1. UX/UI
diegolameira opened this issue · comments
Creative Process
To get a successfull application from the very ground up, I take a step backward before development so I can be sure that the interface will be fine for usage.
So I need to follow some steps to get my final layout:
- Benchmarking: Seek for inspiration, find some ideas from community
- Information Arquitecture: Define where things going to be, looking for patterns
- Brainstorming: Drawing roughly some sketches by hand, all ideas on paper
- Layouting: Low fidelity layout (no need to have colors or be the final result)
- Prototyping: Set layouts as insteractive prototype
- Loop: Whenever something is not good enough on prototype (even for improve to a high fidelity), rollback to whatever step
- Result: the prototype to be develop
- Bônus!
This may be tedious when you dont have someone to validate your ideas, but it's a great process to refine a good product at the end.
1. Benchmarking
Easy, I've just made a simple and small Pinterest Board.
2. Information Arquitecture
This could be a bigger step in a complex project.
But I'm keeping it simple just to focus on all the process, so here we got:
The app will have 4 main screens:
- Map: a map visualization where it can be pinned every where, and a button to locate device on map, triggering a pin on it
- List: a list only visualization of nearby places
- Search: search over nearby list or other places, it will have map and update as user inputs and filter places from Google's API
- Detail: a screen to show the city selected in detail with weather informations
Navigation will be done on a bottom tab navigation on smaller screens so user can have ease access through it finger tips.
7. Result (skiped the documentation of 3~6)
| Phones: | Tablets/Desktop: |
|---|---|
| Open mobile prototype | Open desktop prototype |
 |
 |
Bônus: Logo development
There is no Great Product without a Great Brand, so I designed a logo:
I guess you know well where did come my inspiration 😅
Well, thats all we need for now.