20
UI, UX Guide
Colors
Typography
Visual Design Elements
3 C's of Interface Design-
Color - Contrast - Content
Task Flows
Scenarios
Example-
Car (UX) & Color (UI) of Car
Popular UI Design Language-
Minimalist - Less is More
Accessibility in design allows users of diverse abilities to navigate, understand and use your UI.
Tips-
- Clear Layouts.
- Suitable for variety of users (doesn't mean different devices).
- Assistive tech support like YouTube Voice Search is very popular, Screen Reader used on Govt. Websites.
- Common action center like Button in Google apps to perform multiple actions, in Facebook Search apart from People, Pages you can search Settings and other functionalities as well.
Focus on the user and all else will follow.
What is beautiful is usable.
Consistency is the key -- Zak Frazer
For making a product look more consistent the developer should master Principle of least surprise
The product must be cross-platform available and optimized for different devices as well.
*Responsive Web Design with proper media queries.
*Responsive frameworks like Tailwind, Bootstrap.
Some minor tweaks might get the user a better experience like Search Box, Navigation Menu, Proper Categorization.
Initial/ Default Item.
Most frequently selected or Last item selected by user can be set as an initial/default item.
Recognize instead of Recall.
Instead of writing or searching something user can quickly select from the options.
- Reconfirmation and Undo Options will help users take better acknowledged actions.
The product developed should be fast and efficient. It should not take much time and resources. If the page loads up slowly the user might lose interest, so good performance is an important aspect.