Creating Optimal Desktop User Experiences

70
@GlenLipka Blog: http://commadot.com Sr. Dir. UX, Marketo DESKTOP USER EXPERIENCES Sencha Conference 2010 Sencha Monday, November 29, 2010

description

Great User Experiences savs money in training and support and makes money in strong word-of-mouth marketing as well as customer referrals. However, the techniques and process to make great UX happen are often counter-intuitive and tricky. This session will demystify UX greatness and show you how you can create the optimal desktop user experience. This session will be content-rich with many topics covered.

Transcript of Creating Optimal Desktop User Experiences

Page 1: Creating Optimal Desktop User Experiences

@GlenLipkaBlog: http://commadot.com

Sr. Dir. UX, Marketo

DESKTOP USER EXPERIENCES

Sencha Conference 2010

Sencha

Monday, November 29, 2010

Page 2: Creating Optimal Desktop User Experiences

Where to

Start?

Monday, November 29, 2010

Page 3: Creating Optimal Desktop User Experiences

The Sencha ExtJS FrameworkMonday, November 29, 2010

Page 4: Creating Optimal Desktop User Experiences

Good Ideas

Monday, November 29, 2010

Page 5: Creating Optimal Desktop User Experiences

Bad Ideas

Monday, November 29, 2010

Page 6: Creating Optimal Desktop User Experiences

UnexpectedWow

Monday, November 29, 2010

Page 7: Creating Optimal Desktop User Experiences

Show ofHands

Monday, November 29, 2010

Page 8: Creating Optimal Desktop User Experiences

Gun toyour head

Monday, November 29, 2010

Page 9: Creating Optimal Desktop User Experiences

Are you using the Layout Manager?

Monday, November 29, 2010

Page 10: Creating Optimal Desktop User Experiences

Yes!Monday, November 29, 2010

Page 11: Creating Optimal Desktop User Experiences

Huh?

Monday, November 29, 2010

Page 12: Creating Optimal Desktop User Experiences

The FundamentalsMonday, November 29, 2010

Page 13: Creating Optimal Desktop User Experiences

http://dev.sencha.com/deploy/dev/

Monday, November 29, 2010

Page 14: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 15: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 16: Creating Optimal Desktop User Experiences

Global Nav

Monday, November 29, 2010

Page 17: Creating Optimal Desktop User Experiences

Tree Nav

Global Nav

Monday, November 29, 2010

Page 18: Creating Optimal Desktop User Experiences

Tree Nav

Global NavLocal Nav

Monday, November 29, 2010

Page 19: Creating Optimal Desktop User Experiences

Tree Nav

Global NavLocal Nav

Toolbar

Monday, November 29, 2010

Page 20: Creating Optimal Desktop User Experiences

Tree Nav Canvas

Global NavLocal Nav

Toolbar

Monday, November 29, 2010

Page 21: Creating Optimal Desktop User Experiences

Tree Nav Canvas Aux Tools

Global NavLocal Nav

Toolbar

Monday, November 29, 2010

Page 22: Creating Optimal Desktop User Experiences

Tree Nav Canvas

Drawer

Aux Tools

Global NavLocal Nav

Toolbar

Monday, November 29, 2010

Page 23: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 24: Creating Optimal Desktop User Experiences

Resize

CollapseOn/Off Overflow

Local Scrolling

Liquid Layout

Monday, November 29, 2010

Page 25: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 26: Creating Optimal Desktop User Experiences

Trees

Accordions

Toolbars

Grids

Edit in Place

Pagination

Charts

Forms

Monday, November 29, 2010

Page 27: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 28: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 29: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 30: Creating Optimal Desktop User Experiences

Desktop Web Page

Webtop

Monday, November 29, 2010

Page 31: Creating Optimal Desktop User Experiences

EvolutionMonday, November 29, 2010

Page 32: Creating Optimal Desktop User Experiences

