Lessons From WolfWalk: Interface Design for Tablets

1. Lessons from WolfWalk: Interface Design for Tablets Cory Lown NCSU Libraries edUi 2011 14 October

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

4. WolfWalk Concept Provide a user-friendly way for people to learn about the history of NC State, while exploring campus.

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

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

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

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

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

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

18. Conceptual approach An iPad is a big iPhone, right?

20. Conceptual approach, revised. An iPad is something else.

22. Mail for iPhone/iPod

27. Mail for iPad

34. Apple Mail for iPad

35. Apple Mail for iPad •  Prioritize content

36. Apple Mail for iPad •  Prioritize content •  Flatten the hierarchy

37. Apple Mail for iPad •  Prioritize content •  Flatten the hierarchy •  Minimize full page transitions

43. Details

58. jQuery Mobile •  Touch optimized interface widgets at low cost •  Cross platform support •  Familiar HTML / JavaScript development

71. Thanks! Cory Lown NCSU Libraries cory_lown@ncsu.edu

Recommended