Lessons From WolfWalk: Interface Design for Tablets

Lessons from WolfWalk: Interface Design for Tablets

Cory Lown NCSU Libraries

edUi 2011 14 October

Outline

•  WolfWalk overview •  First tablet design •  Tablets are different •  WolfWalk for iPad •  Tablets and the Web

Outline

•  WolfWalk overview •  First tablet design •  Tablets are different •  WolfWalk for iPad •  Tablets and the Web

WolfWalk Concept

Provide a user-friendly way for people to learn about the

history of NC State, while exploring campus.

Albums from UA023.005 Campus Views and Facilities Sub-Group, NCSU Special Collections Research Center"

Jason Casden, lead developer for WolfWalk, at the NCSU Memorial Tower"

Jason Casden, lead developer for WolfWalk, at the NCSU Memorial Tower"

WolfWalk 1.0

•  Released March 2010 •  Location-aware •  Two flavors •  Mobile web •  Native iPhone/iPod Touch

WolfWalk 1.1

•  Released June 2011 •  Location-aware •  Three flavors •  Mobile web •  Native iPhone/iPod Touch •  Native iPad

WolfWalk 1.1

•  Released June 2011 •  Location-aware •  Three flavors •  Mobile web •  Native iPhone/iPod Touch •  Native iPad

Outline

•  WolfWalk overview •  First tablet design •  Tablets are different •  WolfWalk for iPad •  Tablets and the Web

Conceptual approach

An iPad is a big iPhone, right?

Conceptual approach, revised.

An iPad is something else.

Outline

•  WolfWalk overview •  First tablet design •  Tablets are different •  WolfWalk for iPad •  Tablets and the Web

Mail for iPhone/iPod

Mail for iPad

Apple Mail for iPad

Apple Mail for iPad

•  Prioritize content

Apple Mail for iPad

•  Prioritize content

•  Flatten the hierarchy

Apple Mail for iPad

•  Prioritize content

•  Flatten the hierarchy

•  Minimize full page transitions

Outline

•  WolfWalk overview •  First tablet design •  Tablets are different •  WolfWalk for iPad •  Tablets and the Web

Details

Outline

•  WolfWalk overview •  First tablet design •  Tablets are different •  WolfWalk for iPad •  Tablets and the Web

jQuery Mobile

•  Touch optimized interface widgets at low cost

•  Cross platform support •  Familiar HTML /

JavaScript development

Thanks!

Cory Lown NCSU Libraries cory_lown@ncsu.edu