WHERE
DESIGNERS
MEET
DEVELOPERS
(ANDROID)
GoalS
- improve communication
- decrease development time
- help avoid boring work on both sides
HOW
- show what's possible
- where are the constraints
- later: iterate
Drawables
not only bitmaps
Drawables
9-patch
layer list
inset
clip
shape
state list
level list
Backgrounds
bitmap: 8 MB
9-patch: 1 - 500 kB
shape: ~ 0 kB
so many sizes
240x320
320x480
480x800
720x1280
1080x1920
These were only phones
320x427 dp
320x480 dp
320x533 dp
360x640 dp
360x640 dp
Density independent pixels
- ldpi 0.75
- mdpi 1
- hdpi 1.5
- xhdpi 2
- xxhdpi 3
- xxxhdpi 4
Focus on flexibility
define in %
define margins, paddings
define sizes using images when possible
define sizes as dp only when necessary
Images
You define size of clickable region
Transparent pixels are important
Always remember
pressed state
transitions
communicating errors
showing progress
Pressed state
focused
disabled
selected
checked
checked + focused + disabled
Transitions
you know it better
progress / error
without blocking user
I mean never!
Just to scare you
For button:
4 (or 5) dpis * 5 states
= 20 (or 25) images
For checkbox / radiobutton:
4 (or 5) dpis * 5 states * 2 (un)checked
= 40 (or 50) images
Tools
Action Bar Style Generator
Holo Colors Generator
draw9patch
Communicate intent
different screens + same margin/padding = same name
different screens + same color = same name
Naming Convention
Yes: What is it?
No: Where is it used?
Love_or_hate
names_with_underscores
please_do_that
it_will_ease_devs_work
Last but not least
use Android device
from time to time
