1. Designing for hyper-connectivity
James Box WDC 2008 Bristol | November 2008
Good morning Bristol.
I do like being back on university time.
Starting at 11 is a much more civil time than 9.
Nice to see you all.

2. One lonely connection…
This is the story of one lonely, solitary connection.
Perhaps my first glimpse of a hyperlink.

3. Beak St, Soho / Way back...1999 maybe.
Got talking to a guy named Dave (everyone’s called Dave in my presentations).
Explained that the number on that t-shirt was unique to him and that if I entered it in to a
specific website, it would tell me all about him.
Dave was kinda confident. And I think it was really a chat up line for him. I never saw Dave
again, but I’m pretty sure he’s still single.
Nonetheless the concept captivated me.
Wearing a number. An unique identifier. In prison, prisoners are known by their number as
opposed to their name. This is a form of punishment. A loss of identity.
This was complete opposite. This was something Dave elected to do.
In many ways it was nothing more than a fragile, lonely piece of metadata, but used in
connection with the website, it revealed some of his identity.
I think this is my first memory of the web augmenting someone’s identity.
Incidentally, does anyone know where these numbers are from?

4. Recurring theme in the TV series Lost and has absolutely nothing to do with this
presentation.
Although, this guy does remind me of Dave.

5. 4 8 15 16 23 52
At the time, I was a web novice. But in hindsight, I look back and see these numbers as my
first glimpse of a web connection.
Something similar to a URL or perhaps even hypertext.
Hypertext is really taken for granted now, but it still is the defining feature of the web.
Without it, the web would not exist.
So in this case, the numbers themselves mean nothing…

6. <a href=”http://jeckecko.net” rel=”me”>
4 8 15 16 23 52
</a>
…but marked-up with a hyperlink they become meaningful.
To both a machine and to geeks. I use the term interchangeably ;-)
They define a connection. In this case, the link to my personal website.
This talk is about designing for these connections & connectivity and the ways in which this
has changed during the web’s comparatively short life-span.

7. But before we do that...some context.
Me / Information Architect / IxD / Social spaces / Especially those mediated by technology
A lot of the ‘design’ I’ll be talking about today will be addressed from an IA perspective as
opposed to the world of pretty visual design.
I’m hoping that some of this stuff will also dovetail nicely with Chris’ talk later on.
Clearleft, Brighton / UX consultancy / Silverback / dConstruct / UXLondon
I should also add that I am myself an ex-UWE student so go easy with me.
I was trying to work this out but I think I was living in Bristol around ‘93-’97.
I’m pleased to say by the end of those four years, I was extremely good at Mario Kart.

8. I should also add that this talk is partially influenced by Jonathan Harris/FOTB.
Out of interest, did anyone see or hear about this talk?
Creator of some incredible web work like wefeelfine.org (highly recommend)
Let’s just say the talk caused a bit of a stir.
This slide is from that talk. Harris posited that he is yet to see any great masterpieces within
web design.
I think ‘masterpiece’ is the wrong term to describe design and is actually more appropriate to
works of art, but it remains a very provocative statement.
Irrespective of the rights and wrongs of Harris’ statement, IMO, we have reached a critical
point in terms of how we approach designing experiences with the web.
Many people associate the term web2.0 with this kind of shift, but I prefer to think that the
web is only just beginning to realise its potential. We can’t have a web2.0 if we haven’t had a
web1.0!
Hyper-connectivity is a critical component of that shift.

9. “My salad days,
When I was green in judgement,
cold in blood...”
ANTONY & CLEOPATRA
The other question to ask here is, can ‘masterpieces’ really exist within a medium so young?
Before we go there, can anyone tell me how old the web is?
It’s very easy to forget this but the web is actually only 5000 days old (roughly).
That makes it not even old enough to go to university.
Or A-levels, or GCSEs.
It is an actual fact, a hormone-riddled, pubescent teenager struggling to come to terms with
its own identity.
In light of its relatively short life-span, I think it’s fair to say we have seen a remarkable level
of progression.

