turntable / as the table turns

Last month I did my soap boxing tour and Queenstown junket, talking about our design and development process at Xero. Here are my slides…

After seeing my talk somebody pointed me to this video: “The Science and Art of User Experience at Google”. It’s a presentation by Jen Fitzpatrick, manager of the user experience team at Google, talking about their interaction design process. She shares some really interesting examples of how they collect user feedback, particularly how they track usage patterns and monitor support queries.

A usability note on the actual video file: it contains a caption overlay, which is really useful, but it would be much more useful if that text was available to read/search/copy!

Google have released interactive driving routes (found via Human Factors).

I’m certain this is either heavily influenced or entirely based on the Eyebeam NYC Subway map project. It’s using the same Flash overlay technique.

There are more video demos on personalising maps. This lets you add in photos, videos, even ads (see details here).

When I tried mapping across the two islands of New Zealand it also took into account the ferry crossing. Customising it is amazing. Drag and drop simplicity. Right-click context menu. Scroll wheel zooming, with crosshair centering. It’s another piece of mind blowing design from Google.

Grant and I both worked on driving routes for newzealand.com back in the Web 1.0 days. We know how complex maps and routes can get, even in the simplest implementation. That was later updated to include some Flash interactivity first developed by Andy Biggs and more recently given a major overhaul by Barry Hannah which includes extensive geo-coding. They even integrated it with Google Earth.

When I worked on newzealand.com the biggest user request was always more maps, maps, maps. Wisely, Tourism NZ invested a lot of money into building better maps. They could have never predicted (and certainly never relied on) Google developing technology like this. Now it seems like they should be integrating Google maps into newzealand.com, with photos, videos, and driving routes, rather than continuing to use their proprietary system. Of course, they can still take advantage of the database and technology they’ve built, while leveraging Google’s incredible technology and global reach.

Of course, I can only imagine how useful this is on the iPhone. Could some lucky iPhone owner tell me how it really is (cough Wayne cough)? When we were coming up with blue-sky ideas for newzealand.com mobile and mapping were always the big dream. It’s getting much closer to becoming reality, yet it’s still frustratingly out of reach. Especially considering the price of mobile data.

In the spirit of 37 Better, Adapative Path have answered an open letter to Steve Jobs to design a better insulin pump.

They’ve detailed their whole concept development process for their proposed “Charmr” prototype (I’m sure the working name must have been iDose).

It’s a really outstanding case study of rapid prototyping. They even produced an informercial for it that tells the story in an emotionally compelling narrative.

DATE CORRECTION FOR WELLINGTON:
The Xero UPA presentation in Wellington is happening on Tuesday 7 August.

I’ve been invited to speak next month at UPA events in Wellington and later in Auckland.

I’ll be talking about and showing the interaction design process used to create Xero, providing some insights into the different design techniques used to build a complex online application quickly, yet effectively. I will also discuss how those techniques are evolving as the company and the software grows.

Web 2.0 debate

Last month, I participated on a panel debate at Webstock, arguing the merits of Web 2.0. I thought about making my presentation silly, but I couldn’t help myself and ended up creating a genuine analysis of what Web 2.0 is really all about, what makes it so significant, and why it’s important to understand. I think my slides do explain it pretty well.

I have to admit that our opponents did a much better job of making their case, using their rye cynical wit and deft charisma. Their tactics were extremely effective, but ultimately they were fighting a hopeless cause.

You can watch the full antics here.

I have 2 kids (Emory 7.5 and Jasper 3.5) who are both going to our local Montessori school. I have always felt strongly that the standard school system sucks. I’ve always had a desire to help reshape formal education, to create a better experience focused on: inquisitive thinking, creativity, collaboration, discovery, and following your passion.

No worksheets, no tests, no lectures, no classrooms, no homework.

It turns out, Montessori is what I’ve been after.

We went to a parent night where they showed us some of the materials the kids are currently using and learning. It was incredible. I was so jealous. I wanted to take my 7 year old’s class!!! The things he’s learning are concepts that I’ve only just barely discovered myself after re-reading Bill Bryson’s book “A Short History of Nearly Everything”. I went home and talked to Emory about it and I could see how much he’s absorbing: stong nuclear force, weak nuclear force, dark matter, supernovas, on and on. The learning he’s experiencing is not the type that’s only good for passing tests. He gets it, probably not all of it entirely, but he gets the big important ideas. Meanwhile, he’s enjoying it, really loving it, and because of that a lot more is actually sticking and getting processed in a meaningful way.

The following night we watched a video that outlines the major differences between Montessori and traditional schooling. (I’m happy to lend out my copy if you’re interested in watching it)

At first, it comes off like a cheesy corporate training video. But the content blew my mind.

