Design without critique is like a flower without water (WebExpo 2013 version)

of 81 /81
Design without critique is like a flower without water Petr Stedry, UX Designer My name is Petr Stedry, I work as a UX Designer for GoodData a Business Intelligence cloud platform. Today I would like to help you improve your designs through critique.

description

The talk I gave at WebExpo in Prague.

Transcript of Design without critique is like a flower without water (WebExpo 2013 version)

Page 1: Design without critique is like a flower without water (WebExpo 2013 version)

Designwithout critique

is like a flower without waterPetr Stedry, UX Designer

My name is Petr Stedry, I work as a UX Designer for GoodData a Business Intelligence cloud platform.Today I would like to help you improve your designs through critique.

Page 2: Design without critique is like a flower without water (WebExpo 2013 version)

Imagine your child is 5 years old and learning to write on his own.

Page 3: Design without critique is like a flower without water (WebExpo 2013 version)

Says “DRINKING REGIME”

And one day he shows you this.What will be your reaction?What kind of feedback will you give him?

Page 4: Design without critique is like a flower without water (WebExpo 2013 version)

A) Wow! That's fantastic.

Will you praise him for his good skills?Saying something like ...

Wow! That’s fantastic! You are really good at writing.

Page 5: Design without critique is like a flower without water (WebExpo 2013 version)

A) Wow! That's fantastic.

B) Good job!

Or will your feedback be more specific like this?

Good Job!The letters are well spaced and straight.But look, the N and Z are flipped. And you are missing a space between the words.

Page 6: Design without critique is like a flower without water (WebExpo 2013 version)

A) Wow! That's fantastic.B) Good job!

Who thinks A is a better response?

Who thinks B is better?

Page 7: Design without critique is like a flower without water (WebExpo 2013 version)

Who thought A was better?

Actually A is what most people do to their kids. They want them to feel good.

Offering only praise. Glancing over the errors without mention.

Page 8: Design without critique is like a flower without water (WebExpo 2013 version)

Who thought B is better?

But B is a much better feedback for the child as it can use it to improve his skills.

Let’s talk about ways to use the same approach for your designs. And not only designs.

If you want to improve, critique will help you in many situations.

Page 9: Design without critique is like a flower without water (WebExpo 2013 version)

And not only with your design.

Critique is a life skill.

Page 10: Design without critique is like a flower without water (WebExpo 2013 version)

CritiqueWhat is it?

Why should I care?

So what is critique?

And why does it matter?

Page 11: Design without critique is like a flower without water (WebExpo 2013 version)

No, I don’t want you to read a wikipedia page.That wouldn't help you understand.Let's look at an example. Or rather a counter example.

Page 12: Design without critique is like a flower without water (WebExpo 2013 version)

You are probably familiar with one setting, where critique usually does not occur.Design review meetings.You know them, right?

Page 13: Design without critique is like a flower without water (WebExpo 2013 version)

You would want them to be more like supermarket. You get in with a design and get out with a list of things to be improved.And everyone one is happy! No?

Page 14: Design without critique is like a flower without water (WebExpo 2013 version)

Usually the design review meetings are more like a gallery.

You bring the art and the stakeholders either like it or don’t.Or worse. They are trying to offer improvement suggestions.

Page 15: Design without critique is like a flower without water (WebExpo 2013 version)

To get to the list of things that work and those that don’t you need to perform systematic and detailed analysis of the design.And that’s critique.

It is about critical thinking. Challenging the status quo and not blindly accepting the world as it is.Thinking like Sherlock Holmes.

Page 16: Design without critique is like a flower without water (WebExpo 2013 version)

Argument

Argument

Argument

Argument

Argument

Argument

At the heart of critique is an argument.

But not all arguments are equally powerful.

Page 17: Design without critique is like a flower without water (WebExpo 2013 version)

Personal opinions – the “likes” and “dislikes” – are the weakest arguments as they are based only on emotions.You can agree or disagree with them depending on how much they match your opinion.But that will not make them useful beyond expressing your feelings.

Page 18: Design without critique is like a flower without water (WebExpo 2013 version)

< Opinion Strong Argument >

You can imagine the strength of arguments on a scale like this.

With opinions being off the scale on the left and strong arguments no one argues about on the right.A little bit stronger than opinions are arguments based on inductive reasoning, consensus or analogies.“That horizontal menu worked well on that site, so it will work on our too.”Arguments like this are pretty common and quite weak.

Page 19: Design without critique is like a flower without water (WebExpo 2013 version)

< Opinion Strong Argument >

A strong argument – in design – is based on direct observation, results of usability testing or other forms of research.

