photo ux nux 061014

@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.