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

32

Thank Yourajesh.lal@nokia.com

Join us @ http://maemo.org/development/sdks/