mirror of https://github.com/01-edu/UX-UI.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
39 lines
1.0 KiB
39 lines
1.0 KiB
2 years ago
|
# UI II - Ex 1 CK - Browsing
|
||
|
|
|
||
|
|
**Context:**
|
||
|
|
|
||
|
|
Welcome to the 2nd quest of UI!
|
||
|
|
|
||
|
|
This series of exercises is a great occasion for you to discover how libraries are made in UI, thanks to Atomic Design.
|
||
|
|
|
||
|
|
**Instructions:**
|
||
|
|
|
||
|
|
Among these 4 websites, make snapshots of these elements:
|
||
|
|
|
||
|
|
- 1 template
|
||
|
|
- 1 organism
|
||
|
|
- 1 molecule
|
||
|
|
- 1 atom
|
||
|
|
|
||
|
|
**Websites:**
|
||
|
|
|
||
|
|
- Alibaba
|
||
|
|
- Booking.com
|
||
|
|
- Easyjet App
|
||
|
|
- Interrail
|
||
|
|
|
||
|
|
**Deliverables:**
|
||
|
|
|
||
|
|
- A PDF document extracted from a Figma file of 4 pages
|
||
|
|
- On each page, a screenshot of a template, an organism, a molecule and an atom
|
||
|
|
|
||
|
|
**Resources:**
|
||
|
|
|
||
|
|
- [Atomic Design Methodology](https://atomicdesign.bradfrost.com/chapter-2/)
|
||
|
|
- [Video tutorial on Figma](https://www.youtube.com/watch?v=FTFaQWZBqQ8)
|
||
|
|
- [Beginning graphic design](https://edu.gcfglobal.org/en/beginning-graphic-design/)
|
||
|
|
- [Gareth graphic studio](https://www.youtube.com/c/GarethDavidStudio)
|
||
|
|
|
||
|
|
**Quote:**
|
||
|
|
|
||
|
|
- User Interface Design is a hybrid role and can bring together concepts from interaction design, visual design, information architecture and even Front End Development
|