10 tips for designing mobile widgets - maemo summit, amsterdam, oct 11, 2009 (maesum) @irajlal

10 Tips for Designing Mobile Widgets

Rajesh LalSenior Engineer, Nokia

Maemo Devices, Mountain View, California

Q&A

Top 5 Tips

5 Contextual Tips

Why Should We Care

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

Q&A

Top 5 Tips

5 Contextual Tips

Why Should We Care

Design for a Mobile User

Tip: 1

Short attention span

Divided attention

Interruptible

Dynamic 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 device

Rich features specific to users

Allow for customization

Target sport events, conferences

Play Nice

Tip: 4

Follow design guidelines Justify space

Do not poll data frequently Do not be a memory hog

Utilize Device Potential

Tip: 5

Nokia N900

N900 Features

qwertymulti-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

Q&A

Top 5 Tips

5 Contextual Tips

Why Should We Care

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 aliveCompelling data

Dynamic information

Make it interesting

3. Get statisticsNo. of downloads

No. of users

Feed based statistics

4. Hear your userInclude email

Online forum

Allow for feedback

26

Add Social

Tip: 9

27

Mobile is a social device

Always Available

Meant for communication

Interactive

Make it Fun

Tip: 10

29

“If it's not fun, you're not doing it right” –Bob Basso

Add ‘Extra Fun’

Delight users

Give pleasant surprises

Make 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

Q&A

Top 5 Tips

5 Contextual Tips

Why Should We Care

32

Thank Yourajesh.lal@nokia.com

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