Multipurpose Room: Designing the Next Generation of Web Apps

Wednesday, August 16, 2006

Designing the Next Generation of Web Apps

Web 2.0 – How many are comfortable with this phrase? How many are tired? Look at this term in design. And see how boom and bust works.

Nervous: When it makes magazine covers. (shows Biz Week cover of blogs). And looked at venture capital explanation of web 2.0 which was then picked apart.

Booms and Busts:

Tulips market in Netherlands.
Railroads – changed where goods had to be produced
Model T – revolution was how it was produced (getting faster and faster)
Great depression was trading information
Tokyo real estate boom and bust could not be sustained
Net bubble – lasting change underneath

Today we have a real boom with angles investors. Lots of start ups and innovation. (Start a company at the worse possible time.) Seeing first signs of bust with some startups folding (see TechCrunch deadpool).

What can we pull out? How can we do good work?

Web 2.0 Meme Map from O’Reilly. Acknowledgment of lots of things that we’ve been doing.

Elements => Surface – Skeleton – Structure – Scope – Strategy.

Surface - of Blogger.com tried to make it very friendly. Skeleton – show how interaction works. Structure – Info Arch side. Scope – what do we do on the web and what don’t we do. (fits in nice with service design). Strategy – What does our company do?

Apply to Web 2.0

Surface: Everyone has an opinion of the visual (“That is really blue!”). So let’s take a set of numerical data. At least expose some metadata – rainfall in five cities. It is now information with metadata. Next, add color and use background color to push back the metadata. Try changing the numbers to size of raindrops, but this can be dangerous (see USA Today and The Onion).

What can I do with this by letting go of design control? Shows map where users click on city to show the data from the city. Dr. Gitte Lindgaard – trust a web site by first impression at it and only showed 1/20th of second. trust on the surface: visual appeal is initial emotional response. Then cognition and if you do it right you have Halo Effect. Two books: Don Norm in Emotional Design. and B.J. Fogg Persuasive Technology. Think of your users as collaborators. Users Controlling Their Data.

Skeleton: I was comfortable towards interaction design as simple. Really simple to do wireframes. Then AJAX – innovation of perception. Promoted by Google. Then Jesse coined the term. We have wide enough use of modern browsers.

Shows kayak.com so I can plan with the results. Easy to correct from mistakes.

AJAX: “Roller skates for the web!” – Bruce Sterling.

Discoverability. Shows AJAX interaction to find stuff with kayak.com. Google Maps – “you can drag it around”. More like how you use a map. Fundamental change. Panic Goods – would you have discovered how to drag into shopping cart?

Recoverability. ifile.com looking to see if username is already taken. Interesting that they took this down because of engineering changes on the back web. This new tech challenges our tech team.

Context. Simple act of uploading a file and provide feedback on time to upload from Ruby on Rails.

Feedback. How does the system respond? We got lazy with this because the browser would respond to hitting a button. Shows yellow fade effect to show change was done that 37 signals put into Rails.

Structure: How we organize the data. Shows documents folder on his Mac. Search on the desktop has changed this – important shift. Filing metaphor broke down and search took over. And I do the same thing at del.icio.us. Drills into the blog tag. I find most interesting is “show me keyword from all users” and very interesting way.

Tagging experience as architecture. I think the big innovation was how easy it was. Shows flickr and you can add metadata to the pictures. And I can go to the lizard page from my photo – all other data is by users. Their data is the architectures of the site. You can almost use algorithms to provide experience e.g. popularity of tags, last 24 hours. And flickr has no control of what data shows up.

Scope: Increasingly interesting because of commodization. In 1996 you needed $10 million and category leader idea because of cost of building the server farm etc. In the startup world now it is nearly free. And we only pay for the people we get with Pay Per Click. Try out any idea for nearly anything. This has changed the scope of what is viable.

Old Problems. New Platform. Participation. Example is content management systems. So many fail because the solution is so complicated. Shows TypePad. Were not problems about control but about access. Blogging has created a flood of participation because everyone publishes RSS. Hows The Hype Machine. The other example is Google Maps and open the API to show ChicagoCrime.Org mashup. And this was an evening project by one guy.

Old problems: Analytics. MeasureMap. Your site is only one part of the experience. You need to play well with others.

Strategy: No one used a travel agency to book their travel. This is changing across the board.

Amateurization: An Architecture of Participation. Push out the expertise to our audience. Blogosphere and Rathergate and false document. One blogger of typewriters said it could not do the document. And four people from CBS resigned. Clay Shirky weblogs fix the inefficeincits that traditional publishers are paid to overcome.

Look at craigslist takes the bottom out of the newspaper market because of classified ads. And wikipedia.

Back to travel. There is a next step. Show them how to be an expert. flyspy.com to see when you. Or farecast.com to decided when to buy – looking at trends that a travel agent use to do. Triphub allows people to organize a trip which travel agent use to do.

Next generation of blogging tools, vox, help you know what you want to write about. Shows lots of startups logos that we don’t have time to do.

We are definitely in a boom and we can learn from it.

Slide deck is a pdf.