Technology dissolved in the experience

3,530 views

Published on

0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,530
On SlideShare
0
From Embeds
0
Number of Embeds
10
Actions
Shares
0
Downloads
34
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Technology dissolved in the experience

  1. 1. Technology dissolved in the experience James Box Skillswap Bristol | November 2008
  2. 2. Fan of Bruce Parry's Tribe. Armchair anthropologist. Penan people / Nomadic hunter-gatherer tribe on the Malaysian state of Sarawak Deeply affected large-scale selective logging in the late 1970s / More recently the creation of palm oil and acacia wood plantations has had a caused a profound reduction in the number of Penan people Dense rainforest/jungle. Remarkably attuned to the environment around them. Responses to the change in light, sound, smell and temperature of the forest, nuances that outsiders over look. The forest to which they are perfectly adapted, has been radically altered. Their everyday needs–collecting medicinal plants and clean water has become extremely difficult. One particular scene which I love involves messaging without words or writing. Communication between tribes has to be carried out discreetly (to avoid the attention of the logging companies) so they leave messages on the jungle floor using an ornate arrangement of sticks and leaves. This one particular message involves: * One large stick...the message stick...points in a direction that the tribe must go * Another smaller stick, crossing the first, which indicates you MUST come. There is no choice. * Another stick with a sharp, pointed end pointing to the sky...the sharpness indicates the urgency. * A scraping down the main message stick runs down the length of the stick and indicates it's a very long journey * A piece of knotted bark with three knots indicates that the journey will take three days. * Then a notch further down the message stick a wrapped leaf which indicates they don't have any food * But the best bit is a single stick poking right through the leaf which says even though they're desperate, that they must come quickly, must make it in 3 days, that they are hungry and have no food…this stick means...don't worry I'm in a good mood. Reminded me of nothing more than the humble smiley. Despite our derision, its universally understood. And useful!
  3. 3. Me / Information Architect / IxD Social spaces / Especially those mediated by technology Clearleft, Brighton / UX consultancy / Silverback / dConstruct / UXLondon Co-organise Skillswap Brighton with Natalie Downe Evolution of a talk I gave at Barcamp called Built it like Dave…meet Dave:
  4. 4. How to imbue UX with personality/character by aligning behaviour with those of your friends. Superficial stuff but was concerned with what I perceived as a general lack of attention to the human quality of user experience. This talk is an attempt to explore that subject further…
  5. 5. “ Interaction Design is the creation of a dialogue between a person and a product, service or system. This dialogue is usually found in the world of behaviour. ” Tend to think of myself principally as an IxD. This where all the good shit happens. Use this definition from ‘Thoughts on Interaction Design’ by Jon Kolko, but applies to UX as well. Two words: dialogue + behaviour. I’m going to focus on these aspects of an experience. http://thoughtsoninteraction.com/section_one.html
  6. 6. The whole ‘personality’ thing is not new. Brands love forming relationships with their customers. Some do it very well indeed.
  7. 7. It works. It makes me smile. And of course I’m telling you about it now right?
  8. 8. Lots of people have used this cutesy approach on the web: Flickr greetings in foreign languages etc. This I like: Picnik (flowers ‘grow’ as you complete your sign-up prividing progressive feedback.)
  9. 9. Problem is, I get bored easily. I’m already bored of Obama. The litmus test is: would an estate agent use this? This is outside our office. [Sign on left] It all gets a bit saccharine, mawkish.
  10. 10. “ To design behaviour requires an understanding of the fluidity of natural dialogue, which is both reactionary and anticipatory at the same time. ” The problem is structuring dialogue is difficult as it occurs in a fourth dimension: over time. [quote] Two words: reactionary + anticipatory. Something that can only happen when the dialogue is given sufficient context. If we miss the mark here, the intent fails. We begin to sound clichéd, formulaic and inauthentic… This is a negative experience.
  11. 11. And even worse… http://www.flickr.com/photos/diamondjoe/205674525/
  12. 12. We even risk entering ‘The Valley’. “Mori's hypothesis states that as a robot is made more humanlike in its appearance and motion, the emotional response from a human being to the robot will become increasingly positive and empathic, until a point is reached beyond which the response quickly becomes that of strong repulsion.” The suspension of disbelief is something we’re all prepared to entertain to an extent, but the danger here is when this fails, we break the illusion. Amazon recommendations are great until Christmas, when you spend all your time shopping for others and consequently get recommended bread makers for the next six months.
  13. 13. One of the things I loved about the Penan tribe message was its authenticity. The function/utility of the message was balanced with humour. But when I thought back to my original presentation, I realised this is difficult to achieve with simple heuristics, rules of thumb like ‘be polite’, ‘be courteous’ etc. I also realised that by highlighting noticeable–arguably quantifiable–personality traits, I was ignoring one of the most important attributes of meaningful dialogue. That which is subtle or even unsaid often underpins the most delightful, remarkable experiences.
  14. 14. “ Make all visual distinctions as subtle as possible, but still clear and effective. ” And this is undeniable true when we think of design. Edward Tufte is famous for celebrating ‘The smallest effective difference’ as illustrated in this quote.
  15. 15. 9 8 7 8 5 1 2 3 4 5 6 7 8 9 Chesham Chalfont & Watford Junction Watford Junction is outside Cockfosters Latimer Transport for London zonal High Barnet Epping Watford area. Special fares apply. Oakwood Watford High Street Theydon Bois Totteridge & Whetstone Amersham Croxley Bushey Loughton Debden Southgate Chorleywood Woodside Park 4 Rickmansworth Carpenders Park 6 A Moor Park Edgware West Finchley Arnos Grove Buckhurst Hill A Mill Hill East Hatch End Roding West Ruislip Northwood Burnt Finchley Central Valley Chigwell 5 Northwood Hills Headstone Lane Stanmore Oak Bounds Green Hillingdon Ruislip Harrow & Colindale East Finchley Wood Green Wealdstone Canons Park Harringay Ruislip Manor Pinner Green Lanes South Grange Hill Queensbury Hendon Central Turnpike Lane Woodford 3 Uxbridge Ickenham North Harrow Kenton Tottenham Hainault Highgate 4 Eastcote Crouch Harrow- Preston Kingsbury Hill Blackhorse Brent Cross Seven Sisters Road Fairlop on-the-Hill Road Archway Manor House South Golders Green Gospel Woodford Barkingside Ruislip Rayners Lane Tottenham Walthamstow Gardens West Harrow Northwick Neasden Hampstead Oak Tufnell Park Park Heath Upper Hale Central Newbury Park Hampstead Holloway Finsbury Wembley Dollis Hill South South Kenton Park Park Walthamstow Snaresbrook Redbridge Ruislip Arsenal Upminster North Wembley Willesden Green Kentish Queen’s Road Finchley Road Kentish Holloway Upminster Northolt South Harrow Wembley Central Town Wanstead Gants Bridge B Kilburn & Frognal Town West Road B Belsize Park Hill Stonebridge Park Leytonstone Sudbury Hill Harlesden Brondesbury Chalk Farm Caledonian Road Highbury & Sudbury Hill Harrow Park Leyton Leytonstone 0m (no weekend service) 150m Willesden Junction West Hampstead Camden Islington Dalston Midland Road High Road Hornchurch 10 Thameslink 200m from Road Dagenham Greenford Kingsland East Elm Park ( no Sunday Sudbury Town Kensal Rise Brondesbury Finchley Road Camden Town Caledonian Canonbury service) Hackney Leyton Wanstead Kensal Green Swiss Cottage Road & Central Park Kilburn South Mornington Barnsbury Alperton Queen’s Park High Road Hampstead St. John’s Wood King’s Cross Homerton Dagenham Crescent Woodgrange Park Heathway 2 St. Pancras for St. Pancras International Becontree Maida Vale Great Stratford Kilburn Park Hackney Upney Perivale Edgware Baker Portland Euston Angel Wick Warwick Avenue Paddington Street Street Road Barking Royal Oak Westbourne Old Street East Ham Hanger Park Bethnal Warren Street Euston ( no weekend Green Lane Paddington Edgware Marylebone Farringdon service) Mile End Pudding C Regent’s Park Square Liverpool Upton C Road Euston 200m Mill Lane Park Russell Street Shoreditch Plaistow Park Royal Ladbroke Grove Barbican Bayswater Square Limited service West Ham Latimer Road Check publicity for ELW Bow Bromley- Goodge Moorgate information Road Bow North Ealing East White Holland Notting Lancaster Bond Oxford Street Chancery ( no weekend Stepney Church by-Bow 1 2 3 4 Acton City Park Hill Gate Gate Street Circus Holborn Lane service) 200m Ealing Green Devons Road 654 3 2 Broadway St. Paul’s Aldgate Whitechapel North Tottenham 10 West Shepherd’s Queensway Marble East 25 0 Langdon Park 0m m Acton Acton Bush Arch Court Road Bank Wood Lane Covent Garden Leicester Square 340m Aldgate All Saints Acton High Street Cannon Shadwell East Central Hyde Park Green Park Street Westferry Poplar India Canning Town Shepherd’s Kensington Corner Leicester Mansion Ealing Common Bush Market Royal Victoria Piccadilly Square House South Circus Limehouse Blackwall Acton Kensington Knightsbridge Monument Tower Custom House (Olympia) Charing Hill Tower for ExCeL Goldhawk Road Gateway ELW Cross Fenchurch Street 150m D Acton Barons Gloucester Blackfriars Closed until spring 2009 Wapping West West Prince Regent D Town Court Sloane St. James’s Underground station India Quay Silvertown South Ealing Hammersmith Road closed March 2009 River Thames Square Park until late 2011 Royal Albert Northfields Temple Rotherhithe Canary Wharf London Beckton Park Boston Manor Bridge 381/N381 Canary Wharf 0m Chiswick Turnham Stamford Ravenscourt West Earl’s South Victoria Westminster Embankment 2 Pontoon 20 Hounslow North Cyprus East Park Green Brook Park Kensington Court Kensington Charing Cross 100m Greenwich Dock Osterley Canada 15 Bermondsey 1 Gallions 0m Heron Quays for The O2 Hounslow West Brompton Water Reach West Hounslow Central Fulham Waterloo Surrey Quays South Quay Gunnersbury Broadway London City Crossharbour Airport Beckton Hatton East London line is closed Terminals Cross Parsons Green Mudchute for major line extension 1, 2, 3 Kew Gardens Putney Bridge Pimlico Southwark Borough work to become part of ELC Waterloo East Island Gardens King River Thames the London Overground George V Terminal 4 Lambeth network E North E Richmond East Putney New Cross Cutty Sark 3 Heathrow Gate for Maritime Greenwich Terminal 5 Airport Opening Vauxhall Elephant & Castle ELC New Cross Greenwich early 2009 Southfields Kennington 100m Deptford Bridge Woolwich Elverson Road Arsenal Wimbledon Park Clapham Junction Lewisham Oval Wimbledon 4 Stockwell Clapham North Clapham High Street 100m Brixton 100m Clapham South Clapham Common Improvement works may affect your F journey, particularly at weekends. Balham F Check before you travel; look for publicity Tooting Bec at stations, visit tfl.gov.uk/check Colliers Wood or call 020 7222 1234 Tooting Broadway Morden South Wimbledon This diagram is an evolution of the original design conceived in 1931 by Harry Beck · 10.08 Transport for London Correct at time of going to print, October 2008 1 2 3 4 5 6 7 8 9 MAYOR OF LONDON Successful Information visualisation thrives on its ability not just to reinterpret but Transport for Lo also condense information in to understandable, intelligible and unambiguous representations. What’s left out is as crucial to this message being communicated as what is left in. Harry Beck’s Tube Map is the canonical example. Tufte often bemoaned the prevalence of Chartjunk within information design: those “visual elements that are not necessary to comprehend the information represented on the graph, or that distract the viewer from this information.”
  16. 16. Design for serendipity Architecture can be good mediating this kind of experience. Rather than a cold, urine-smelling NCP style Fire Exit, the main staircase within Cardiff’s Millennium Centre is intentionally positioned within the central social hub of the building. Exposed for all to see. The intention here is to create a sense of fluidity by exposing the movements but also to create chance encounters, serendipitous exchanges between the building’s temporary inhabitants. There is no instruction, just implication. When the 'feature' or function is held in reserve, and not overtly forced, it becomes discoverable. Engagement then becomes a delightful, serendipitous experience.
  17. 17. Ambient signifiers In Japan, the notoriously complex railway system employs a set of individual chimes for each station that play as the passengers wait to get on or off. Design elements that communicate subtly as part of the environment’s ambiance. They allow passengers to gauge status or context without having to actively seek it. Previous incarnation of the BBC home page was originally created with a ‘digital patina’ which altered the colouring of the page according to usage patterns. Similarly when we’re walking the streets, many county councils alter the texture of the pavement to indicate caution i.e. when approaching a zebra crossing etc. Again, subtle. For some, not even noticeable. http://www.boxesandarrows.com/view/ambient_signifi
  18. 18. Systems like last.fm (scrobbler) rarely interrupt, instead they gather silently. The product’s output is simply a manifestation of my typical, intrinsic behaviour. The data and therefore the value of my dialogue with last.fm emerges through use.
  19. 19. Similarly Nike+ Transaprently extracting my behavioural information directly from the shoe/iPod and publishing this to ‘The Cloud’ to be viewed, shared, recombined and probably laughed at! There is no ungainly input device–no keyboard, mouse or RSI–to battle with. Technology dissolved in the experience. http://www.flickr.com/photos/ldandersen/249465130/
  20. 20. SeeShell is an augmented Oyster Card (the RFID-enabled Underground ticket), designed by PhD student Johanna Brewer A simple sleeve which displays, over time, the journeys the owner has taken. http://www.flickr.com/photos/nicohogg/344132621/
  21. 21. Violet’s Mir:ror project. (Sidenote (something I was reading before I came in here): Violet the creators of the notorious Nabaztag have recently announced their Mir:ror project in which they have devised “a simple, two-step strategy for the construction of an Internet of objects i.e. a time where all objects are internet-enabled. * One: connect the Rabbits. * Two: connect everything else.”
  22. 22. 1. Connect the Rabbits Violet’s Mir:ror project. (Sidenote (something I was reading before I came in here): Violet the creators of the notorious Nabaztag have recently announced their Mir:ror project in which they have devised “a simple, two-step strategy for the construction of an Internet of objects i.e. a time where all objects are internet-enabled. * One: connect the Rabbits. * Two: connect everything else.”
  23. 23. 1. Connect the Rabbits 2. Connect everything else Violet’s Mir:ror project. (Sidenote (something I was reading before I came in here): Violet the creators of the notorious Nabaztag have recently announced their Mir:ror project in which they have devised “a simple, two-step strategy for the construction of an Internet of objects i.e. a time where all objects are internet-enabled. * One: connect the Rabbits. * Two: connect everything else.”
  24. 24. A warning. As our personal data becomes exponentially more available, connected and discoverable, the need for privacy controls becomes greater and greater. There is no excuse for ‘security through obscurity’ when dealing with user’s personal data– even our genome data is now sharable with services like 23andme. And this is especially true for those products whose dialogue with technology manifests itself as a seamless, invisible or ambient experience.
  25. 25. This is a big challenge for designers. This is something I was playing around with: applying the OAuth model of managing access to all our personal data. In case you don’t know what OAuth is, in laymen’s terms it allows a user to grant access to their information on one site (e.g a Service Provider like Flickr), to another site (e.g. Consumer like Moo), without sharing all of his or her identity. It also ensures maddeningly, immoral, lazy patterns like the password anti-pattern stop proliferating the web. Sketched this after experiencing the pain of public sector organisation’s attempts to control OUR data. They seem to move from one extreme to the other: either paralysed by fear or imploding with their own ineptitude. So this is an imagined ‘personal dashboard’ for your own personal data.
  26. 26. There are other risks to be mindful of as well as privacy. Mobile me. These services become so deeply ingrained, sometimes invisible, that they become close to muscle memory. Twitter fail whale. This hurts.
  27. 27. Gentle. Open. Transparent. Deferential. Ambient. Anticipatory. Invisible. Humble. Modest. Assured. Well-mannered. Considerate. Contextual. Subtle. Unassuming. Discoverable. Reactionary. In conclusion: Design does not need to be ‘obvious’ or contrived. We don’t always have to impose dialogue on our users. Context (reactionary + anticipatory) is everything but don’t be arrogant or rude and assume you can predict this. Be open Be transparent The ambient and invisible can be more meaningful.
  28. 28. “I like a view but I like to sit with my back turned to it.” GERTRUDE STEIN, THE AUTOBIOGRAPHY OF ALICE B.TOKLAS I leave you with this quote from Gertrude Stein which says it all for me.
  29. 29. Creative Commons Attribution-Noncommercial-Share Alike
  30. 30. Photo Credits: http://www.flickr.com/photos/74845103@N00/415981279/ http://icanhaz.com/penan http://www.flickr.com/photos/duncan/2084134925/ http://www.flickr.com/photos/lwr/972289835/ http://www.flickr.com/photos/maxbraun/1489103461/ http://www.flickr.com/photos/w00kie/225861208/ http://www.flickr.com/photos/nicohogg/344132621/ http://www.flickr.com/photos/otrops/2702646947/ http://www.flickr.com/photos/mattbaron/2657690363/ http://www.flickr.com/photos/suntom/181044383/ and a bunch from my Flickrstream: http://flickr.com/photos/boxman

×