DESIGNING FORANDROID
A WINNING STRATEGY
A WINNING STRATEGY
KUNJANSHAH
PRESENTEDBY
ASHOKAMARAN
ORGANIZEDBY
DESIGNING FORANDROID
DISCLAIMER
I ❤ ANDROID
[ REGARDLESS OF WHAT YOU SEE IN THE FOLLOWING SLIDES ]
ANDROID LAYOUTS
ISSUES
MULTIPLESCREEN SIZES
MULTIPLEASPECT RATIOS
MULTIPLESCREEN DENSITIES
MULTIPLEANDROID VERSIONS
MULTIPLEDEVICES
?
NUMBER OF ANDROID DEVICES
TAKE A WILD GUESS.
NUMBER OF ANDROID DEVICES
NOT EVEN KIDDING.
1135
PHYSICAL SCREEN SIZES
TOSHIBA HAS A 13” ANDROID TABLET. NO, REALLY.
2 TO 5.3 INCH FOR PHONES
7 TO 13 INCH FOR TABLETS
SCREEN SIZES
SOME WON’T FIT IN YOUR HAND.
PHONES TABLETS
2.55 3.6 72.6 3.7 7.92.8 4 8
3 4.2 9.73.1 4.27 10.1
3.14 4.3 133.2 4.53.3 4.653.4 4.83.5 5.3
SCREEN RESOLUTIONS
I PROBABLY MISSED SOME.
PHONES 480 X 800 800 X 600240 X 320 480 X 854 1024 X 600240 X 400 540 X 960 1024 X 768240 X 432 640 X 960 1280 X 720240 X 640 1280 X 800 1280 X 800320 X 480 1600 X 900340 X 480 TABLETS360 X 640 480 X 800480 X 640 480 X 854
ASPECT RATIOS
STUFF WILL GET SQUASHED!
1.33 1.60 1.771.41 1.66 1.801.50 1.70 2.66
ANDROID VERSIONS
OUR SUGARY OVERLORDS.
1.5 2.2 2.3.3 3.1 4.0.21.6 2.3 2.3.7 3.2 4.0.32.1 2.3.2 3.0 4.0
SCREEN DENSITIES
NEXT UP: XXHDPI
LDPI MDPI HDPI XHDPI
COPING
IT HELPS TO TALK TO YOUR PSYCHIATRIST AS WELL.
18SCREEN
SIZES
9ASPECT RATIOS
4SCREEN
DENSITIES
14ANDROID
VERSIONS
1135ANDROID DEVICES
1
2
3N
WRITE LAYOUT
TESTDEVICE N
TESTDEVICE 1
BUILDAPK
N+1
TESTDEVICE N+1
HOW TO WIN
RE
LETS GO WIN !SMART DESIGN SMART XML SMART IGNORING
STRATEGIES
Design XML that will work on wide variety of Android devices, various techniques follow.
Ignore old Android versions,. Ignore devices that have less market share. Smartly ignore devices based on business needs and app focus.
Design your UI/UX in a way that will translate to multiple layouts. Design like the web, responsive.
UI widgets on Android have different colors, gradients and backgrounds on different versions, and manufacturers.
UI CONSIDERATIONS
SMART DESIGN
WYSIWYDG
4”2.3
4”4.0
3.7”2.0
4.3”2.3.4
ASOP
ASOP
ASOP
HTC
UI widgets on Android have different colors, gradients and backgrounds on different versions, and manufacturers.
MULTIPLE RESOURCES
SMART DESIGN
HIRE MORE PHOTOSHOP MONKEYS.
WRITE IT LIKE HTML
SMART XML
WYSIWYDG
BACK TO 1999
SMART XML
YOU DON’T NEED A TIME MACHINE.
IT STILL WORKS!
OKAY-ISH.
SMART IGNORING
IGNORANCE IS BLISS.
IGNORE DEVICES WITH LOW MARKET SHARE.
IGNORE OLDER ANDROID VERSIONS WITH LOW MARKET SHARE.
IGNORE ANDROID VERSIONS RUSHED TO MARKET.
1.5 1.6 2.1 2.2 2.3-2 2.3.3-7 3.0 3.1 3.2 4.0/4.0.2 4.0.3
2.40.52.210.1
63.2
0.5
23.1
60.70.3
SMART IGNORING
IGNORANCE IS BLISS.
SMART IGNORING
(YOU DON’T WANT CRAPPY PICTURES TAKEN BY YOUR APP ANYWAYS.)
IGNORE DEVICES/ANDROID VERSIONS OUTSIDE YOUR APP FOCUS.
AN APP WITH FOCUS ON PICTURES CAN IGNORE DEVICES WITH
CRAPPY CAMERAS.
IF ALL ELSE FAILS...
YOU DON’T WANT TO BE HERE.
WRITE SEPARATE LAYOUT XML FILES FOR SPECIFIC DEVICES.
USE SVG FOR GRAPHICS ASSETS.
DONT CARE MODE.
FACEBOOKWWW.FACEBOOK.COM/QUARKSTUDIOS
TWITTERWWW.TWITTER.COM/QUARKSTUDIOS
GET IN TOUCH WITH US
WWWQUARK STUDIOSWWW.QUARKSTUDIOS.COM
WWW JMA ITWWW.JMAIT.COM
THANK YOUFOR YOUR ATTENTION.
WWW.QUARKSTUDIOS.COM
QUARK STUDIOS & JMA-IT
SECURING APPSFOR THE GOVERNMENT & ENTERPRISE
RSVP TODAY!
NEXT...