View
620
Download
1
Category
Tags:
Preview:
DESCRIPTION
As mobile devices take over the world it is hard to ignore useful and important they can be. But without useful apps, these devices are just overpriced coke mirrors cheese plates. For those of us in the design community who choose to design and build mobile apps, there are many rules and standards we can follow to streamline the process and let us focus on making apps that do cool things and less time reinventing wheels.
Citation preview
Welcome!
Social Love#CropMeetup
Twitter: Crop_meetuphttp://www.meetup.com/designcrop/
Tuesday, September 25, 12
Mobile devices NOW outnumber mobile homes in america!
By a lot!
So let’s stop making mud flaps and start making mobile apps.
Tuesday, September 25, 12
Planning and UI
Design
Development
Tuesday, September 25, 12
Flow MappingPlanning and UI
Start with low fidelity, simple shapes suggesting basic functions on each screen, and connect the dots, figure out how the app flows from one screen to the next.
Tuesday, September 25, 12
Flow MappingPlanning and UI
Flow mapping is something you refer back to constantly as you
move along the design process.
Tuesday, September 25, 12
Flow MappingPlanning and UI
End with high fidelity flow mapping — see if your more defined UI still makes sense and finish your main tasks.
Tuesday, September 25, 12
WireframingPlanning and UI
Pick up a pencil or a wireframing program — how detailed is up to you. For client approval I’d suggest mid-high range
Tuesday, September 25, 12
Wireframing TipsPlanning and UI
Be a user first. Befriend the device you are
wireframing for.
Work with Curtis.
Tuesday, September 25, 12
UIPlanning and UI
Know what you DON’T have to design.
Follow guidelines.Don’t reinvent the wheel.
Tuesday, September 25, 12
iOS basic elementsPlanning and UI
Activity bar
Navigation bar
Tab bar
Don’t do this.
Tuesday, September 25, 12
iOSPlanning and UI
Clickable elements: 44x44 or 88x88 (retina)
App icons: start at 1024x1024 (retina)
Tuesday, September 25, 12
iOS - don’t go below 13ptPlanning and UI
20pt for titles and buttons labels
15pt for normal body text
17pt for list labels
13pt for activity bar
12pt for app icons
Tuesday, September 25, 12
AndroidPlanning and UI
Tuesday, September 25, 12
Android ThemesPlanning and UI
Tuesday, September 25, 12
Android ThemesPlanning and UI
Launcher icons: 48x48
Tuesday, September 25, 12
Work from your wireframesDesign
Should =
Tuesday, September 25, 12
Do All This Design
Tuesday, September 25, 12
Do None Of This Design
Tuesday, September 25, 12
Design TrendsDesign
Tuesday, September 25, 12
Mo Clutter, Mo ProblemsDesign
Tuesday, September 25, 12
Have Fun With Games!Design
Tuesday, September 25, 12
Form Can Have FunctionDesign
Tuesday, September 25, 12
Don’t Piss On DevelopersDevelopment
Squeezing too many items onto a tiny screen (phone-size.com)
Too much transparency = Bad
Smaller, stretchable images are better
Never include text in images unless you’re producing those images for every resolution
Designer
Developer
A
=
Tuesday, September 25, 12
Compatibility Is Key!Development
2 resolutions for iOS, at least 4 different pixel densities and at least 5 resolutions for Android
If you want an app to look exactly alike on all Android devices, you cannot rely on any stock UI elements (look and feel varies between different hardware vendors)
Tuesday, September 25, 12
The End!
Tuesday, September 25, 12
Thanks for Coming!
And special thanks to our sponsors:
Tuesday, September 25, 12
Social LoveCrop
http://www.meetup.com/designcrop/Twitter: Crop_meetup | #CropMeetup
HostAtlantic BT / twitter: @atlanticbt / http://www.atlanticbt.com
Co-OrganizerEileen Allen / twitter: @eileenallen / dribbble: eileenallen
Co-OrganizerCorey Brinkmann / twitter: @cbrinkmann / dribbble: cbrinkmann
PresentersNancy Jin / Corey Brinkmann / Curtis Martin / Helen Shaffer
Tuesday, September 25, 12
Recommended