10. The web: like TV only BETTER!
Not bad for something that people envisaged would be like ‘TV but even better’.
I always think visions of the future are interesting.
Even if it is just for us to go back and laugh.
This is from an IBM slide presentation in 1975 entitled:
“It's 1975 And This Man Is About To Show You The Future”

11. As you can see this vision made perfect sense.
There will be information.
And programs (huh?)

12. I love this. I think this is the point in the presentation where people were supposed to be
thinking:
“On my god, this is amazing....b-b-b-b-but how?”
and the answer…

13. Well of course, you need a data base [sic].
Clearly the medium was so young that the words data and base hadn’t even merged yet.

14. “When a new medium borrows from an
existing one, some of what it borrows
makes sense, but much of the borrowing
is thoughtless, ‘ritual’, and often
constrains the new medium…
Still 5000 days is a relatively short life-span.
And inevitably, as is the case with any new medium, we have relics from the mediums that
preceded it: Print design, TV etc.
Way back In 2000, A List Apart published an article by John Allsopp called ‘A Dao of Web
Design’.
In the article, John decreed that it was time the web found its own identity.
That it should stop relying on the unnecessary conventions of previous mediums.
[quote…continues…]

15. …Over time, the new medium
develops its own conventions,
throwing off existing conventions
that don’t make sense. ”
[finish quote]
Clearly we have a lot more than ‘slightly better TV’, but I think it’s fair to say that much of
today’s web still relies on the paradigms and models of those that preceded it.
I apologise for using the word paradigm btw.
It makes me sound like I know what I’m talking about ;-)
But certainly one of those conventions, a feature of print design, is the concept of the page…

16. Limited connections: the web of pages
And so we have ‘the web of pages’.
I think in many ways this is still really how the mass market views the web.
You have a web site which contains lots of ‘pages’ of content.
In effect, lots of silos of information that operate independently of one another.
A site whose structure and therefore the way it is experienced is designed by us web
designers.
And for the majority of my career as a web designer/UX practitioner, I think we have been
designing for this model.

17. In my role as an Information Architect, designing the user experience for a set of limited
connections is often a case of simple sign-posting.
Creating an optimum path through our pages to information the user requires.
Providing the user with cues to move from point A to point B.
Often these take the form of ‘navigation’ or perhaps a crumb trail. You know the kind of stuff
I’m talking about.
For an IA, these paths often manifest themselves in the form of a site map – a blueprint of the
site’s structure.
Interesting that we use the term map–something that we normally associate with a physical
location–to help us understand this model.
Similarly, sign-posting is another one of the spatial metaphors we have used to help us
understand the web.
Even the term web ‘site’ itself, is a reference to a physical location.
In the same way we borrow from previous mediums, it helps for us to understand new
experiences by relating them to our everyday experience. Basically through the use of
metaphors.

18. Sometimes sign-posting or designing the optimum path is really, really easy.
What’s plainly obvious is that Jonathan Harris had not seen this site when he claimed there
were no masterpieces within web design!
It is of course, the US Dept of Agriculture's, Farm Service Agency, website for Hay.
And clearly these guys really know their users!
There are those that ‘need hay’ and those that ‘have hay’.
Simple.
If only it were this easy all the time.

19. In the same vein (no pun intended), some of you may also be familiar with Cynthia Caster’s
work.
Cynthia, as you might guess, makes plaster-casts of rock stars and other famous people’s
genitalia.
And just like Hay.net, Cynthia Caster knows her audience
In this case they fit into two pretty self-explanatory groups.
Those that ‘want plaster-casts of dicks’ and those that ‘want plaster-casts of tits’.
The labels are so so good, she doesn’t even need icons.
Although if she ever needed any...
Incidentally, Jimi Hendrix was one of her subjects and I can tell you all the rumours are true.

