UX for Multi Device applications

UX for Multi Device
Applications

| www.universalmind.com

Joe Johnston
Senior UX Specialist

Monday, September 20, 2010

A Multi Device
Application
Netﬂix Example

• Wii
• XBox
• TiVO
• BlueRay
• iPhone
• iPad
• Web
• Other...

App Built for that Device
• Wii vs XBox



Challenges
Devices?
Which Devices to I target?



Challenges
Native UI vs Custom UI?
How do I build it?



Challenges
Users?
Who are the users.



Telco Wireless
Case Study
5 resources
UX/ Dev/Design

Android
iPhone
iPad
Flash MultiTouch Kiosk
HTML 5 Application
Flex Application
Silverlight Application



Telco Wireless
Case Study

Case Study Video



Telco Wireless
Case Study
4 Personas - The users



Telco Wireless Ecosystem story
Case Study Focus on four different individuals. (four persona’s each with a context scenario)
All basically accomplish the same sort of task but the experience is focused for that speciﬁc
device.
4 Context Scenarios - Eco System Story

1. A stay at home Mom which logs into the Telco website and checks here account info, like
minutes the family has used, pay her bills, compare her plan with others, see a chart of text
and minutes used.

2. A younger individual say 15 that has a “Pay as you Go” type of phone and does not have a
credit card. He wants to add more minutes to his phone so he goes to the kiosk either in
the Telco store,movie theater or mall and logs in and sees his account info and decides to
put more minutes on his phone with cash. The kiosk would have the ability to accept cash
payments. Could allow to get other things like ringtones.

3. A business road warrior while traveling needs to check his account info using the Android
App on his smart phone. He checks to see when his bill is due and even could allow him to
pay his bills, compare his plan with others, see a chart of text and minutes used.

4. A grandparent or older individual that has an iPad in place of a computer. She hops on her
iPad to check her account. She launches the iPad app which has all of her account info and
allows her to pay her bill, compare her plan with others, see a chart of text and minutes used.
Also could show some content for Help Support



Telco Wireless
Case Study
iPhone - Native experience

Used on the Go

Native bottom TabBar experience



Telco Wireless
Case Study
Android - Native experience

Used on the Go

Native Tab experience

Tactile buttons

Back Button



Telco Wireless
Case Study
iPad - Bridge between Web and Mobile
experience

Interesting Device

Used on the Couch



Telco Wireless
Case Study
Kiosk - Key experience for a targeted user

Used in Entertaining environments - Movie
Theaters, Airports, Malls



Less is More
Mobile
You don't need everything on a mobile
device, its mobile and not the desktop/web

Use Aggressive Auto Completion - reduce
typing

Flatten hierarchy

Truncate interfaces



Connectivity
What happens
How does your application react when its
connected and when its not, smooth user
experience

How does it handle Notiﬁcations and
Updates



Orientation
Reorganize

How does it handle Orientation changes,
Landscape vs Portrait.

Reorganize Content or Change Content



Input
What is it?

Be aware of input methods and interactions

Touch/Multi Touch
Virtual/Physical Keyboards
Wheels
VUI - Voice User Interface
TUI - Tactile User interface
GUI - Graphical User Interface

Be aware of where the user’s hand will be
while interacting with the device



HTML5
Do I use it?
HTML5 features are incomplete and do not
provide a consistent experience across
multiple devices.

<audio/>, <video/>, and <canvas/>
are not supported equally

different platforms support different codecs
and implementations

No streaming media, only progressive
download

CSS3 Styles are not consistent or reliable

HTML5 APIs, including geolocation and
ofﬂine storage are not consistent or not
implemented

No camera / device access



Resources
UX/UI Guides

iOS Reference Library -
iPhone Human Interface
Guidelines

Android - User Interface
Guidelines

RIM - Blackberry UI Guidelines

Windows - Phone 7 Series UI
Guidelines(pdf)



One More
Thing www.ibrainstormapp.com

iPad Creative Collaboration app

iPhone Companion allowing ’ﬂick’
interaction

Stats
Submitted July 19th

Week 1 - 39,816

Week 2 - 94,383

First Update Aug 3 39,544

Total updates to date over 130k

Total to date 397,345



Ok, One More
Thing

Lady Gaga iPad Collectors
digital edition concept

Built using the Adobe
Digital Publishing framework
all in InDesign



Thanks joe.johnston@universalmind.com

joe@merhl.com

@merhl

merhl.com

Joe Johnston
Senior UX Specialist


UX for Multi Device applications

More Related Content

Similar to UX for Multi Device applications

Recently uploaded

UX for Multi Device applications