search

zuri-training / qr-gen-proj-team55

This project involve building a web site for generating a (Quick Response) qr_code where user that visit the site can only generate the code after registration. The code generated should also be able to use both on and offline and can be shared via email, can be downloaded in PNG and PDF
MIT License
3 stars 24 forks source link

Abimbola Ashonibare #61

Open BimboOni opened 2 years ago

BimboOni commented 2 years ago

My name is Abimbola Ashonibare and I am a product designer. I worked along side other product designers, as well as developers on the QR code generation website for team 55.

I worked on developing the style guide that was used in this project along side some other designers. I was charged with the responsibility of creating the colour styles which was of utmost important to this project. It was important that we used the right set of colours for the website. I created the grid style that was used for this project as well. Also, I created all the button styles for both the desktop view and the mobile view. I made sure to create all the various button states as well as shapes.

Here is a link to the colour style I created. https://www.figma.com/file/h4z1WucYksn2jffHUW4VDE/Zuri-proj_team_55-team-library?node-id=460%3A249

Here is a link to the button styles I created (desktop). https://www.figma.com/file/h4z1WucYksn2jffHUW4VDE/Zuri-proj_team_55-team-library?node-id=415%3A370

Here is a link to the button styles I created (mobile). https://www.figma.com/file/h4z1WucYksn2jffHUW4VDE/Zuri-proj_team_55-team-library?node-id=457%3A255

Here is a link to the grid style I created. https://www.figma.com/file/h4z1WucYksn2jffHUW4VDE/Zuri-proj_team_55-team-library?node-id=460%3A309

BimboOni commented 2 years ago

For the design of the website itself, I worked on the landing page. I ensured the proper alignment of every single item on the website was in line with our 4 point system. I also ensured the illustrations used were of the right size for the website. Also, I ensured the font size for the landing page was just perfect. I created the landing design for the mobile view as well. Also, I ensured the overall aesthetics of the landing page was beautiful.

Here is a link to the landing page's wireframe. https://www.figma.com/file/h4z1WucYksn2jffHUW4VDE/Zuri-proj_team_55-team-library?node-id=1641%3A8640

Here is a link to the landing page's low fidelity. https://www.figma.com/file/h4z1WucYksn2jffHUW4VDE/Zuri-proj_team_55-team-library?node-id=1641%3A4550

Here is a link to the landing page's high fidelity (desktop view). https://www.figma.com/file/h4z1WucYksn2jffHUW4VDE/Zuri-proj_team_55-team-library?node-id=1629%3A3617

Here is a link to the landing page's high fidelity (mobile view). https://www.figma.com/file/h4z1WucYksn2jffHUW4VDE/Zuri-proj_team_55-team-library?node-id=1629%3A6134

thank you