20. Typically it’s a little harder than this and a UX designer will spend some time upfront
conducting research to find out what the users need.
Often this research manifests itself in the form of design tools such as personas – archetypal
or typical users – that help us to empathise with the range of users we are designing for.
So in the case above, we firstly have some information about Adam Fletcher
– demographics and personal background, followed by his technical expertise,
income etc. This stuff is really there to help us derive the important stuff
on the right: The scenarios...how Adam will use the site. What problems he
needs to solve and a feature to address this.
In short we extract attitudes, behaviour, needs, goals and motivations and design for them.
Clearly the goal here is to ensure we get as close to possible to a user-centered design and
hopefully an optimal path through a set of limited connections.

21. Reductionism
Obviously I’m brushing over the techniques here, but what I hope I’m illustrating is is
essentially how much of UX design employs a scientific approach to the design of a user
experience.
By breaking the problem down into its constituent parts.
This is the notion of ‘reductionism’ which was the driving force behind much of the twentieth
century’s scientific research.
It tell us that to comprehend nature, we first must decipher its components.
The assumption here is that once we understand the parts, it will be easy to grasp the whole.
And this model has worked. With a limited number of pages, we have a limited number of
connections and so a limited number of variables to design for.
Our job as designers of the experience is to organise these connections into meaningful
interactions for our users.

22. Hyper-connectivity: the web of data
The web we’re seeing to today is not characterised by limited connections.
Or pages.
Data that has typically been entwined within a web page, is now available as a resource its
own right.
Formats like RSS separate the data from the HTML page that contains it–if there is indeed one
at all. We see can consume content how we choose. Maybe on a web page. Maybe within an
RSS reader. Maybe via an internet enabled bunny like a Nabaztag.
And data is an entirely different beast to a page.
It’s open. It’s hackable. It’s re-combinable. In terms of connectivity, we have a far more
powerful option.
As a result the number of connections we now have to design for has grown exponentially.
Let’s try and clarify this:

