1.8 KiB
UI IV - Ex 2 CK - Design system library
Context:
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:
Based on the moodboard you designed in Ex 1, create a design system with at least 30 elements, including atoms, molecules and organisms, and include multistates.
Deliverables:
- A PDF document extracted from a Figma file with a library including
- At least graphic design 30 elements
- At least 5 atoms
- At least 5 molecules
- At least 5 organisms
- At least 10 multistate variations
Tips:
- Start by asking yourself what key elements may appear in an e-commerce app.
- Feel free to get inspiration from existing design systems. Browse Dribble and the Figma community!
Resources: