Upload
greg-raiz
View
123
Download
2
Tags:
Embed Size (px)
DESCRIPTION
Citation preview
Flat Design in a non-flat WorldGregory Raiz, CEO
@graiz
The Plan
•What is flat design?
• Design is fashion
• Designing for humans
• Examples of flat design
• Affordances vs. Skeumorphism
• 5 ways to design with depth
What is flat design?
Font Color Image Depth
Fonts are thin.
Colors are bright
Shadow and gradients optional
New tools for depth
White is the new Black
Flat Design is Fashion.
iOS7 is Fashion.
It’s harder to hide bad design with flashy art
Bad Design?
Legibility Readability Usability
Bad Design?
!
!
!
!Readability
Legibility
UsabilityClick to get
started
The UX is familiar
% of people not freaking out
Handheld devices history
BlackBerry 6710
Nokia 1100 Palm Pilot
Flat design fashion
Classic Flat Design
Mobile Flat Design
Examples
Great design has affordances
Affordances Provide Natural Cues to
Interactions
Skeuomorphism
Skeuomorphism
This doesn’t work
Affordances clarify intended interactions
Yes
Be careful with borderless buttons
OK
InteractionsSwipeTap
Pinch Scroll
Lessons in non flat thinking
5
Your hands are not flat
1
Design for dexterity
Your posture is not flat
2
How do you use your device?
• Vertical vs Horizontal
• Sitting, Standing, Lying down
• Holding something in the other hand
One Hand Free No Hands Free
Your senses are not one dimensional
3
• Camera
• Accelerometer
•Microphone
• Proximity Sensor
•Magnetometer
Some of the sensors
Your location is not flat
4
Our lives are not one dimensional
5
•Work vs. Play
• Family vs. Job
• Entertainment vs. Productivity
• Young vs. Old
Life dimensions
Everything should be made as simple as possible, but not simpler. - Albert Einstein
Answer the question, WHY?
@graizGregory Raiz, CEO