23. Firstly, I think we need to acknowledge that this technology has helped to create a genuine
cultural shift here in terms of ownership. In terms of who owns what.
The bottom-up mash-up culture is now mainstream (I hate that word)
Artists like Radiohead are challenging our existing models of ownership with their pricing
model and remix competitions.
When I buy music I no longer expect a tangible object that I can pore and gloat over (although
it's nice).
No. We’ve cut ourselves a different deal now. The value is now instant access, instant
use, remix-ability. The option to move the file from device to device.
This challenges our traditional model of where value lies...not in tangible objects such as
bricks and mortar...it's actually in the bits–the ones and noughts themselves. The music
industry is starting to deal with this problem, It’ll be interesting to see if Hollywood can.
The important thing here is the mass-cultural shift is now aligning with the technological
potential.

24. So the old notion of content locked into pages. Locked into silos has changed.
And this is happening with popular culture, not just progressive technology.
Today’s web is characterised by openness.
Just recently The Guardian upgraded their RSS so rather than one or two static feeds, users
can now retrieve feeds via a whole range of different parameters like section, subject, type,
author.

25. http://www.guardian.co.uk/profile/charliebrooker/rss+sport/cricket/rss
If I wanted to tailor my feed solely to Charlie Brooker’s articles and Cricket news, I can do
that.
And with so many parameters, the number of permutations, the number of connections is
enormous.
Again, we’re seeing a cultural shift aswell as a technology.
The site owners are knowingly relinquishing control of how their readers experience their
content.
Users are designing their own path through the data.

26. hackable, recombinable
This level of openness is not just about consumption though, it’s about recombination.
This Google map shows population statistics for some of the UK’s biggest cities.
Nothing remarkable about that.
What is remarkable is how it was produced.
Basically one giant hack.
Firstly, the raw data stats are ‘imported’ into Google spreadsheets (using =importHTML
formula).
This is then published as a comma separated list (CSV).
This is then ingested in to a service called Yahoo Pipes. A service which allows us to mash-up
RSS feeds in all sorts of useful ways.
Using Pipes, they were able to add location data and create a geocoded KML feed. Then they
simply import this in to Google Maps.
Wow!
But you know things have gone mainstream when people are mashing up in spreadsheets.
Even my Mum uses spreadsheets!
Think of the number of connections. All enabled through open data services and APIs.
http://ouseful.wordpress.com/2008/10/14/data-scraping-wikipedia-with-google-

27. Dopplr
The founders of the frequent traveller service Dopplr (This is not them btw!) spoke at
dConstruct about their desire to make a website that nobody has to visit.
Some marketeers find that concept startling. They are from the mindset that sees value in
‘eyeballs’, visits, views and clicks.
But the Dopplr guys are much smarter than that. They understand the value of their service
comes from the connections, irrespective of where they are consumed.
Their aggregate value lies within all the ways that their data can be experienced...many
connections is good…whether that be to a Facebook widget or recombined with any of the
other open services out there.
Again this challenges our existing models of where value lies.

28. Fireeagle is a simple service for managing your location data.
When it was first released after weeks of anticipation, people badly missed the point, thinking
it was essentially a service for displaying your location on a map.
But just like Dopplr, the value with Fireeagle lies not on the site, not in the pages, but in the
data, in the connections, and how these are recombined with other services.
Thus FE focuses heavily on making itself as open a service as possible, designed to work
seamlessly with other applications.
As you can see from this screengrab from my account Dopplr is one of those services.
All these services are characterised by their openness. Their willingness to connect over
multiple channels.
[If time allows mention AMEE]

29. “ A web of data sources,
services for exploring and
manipulating data, and
ways that users can
connect them together ”
As far as I know, Tom Coates of Fireeagle coined the term ‘the web of data’, describing it as
(quote) in his 2006 talk Native to a Web of Data.
He described the potential for the ‘network effects’ that would occur when “every new service
can build on top of every other existing service
How every service and piece of data that’s added to the web makes every other service
potentially more powerful.”
Tom was so right.
Data has spilled out of its old page model and into an enriched, hyper-connected world of
services, APIs and spimes.

30. Designing for a hyper-connected world
So how does this change things?
How do we design for a web of hyper-connections?
How do we start to take advantage of the network effects?
http://www.flickr.com/photos/hd41117/2576799956/

31. Ego-less Genius
Do people recognise these guys?
CA vs SJ
Ego-less vs Genius design
Steve probably is a genius. But to some extent he has to be. Industrial design such as the ipod
means that making a little tweak to the pause button is not that easy. He needs to get it right.
So even if he isn’t a genius he needs people to think he is! Apple do a very good job of
creating this image.
It would be arrogant for us to assume that we can design this way. In truth, Apple makes
plenty of mistakes (Newton). They just do a very good job of making sure we don’t still hear
about them until now!)

32. In a hackable world, your design problems will emerge anyway.
Parking machines? Guerilla usability design.
This parking machine was not designed by Steve Jobs.

33. Ego-less Genius
IMO, CA was a genius to. But his expertise lay in the fact that he acknowledged that with so
many variables–or in our case so many connections–it is highly unlikely we can ‘envision’ a
perfect solution.
This is design via ego and is in many ways incredibly arrogant.
He understood that design and in his case buildings, must be adaptable in order to succeed
over time. Buildings need to respond to the needs of the inhabitants. In short, they need to
evolve.
And this approach is highly applicable to the web. The facility is there for us to work in an
agile, responsive manner, making rapid changes and tweaks. Working responsively to the
emerging demands of our users.
This is a lovely position to be in.

34. Desire paths
http://www.flickr.com/photos/philgyford/20553280/
http://www.flickr.com/photos/yersinia/230046745/
I love these pictures of desire paths.
We see the planned routes and how paths are now intersected by short-cuts.
In Nick Crane’s book 'Two degrees west', Desire Paths are defined as the imprints of 'foot
anarchists', individuals who had trodden their own routes into the landscape, regardless of
the intentions of best-laid plans.

35. Embracing ‘mistakes’
I like this one but it begs the question why would anyone would want to take a shortcut to
Lidl?
I can only assume that it must be people trying to get out.
What we’re seeing here are representations of emergent behaviour.
Just like the hacked parking machine.
This is often a characteristic of a ‘complex network’ with many connections.
And while some people may see this as failure, in a complex network this is actually
something we encourage. The emergent behaviour is a clear sign of where value is being
derived from the experience. It can lead our design.
Flickr story. GNE.

