photo ux nux 061014
DESCRIPTION
Slides from @chudders presentation at NUX 2014 on User Centred PhotographyTRANSCRIPT
@chudders
James ChudleyUser centred photography NUX 2014
I’d like to introduce you to the idea of thinking about photos from a user centred point of
view
@chudders
It’s good to be back
I discovered photography and UX 14 years ago when I moved to the North West to work for Amaze, so it’s great to be back
talking about two of my favourite topics.
@chudders
Plan of attack
1. Why are photos so important?
2. Some photoUX stories
3. Qualities of usable photos
4. Tips to improve photoUX
@chudders
What do I do all day?
I’m a UX Director at cxpartners and am
lucky to lead projects for these clients
amongst others…
@chudders
I’ve written a couple of books
★ ★ ★ ★ ★
“Good price. Well packaged. Arrived promptly. Just what she wanted. I’m being asked for
more words, but really that’s all I want to say”£2 from www.fivesimplesteps.com
I’ve also had the opportunity to write a couple of books along
the way.
@chudders@chudders
But more importantly I bloody love photography
I absolutely love photography, it has
been an all consuming hobby of mine for the
last 14 years.
@chudders
I’m on a mission
http://www.gettycritics.com/
I’m on a mission to try and improve the
quality and effectiveness of web
photos.
@chudders
We are all photographers
http://broodr.com/blog/wp-content/uploads/2011/09/sarah_taking_lge.jpg
We all have cameras in our pockets these
days. It’s never been easier to take, share and publish photos.
@chudders
Would you link in with them?
You are already photoUX experts
http.www.linkedin.com
We’ve all thought long and hard about the most
appropriate photos to use to accompany our social
media profiles, so you understand the importance
of photos.
@chudders@chuddershttp://manishin.com
Iconic photos stay in our minds forever..
@chuddershttp.www.benetton.com
And ad campaigns use photos to deliberately shock us and make us
stop and think.
@chudders@chudders
Photos are hugely important in our lives,
documenting key moments…
@chudders@chudders
..such as family holidays…
@chudders@chudders
http://www.flickr.com/photos/maryblathwayt/265874415
…and our favourite sports teams!
@chudders
Photos also make us laugh, imagine my
delight when I recently spotted this
modification to a local street sign!
@chudders
Impact
Investment
The crazy reality of photos & digital design
(Behaviour & conversion etc.)
So given how significant photos are in our lives why do we
pay them so little attention during the
design process?
@chudders
So given the power of photos why do we do this?
http.www.shutterstock.com
Stock images can cause problems as
users can’t relate to the people that they
see within them.
@chudders
A recent favourite
http.www.creditexpert.com
Would you be feeling this relaxed if you’ve just learnt that your
identity had been stolen?
@chudders@chuddershttp://www.ikea.co.uk
Photos are designed too
Photos are designed too. Consider for a moment the design
thinking that went into this photo.
@chudders43
Shoot wide to convey space
Control shutter to blur water
Dynamism & movement
Use directional light to add impact
Wet floor acts as a reflector
Use white wall on left as reflector
Location choice - urban, aspirational, on
brand
Compose to only include relevant
objects
Use flash to enable use of fast shutter
speed
Ensure colour remains punchy to draw
attention
Blow sky to render neutral
Dress image as appropriate
Use lines on floor to guide the eye
Shoot at eyeline to connect with people
The photographer ‘layer’
These are design decisions that the
photographer made in order to get the photo
they wanted..
@chudders45
Convey the benefits
Demonstrate usage EntertainEducate & help
understanding
Shock Illustrate a point Set expectations Persuade Get a reaction
Create desire Sell & cross sell Show quality Demonstrate features
Show uniqueness
Show scale & what’s included Give context Communicate a
propositionConvey
a lifestyleSupport
the brand
Inspire Show accessories Convey intangibles
Convey personality
Create an emotional response
Quality & trust Demonstrate value Imagine ownership Show details Improve perception
Business layer
The ‘business’ will have contributed their own requirements to the
brief too.
@chudders@chudders47
Does it look good? Is this what I want/ need?
Can I imagine myself there?How does it work?
Will it match ‘x’? Is it right for me? Will it be right for ‘x’ Will it fit? What does it come with?
Entertain me! Where is it? What do I get? Have I got one like it?
Am I in the right place?
What will the experience be like?
Does it look like value for money?
Can I imagine owning it
Does it look like fun?
Is it good quality? Do I trust them? Has it got that feature I need?
Is it what I would expect from them?
Help me to understand it
Is it safe? Do I like it? Does it look comfortable?
Where will I be sitting/ staying/ watching
from?
Will there be people like me there?
How is it different?
User layer
And of course users have all sorts of things they need to know that
a photo can help to answer.
@chudders
Why do we just ignore them in our work?
I find it odd that as UX designers we do so little to inform the choice of
photos given we know so much about user and
business requirements.
@chudders
Some stories from the front line
@chuddershttp.www.wiltshirefarmfoods.co.uk
Users who viewed this site told me how wonderful the
company were as they would clearly deliver
whatever the weather, the photos gave them a great
first impression of the business!
@chuddershttp.www.lovefilm.com
In this example people didn’t like the look of ‘Liam
Gallagher man’ so we’re dissuaded from choosing
the £9.99 (best for the business) option
@chuddershttp.www.beneden.co.uk
Can you trust people if you cant see their
eyes?
@chudders
Some insights from Craig Sullivan @optimiseordie
http://www.thewebpsychologist.com/podcast-episode-33-craig-sullivan/
Belron (Autoglass in Germany)
‘The comprehension and perception of a service are largely influenced by photos…”
‘Body language of people in photos has an impact on conversion…”
‘Photos must match the emotional state of the user, who would you want to see if you’ve just had your windscreen smashed …you want to see your mum with a cuppa”
Craig is your man for quant based evidence around the impact of photos - check out his
slideshare pages.
@chudders
What is a usable photo?
@chudders
“...the most usable and effective photos communicate something
clearly to the user, are useful, are in keeping with the brand, evoke
an emotional response, and influence the user in the way that the designer intended...”
@chudders
Ornamental vs content photos
http://www.b2bcompliance.org.uk/
Ornamental photos don’t really help much, they are often used to fill a space and often serve little purpose.
@chuddershttp://www.timbuk2.com/tb2/products/home
Ornamental vs content photos
‘Content’ photos like these are helpful and
serve a purpose.
@chudders
Effective photos show the benefits
http://www.gorillapod.co.uk
This photo effectively communicates the
benefits of the product, I can instantly
see what it does and how it might be useful.
@chudders
Effective photos are consistent
vs
When the style of photography is inconsistent it
distracts us from the product.
@chudders
The photos of the product are the product
http://www.howies.co.uk
Often the style of photography becomes an important part of the brand identity.
@chudders@chudders
Use the eyes to your advantage
http://www.adidas.co.ukhttp://www.arkive.co.ukhttp://www.nikewomen.co.uk
We naturally look to see what others are looking at, see how
these examples influence where you
look.
@chudders
Effective photos convey the intangibles
http://www.bentley.co.uk
Photos can convey concepts like
‘craftsmanship’ very concisely. Could you
use words to communicate the same message so concisely?
@chudders
Effective photos give credibility
http://www.arkive.co.uk
Older users loved the fact that Sir David was a patron
of Arkive. Younger users perceived the same photo to mean that the website
was for old people!
@chudders
Effective photos convey scale
http://www.ford.co.uk
If you are considering buying a van it’s likely
that a forklift is a useful reference point to understand scale.
@chudders
Effective photos persuade
http://www.linkedin.co.uk
Photos of people we know can be very
effective in persuading us to do things.
@chudders
Evaluating photo UX
@chudders
The Don
“Good design is also an act of
communication between the
designer and the user.”
photography
This great quote from Don Norman works well for photos too.
@chudders
ethos (CREDIBILITY)
pathos (EMOTION)
logos (LOGIC)
. .
Rhetoric - the art of persuasion
We can use this formula to construct a
persuasive message
@chudders
Is this what I need?
How does it work?
Will it match ‘x’?
Is it right for me?
Will it be right for ‘x’
Will it fit?
Where is it?
What do I get? Is it good quality?
Is it safe?
Rational appeal (LOGOS)
Does it fit with the brand?
Reputation/ brand appeal (ETHOS)
What qualities do I assume it has
These guys know what they are doing
If they made it it must be good
Does it look good?
Entertain me!
Does it look like fun?
Do I want it?
Emotional appeal (PATHOS)
Will the experience be good?
What will I look like with it?
Is it for people like me?
Social/ Status appeal
What will other people think?
How will this make me look?
User needs vs rhetoric
It’s a useful framework for understanding the
different types of questions that people
will ask of your photos.
@chudders
1. Legibility & credibility
2. What message does the photo communicate?
3. Usefulness & effectiveness
My photo usability checklist
https://uxmag.com/articles/evaluating-the-usability-of-web-photos
I’ve come up with a set of guidelines to use to evaluate photos, give them a try and let me know how you get on.
@chudders
What can you do today to
improve your photo UX?Hopefully you can use
some of these tips on your own design
projects.
@chudders
Take a content strategy approachI think you can apply a
content strategy approach to photos,
check out my slideshare for more on
this..
@chudders
Annotate wireframesYou can annotate wireframes to pass on
your intentions to your Art Director or
whoever chooses the photos in your team.
@chudders
Sketch a brief
Sketching photos is a great way of briefing
photographers.
@chudders
Audit what you’ve got
•Audience
•Task
•Outcome/ Purpose
•Primary message
•Context - this will be shown at this point
in the journey and with this content
•Commercial objective
Photo audit
Why not take the same approach to auditing
photos that we take to doing traditional content audits?
@chudders
Work out what you needYou can use task
models and experience maps to identify the types of photos you need for different points in the user
journey.
@chudders
http://www.createyourownrealitynow.com Does this look familiar?
“I’m focussed on success, i’ll do whatever it takes to
make it in my career”
brenda is the senior vp of a major multi-national company. She
works hard and plays hard and doesn’t suffer fools gladly.
her key tasks are:
- checking sales forecasts
- running reports
- setting targets
Business Belinda
Personas are all about showing representations of
real users. Why use stock photos of people who
don’t look like ‘real’ people!
@chudders
“I want to make the most of my retirement”
peter has been retired for 6 years after a successful career as a
teacher
her key tasks are:
- understanding the product
- working out the final transfer
- setting up meetings with adviser
Peter the retired teacher
Now this is better
For a recent persona project we took photos of users who came in
for user research which gave us photos of real
customers for free!
@chudders
Use photos in your deliverables to tell stories
Photos are wonderful assets to use to help us tell stories. They are a
powerful way of communicating aspects
of your users lives to the business.
@chudders
Use photos in your prototypes
Why not put photos in prototypes. You’ll learn loads from what they communicate to users which will add more
depth to your insights.
@chudders
Thanks!Let’s improve the effectiveness of web photos
Please pay photos extra attention during your next research/ design
project and let’s do more as UX’ers to improve the quality and effectiveness
of web photos.