South By Southwest Interactive - Day 3

Wireframing in a Web 2.0 World

James Box and Richard Rutter of clearleft presented Wireframing in a Web 2.0 World first thing Sunday morning. Somehow, I managed to stumble in early. While their presentation wasn't necessarily ground-breaking, it was definitely one of the better and more useful panels I attended all weekend. It makes sense to me that developing prototypes is much more useful than assembling mounds of inarticulate paper wireframes, but maybe it's just because I'm a developer.

What James and Richard do for RIAs is develop functional prototypes for their layout and interactions. When I say functional, I mean that it simulates the user experience. It doesn't have the cleanest code and chances are it doesn't actually do anything - it's just used to give a better feeling of what it will be like to use a certain web page. They tend to use pre-packaged, simple libraries like jQuery or script.aculo.us.

So why bother creating these HTML prototypes? Well, everybody involved in a project uses the wireframes, and with a functional prototype, everybody can understand it and see how things will work. It will also give visual designers a better understanding of how to design for the various situations and states the page can be in.

Jeremy Keith (I think) said, you can't tell how well something will work until it's sitting in your sweaty palm. Without taking part in and using something, you can't really tell if it is going to be usable. As I mentioned in my previous post about accessibility, you can't accurately reproduce the experience of someone using a screen-reader by imagining using one - you need to physically use one. The same goes for RIAs - it's near impossible to imagine using a complicated, stateful application and then from that, create a simple, intuitive interface. Chances are that some of your assumptions are going to be - gasp - wrong (like using Flash where it's not needed, or over-usage of buzz-words like Ajax.)

For developers, the most useful thing about functional prototypes is that it's much easier actually clearly see how something should behave, rather than trying to interpret a written description of behavior. Granted, the prototype should not be over-done - annotations are still better in some cases like describing behavior when JavaScript is turned off. There is a tool called PolyPage which helps adding notes and page states to wireframes. These notes should be used to explain the various states, errors, and graceful degredation/progressive enhancement. Clearleft has a demo of PolyPage wireframes for a fictional social networking site. For more information presenters themselves, Richard has posted some links and notes on his blog.

The Real Dragon: Understanding the Web and Digital Media in China

The next panel I went to was The Real Dragon: Understanding the Web and Digital Media in China. A recurring theme throughout the conference was that, although mobile browsing in America and Europe are relatively low (compared to PC), mobile phones are the primary means of accessing the internet almost everywhere else. People cannot afford personal computers, do not have stable phone lines for internet, and therefore, rarely use computers for the web. The site Pacific Epoch tracks development of these types of media in China.

One of the big exceptions to the rule however, is internet cafes in China, which are hangouts for groups of people playing games over the internet. Video games are huge in China. Kids who undergo enormous amounts of stress (China has a one-child per family law) use the internet to socialize and chat on instant messaging services, and escape with video games. While over 70% of internet users are over the age of 30 in America, 70% of internet users are under the age of 30 in China. There is a very different demographic in China, and they are expecting a very different experience from their internet.

Another big cultural difference which translates into the internet is that China has primarily a cash-based economy. Not many people trust credit cards, and even fewer have them. A standard "e-commerce" transaction in China consists of a user ordering something online and exchanging cash for the goods with a bike-messenger who arrives at their house half an hour later.

The cultural differences and home city issues are going to be best understood by native Chinese developers and designers. Chinese users are expecting busy, blinking, flashing sites ridden with advertisements and popups. I'm not saying that is a good thing, but that is the norm in the Chinese web. Due to connection speed limitations, streaming media may be of less quality, etc. Creating an international team will simplify these differences, provided the teams are similar enough to keep brand and product development consistent while remaining independent enough to perform their specific tasks in their own way. A key facet of this is finding management capable of understanding these differences and hiring a strong, highly talented team across the sea to take on their own projects. Management and quality control are not positions most people have experience with in China, and adhering to best practices may be difficult for the wrong person.

Get Rich, Remain Accessible

After lunch and a quick power nap, I went to the Core Conversation
Get Rich, Remain Accessible. Lots of the industry leaders for ARIA were there.

This wasn't so much a presentation as it was just a round-table discussion of about 20 people talking about accessibility and dynamic web sites. A lot was a continuation of the presentation from the day before, kind of exploring more in-depth how to use live regions, politeness levels, consistent keyboard interactions across widgets, and other best practices.

That being said, best practices are not necessarily going to help everybody. Many people can't afford to update their computers and software, so may not have access to ARIA-enabled features. No matter how hard you try to make rich internet applications accessible, it's very difficult to guarantee that all users get the same experience. Unfortunately, WAI-ARIA is not yet fully standard, and is not implemented in many common browsers. But, it's not going to break anything to implement WAI-ARIA, and Mozilla has some good resources in addition to the W3C stuff.

Harness the Power of Social Networking on Your Intranet

This presentation was pretty much what I was expecting. It explained the problems with your typical intranet:

• search doesn't work
• the navigation doesn't make sense to everyone
• information and documentation is scattered and out-of-date

But how do you resolve those problems? The best way is to make it impossible for people to do their job efficiently without using the intranet. By that, I don't mean "hijack all your documents and stuff them into one main repository" or monitor everyone's usage. The intranet should be such a useful resource, that everybody wants to use it so they can be more productive. And one of the hardest parts of that is keeping all of the documentation up to-date.

In most companies, people use a variety of places to store files and documentation. This is because everybody has their own method of organizing things. This is why hierarchical navigation in intranets does not work. I cannot navigate the mindset of the developer who created my intranet, because chances are that I'd organize things differently. Social intranets allow users to organize and sort information relevent to them as they please - through the use of tags, contacts, and then if those fail, the traditional navigation and search features are still available.

Most people are familiar with social networking sites now, and by making employees responsible for updating their profiles and their documentation, others will find find fresh and relevant data, making them want to use the intranet. It should be fun and helpful. So don't force people to use the intranet, but make it so that they can't live without it.

In closing

I tend to get lazy and scatter-brained the more I write. I should take shorter days. Or perhaps just create shorter blog posts.