http://www.useit.com/alertbox/scrolling-attention.html

Web = Fold

Monday, November 29, 2010

Page 33: Creating Optimal Desktop User Experiences

1280 x 1024

The Scrolling App

Monday, November 29, 2010

Page 34: Creating Optimal Desktop User Experiences

What happened to the

navigation?

Monday, November 29, 2010

Page 35: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 36: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 37: Creating Optimal Desktop User Experiences

Filter

Tags

TreeNav

Monday, November 29, 2010

Page 38: Creating Optimal Desktop User Experiences

Webtop App 2008

Monday, November 29, 2010

Page 39: Creating Optimal Desktop User Experiences

Webtop App 2010

Monday, November 29, 2010

Page 40: Creating Optimal Desktop User Experiences

Webtop App OWA

98-10

Monday, November 29, 2010

Page 41: Creating Optimal Desktop User Experiences

Webtop App 1999

Monday, November 29, 2010

Page 42: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 43: Creating Optimal Desktop User Experiences

User

Monday, November 29, 2010

Page 44: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 45: Creating Optimal Desktop User Experiences

Safe

Familiar

Rich

Powerful

ModernMonday, November 29, 2010

Page 46: Creating Optimal Desktop User Experiences

Owning UXMonday, November 29, 2010

Page 47: Creating Optimal Desktop User Experiences

http://commadot.com/best-of-commadot/

Monday, November 29, 2010

Page 48: Creating Optimal Desktop User Experiences

Local Max Island

GlobalMax Island

Monday, November 29, 2010

Page 49: Creating Optimal Desktop User Experiences

The Halloween Principle

Monday, November 29, 2010

Page 50: Creating Optimal Desktop User Experiences

User Research

Monday, November 29, 2010

Page 51: Creating Optimal Desktop User Experiences

Users don’t read

Monday, November 29, 2010

Page 52: Creating Optimal Desktop User Experiences

Love thy Customer

Monday, November 29, 2010

Page 53: Creating Optimal Desktop User Experiences

Size doesn’t matterMonday, November 29, 2010

Page 54: Creating Optimal Desktop User Experiences

Feature you spent 6 months

busting your butt

The reason they love you

Size doesn’t matterMonday, November 29, 2010

Page 55: Creating Optimal Desktop User Experiences

Which is better?Monday, November 29, 2010

Page 56: Creating Optimal Desktop User Experiences

I enjoyed my task

I completed my task

Which is better?Monday, November 29, 2010

Page 57: Creating Optimal Desktop User Experiences

I enjoyed my task

I completed my task

That waseasy to learn

That was fun to use

Which is better?Monday, November 29, 2010

Page 58: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 59: Creating Optimal Desktop User Experiences

Easter Eggs

KeyboardShortcuts

Drag n Drop

Detals

Monday, November 29, 2010

Page 60: Creating Optimal Desktop User Experiences

ReferralsMonday, November 29, 2010

Page 61: Creating Optimal Desktop User Experiences

Make it easier

Monday, November 29, 2010

Page 62: Creating Optimal Desktop User Experiences

Goal

User

RemoveSystem Friction

Blocker

Monday, November 29, 2010

Page 63: Creating Optimal Desktop User Experiences

Goal

UserRemoveSystem Friction

Monday, November 29, 2010

Page 64: Creating Optimal Desktop User Experiences

80% of your users

want bananas!

Monday, November 29, 2010

Page 65: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 66: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 67: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 68: Creating Optimal Desktop User Experiences

Monday, November 29, 2010

Page 69: Creating Optimal Desktop User Experiences

Engineers DesignersMonday, November 29, 2010

Page 70: Creating Optimal Desktop User Experiences

@GlenLipkaBlog: http://commadot.com

Sr. Dir. UX, Marketo

DESKTOP USER EXPERIENCES

Sencha Conference 2010

THANK YOU

Sencha

Monday, November 29, 2010