36. “Riding reductionism, we run into the
hard wall of complexity. We have
learned that nature is not a well-
designed puzzle with only one way to
put it together…Yet nature assembles its
pieces with grace and precision…It does
so by exploiting the all-encompassing
laws of self-organisation, whose roots
are largely a mystery to us.”
Albert Laslzo Barabasi is a recognised expert in the field of complex network theory. This is
from his splendid work Linked. I highly recommend.
It is written in response to our natural urge towards reductionism.
Barabsi is talking about the laws of nature, but as he later observes, these pattern apply to
any complex network.
The crucial word (or words?) here are self-organisation
As designers all we can do is create the spaces and objects (the interface) within which people
interact, but–the interactions themselves, the dialogue, the behaviour–emerge from the
inhabitants (the users) themselves.

37. Organised complexity
What Barabasi is talking about here is a particular kind of complexity.
When apparently random, chaotic or infinitely complex fragments organise themselves into
elegant patterns.
These patterns occur regularly within nature, such as the florets in this sunflower. Or within
ant colonies. Or even in cities.
It would be futile for us to try and pretend that we can design or even orchestrate this kind of
network effect. The everyday social drama of a city for example is infinitely nuanced and
unrepeatable. Here we have to resist the natural human urge to reduce this complexity into
something understandable and formulaic.
Instead we wait for the patterns to emerge, the desire lines, the hacks. We than have a model
to influence, encourage and nurture.

38. To open our data to the potential for network effects, we need to embrace the potential for
recombination.
Forget traditional models of ownership. The page way.
Open our data to the potential of hyper-connections using machine-friendly formats like
well-structured HTML, RSS, microformats, JSON and APIs.
Seek out ways of adding value to our own experiences through recombination with the
existing services. Fireagle is a great starting point to making your experiences more
contextual.
Look out for ways you can return your data back for others to build upon. Add value to the
aggregate whole.
What out for ego-driven design and instead embrace hack-ability, allow users to create their
own desire paths within your services. Don’t defy time. Be open to adaptation.

39. Looking back in to history we see the most successful design–those that are perhaps
considered masterpieces–are those that endure. Those that adapt with time.
This is a photo of Piazza del Campo, Sienna, Italy which contains the Palazzo Publico.
The Palazzo Publico is championed in architecture schools as a model of successful
architectural design.
This building owes much to time.
Owes much to its potential for adaptation.

40. The Ground floor was created in 1284
The First Floor added in 1310
The Spire in 1325
And the Clock in 1355
Not until 1680 did the building receive its defining crenelated tower
…and then sometime in the c18th the Belfry

41. “Age plus adaptability is
what makes a building
come to be loved. The
building learns from its
occupants and they
learn from it.”
STEWART BRAND, HOW BUILDINGS LEARN
Leave you with this quote from one of my favourite books:
How Buildings Learn by Stewart Brand.
I couldn’t say it any better than this.

42. This presentation is licensed under a Creative Commons Attribution-Noncommercial-Share
Alike license.

43. Photo credits:
http://www.flickr.com/photos/thelunch_box/2798522576/
http://www.flickr.com/photos/sarowen/2061784789/
http://www.flickr.com/photos/alexliam/951320552/
http://www.flickr.com/photos/minato/75160146/
http://www.flickr.com/photos/seraphimc/160305329/
http://www.flickr.com/photos/cornellfungi/2118908448/
http://www.flickr.com/photos/rdolishny/2760207306/
http://www.flickr.com/photos/esdrascalderan/358517026/
http://flickr.com/photos/flissphil/6416813/
http://flickr.com/photos/bramhall/2528499012/
http://www.flickr.com/photos/burnto/2885703536/
Thanks to these people for their photos.

44. Thanks!
I’d love to talk more so please come up and chat–I’ll be here all day.
And thank you all for listening.