mobile ui: fruit or delicious sweets
TRANSCRIPT
Mobile UX: Fruit or Delicious Sweets
Yonatan Levin
> 10M usersRuby, Golang,
Python, Android, iOS
52 cities
> 1000 members
Largest StudyJam
in the World
AndroidAcademy
Our menu?
➔ How to convert iOS to Android➔ Know the rules➔ Talk language of your users➔ Design Patterns
How to convert iOS to Android?
Real story:
Product: We have new featureDesign: Here the mockupAndroid Developer: It’s iOS mockupDesign: No problem. Use the same for Android.
You don’t!
Really,Don’t!
Really,Don’t!
“It’s important to understand the idioms and behaviors of each platform
before you start design and development.”
iOS & Android Different Patterns
General Style
iOS - flatter design style driver by 3 core philosophies: deference, clarity and depth.
Content is a king
Android - Material Design
Material is the metaphor Motion provides meaningBold, graphic, intentionally
Principles
Trello
“One of our guiding themes during the Material redesign was simplicity, and we think this paid off nicely.”
Hamid Mobile Lead
Trello
10% increase in sessions per user
per week.
42% more boards created per
session.
63% more people added to boards
per session.
So if i convinced you, Let’s start a work :)
Real Buttons
Status Bar
Status Bar & ToolBar Material Design
Navigation
https://design.google.com/articles/design-from-ios-to-android/
Cards
Typography
Roboto San Francisco
Grids - קווי מתאר
Multipliers of 8dp
Button styles
Dropdown - Android only
Segmented controls
Dialogs
Icons
UI Controllers - Loading
Notifications
Notifications - the cool part
Gestures - Long Press
So , what so special about Android
Apps vs. Activities
Let’s ask some one else to work hard
Designing for multiple screen
DP - density independent pixels
SP - same as DP but scaleable
Normal Large Huge
9 patch
Widgets
So… Now you know all major components
Don’t afraid to experiment
Good sources
Google Material Design (General)
Google Material Design (Patterns)
androidux.com
pttrns.com
materialup.com