stanford cs193p - designing for ipad

87
Designing for iPad Evan Doll

Upload: evan-doll

Post on 08-Sep-2014

100.636 views

Category:

Technology


5 download

DESCRIPTION

Guest lecture for Stanford CS193P (iPhone Application Programming) on February 12, 2010.

TRANSCRIPT

Page 1: Stanford CS193P - Designing for iPad

Designing for iPadEvan Doll

Page 2: Stanford CS193P - Designing for iPad

Who am I?

• Evan Doll

• Former Apple employee

• 3 years on iPhone

• Co-taught CS193P

Page 3: Stanford CS193P - Designing for iPad

Who am I?

• Not an Apple employee

• Waiting in line outside the Apple Store just like you

Page 4: Stanford CS193P - Designing for iPad

Today

• How iPad changes everything

• Where does it fit?

• Designing great apps

Page 5: Stanford CS193P - Designing for iPad

Remember

I am not anApple employee!

Page 6: Stanford CS193P - Designing for iPad

First Things First

• I don’t know any iPad secrets

• No SDK discussion today

Page 7: Stanford CS193P - Designing for iPad

How iPadChanges

Everything

Page 8: Stanford CS193P - Designing for iPad

Obligatory photo:

Page 9: Stanford CS193P - Designing for iPad

“Make the screen five inches by eight inches, and you’ll rule the world.”

- Alan Kayhttp://bit.ly/dAXgsQ

Page 10: Stanford CS193P - Designing for iPad

News Flash:Computers are

still too complicated

Page 11: Stanford CS193P - Designing for iPad

Those who design & build computers are most likely to

forget this

Page 12: Stanford CS193P - Designing for iPad

The Gulf of Knowledge

Page 13: Stanford CS193P - Designing for iPad

HackersBloggers

Tech columnistsYou

Page 14: Stanford CS193P - Designing for iPad

Keep this in mind when evaluating new technology

Page 15: Stanford CS193P - Designing for iPad

What’s wrong with the status quo?

Page 16: Stanford CS193P - Designing for iPad

Files

Page 17: Stanford CS193P - Designing for iPad

“On Mac OS X, the /System/Library/ folder...

contains over 90,000 items, not one of which a typical user should ever need to see or touch.”

- John Gruberhttp://daringfireball.net/2009/12/the_tablet

Page 18: Stanford CS193P - Designing for iPad

My mom has ~100 files on her desktop

Page 19: Stanford CS193P - Designing for iPad

Mouse

Page 20: Stanford CS193P - Designing for iPad

Geeks still argue about 1-button vs.

2-button mice

Page 22: Stanford CS193P - Designing for iPad

The mouse is a bug, not a feature

Page 23: Stanford CS193P - Designing for iPad

Your StanfordC.S. Degree

Page 24: Stanford CS193P - Designing for iPad

To your family,this still means“tech support”

Page 25: Stanford CS193P - Designing for iPad

Not just a generation gap

Page 26: Stanford CS193P - Designing for iPad

Opportunity to fundamentally

rethink computing

Page 27: Stanford CS193P - Designing for iPad

Where does it fit?

Page 28: Stanford CS193P - Designing for iPad

http://ohnodoom.com/ibap/

Page 29: Stanford CS193P - Designing for iPad

While drivingAt a restaurant

During the opera

Page 30: Stanford CS193P - Designing for iPad

While drivingAt a restaurant

During the opera

Page 35: Stanford CS193P - Designing for iPad

Laptops and iPhones are often antisocial

Page 36: Stanford CS193P - Designing for iPad

iPad is moreinviting and shareable

Page 37: Stanford CS193P - Designing for iPad
Page 38: Stanford CS193P - Designing for iPad

Multi-user interactions

Page 39: Stanford CS193P - Designing for iPad

Presenter + Viewer

Page 40: Stanford CS193P - Designing for iPad

Multiplayer games

Page 42: Stanford CS193P - Designing for iPad

CombineiPhones + iPad?

Page 43: Stanford CS193P - Designing for iPad

Multiple Touches

Page 44: Stanford CS193P - Designing for iPad

Room for two(or more) hands

Page 46: Stanford CS193P - Designing for iPad

DesigningGreat Apps

Page 47: Stanford CS193P - Designing for iPad

(My) Three Rules

Page 48: Stanford CS193P - Designing for iPad

1. It’s not an iPhone2. Don’t break the flow

3. Make it feel real

Page 49: Stanford CS193P - Designing for iPad

1. It’s not an iPhone

Page 50: Stanford CS193P - Designing for iPad

“It’s just abig iPod touch!”

- Someone on the Internet

Page 51: Stanford CS193P - Designing for iPad

Hardware? Maybe.Software? NO!

Page 52: Stanford CS193P - Designing for iPad

Don’t just recompileyour iPhone app

Page 53: Stanford CS193P - Designing for iPad

Apps that do this will not be well-received

Page 54: Stanford CS193P - Designing for iPad

2. Don’t break the flow

Page 55: Stanford CS193P - Designing for iPad

“One view onscreen”no longer the only way

Page 56: Stanford CS193P - Designing for iPad
Page 57: Stanford CS193P - Designing for iPad
Page 58: Stanford CS193P - Designing for iPad

Use split views

Page 59: Stanford CS193P - Designing for iPad
Page 60: Stanford CS193P - Designing for iPad

Don’t abuse it

Page 61: Stanford CS193P - Designing for iPad

Use popovers formodal content

Page 62: Stanford CS193P - Designing for iPad
Page 63: Stanford CS193P - Designing for iPad

Full-screen transitionscan be disorientingon a large display

Page 64: Stanford CS193P - Designing for iPad

3. Make it feel real

Page 65: Stanford CS193P - Designing for iPad

Direct manipulation

Page 66: Stanford CS193P - Designing for iPad
Page 67: Stanford CS193P - Designing for iPad

Tactile, physical interface design

Page 68: Stanford CS193P - Designing for iPad

Postage Classics ConvertBot

Page 69: Stanford CS193P - Designing for iPad
Page 70: Stanford CS193P - Designing for iPad

Realisticsound effects

Page 71: Stanford CS193P - Designing for iPad

Animations!

Page 72: Stanford CS193P - Designing for iPad

Not just eye candy

Page 73: Stanford CS193P - Designing for iPad

Help user to builda mental mapof your app

Page 74: Stanford CS193P - Designing for iPad

Some specific tips:

Page 75: Stanford CS193P - Designing for iPad

Read theHuman Interface

Guidelines

Page 76: Stanford CS193P - Designing for iPad

Work with agreat designer

Page 77: Stanford CS193P - Designing for iPad

4x the pixels=

4x the ugly

Page 78: Stanford CS193P - Designing for iPad

Performance isa BIG DEAL

Page 79: Stanford CS193P - Designing for iPad

Test on a real iPadfor performance

and usability

Page 80: Stanford CS193P - Designing for iPad

Build a paper iPadhttp://mashable.com/2010/02/08/paper-ipad/

Page 82: Stanford CS193P - Designing for iPad

In summary...

Page 83: Stanford CS193P - Designing for iPad

New platforms don’t come along often

Page 84: Stanford CS193P - Designing for iPad

We are living in exciting times

Page 85: Stanford CS193P - Designing for iPad

The possibilitiesare endless

Page 86: Stanford CS193P - Designing for iPad

Go forth & develop!

Page 87: Stanford CS193P - Designing for iPad

Thanks!@edog1203