UX Cambridge: James Chudley, Photos – The Unsung Heroes of User Experience Design

James Chudley is UX Director at CX Partners in Bristol, the author of Smashing UX Design, and a keen amateur photographer. He blogs at photoux.co.uk and tweets as @chudders. His new eBook on the usability of web photos will be released through fivesimplesteps.com next year.

  • I want to change the way you think about web photos. There is an opportunity for designers, directors, users, etc. to think about photos in a new way. As a profession we ignore photos and this is a bad thing.
  • For example: a website for a free food delivery service for the elderly. Put yourself in the shoes of the target audience (the children of the elderly service users). There were key anxieties in users’ minds that hadn’t been considered. Using a snowy photo conveyed the feeling: “They’ll deliver whatever the weather.” How did the user know that? How could you even begin to convey that in text or wireframe?
  • As a photographer, I can take a totally contrived photo; why then as a UX designer do we just stick a box with a cross through the middle?
  • Let’s think about designing a photo. An example from IKEA: wide open to convey space, dynamism/movement, wet foor/white wall to reflect light, etc. There are business considerations, and user considerations when looking at a photo. Can any other type of web content work so hard for your business or your users?
  • We sweat over layout and labelling and think about how people behave. Then we make a square with a cross in as a photo placeholder. This is weird. UXers are very rarely involved with selecting the photos.
  • Where are all the web photo guidelines? There is no photo equivalent of the usability heuristic rules; no rules about ‘what makes a usable photo.’ So I came up with some.
  • So why are photos important? There are quite a few online: 60bn in 2010, 100bn in 2011. Facebook, Instagram, it’s never been a more popular time to share our photos.
  • We are programmed to notice faces and emotions. Using images of people has a huge impact on people viewing it; there’s a part of the brain whose job it is just to recognise faces. You can manipulate where people look on a website by considering gaze lines in photos.
  • We did research on university sites and business services. Users hated generic smiling headshots — photos that worked well with students were of real students doing real things.
  • Facebook have a huge role in creating design patterns around photos, e.g. large photo slideshows, zooming.
  • What message are your website photos giving your users? All the photographer is thinking is ‘what message will this convey’? Example: The AA site uses a photo showing a single woman in the middle of nowhere as it gets dark — manipulates user anxiety.
  • User testing can reveal great insight into how people interpret your photos.
  • Photos are generally either useful (“content photos” e.g. Amazon) or not. Stock photography is used a lot, because photos are hard to find and source, but loses all manner of trust from users (these aren’t real people, I don’t trust this website).
  • Photos can: Support the primary task (property rental sites, product sites); convey intangibles (Buffalo shows photos of UK-based textile workers and their craftsmanship — how would you convey that feeling with any other sort of content?); show the benefits (the gorillapod SLR site shows the product in use); credibility (Arkive used a photo of David Attenborough, which immediately associates them with the brand values of the BBC); show you how (ifixit.com has large photos showing how to take the battery out of an iPod); humanise technology (sumall.com/about); consistency (John Lewis product photos are all framed and lit exactly the same; compare this to eBay photos!); show in detail (zoomable product photos — user testing showed that a main photo with an overlay next to a second zoomed-in block performed best).
  • Strategic use of photos to help sales: Emotive/lifestyle imagery at the start of the section (emotional), then specific product imagery as we shift towards rational decisions, focus on the product, detail.
  • Don’t forget: All of these things are wrapped up in the photos, yet still all we do in mockups is a cross-in-a-box.
  • What qualities does a usable photo have? Aristotle has the answers: Ethos (credibility), Pathos (emotion), Logos (logical persuasion/practical).
  • Rational appeal – will it match, fit, where is it, what do i get, etc. Emotional appeal - does it look good, entertain me, do i want it, does it look fun. Reputation/brand appeal – does it fit the brand, what qualities do i assume it as. [Social - how will i be perceived if i have this thing.]
  • Framework for evaluating web photos: 1. Fundamentals (focus, composition size exposure, quality, crop) 2. Effectiveness (rational appeal, emotional appeal, reputation/brand appeal) 3. Message communicated: What is it saying to you? 4. Anticipated user response: Change behaviour, decision making, sharing, change opinion, create desire.
  • UX people should have input into evaluating photos.
  • Mirror real behaviour on a website, e.g. how do people look at/evaluate shoes in a real shoe shop? Can we mirror that experience online?
  • Photographers’ problems: Offline vs online, cost, digital (i.e. online) is a poor relation to offline (print), brief based on campaign idea not on user needs. Photos taken intended for use on the side of a bus don’t work when you just make it smaller and stick it on a website.
  • Art director/designer problems around photography: Lack of assets, no access to photographer, lack of landscape oriented shots, lack of guidelines, retouching time.
  • Let’s push things forward: Annotate your wireframes (description, key message, photo content, response desired); drop photos into your wireframes; Use photos to tell stories to get empathy; talk to your designers; talk about photos in your usability reports; use real people photos in your personas (if the point of personas is to make you care about your users, don’t use photos of people that don’t exist!); do photo audits in the same way as you do content audits; use task models to create a shot list; and sketch photo briefs.
  • To recap: photos will be having a massive impact upon the way that people are using your products.

The slides from James’s presentation are now up on SlideShare.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>