"Sharing, what I have learnt about UX UI. The benefits of using it in design. Understanding how UX UI is in everyday things."
Solving
Analysis with, Miro | Design with, Figma
Think, like a UX UI Designer..
Everyday Design
UX UI Gestalt Principles
Proximity
Grouping
Within a UX design experience, having UI elements that are closely related, grouped together to clearly display different sections.
Similarity
Consistency
Having UI elements that are related in action, for example, certain call-to-action buttons in one same hue, shape etc.
Closure
Gaps
Using less details or shapes on UI screens as the user is able to fill in the gaps.
Continuity
Movement
Figure
Ground
Having distinguished focal points on UI screens, within the background or foreground.
Common Region
Together
Using for example shapes, that include details, that might not be necessarily be all together but similar to group.
Why are Gestalt Principles in UX UI important?
Prevent Cognitive Load Improve Usability Improve Scannability Strengthen Visual Hierarchy Enhance UI Structure Enhance UI Organization
Which model to use?
UX UI Design
1.
Conceptual Models?
The...behavior...layout defined by designers to explain how the system actually works. It includes information architecture, terminology, and interaction design.
Google AI
1.
Mental Models?
The...expectations, and cognitive representations a user brings to a product. It's how they think it works, often influenced by prior, similar experiences.
Google AI
Alignment
Bridging the gap! Designers should research existing user mental models...to create a system that matches their intuition rather than forcing them to learn a new, unnatural model.
When the designer’s conceptual model aligns with the user's mental model, the interface feels RIGHT!
Google AI
What to do?
UX Interviews
Statistics | 5 User Rule!
How many Users?
5 to 6 users, according to the research done by Jakob Nielsen, is can actually be 85% sufficient with understanding problems with usability.
This is an article title. Replace it with own content
This is an article description. Describe a short summary of the article to encourage your visitors to read the full story
Author name
This is an article title. Replace it with own content
This is an article description. Describe a short summary of the article to encourage your visitors to read the full story
Fundamentals | Flexible | Data Driven
Pareto Principle UX
80/
Prioritize Functionality
Focuses limited time and resources on high-value tasks.
Google AI
Improve Navigation
This is a product description. Add more detail about this product, such as benefits, appearance, components and value
Focus on Key Issues
This is a product description. Add more detail about this product, such as benefits, appearance, components and value
Enhance Onboarding
This is a product description. Add more detail about this product, such as benefits, appearance, components and value
Design for Efficiency
This is a product description. Add more detail about this product, such as benefits, appearance, components and value
Both are still important and the 80% should be considered as an opportunity to improve on user experiences.
Fundamentals | Flexible
UX Golden Rules
Fundamentals | Flexible
UI Golden Rules
Both have similar rules which are equally important and required to make a great functional and aesthetical product.
ui Design Systems
iOS
ui Design Systems
Android
International Organization for Standardization
Used More
-
GDS Standards
Gov.UK Design System
Government Digital Service |
Updated Service Standard - 2019
-
WCAG 2.2 AA
Current International Standard - Digital Accessibility (web content, apps, devices)