Natural User Interfases (NUIs) - Android TO Conference 2012

22
AndroidTO October 25, 2012 Peter O’Blenis FREAKIN’ awesome apps freakinawesomeapps.com

Transcript of Natural User Interfases (NUIs) - Android TO Conference 2012

Page 1: Natural User Interfases (NUIs) - Android TO Conference 2012

AndroidTOOctober 25, 2012

Peter O’Blenis

FREAKIN’awesome appsfreakinawesomeapps.com

Page 2: Natural User Interfases (NUIs) - Android TO Conference 2012

1960 – Text Based UI

Page 3: Natural User Interfases (NUIs) - Android TO Conference 2012

1985 – Graphical UI (GUI)

Page 4: Natural User Interfases (NUIs) - Android TO Conference 2012

2010 – Natural User Interface (NUI)

Page 5: Natural User Interfases (NUIs) - Android TO Conference 2012

The user experience is now the primary differentiator

Page 6: Natural User Interfases (NUIs) - Android TO Conference 2012

“Microsoft’s mobile OS takes the cake with the most intuitive and easiest-to-use user interface.”

“Mobile Throwdown: iOS vs. Android vs. Windows Phone” James Pikover, IGN

Page 7: Natural User Interfases (NUIs) - Android TO Conference 2012

UX is a differentiator

Apps that connect on a visceral level win

Fun, playful, cool >= Useful

Page 8: Natural User Interfases (NUIs) - Android TO Conference 2012

Mobile extension of your brand Intimate connection to your customer

The good The bad The ugly

Page 9: Natural User Interfases (NUIs) - Android TO Conference 2012

Discoverable and intuitive Canvas vs Screens Gestures vs buttons Immediate response Relevant transitions and

effects Motion and physics “Feels good” to use it

Page 10: Natural User Interfases (NUIs) - Android TO Conference 2012

Bounce at the end of a list or canvas

Tilt of a tile when pressed No more Save button Text hanging off the screen

Page 11: Natural User Interfases (NUIs) - Android TO Conference 2012

Graphics Layout Motion Physics Lighting Sound Haptics

Page 12: Natural User Interfases (NUIs) - Android TO Conference 2012

Design, Implementation: Everything is Different.

Page 13: Natural User Interfases (NUIs) - Android TO Conference 2012

Designer Developer

GAP› User Stories› Wireframes› Video Mock-Ups› Prototypes

› Translate Design Code› Trial & Error› Difficult to communicate

gestures, physics & motions

Lost in Translation

Page 14: Natural User Interfases (NUIs) - Android TO Conference 2012

Design This Get This

GAP

Lost in Translation

Page 15: Natural User Interfases (NUIs) - Android TO Conference 2012

Native UI widgets don’t cut it HTML5 too slow Platforms use the above What’s left? ………hand coding

Page 16: Natural User Interfases (NUIs) - Android TO Conference 2012

OS versions x Devices = ∞ Moving target What combination to support?

Page 17: Natural User Interfases (NUIs) - Android TO Conference 2012

What about iOS, Windows?

The same app?

Page 18: Natural User Interfases (NUIs) - Android TO Conference 2012

GUI – Outdated Process and Tools Waterfall product

development process

Outdated Peck and Poke UI tools

3000 page UI specifications

Page 19: Natural User Interfases (NUIs) - Android TO Conference 2012

NUI process and toolsAgile Development Iterative Motion Based Specs

Cross Platform Rendering and Business Logic

Page 20: Natural User Interfases (NUIs) - Android TO Conference 2012

Everything in the UX has a purpose 100% discoverable. Intuitive The details are everything Not constrained by factory controls Different designer skill set

Page 21: Natural User Interfases (NUIs) - Android TO Conference 2012

• Expensive• Uncommon skill set• Overkill for some apps• Not appropriate for all content• Truly unique functionality can get away without it…for now

Not yet

Is NUI for All Apps?Is NUI for All Apps?

Page 22: Natural User Interfases (NUIs) - Android TO Conference 2012

Beautiful. Tactile. Intuitive. Visceral. Unique. Playful.