#SXSWi Session Notes: Designing iPad Interfaces

These are my raw notes from this session.AKQA@Lynn_teoHead of User ExperienceTheoryThe first toy you had as a child was really some form of an interface.Common interfaces: calculator, computer mouse closed the gap between user and interface, tablets with stylus went even further, and then touch tablets took the user directly to the interface.Touch is direct, removes ambiguities, leverages forms.Four elements of form: size, shape, form, mechanics.Shows video from YouTube of 2 year old figuring out how to use iPad very, very quickly. Shows how compelling the form of the iPad is, even to a two year old. The physical form of a device lends itself to how you interact with it. The physical device invites you to play with it.Form follows function. - Louis Sullivan, architectObjects have behavioral interactive clues: chairs, doors, drawers, lenses, Rolodex.Form informs function.Looked at 80 apps in preparation for today's presentation. A lot of variety, a broad spectrum.PracticeTarget app. Brings physical world elements into app.Audi app. Form factor lends itself to exploration. Replicates the physical space of the showroom floor. Can go onto the car. Content is not deep, but that is more engaging and you want people to snack on the info.Epicurious app. Replicate a flip book.Page view carousel.MoMA. Makes you feel like you are actually staring at art on the wall. Can swipe across a timeline of artists. Replicates the experience of going to a museum and being able to get up close.Flipboard. Stories are represented as physical tiles. Snack on content.CNN. Presenting news as if it were a board with stories tacked up on it. Give users the ability to skim headlines. Big pictures.Reuters. Video strip at the bottom. Physical recreation of newspapers. A lot of photo galleries.Wired. The notion of a layer, ability to navigate back with direct access to other stories.Courtside. Physical replication of being at the game. Layers. Can watch a game live or pre-recorded.The best navigation systems are the ones that hint at common constructs, hint at physical experiences, it is okay to reuse familiar web/mobile concepts.Navigation schemas that are drawn from familiar constructs are relatable.Gap. Grid feels very free form. Tells you that you should be exploring and the order doesn't matter. Interface that makes use of discoverability easy.Gilt. Commie apps show presentation of products in extremely big tiles. If you tap on the tile, it spins and gives a different view of garnet. Discoverability. Lean on web conventions, buttons that give drop down menu alternate view.Auditorium. Bits of info fed to you in a progressive way. Can launch iTunes. Designed on the premise of relaxing and getting into the music. No rules, up to user as to how to navigate. Giving users a sense of infinity.The Daily. Makes it clear that there're interactive elements you can be playing with.Style.com. Carousels are pumped up. Each row moves independently. Becoming a convention. Invites exploration.NPR. Gives cues to show more content. Split screen content. Layers. Buttons at the bottom ten to be non-contextual.Yellow Pages. Even they are adopting a different approach that allows for discovering businesses. Tiles that flip and bring info to you.ABC News. Unconventional. Spherical in nature. How to get people to explore and read more articles. No fixed principles. Still sticking to the rules of disciverability and something familiar that implies how it should be used.Principles: intuitive, visual affordance (cues to suggest interaction), user feedback, fewer options (even the news applications simplify what they show on the first screen, becomes less overwhelming and intimidating).Simple, intuitive navigation makes them discoverable.Pulse. Tells you what to do. Being explicit and providing users with a quick snapshot of the navigation.Food and Wine. gives a quick snapshot of navigation. Help guide gives tips on gestures.Wired. Wall of pages. Can deep dive into any article. Inspired by print, but training users on new interface paradigms.The Daily. Carousel used to spin the articles, there is no question what you should be doing when you get here. It is huge, which makes the cues extremely learnable and clear.Twitter. Overlapping screens that cascade.Marvel. Comic books. Explicit instruction would have been good here, users didn't realize there were different things they can do.Don't understand how powerful navigation help guides can be. Repetitive application. Explicit in-context instruction.User instruction built in insure that navigation is learnable.Navigation system should be relatable (hinting at physical experience, not replicating it), discoverable, learnable.New form factors bring about new interaction behaviors. The form of then iPad help users interact with content differently.