In this quest, you’ll have to build your own interface.
After designing your own style guide with a moodboard, colors and typography, you can use the series of consistency principles, atomic design structure, the techniques to build you own library and then a series of screens. Step by step, you’ll have built an animated high-fidelity prototype.
The very last step will be to test it on users to detect the impressions they get when they discover your app.
Once again, feel free to get as much inspiration as you need from existing design systems. Dribbble, consistency and structure are your best friends!
**Instructions:**
Your agency works on a digital product to create an e-commerce app for second-hand electronic devices. You collaborate with a UX designer from your team. They have deisgned the wireframes and pass it on to you!
Design a style guide (= a moodboard with typography + examples of typography with buttons, title, description and content).
Also think about the values and spirit you want to spread through this moodboard, we’ll get back to it in Ex. 5.
- Upload the Figma file on Github, labeled as follows: “Name_FirstName_DeliverableName_Date_VersionNumber”. For example, it can be labeled as “Doe_John_MidFiPrototype_05242024_V1”.
- Add a title within the file.
- Pay attention to the global aspect of the file. It must be clear, simple and easy to read. You can get inspiration on canva.com but don’t overload your design with too much details!
