# UI IV - Ex 2 - Design system library

**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 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
- 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!

**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:** 

- [FIGMA FILE (to duplicate)](https://www.figma.com/file/U26mctkrOqxiUeAlNHzSxW/UI-IV---Ex-3---E-COMMERCE%3A-Design-screens!?node-id=0%3A1)
- [Introduction to design systems](https://www.youtube.com/watch?v=xEuBCUngJ_U)
- [Create a design system - Figma course](https://www.youtube.com/watch?v=RYDiDpW2VkM)
- [Building a design system library - Lyft](https://medium.com/tap-to-dismiss/building-a-design-system-library-532ef2492811)
- [Examples of UI Buttons library](https://www.pinterest.co.kr/pin/663014376380850291/)