I came to the profound and stark realization that sending your kid to a traditional school is like giving your kid a lobotomy and throwing them in a torture chamber. If they come out fine, it’s in spite of the education they were given. That’s how I felt about school when I was in it. Now I just wish I saw that video about 2 years ago (and I wish my parents saw it 30 years ago). Our older son Emory went to Montessori pre-school. It was awesome. Then when he was 6 we decided that he should go to the local school: it’s a block away, it had a great reputation, we were unsure whether the Montessori primary school would provide enough “grounding”. Ugh. In some ways it was a necessary and important way for us to learn that even at a “good” school in a country with a good reputation for their education system is just the same old bullshit: worksheets, tests, and catering to the lowest common denominator. It’s just as backwards as everywhere else. After eighteen months of standard schooling, we switched Emory back to Montessori and we are ecstatic.

While watching the Montessori video, I realized how directly related the principles are to interaction design, the web, social networking, and open platforms. Fundamentally, Montessori is a well designed platform that uses the same underlying techniques as our best digital platforms:

• object oriented architecture
• peer networking
• multi-sensory inputs and outputs
• parallel processing
• iterative and agile development
• progressive disclosure and perceived affordances

Best of all, the Montessori platform provides so many beautifully simple, highly imaginative, fun materials to help people (kids and adults alike) enjoy the learning process so that it is an extremely powerful and meaningful experience.

If you’re interested in finding out more about Montessori I highly recommend that you watch the video, read this article and others like it, read this FAQ and go observe a Montessori class.

This past week I went in and spent a couple hours with Emory’s class. I had a lot of fun making this simple little digital story together with the kids. I can’t wait to do it again!

There’s another Webstock Mini coming up on June 19th (my birthday!). The line up looks as great as always: a RoR workshop by the legendary Koz, a tour of Second Life, the low down on Firefox 3, followed by a panel “debate”. I happen to be one of the invited panelists for that debate.

The topic of the debate is “Web 2.0 is all fizz and no substance”. I’m not exactly sure what there is to debate. It seems like a pointless folly to me. I’m hoping we’ll have a bit of fun with it.

In the spirit of web 2.0 and user participation, I urge you to contribute to the wiki I’ve created for the occasion. I’m really counting on some user contributions. Please don’t let me down.

This afternoon I met with my fellow debatrs Brenda Leeuwenberg and Che Tibby to plot our triumph, over lunch at Ka Pai (my new favorite lunch venue - I’ve eaten there 3 days in a row - finally yummy, affordable salads in Wellington!).

Maybe we could all do a Meetup prior to Webstock? No flashmobs please.

UPDATE: Thanks to Grant for this link to a video demo of Photosynth (the concept I refer to below). It doesn’t get sicker than this…

Two emails went flying around yesterday. One about Google Streetside and a follow up about Microsoft Surface.

My reaction to Surface

Kiosks 2.0 (because kiosks 1.0 were so great)

It was pretty easy to predict video billboards the day that LCD screens became available. Being able to get movie times from a movie billboard (note: not a concept I saw in the Surface demos) is something I’ve been waiting for, for a long time. This “vision” of “surface computing”, to me, seems like a very limited, one-trick gimmick. I think paper thin screens will be far more useful and ubiquitous. I seriously doubt that surface computing – in the sense of a dedicated table - will ever go mainstream. Some underlying concepts are likely to persist – ie, some types of gestural interactions, device synching, but those aspects of Surface are no any way revolutionary or unique to this product.

My reaction to Streetside

It’s stunning. Incredible implementation. Absolutely gobsmacking. I was able to look in the doorway (and window) of my old apartment in San Francisco!!

I went down the street where my old office was and I didn’t recognize it since I haven’t been there in 5 years and things have changed. Very trippy.

And it just works. Click around a few times and you know how to use it in all its glory. Yet, it’s quite sophisticated. Amazon did some streetside mapping that was kind of cool, but Google’s implementation is absolutely jaw dropping. The shear scale of data, the elegant game-like interaction, the speed, the depth, the dynamic contextual layers.

I worship Google.

The only thing I wonder about is the usefulness – whether it’s really worth the effort. It’s an extremely cool experience, I can see a few practical uses, lots of impractical uses, but compared to Gmail or even just street maps, I’m not sure there’s such a big pay off beyond bragging rights and cool factor.

However, combine it with a mobile phone and GPS – then I could see it being extremely powerful. Combine Streetside with Microsoft’s dynamic 3D stitching – then I could take a picture with my camera phone and in realtime it gets posted to Google and it’s a form of personal memory mapping and user generated real time mapping. Google could pinpoint where I was, when I was there, and even show me the photo. If, years later, I meet somebody who was at the same place at the same time then we could see how our paths literally crossed. Of course, there’s all the geo-tagging opportunities (this restaurant was rated by your friend Joe last week, there were 3 late night muggings in this alley in the past week).