You can read research papers online for free!And it’s a great idea to spend as much time in usability tests as possible.It doesn’t need to be your site or app that’s tested. The observations you’ll make will be worth it.

Page 20: Design without critique is like a flower without water (WebExpo 2013 version)

Preparing for critique

To get most of the critique session, you should prepare yourself in advance.There are a few things you can do.

Page 21: Design without critique is like a flower without water (WebExpo 2013 version)

Accept that your design is not perfectStart with accepting that your design is not perfect.I have a story to tell you ...A long time ago, I was a JAVA programmer.My job was to design and implement an optimal technical solution to a problem.

Page 22: Design without critique is like a flower without water (WebExpo 2013 version)

O (n²)

In programing it is quite easy to measure what approach is best.I got taught at school how to compute the asymptotic time complexity of an algorithm. Those were times.Everything seemed so simple.

Page 23: Design without critique is like a flower without water (WebExpo 2013 version)

I began to move from programming to design in 2004 when I was working as a contractor for Skoda Auto, the car manufacturer.I carried on the skills I had learned.When the requirements arrived, I tried really hard to produce the optimal user interface.When the negative comments came, I was mostly defending my "optimal" solution, looking for arguments to support it.

Page 24: Design without critique is like a flower without water (WebExpo 2013 version)

Accepting critique seemed like admitting failure.

Failure to design the optimal solution on my own.

Page 25: Design without critique is like a flower without water (WebExpo 2013 version)

Wrong50 %

Right50 %

Don't be like that past me. Don't blindly defend your solution.

Page 26: Design without critique is like a flower without water (WebExpo 2013 version)

Wrong50 %

Right50 %

Accept, that you might be right just 50% of the time.Use critique to uncover what is good and what it wrong in your design.

Page 27: Design without critique is like a flower without water (WebExpo 2013 version)

Set your expectations

In order to be able to accept the critique, you also need to set your expectations.

Page 28: Design without critique is like a flower without water (WebExpo 2013 version)

Do you need a hug?If the answer is “Yes” then go to your or mother.She loves you and will hug you if you ask for it.

Page 29: Design without critique is like a flower without water (WebExpo 2013 version)

Or post your work on Behancé.This screenshot shows the typical type of feedback you will receive.

Isn’t that the digital equivalent of a hug?

Page 30: Design without critique is like a flower without water (WebExpo 2013 version)

Or did you just want to show off your supreme design skillz?Why not. Nothing wrong with that. But it won’t work as a critique session.

Page 31: Design without critique is like a flower without water (WebExpo 2013 version)

It's not about your ego. It's about improving the design, remember?Only call for critique if you want your design improved.This has to be your main motivation.

Page 32: Design without critique is like a flower without water (WebExpo 2013 version)

Prepare the design

For you the design is probably "your child". You nurtured it for several days, weeks or maybe even months.It IS hard to accept critique.The design needs to be prepared.

Page 33: Design without critique is like a flower without water (WebExpo 2013 version)

The bond between you and your design is strong. An there’s something called the IKEA effect.

It says the strength of the relationship between you and the design depends on the amount of labor you put in.

Page 34: Design without critique is like a flower without water (WebExpo 2013 version)

You can also observe this phenomenon when you have kids.Your feelings for them are so strong because of the extraordinary amount of work you put into raising them.

In design though, there is one easy way to minimize its effect.Start with critique as soon as possible.

Page 35: Design without critique is like a flower without water (WebExpo 2013 version)

Forget long hours in Photoshop or Axure to polish a design.Whenever you can, critique pencil sketches created in a few minutes.You will be much less attached to them.

Page 36: Design without critique is like a flower without water (WebExpo 2013 version)

Share the context

For other people to be able to critique your design effectively, they need to know what you know …

Page 37: Design without critique is like a flower without water (WebExpo 2013 version)

Without this information, they cannot objectively evaluate the quality of the design.It would be the same as if you were wandering around city on a foggy day, unable to see most of its beauty and flaws.And someone would ask you: “How do you find this city?”. You would be unable to answer.

Page 38: Design without critique is like a flower without water (WebExpo 2013 version)

So share Personas, Scenarios and any other user research you’ve based your work on.

It is important, that this information is not only presented, but also well understood by all participants of the session.

Page 39: Design without critique is like a flower without water (WebExpo 2013 version)

But you do not want the critics to follow you in your footsteps.

Just show them where you intended to go - what were your design goals and constraints.

Page 40: Design without critique is like a flower without water (WebExpo 2013 version)

A-ha!

You need them to form their own opinion!

They need to experience that “a–ha” moment.

