Embed Size (px)
Citation preview
10 Tips for 10 Tips for Designing Mobile WidgetsDesigning Mobile Widgets
Rajesh LalSenior Engineer, Nokia
Maemo Devices, Mountain View, California
15 minutes
Why Should We Care
Worldwide 1 Billion Computers and ~ 4 Billion Mobile Phones
Today Computer to Mobile ratio is 1:4
Smartphone sales estimate: 20% increase annually, today 140 million to 423 million in 2013
Source: Wireless Expertise www.wirelessexpertise.com
Data based on study at http://www.researchandmarkets.com published July 27, 2009
Design for a Mobile User
Tip: 1
Short attention spanShort attention span
Divided attention Divided attention
InterruptibleInterruptible
Dynamic environmentDynamic environment
Know Widget
Tip: 2
A Widget is a small, light weight application, meant for a single purpose.
Mobile Widget
[ ]Desktop WidgetKonfabulator, Desklets, Dashboard, Vista
Widget Engine
Native APIs
Web Widgetigoogle, Wordpress,
Pageflakes, Facebook
Web browser (server) based
+ =
< >HTML, CSS, JavaScript, XML, Ajax, RIA
Mobile WidgetS60, Maemo
Web Runtime
Device APIs
11
Target Specific Set of Users
Tip: 3
12
Highly personal deviceHighly personal device
Rich features specific to usersRich features specific to users
Allow for customizationAllow for customization
Target sport eTarget sport events, vents, conferencesconferences
Play Nice
Tip: 4
Follow design guidelinesFollow design guidelines Justify space Justify space
Do not poll data frequentlyDo not poll data frequently Do not be a Do not be a memory hogmemory hog
Utilize Device Potential
Tip: 5
N900 Features
qwertymulti-taskingmulti-tasking
personalized desktop
widgets
flash
Ajax
integrated gps
5 mp camera
linux os
3d graphics
Open GL
web run time
Qt32 gb
wireless broadband
powerful processorInnovative design
800 × 480 resolution
video
touch screen48 gb exp memory
firefox browserradio
Focus on One Functionality
Tip: 6
Know what Widgets are meant for
Quick information
Casual games
Simple utility
Media application
Search / Lifestyle Widget
Recent Trends
Social Widgets
Branded application
Subtle advertisements
Mini Web Apps
Simplify Features
Tip: 7
http://www.google.com/ig/directory?q=clock
Easy to Look
Easy to Understand
Easy to Use
Most effective designs are least complicated
Paperclip Principle
Grab the User
Tip: 8
1. Attract at entry point
Short title, simple headings
Nice professional icon
Precise description
2. Make it alive
Compelling data
Dynamic information
Make it interesting
3. Get statistics
No. of downloads
No. of users
Feed based statistics
4. Hear your user
Include email
Online forum
Allow for feedback
26
Add Social
Tip: 9
27
Mobile is a social device Mobile is a social device
Always AvailableAlways Available
Meant for communicationMeant for communication
Interactive Interactive
Make it Fun
Tip: 10
29
“If it's not fun, you're not
doing it right” –Bob Basso
Add ‘Extra Fun’Add ‘Extra Fun’
Delight usersDelight users
Give pleasant surprisesGive pleasant surprises
Make it specialMake it special
7. Simplify Features
1. Design for a Mobile User
10. Make it Fun
Ten Tips
2. Know Widget3. Target Specific Set of Users4. Play Nice
5. Utilize Device Potential
6. Focus on One Functionality
8. Grab the User
9. Add Social
31