My favorite bits:

• involve users in your web application’s story
• make growth a social aim for existing users
• talk to your users (bad news > no news) … more likely to tolerate growing pains
• embed your service in others

(thanks Adam)

Based on some of my previous blog posts, I don’t think Apple would be too keen to hire me for this job…

Senior Human Interface Designer

Complete mastery of the Mac OSX platform.

Deep understanding of Apple’s human interface design language and the ability to translate it into future designs of Apple’s professional applications.

Read: must drown yourself in Apple flavored kool-aid.

But I do like these skills criteria:

Exceptional understanding of fundamental design disciplines (typography, composition, information architecture, color and animation) and principals (affordance, clustering, consistency, usability etc…)

Attention to detail and pixel-perfect fit and finish worthy of “one of the crazy ones.”

The ideal candidate is not afraid of a blank white board and can wield dry erase markers with divine-like inspiration.

When I first started working on Xero, I used sticky notes to help me get a sense of what it would take for us to build an online accounting system. After working on those sticky notes for about two weeks, we felt comfortable that we had a good foundation for the product architecture. Two weeks might seem like a long time to spend scribbling on sticky notes. But it was worth it. Those sticky notes are still a point of reference for us to this day – they still reflect the overall product structure and the product roadmap.

From our earliest plans we mapped out two major milestones: having a beta ready by November 2006 and having the product released by April 2007. We had a vague feeling that those two targets were theoretically do-able under ideal circumstances, but we all knew from our past experiences that theory and reality never align, and ideal circumstances only happen in theory.

That’s why I am so amazed that we pulled it off – hitting both targets to the day! Besides working with an amazing team of talented people, with all the hard work and some good luck, I think one of the most important factors that enabled us to make those targets has been our commitment to an agile design and development process.

If we would have done “proper” software specs for Xero we’d still be bogged down writing and arguing over use cases and flow diagrams to this day. Nothing would have even gotten designed or built yet. Instead, our specs process generally involves an hour at the whiteboard identifying the core requirements for an entire piece of functionality. From there, I go straight into prototyping.

My method for prototyping is doing rough screenflows. These are intentionally rough so that we don’t burn our time on low-level visual details, when we just need to sort out the high-level functional concepts. I quickly mock up screen layouts for each transaction in a typical user scenario, from the start of a task to the end, hitting every transaction along the way. It’s like storyboards for movies, scene by scene you see the plot unfold. I can build these prototypes very quickly, generating lots of ideas as I iterate through dozens of different designs in a few hours.

The screenflow prototypes are done as black-and-white outlines, similar to traditional wireframes. Except you move through it like a slideshow, seeing how one thing leads to the next, getting a feel for how it all flows. Traditional wireframes and written specs take a lot more time to create, plus they force you to intellectually resolve how it all works together in your head, instead of seeing how it flows on screen. Having to work it out in your head, instead of seeing it in action, leaves too many things open to misinterpretation, causing major confusion and delays.

With the screenflow prototypes we quickly evaluate what’s right and wrong about a design, what’s missing and what needs to be ripped out. We put the prototypes in front of users to get their feedback, which quickly gives us a good indication if we’re on the right track or not, and it provides us with some insights on how to make it better. Then we do more iterations.

This passage from an article written by the head of IDEO Tim Brown describes what I’m talking about really well:

People need to have a visceral understanding — an image in their minds — of why you’ve chosen a certain strategy and what you’re attempting to create with it.

Because it’s pictorial, design describes the world in a way that’s not open to many interpretations. Designers, by making a film, scenario, or prototype, can help people experience the thing that the strategy seeks to describe.

Build to Think

Design thinking is inherently a prototyping process. Once you spot a promising idea, you build it. The prototype is typically a drawing, model, or film that describes a product, system, or service. We build these models very quickly; they’re rough, ready, and not at all elegant, but they work. The goal isn’t to create a close approximation of the finished product or process; the goal is to elicit feedback that helps us work through the problem we’re trying to solve. In a sense, we build to think.

When you rapidly prototype, you’re actually beginning to build the strategy itself. And you’re doing so very early in the innovation cycle. This enables you to unlock one of your organization’s most valuable assets: people’s intuitions. When you sit down with your senior team and show them prototypes of the products and services you want to put out in two years’ time, you get their intuitive feel for whether you’re headed in the right direction. It’s a process of enlightened trial and error: Observe the world, identify patterns of behavior, generate ideas, get feedback, repeat the process, and keep refining until you’re ready to bring the thing to market.

The Prototype Tells a Story

Prototyping is simultaneously an evaluative process — it generates feedback and enables you to make midflight corrections — and a storytelling process. It’s a way of visually and viscerally describing your strategy.