Page 41: Design without critique is like a flower without water (WebExpo 2013 version)

It’s hard not to explain your design decisions!And it needs practice.

But if you avoid that, the critique session will go much more smoothly.

Page 42: Design without critique is like a flower without water (WebExpo 2013 version)

The critique session

So you’ve prepared the design, set your expectations and provided the context.

And the critique session starts.

Page 43: Design without critique is like a flower without water (WebExpo 2013 version)

People participating in the session might not know about critique.

So you will need to moderate.Following these tips will help you get the most of it.

Page 44: Design without critique is like a flower without water (WebExpo 2013 version)

Be specificAre you trying to get feedback on something specific?Then say what it is. Do you want to hear arguments about the paper on the package or the ribbon?

Page 45: Design without critique is like a flower without water (WebExpo 2013 version)

If people get too far from what you want criticised, nudge them back to the topic.Keep the target in sights or you lose the battle :) as they say.

Page 46: Design without critique is like a flower without water (WebExpo 2013 version)

+–

Critique usually starts with negative feedback, at least where I come from. That’s why it is perceived as something bad ...... as nitpicking. But do not stop there, critique is impartial analysis.Try to discover what is good as well as what is bad about a design.

Page 47: Design without critique is like a flower without water (WebExpo 2013 version)

Positive feedback tells you what should be kept and improved.Negative feedback tells you what needs to be simplified, changed or removed.Always strive to achieve a balance between negative and positive feedback. Nothing in design is all wrong or perfect.

Page 48: Design without critique is like a flower without water (WebExpo 2013 version)

There is a nice iterative colaborative design method called the Design Studio that uses critique at its core.

Page 49: Design without critique is like a flower without water (WebExpo 2013 version)

Who heard about Design Studio?

I am curious. Who heard about Design Studio?

Page 50: Design without critique is like a flower without water (WebExpo 2013 version)

Who tried Design Studio?

Is there anyone who had the chance to try it with clients or colleagues?

If you haven’t heard about it or tried it out yet it’s the perfect training ground for critique.

Page 51: Design without critique is like a flower without water (WebExpo 2013 version)

I like ...I don’t like ...

When trying to criticise the sketches of their peers at the workshop, many people start with "I like", "I dislike".Those are opinions, remember? The weakest arguments, that completely disregard the target group the design is created for.The design was not created for your eyes only!

Page 52: Design without critique is like a flower without water (WebExpo 2013 version)

BANBan "I like"! Ban the emotional response. Encourage people to refer to the personas, target groups or whatever resemblance of the customer you have.Banning the emotional response will help you to create a design, with the people in mind.

There’s also another reason to keep the discussion impersonal.

Page 53: Design without critique is like a flower without water (WebExpo 2013 version)

I don’t like your design!

(in a resolute voice) "I DON'T LIKE YOUR DESIGN"How do you feel?How does this comment change your behavior?

Do you want the dialog to continue?

Page 54: Design without critique is like a flower without water (WebExpo 2013 version)

Probably not.You will either get passive or defend yourself.And this is exactly what are you trying to prevent during the critique session.

Page 55: Design without critique is like a flower without water (WebExpo 2013 version)

You need people to feel safe. You need them to be willing to share any feedback.

And when the feedback comes, you should "ack-app-cap" it.

Page 56: Design without critique is like a flower without water (WebExpo 2013 version)

AcknowledgeAppreciateCapture

Acknowledge, appreciate an capture it.Let’s talk about why are those actions important. And how do they help you.

Page 57: Design without critique is like a flower without water (WebExpo 2013 version)

This is Dan Ariely a behavioral economist.Dan and two other researchers published an interesting paper acknowledgment and its effect on the willingness to work.

Page 58: Design without critique is like a flower without water (WebExpo 2013 version)

Note: The following material is from the “Beginners guide to irrational behavior” by Dan Ariely on Coursera. All rights reserved.

People were given sheets of random letters and they were asked to find pairs. They got paid for each sheet.

Page 59: Design without critique is like a flower without water (WebExpo 2013 version)

In the first condition, people were asked to sign the paper in the top right corner.And were asked to deposit the each sheet at a table. The person sitting at the table acknowledged this by saying “A-ha”.

Page 60: Design without critique is like a flower without water (WebExpo 2013 version)

In the second condition, people delivering the sheets were completely ignored by the person at the table.

Page 61: Design without critique is like a flower without water (WebExpo 2013 version)

In the third condition, the person at the table took the sheet of paper and put it into a shredder without looking at it.

Page 62: Design without critique is like a flower without water (WebExpo 2013 version)

