# Basic Design Process


## UX design phase
#### 1. Requirements definition
- Define problems
- Categorize competitors to determine the differences
- Define target users if needed
- Bring all features to the table
- Define main system requirements

#### 2. Information architecture
- Define required screens
- Assume user flows

#### 3. Set rough concept
- Gather samples(screenshots/apps/drawings etc...) by some perspectives
- Features
- UI/UX
- Color pattern
- If needed, make a rough prototype to check all necessary information is there.

Ex.) Meson wallet
https://www.figma.com/proto/AnFbNshrNoqMpjnNGpSmZ5/%5BWIP%5D-Meson-wallet_internal?node-id=103%3A3132&scaling=min-zoom&page-id=0%3A1&starting-point-node-id=103%3A3132&show-proto-sidebar=1

#### *→ If the direction is right, go ahead to work on UI design*

## UI design phase
#### 3. Layout design
- Set up base design system(*this can be changeable at visual design)
- Font size/family
- Color
- Dividing screens into components
- Determine common components
- Nav/Side bar
- Button

- Determine the base layout
- Ex.) Meson wallet
- Top navbar vs Side navbar vs both Top&Side navbar style

- Work on by screen/component
- *Ideally, check the output on weekly meeting to avoid unecessary redo

- Prototyping
- Connect all the components
- Ex.) Meson wallet
- https://www.figma.com/proto/XYxM21Us7yYNKP9znxMr2R/Meson-wallet_team?page-id=1511%3A14070&node-id=5894%3A33922&viewport=391%2C-118%2C0.02&scaling=contain&starting-point-node-id=5894%3A33921&show-proto-sidebar=1

- For reference, record each main user flows if needed
- Ex.) Meson wallet
- https://drive.google.com/drive/u/1/folders/1RUbsk2JWnWO_DfTZMYK_NFQGV4pmTum6
- Gather feedback from users
- User interview: Ex.) https://hackmd.io/kauEIzFSRoKBo9ZP1UQvzg
- Internal review
- Short survey

#### 4. Visual design
- Create design token
- Design in detail

=> For Meson Wallet:
https://hackmd.io/SWEOvL4wR0qL3Y5qwdFB5w

---

# Before the product design...

Before working on new product, plan marketing strategy (= how you plan to approach users) with user's [action flow](https://hackmd.io/yvmjC3zvRgC9fiXc73XQVw).

---

# Deep dive into UX design
▶ [UX Design Flow](https://hackmd.io/3-fuxojHRq-Y2y70TD8_Jg)
▶ [User interview](https://hackmd.io/kauEIzFSRoKBo9ZP1UQvzg)

I think the biggest one will be that we will eventually have privacy features
We want it so that normal people who want some basic privacy can use our wallet without shooting themselves in the foot

- The prototype
- Privacy features will be added