web directions south 2007, day one (big stonking post)
I had planned to liveblog these as the day went on, but as is now traditional the laptop refused to connect to the wireless network.
So, here they are in One Big Stonking Post™! :)
In this post:
- Rashmi Sinha - the perils of popularity
- Andy Clarke - Think like a mountain
- Cam Adams - Future of web based interfaces
- John Allsopp - where's your web at?
- Chris Wilson - Moving the web forward
Rashmi Sinha - the perils of popularity
Object-based social networks: we don't meet in real life and say "hey let's grow our network..." we do stuff; we meet for stuff like coffee and beer. So the successful new social networks tap into this - they're more human.
flickr/youtube etc - based on objects.
Social app has 3 components - the objects, the place, the graph (social graph)
Four models of popularity:
- Google - blind sociality. Social network cannot be browsed. They prefer you to search.
- Digg - laser beam. Very focussed in terms of content type/topics, type of user, etc. Encourages mobs; quick, engaging, transparent and simple metric; but encourages conformity. "3000 diggs... I'll digg it too" (rich get richer effect). Compare with Flickr were you see other photos and you respond by posting your own. [book ref: The Wisdom of Crowds by James Surowiecki]
- YouTube - promiscuous popularity. Many metrics, navigation by popularity. Most viewed will land on homepage. "diff strokes for diff folks" Slideshare launched and discovered that there is slideshow porn! Not most commented, faved or tagged - but it was most viewed. So they had porn on their homepage. Had to sort out community flagging etc to deal with it. Long tail of content - anyone can share; but who reaches the masses? It is a new game to play if you want to put out content which is popular. The way hits are created has changed. [movie ref: The Player]
- [John A's q: this reminds him of Game Theory, what does she think? reply: doesn't formally know Game Theory but sees some parallels, also relating to popular culture eg. Survivor which uses competition as the basis for the product]
- [Chaals: so this means systems will give success to people who can game the system..? reply: not so much as people who know how to play the game, as opposed to gaming the system.]
- [Q: social networks vs. the dangers, especially to young people. A: provide tools to help people filter - let the community filter the site. All social networks are struggling with the issue, particularly as peoples thresholds/standards - ie. "is this porn or not?" is not a black and white question, everyone has a different opinion/threshold. Colin notes: will we get social network police and vigilante groups? My thought: the only 100% sure filter is supervision, the tools can only help but can't be relied on.]
The rules of the game are always changing. Metrics change, viral pace throttled; but still no levelling of the playing field.
So think... what kind of interaction do you want?
The metric counts:
- Digg - one transparent metric, easily corrupted.
- Youtube - multiple metrics, harder to spam
- (third, missed it)
Give up control! "This is messy" hard to do - you're so invested in it.
Q: methods people are using to prevent gaming the system; could you expand on how Slideshare combats it. A: it's a constantly changing game, it's always a battle.
Make system personally useful. Don't count on altruism, thrive on people's selfishness. What's in it for them? What is your system providing the user?
Q: does real life popularity translate online, for individuals and companies. A: asked the crowd, people didn't seem to think so. Q: will the cool kids be cool online? A: thinks not related at all, eg. pagerank can push people off the first page of results despite other deserving people also being relevant to the search. The systems aren't a direct correlation.
Q: how did Slideshare start becoming popular? A: first thing, make it useful. Powerpoint might be 99% bad but everyone does it, everyone needs it. Also, be agile. No magic bullets. Respond fast, see what is working and do more of that. Take away features when they aren't serving any needs.
Q: how did you know you were successful? A: Alexa tells us we're doing well, our users love us (lots of passionate email/blogs). It's relative! ...really good question, I don't know!
Andy Clarke - Think like a mountain
Discussing influence of comic books on art, not just Hollywood but "real" art as well like fine art.
They also influenced a lot of young boys who go on to become geeks and make websites.
So what can we take from comics and apply to the web?
Every writer + artist combination will have a style. So the reader has to learn how to follow the story from panel to panel. [book ref: Understanding Comics by Scott McLeod]
Between panels things are going on, but they are implicit. You are left to imagine what's going on. Also you might get a series of panels which aren't explicitly explained but are all related. Then scene to scene cuts.
Compare it with moving between pages, or between sites. When you get there do you need to re-learn what's happening? How do you know you've got where you expected to go?
Consistency used to create rhythm, and that's only broken for dramatic effect - not to fit more content in. The size of the content doesn't drive the design, the story drives the design. The size and shape of panels can give cues as to how long you should spend reading/looking at them.
* takes comic book layout and creates grey box layouts
Can we take comic book rhythm to a website? Many web layouts are fixed width, same as with comics. Not putting a border around some content may bring more emphasis to that content. Seems back to front but it works really well in comics.
Doesn't have to be OTT, it can just be a slight difference in colour/contrast/opacity. Eg. five rows of content, odd rows slightly lighter or darker.
Splash pages - people thought they were cover art but that's not the right way to look at it. The job of the cover is to draw your eye to that title so you pick it up, but on the web we don't need that. Covers also provide continuity between issues.
First panel is more like a splash page. Gives the reader an idea of place and where they're being taken with the story. Some issues might give a "for new readers" summary, helping the reader understand where they are starting from.
Compare comic panel layout with grid design for the web. Comics often use unusual panel layouts, so they have ways to provide the cues you need to decide where to go next. eg. position of speech balloons.
Comics create a sense of drama. But we rarely see it on the web. Similarly we don't generally provide movement and pace. So drama is important!
Example: comic putting just a couple of panels off centre, rotated slightly, to give the sense that something has gone wrong.
Colour changes things - it can be useful to work in pure black and white for structure. Does colour always add something? Sin City uses black and white with the very occasional splashes of yellow and red. Those splashes POP.
We should look for inspiration in non-web media!
(Due to copyright restrictions, the slides probably won't be posted)
fireside chat about w3c specs
Should the big companies be making the decisions about the tools we're getting? It's not their web it's OUR web.
So... we should stop whining and do something.
International group of visual designers; going to spend time developing a translated example of how things need to work.
Translating CSS specs into visual language.
Two months per spec.
Also calling for input.
Cam Adams - Future of web based interfaces
You'll never create one interface which works for everyone. What about providing a range of interfaces? We can create dynamic interfaces which adapt to the user's needs.
We have the technology. Also, caveat: dynamic interfaces aren't for everyone, not for every site. Also the more browsing-oriented the site is (eg. wikipedia) you're probably not going to need it as much as something like Gmail.
Two approaches: 1) customisation, push from user; 2) analysis, you do the work! Look at what the user is doing and tailor the interface for what they're doing.
Levels of customisation - eg. Twitter has only a small number of options, MySpace has lots of customisation (although it's really hard - too much HTML/CSS for the average user). MySpace users end up choosing from template sites - ie. they're not expressing themselves.
Customisation - you need to choose how many restraints you'll place on it. MySpace doesn't really stop you doing anything; whereas Flickr is quite rigid - you choose between some layouts. But it still effects how people interact with the page. But are Flickr's 6 choices too static?
Modular approach - eg. landing pages like Netvibes or iGoogle. You can choose what to show and where to put it. Similar to Photoshop's layout options. Still pretty restricted.
What about moving widgets into content? eg. SearchMash (google) customisation modules. Compare "Alpha" (yahoo). Yes, a product called Alpha Beta! It maintains preferences through your session.
Interface should be your mental model. Customisation shouldn't create a gap between the interface and the user's mental model. eg. it's better to let the user just move stuff around, rather than pushing them off to another page then coming back to see the results.
Looking beyond HTML, stuff like canvas and SVG offers cool interface opportunites. Much cooler than flash since they're not plugins!
How can it all be done?
Most important thing is to separate Data, Style and Behaviour. Separating those gives you immense freedom.
Work out what the user is doing then customise the experience accordingly. Simple example is to run a decent print stylesheet.
You can also adjust the page layout based on window size/resolution. Particularly helpful for a cramped/busy page - let it breathe at higher resolution.
Sidenotes: iPhone does use handheld media type. CSS3 has width-based selectors. Things will get better/easier as we go along.
So anyway, in the meantime, Js can fill the gaps left by CSS/HTML.
But you don't have to change the whole page - you can just change parts. eg. You can track a user's account to show they've already downloaded something, so you no longer have to emphasise that item. If they've visited a bunch of times you can offer to minimise the help area, since they probably don't need it.
But! Give them the choice. Let them confirm or reject.
BBC did "digital patina" which emphasised the areas the user read more often. The sections the user reads the most get darker/more prominent. Pulls the user's eye to the area they use the most.
Make sure you get the basics right first.
Go with progressive enhancement.
Really put effort into design.
John Allsopp - where's your web at?
The great successes of the web have been built by developers and technologists, not managers.
So what trends are exciting John? :)
Computing paradigm - you go to the web, you go to the computer, you sit in your den isolated while you use it. But this is breaking down. Now the web is becoming ubiquitous, wherever you go, the web is there.
We're also changing the way we interact with computers. eg. the web on a Wii is different to the web on a computer. Same again for a PSP.
Your car will have a browser soon - but hey you're not going to use a mouse and keyboard while driving. So how will you use that?
Key point - you need to separate your application from the interface since it could change so much. Your website could be used on so many devices.
The OS is not looking like the platform so much, rather it's the browser that's the platform. The web is becoming the platform.
Everything is moving from the centre to the edges. We are only just beginning to build apps with this in mind. The centre can not be held.
Current wifi isn't that great but will improve. Devices will increasingly know where they are.
We are unchained from the desktop, we will always be connected wherever we go. So what can we do now, with this situation, that we can't do in the old model?
Devices will be able to react to location and proximity. If you're in the pub it should be able to have your phone alert you if a friend is there too.
It's more than mapping - it's not just where you are. It's about where someone is, who is nearby and what is nearby.
It's a huge opportunity for developers. There are moments of great change when you can do big things - eg. when personal computers arrived, it really changed computing.
It's like the Wii busting up the Xbox vs. PS3 fight.
David Storey about the Wii: "They thought about the users, rather than the technology"
The Wii makes gaming into a casual experience, shared experience. It gets away from the solitary, tethered to screen feeling of old gaming (although consoles did this to some extent when they got people away from PCs).
The Wii also has a fully fledged, standards-based browser (Opera) rather than no browser or a crappy half-baked thing.
So it means the internet is not just on computers now. With the Wii you can have four people on the web at once, in their lounge room. So what web app might you build for that scenario?
Challenges on the Wii: resolution and accessibitily, mousing/interaction, text input, shared experiences. Of course if you've been thinking about accessibility you get a head start on this, you've already been thinking about this stuff.
Has the mobile web arrived at last? iPhone, iPod touch, mobiles with decent browsers like Opera and Safari.
These devices will push for better, cheaper wifi - demand will massively increase.
There are no baselines to fall back on. There's none of this "best viewed in.." stuff.
Many of our design and interaction patterns are meaningless if you're not using a PC/laptop. Fixed widths, multi-column, etc... they don't make sense on a plasma screen with a Wii.
User input is profoundly different. No mouse, or even a keyboard. Virtual keyboards are difficult to use so you want to minimise the amount you need to enter. Voice input and commands - might make sense for the car, but you wouldn't want it in your office.
Input is changing - it's not active input all the time, there's passive input like last.fm tracking what you really listen to. In the past you always had to use active input, which mean you actually had to decide to enter some kind of input/event.
This does indeed have privacy and security issues but surely technology can solve those problems.
Where's your data at?
Traditional computing and the web... isolated data and services, walled gardens requiring registration, the service owning the data you entered. Data storage and transfer isn't especially structured.
With data at the edges, you get more structure and portability. APIs, RSS, JSON, microformats etc.
- build you application from the API up
- use these internally
- what data and services can you make available?
This is a huge cultural change for organisations and managers. But, value is moving from content to attention. How do you encourage the use of your data?
Attention economy: how can I get more people paying attention to what I've got to say?
Users are becoming the ecosystem. They're not just contributing content.
eg. Blogger vs. Wordpress - Wordpress has the users building addons. Blogger doesn't. [of course Blogger doesn't require you to install all the updates :)]
How do you encourage ecosystems? Offer customisability; plug in architectures; APIs; licensing which lets people do stuff.
Smaller, more focussed, easier to debug and maintain, easier to bring to market, easier to abandon (lower overhead, you can walk away without major repercussions).
eg. John's products going from big projects to Xray. Xray took only ten days from idea to fully polished release; yet jumped to top of Google results in just two weeks.
John put forth a series of challenges - check them out in slideshare.
Chris Wilson - Moving the web forward
Remembering the vision of the web - it was simple to create and serve. Anyone could be a content producer... but not everyone was. Driven by the need to interconnect.
"Web 2.0 is...." 'caring about the quality of web UI'. Rich social experiences to make the web immersive. Connecting people to people, not just information. Portable across platforms, devices even languages and cultures.
Segment the world into three groups of people:
- Web developers
- Browser vendors
- Everybody else
CW's understanding.... being a web developer is painful! Trying to get all the browsers to work, then they change...
The world as a browser vendor:
- hacking browsers is lucrative, so it's a challenge (and a major expense) to vendors
- security is hard. hacks target complex interactions, "they're not just buffer overruns".
- you have to protect against web fraud as well
"We can't break the web." Not only are there deployed browsers, there's also deployed content and you can't have that just stop working.
Run the numbers... IE has half a billion users, which means if you do something to effect 1% it's hundreds of thousands of people. If you make something break, they'll uninstall the updated browser which caused the problem. So compatibility prevents upgrades.
"The bar" is different for each browser. Each browser's new version is expected to work basically the same way as the previous one.
The very long period of time with IE6 means that people built in the ways to deal with it. IE6 hacks are in libraries, and so on; so many people aren't even aware that they're relying on it.
In short, "we can't break my mom's banking site". She takes away "IE's broken".
The question is... not "why should we care about standards"", it's "how do we support standards without breaking the web for millions of users?"
So who do vendors listen to? Everyone has an opinion and they conflict.
You can't move forward in ways that aren't secure enough for a bank, nor too hard for an IT guy to deploy, no can you break your mum's browser.
So they come to the saying "Leave the web better than we found it"
Better means more secure, more stable, more interoperable, more performant, more powerful (more capable, more features).
Security is not just a browser issue, it's everyone's problem. Vendors, developers, etc.. everyone is involved. Everyone should think about how they might be attacked; and respond accordingly.
Privacy is still an issue; and mashups etc are catalysts for risk. You need to be aware of the data you collect, who sees it, how can they use it and so on.
Chris's rules of compatibility:
- If a page works in browser x, it has to work in the next version of x.
- If a page only uses standards, and it works in one browser, the effort to get it to work in another browser should approach zero.
- Don't needlessly multiply the test matrix (don't trickle out standards in updates)
So you can't just push out updates which change rendering behaviour.
You can't just use quirks and standards mode, since not all bad sites are in quirks mode and vice versa.
What about Microsoft?
- They are working on IE.Next - IE isn't "going away again"
- They are committed to standards
- Web 2.0 changes the assumptions for us