People in the “shredder” condition completed about 6.5 sheet on average.

Page 63: Design without critique is like a flower without water (WebExpo 2013 version)

People in the “acknowledged” condition completed more than 9 sheets on average.

Page 64: Design without critique is like a flower without water (WebExpo 2013 version)

People in the “ignored” condition completed almost the same number of sheets as in the “shredded” condition.As you see, it is quite important to acknowledge and appreciate the feedback you receive. Failure to do so will result in dramatically less feedback.The easiest way to appreciate something is to say "Thank you".

Page 65: Design without critique is like a flower without water (WebExpo 2013 version)

Good point. Thanks!My own “mantra”

You all have a way how to appreciate other humans. So do not forget to use it during critique sessions.

My own mantra is "Good point. Thanks!". Feel free to use it too :)

Page 66: Design without critique is like a flower without water (WebExpo 2013 version)

Do you think you can remember everything clearly without writing things down?You are probably right at first. You can remember for a few second or minutes ...

But as time moves on, your memory will remove or twist the facts that don’t match your beliefs.

And in the end it might look like your opponent actually praised your design.

Page 67: Design without critique is like a flower without water (WebExpo 2013 version)

Red Green Blue

That’s caused by cognitive dissonance - the state that you’re in when with information that goes against what you believe.

This is a nice example of it. The text says something else than the colors.Makes you uncomfortable just looking at it, right?

Page 68: Design without critique is like a flower without water (WebExpo 2013 version)

Write everything down.

If you are not able to take notes during the session, ask someone to do it for you.

Page 69: Design without critique is like a flower without water (WebExpo 2013 version)

Buy red and green markers and carry them with you everywhere you go.

And use them as often as possible.

Page 70: Design without critique is like a flower without water (WebExpo 2013 version)

Annotate the arguments directly into the design itself so the feedback stays close.

Page 71: Design without critique is like a flower without water (WebExpo 2013 version)

Don’t be afraid to end the discussionAny argument also has to be presented in a way that’s understandable.And if they do understand, there is (usually) no point in repeating it.Let me tell you a story about this ...

Once, I had a meeting with a client ...

Page 72: Design without critique is like a flower without water (WebExpo 2013 version)

No, not like this.

Page 73: Design without critique is like a flower without water (WebExpo 2013 version)

More like this.The client paid for my critical opinion on a design they got from another agency.We sat down, went from the information architecture down to each page in detail. We got to a point where he started to defend his point of view.

He repeated his arguments.I waited for him to finish and said: "We both presented our arguments. You know my opinion and I will not add anything to it at this point. Let's continue with the next page." He paused for a moment and replied with: "Oh. That's professional.".

And we moved on.

Page 74: Design without critique is like a flower without water (WebExpo 2013 version)

Say what you have to and move on.It's pointless to repeat arguments.You’re in for the feedback not to have the last word.

Page 75: Design without critique is like a flower without water (WebExpo 2013 version)

Questions?

Source for all images - internet. All rights reserved.

So this is it. We’re almost at the end.Let’s ask some questions and then I will sum it up.

Page 76: Design without critique is like a flower without water (WebExpo 2013 version)

Prepare for critique‣ Accept your design is not perfect

‣ Set your expectations

‣ Prepare the design

‣ Share the context

To sum up ...first you should prepare for the critique ...Set your expectation, explain the context and prepare the design ... sketches work best.

Page 77: Design without critique is like a flower without water (WebExpo 2013 version)

During the session‣ Limit the scope & be specific

‣ Positive and negative feedback

‣ Ban "I like" and keep it impersonal

‣ A-A-C

‣ End when you run out of argumentsSo how do you use this to improve your designs?

Page 78: Design without critique is like a flower without water (WebExpo 2013 version)

What are you worst at?

So how do you use this knowledge to improve your designs or yourself?Think about how you approach critique.What are you worst at? Got it?

Page 79: Design without critique is like a flower without water (WebExpo 2013 version)

What could you do really fast?

What could you start doing really fast?

Page 80: Design without critique is like a flower without water (WebExpo 2013 version)

Pick one technique in each of these two categories.And write an e-mail to the future you asking if you already achieved these two goals and how did you improve.You can use futureme.org a free service, that does exactly that - send you an e-mail at the point in time in the future of your choosing. I suggest you put it at least one year in the future so you forget that you sent it in the meantime.

Page 81: Design without critique is like a flower without water (WebExpo 2013 version)

You can reach me [email protected] | @vorkronor | delicious.com/vorkronor

Thank you :)

And that will make you a better designer and a better person as well.

Thank you!