Menu Search
Jump to the content X X
Smashing Conf New York

You know, we use ad-blockers as well. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf New York, dedicated to smart front-end techniques and design patterns.

How To Run A UI Design Critique

Criticism is easy. It seems like everybody has an opinion, but, as the author Harlan Ellison points out, “You are not entitled to your opinion. You are entitled to your informed opinion.” To become informed, though, requires exploration. Design critiques are an important part of any product exploration.

A design critique — where the creator discusses and explains the creation with the rest of the team and/or client — is not about badgering the designer or pushing them to justify every decision they made. That’s just criticism. A good design critique is meant to explore the design, find where it is working and where it could be improved. If done well, design critiques allow everyone on the team to feel as if they have been heard and allow clients to give valuable feedback.

Further Reading on SmashingMag:

If you are the person running the critique, getting to constructive criticism is often a challenge, especially with groups that do not have experience with the design critique format. In an agile environment, you will often have coders, project managers, product managers and people from other disciplines sitting in to give feedback, and you need to know how to quickly get them up to speed on the expectations if you want to get anywhere fast.

Principles For Running A Great UI Critique Link

From my own experience, I’ve found that design critiques for user interfaces (UIs) need to be performed throughout the entire product design and development process, at least weekly, and possibly even daily at certain times. They keep the product design on track, and they become even more critical in an interactive agile or lean UX product environment, where designs go through multiple iterations before deployment. Running a UI design critique is a challenge, requiring you not only to explain decisions, but also to listen carefully to other ideas.

Description of the image.5
The critique allows your team to create together. (Image: Jamie Cummings6) (View large version7)

Establishing clear principles — not “rules” — at the beginning of every critique is imperative. Unlike rules, which are dogmatic and feel restrictive, principles help everyone understand the expectations but still allow for the freeform discussion that is needed.

Chief among these expectations is for everybody to agree on why you are actually critiquing what you are looking at. Jason Ulaszek recommends:

Start by asking about the purpose or intention behind the design you’re critiquing. Why are we asking for this piece of information? What expectations have been set that allow us to ask for it? What will we do with it? If we can answer those questions, then we move on to discussing various options of interpreting the need for the element and respective advantages and disadvantages with each option.

Critique8
Be prepared to show and tell. (Image: Jason CranfordTeague9) (View large version10)

To help you keep to this guideline, I recommend following the standard principles you might apply to any design critique, whether it involves UI design or not:

  • Show respect.
    It might sound cliched, but if everyone in the critique is not respectful of the opinions and skills of the others at the table, then the critique will quickly degrade into hostility.
  • Designate roles.
    Before starting, clarify who will be taking on which role(s) during the critique. It’s best to mix these up from critique to critique so that no one feels left out, and it’s optimal if the three lead roles are different people (but that is not always practical).

    • Presenter
      This is the person responsible for presenting the design and the thinking behind it. This person answers all questions or directs them to other people in the critique who can answer them.
    • Moderator
      If possible, it is best if this role is performed by someone not directly responsible for the design, often the project or product manager. The moderator ensures that everyone stays on topic and that everyone is heard.
    • Note-taker
      This person focuses on recording what is discussed and is especially vital for making sure that the takeaways (another principle, listed below) are clearly defined at the end of the critique. The note-taker should not be left out of the discussion, although their role might lean towards getting other members of the team to clarify what they have said.
  • State the goals for the project and for the critique up front.
    Quickly remind everyone of the goals of the project and what this specific critique will cover. Keep the critique focused on the task at hand, rather than allowing the scope to creep to other considerations that would derail the primary purpose of the discussion.
  • Review the audience(s).
    To reinforce that the people in the critique are not the target audience for the product, remind everyone about who is.
  • Avoid coming up with “the answers.”
    Participants will feel a strong desire to solve problems and come up with the “answer” in a critique. However, the best solutions rarely arise in the actual meeting. The point of a critique is to probe for issues and discuss multiple potential solutions for the designer to take away and consider.
  • Agree on takeaways.
    After everything has been said in the critique, the note-taker needs to review the takeaway tasks for everyone who participated to ensure that everyone is on the same page for the next critique.

Unfortunately, all too often, UI design critiques focus heavily on the visual and not enough on the interactive, much less temporal, nature of the design. For a UI design critique, add the following elements:

  • Identify the presentation media.
    Along with identifying the audience, review the platform and technologies being used to create the product. Is this an iPhone app? A website? Are you using AngularJS? C#? Make sure these are all considered so that you avoid proposing solutions that wouldn’t work.
  • Outline the process flow.
    You need to know the road map. For UI design, that would be the process flow for the user’s experience. This might come in the form of storyboards, journey maps or other ways of describing the process, but everyone should be familiar with it before considering the UI.
  • Demo the product, but show more than tell.
    I cannot stress this one enough: A great user experience has a lot more showing than telling. The end user will need to know exactly how the product works with minimal explanation. Your demo should also require as little explanation as possible. As the saying goes, a good UI is like a joke: If you have to explain it, it’s not very good.

Asking The Right Questions Link

Plenty of questions11 and statements12 work against strong cooperation in a design critique. Here are a few questions that I have found open dialogue for exploring designs in a collaborative, rather than combative, way, which you can suggest to your team.

Ask More Questions.13
The key is to ask the right questions. (Image: Jonathan Simcoe14) (View large version15)

“How Did You Come Up With That Solution?” Link

A great place to start any critique or conversation is to ask the designer how — not why — they did something. Asking why immediately puts them on the defensive, while asking how invites exploration of the concept’s origin without the need for justification.

Description of the image.16
Finding answers is easy. Asking the right questions is hard. (Image: Jason CranfordTeague17) (View large version18)

“Why” questions push us towards trying to prove something is “true,” rather than explaining it as one possibility. According to Aaron Morton19:

“Why” elicits a story, explanations of why something is true. If you ask why nothing is working out the way you want it to, you are likely to create a story, which may or may not be true. This is dangerous territory in making you feel bad.

Instead of asking “why,” consider asking “how” questions to elicit a story about the process of creation, rather than a defence of its existence. From there, you can then ask what possibilities the designer considered before, and only then explore alternatives they may not have considered. But listen carefully to what the designer has already tried before offering suggestions. They may have overlooked something, but don’t go into the conversation assuming so.

“Where Did You Get the Idea To Do It That Way?” Link

Thomas Edison famously said, “Genius is one percent inspiration and ninety-nine percent perspiration.” But he largely stole his one percent from Nikola Tesla. Then again, Picasso said, “Good artists borrow, great artists steal” (but he probably stole that line).

A central idea of Pixar Animation president Ed Catmull20’s book Creativity, Inc is that having a great team is more important than having a great idea:

Getting the right people and the right chemistry is more important than getting the right idea.

We rarely conceive ideas in a vacuum, and thinking about where we got our inspiration from can push our own innovation. Even better, bringing our inspirations together in a team setting can spawn new ideas.

A word of caution: Be careful not to sound accusatory or condescending — i.e. implying they stole the idea. Though, you do want the designer to push their own understanding of the motivations for their ideas and where they came from, without squishing the innovation.

“When Does That Need to Happen?” Link

Just like in comedy, timing is everything in temporal design21, and events need to happen at the right time and in the right order. When we are designing, though, that order is not always obvious until we have to sit down and explain it.

A great UI is like a great story, and that means you have to carefully pace it. How much information is just enough to get started with a form? Are you displaying data in the right context for the user to understand? Is this the right moment to reveal the conclusion?

Jason Kunesh, CEO of Public Good22, a startup that helps nonprofits connect with people through the news, tells me:

For our customers, a great interaction at the right moment is the difference between a happy fan of the product or service and a lost opportunity to connect. Turning a casual interaction into a lasting relationship depends on a series of tiny, positive interactions and messages arriving when people are ready for them.

Part of the critique process should be to iron out the wrinkles in the timing of the interface by asking at every opportunity whether this is the right moment to perform an action, ask a question or present data.

“Can We Use Motion to Add Visual Cues?” Link

This question will surprise a lot of designers who are used to the static nature that has dominated UI design for years. However, movement, animation and transitions are becoming the norm in experience design. Motion will soon be as important to consider in a design as color.

Animated UI.23
Motion is as important as color in modern UI design. (Image: Jakub Antalík24) (View large version25)

According to UI animation expert Rachel Neighbors26:

With the rise of flat design and the UX stumbles that have come with it, we’ve seen just how dangerous it can be to strip visual cues from a site’s components. Animation can be used to the opposite effect.

Movement or change could be as simple as a change in opacity or color, or a monkey’s arm stretching across the page, or a sun rising as the user completes a task. Asking about adding moment-to-moment movement in a UI design will often push the designer to change their perspective in good ways. Push the designer to think beyond the discrete moment and to discuss the design in time, not just in space.

“How Could We Make It Simpler?” Link

Simplicity is hard. It seems like adding is always easier than taking away, and many UIs suffer from what I like to call the “snowflake in a blizzard” syndrome: Sure, every snowflake is unique, but you’ll never notice that in a blizzard. In UI design, we all too often see interfaces chockablock full of links, buttons, controls and images. Clients will often think they need to include everything the audience might ever need, to the point that you can’t find anything you actually need.

Simple.27
Reduce noise and clutter. (Image: Bench28) (View large version29)

I put the simplicity question to Steve Krug, author of Don’t Make Me Think30:

I think it’s a very useful question. I would have thought it’s a lesson everyone’s absorbed by now, but I know they haven’t. I always like to say that anything on the page or screen that’s not part of the solution — for the user’s real goals — is noise and a candidate for being thrown overboard.

At every step in a design, we need to ask ourselves, How can we create something that requires less thought yet keeps the same power? In a critique, this is best expressed by asking how to make something simpler. It’s important to maintain clarity in the design, but to do so with fewer clicks, less text and not as many form fields. Get down to the bare minimum needed to get the job done, and your users will thank you.

“What Happens Next?” Link

A great design critique shares a lot in common with a great interview: They are both about exploration. One of the greatest interviewers, Studs Terkel, said31:

[Interviewing] isn’t an inquisition; it’s an exploration, usually an exploration into the past. So I think the gentlest question is the best one, and the gentlest is, “And what happened then?”

Applying this to a UI design, we always need to ask the designer to think about what happens next. This question invites them to think beyond what they considered to be the end. Users must always have somewhere to go next.

One of the greatest challenges to envisioning any UI is to consider all of the possible paths, not just the “happy path” we want the user to take. What happens after they click a button? What happens if there is an error? What happens after they submit a form? Ask what happens next until you’ve considered every possible scenario, otherwise you run the risk of leaving the user hanging, which is always a bad experience.

Don’t Just Ask Questions to Answer Them Link

When asking these questions — or any others for that matter — don’t ask simply so that you can answer yourself. It is annoying when someone asks you a question not to hear your answer or to understand your thinking but simply to hear their own voice.

Blank Notebook.32
Be ready to take notes and listen. (Image: Luis Llerena33) (View large version34)

If you are one of those people, cut it out immediately. Ask all of your questions with your mind wide open to the answers given. Then, craft your responses based on those answers, not the answers you wanted to hear.

What A Good UI Critique Looks Like Link

Critiques will vary greatly depending on the skills, goals and responsibilities of the participants. However, a good critique always focuses on specific aspects of the product and thoroughly explores the presented solution.

A UI critique focuses not just on what the product looks like at the moment, but on how it works over time and whether this best suits the user’s needs. Rather than considering the user’s needs, participants will often wonder why something wasn’t done the way they expected. Jason Ulaszek of UX for Good35 agrees, telling me about his own critiques:

Staying objective in our discussion and considering the mental model of the individual tasked with using the design [i.e. the user] is critical in how we discuss the solution.

Always keep in mind that — like cell-based animation, where a second’s worth of the final film could take weeks or months to produce — while we might spend hours agonizing over a minute detail in the interface, it will probably be just a blip on the user’s radar.

CCTV Cams.36
The whole team needs to be looking in the same direction. (Image: Matthew Wiebe37) (View large version38)

Steve Krug had this to say when I asked him about this:

We’re thinking, “great literature” (or at least “product brochure”), while the user’s reality is much closer to “billboard going by at 60 miles an hour.” It’s incredibly hard for UI designers to realize just how quickly people are zooming through — or past — the interface they’ve worked so hard to develop, and how little of it they actually take in.

A good UI critique slows down to consider every element, but recognizes that this is not how the user will be seeing the design. If the participants in your critique do not have formal training to speak directly to color, typography or experience design, they can still consider these important factors in all UI designs:

  • Consistency
    Are the design and its implementation consistent throughout the product? This includes color, typography, controls, imagery and any design element (static or interactive) that is used more than once in the interface.
  • Context
    Have you consistently respected the context of the user as they are using the product? Constantly asking this question is key because you are likely not in that context, but merely simulating it, while designing or testing.
  • Voice
    Do the brand and design have a clear, consistent and recognizable voice?
  • Transitions
    Are you using transitions from state to state for any significant changes in the UI? Modern designs are about far more than the visual. Consider how all interface elements move and change during the user’s interaction.
  • Simplicity
    Is the design as simple as it can be to get the job done?

Avoiding Hostile Critiques Link

Critiques can be — and often are — done in a pugnacious way, where members of the team, for whatever reason, are inclined to criticize the work without listening to the thought process that went into its creation. They bring their own biases to the design, rather than consider the user, and they often just try to show how clever they are.

You can always tell when a critique becomes overly aggressive: The designer tends to become prickly about their decisions, rather than explain how they arrived at them and discuss alternatives. The key to avoiding aggressive critiques is to set out clear principles and ask open-ended, constructive questions. Remember that the idea is to strengthen the design collaboratively, not to win a design battle.

I find aggressive critiques to be unhelpful and usually harmful. Antagonistic critiques force the designer into a defensive posture, entrenching them in what they have done, rather than empowering them to expand it. Design is — to a very large extent — intuitive and not always easily qualifiable, much less quantifiable.

However, that does not mean the critique is purely about the designer’s opinion; it is about the designer’s well-informed opinion gained through years of study. Web producer Phillip Djwa39 of Agentic feels that the key is to…

… speak from my experience, and not try to generalize. For example, I would ask, “I wonder whether the opening banner is communicating enough of the brand?” instead of, “Wow, people will never understand what brand value we have.”

Final Word: A Critique Is Not Usability Testing Link

It’s easy to trick yourself into thinking that you speak for the audience, either through the use of personas or your own biases. No matter how many personas you create or critiques you run through, you are not your audience. Steve Krug tells me:

This is one reason why I think every designer should spend time watching people try to use what they’ve built (aka usability tests).

Toolchest.40
A design critique is just one tool in your UX toolchest. (Image: Todd Quackenbush41) (View large version42)

Just like a laser level43 versus a bubble level, usability testing is more precise and accurate than internal critiques, but also generally more time-consuming and expensive. Regular design critiques are invaluable for keeping a project on target but can never replace getting out in the field and testing with real-life users. Otherwise, all you are doing is talking to yourself.

(ah, al, il)

Footnotes Link

  1. 1 https://www.smashingmagazine.com/2010/03/web-design-criticism-a-how-to/
  2. 2 https://www.smashingmagazine.com/2014/06/facing-your-fears-approaching-people-for-research/
  3. 3 https://www.smashingmagazine.com/2009/10/how-to-respond-effectively-to-design-criticism/
  4. 4 https://www.smashingmagazine.com/2013/04/rainbow-spreadsheet-collaborative-ux-research-tool/
  5. 5 https://www.smashingmagazine.com/wp-content//uploads/2016/08/create-opt.jpeg
  6. 6 https://unsplash.com/@bamagal
  7. 7 https://www.smashingmagazine.com/wp-content//uploads/2016/08/create-opt.jpeg
  8. 8 https://www.smashingmagazine.com/wp-content//uploads/2016/08/critique-opt.jpg
  9. 9 http://cranfordTeague.com/
  10. 10 https://www.smashingmagazine.com/wp-content//uploads/2016/08/critique-opt.jpg
  11. 11 https://medium.com/jasonspeaking-report/6-seemingly-innocent-questions-guaranteed-to-kill-creativity-c4d35aa8f2cd#.kbk4wne2l
  12. 12 https://medium.com/jasonspeaking-report/6-statements-that-kill-ui-creativity-f0a8384a63aa#.ahc7de9j9
  13. 13 https://www.smashingmagazine.com/wp-content//uploads/2016/08/questions-opt.jpeg
  14. 14 https://unsplash.com/@jdsimcoe
  15. 15 https://www.smashingmagazine.com/wp-content//uploads/2016/08/questions-opt.jpeg
  16. 16 https://www.smashingmagazine.com/wp-content//uploads/2016/08/solution-opt.jpg
  17. 17 http://cranfordteague.com/
  18. 18 https://www.smashingmagazine.com/wp-content//uploads/2016/08/solution-opt.jpg
  19. 19 http://lateralaction.com/articles/creative-questions
  20. 20 http://waltdisneystudios.com/team-view/ed-catmull/
  21. 21 https://medium.com/jasonspeaking-report/temporal-design-thinking-8b37e2879d08#.u8qxa5do8
  22. 22 https://publicgood.com/
  23. 23 https://www.smashingmagazine.com/wp-content//uploads/2016/08/goals-animation.gif
  24. 24 https://dribbble.com/antalik
  25. 25 https://www.smashingmagazine.com/wp-content//uploads/2016/08/goals-animation.gif
  26. 26 http://rachelnabors.com/
  27. 27 https://www.smashingmagazine.com/wp-content//uploads/2016/08/simple-opt.jpg
  28. 28 https://unsplash.com/@benchaccounting
  29. 29 https://www.smashingmagazine.com/wp-content//uploads/2016/08/simple-opt.jpg
  30. 30 https://www.sensible.com/
  31. 31 http://www.nytimes.com/2008/11/01/books/01terkel.html
  32. 32 https://www.smashingmagazine.com/wp-content//uploads/2016/08/notes-opt.jpeg
  33. 33 https://unsplash.com/@albertosaure
  34. 34 https://www.smashingmagazine.com/wp-content//uploads/2016/08/notes-opt.jpeg
  35. 35 http://www.uxforgood.com
  36. 36 https://www.smashingmagazine.com/wp-content//uploads/2016/08/looks-opt.jpeg
  37. 37 https://unsplash.com/@matthewwiebe/
  38. 38 https://www.smashingmagazine.com/wp-content//uploads/2016/08/looks-opt.jpeg
  39. 39 http://www.agentic.ca/studio/phillip-djwa
  40. 40 https://www.smashingmagazine.com/wp-content//uploads/2016/08/tools-opt.jpg
  41. 41 https://unsplash.com/@toddquackenbush
  42. 42 https://www.smashingmagazine.com/wp-content//uploads/2016/08/tools-opt.jpg
  43. 43 http://www.dewalt.com/en-us/products/hand-tools/measuring-and-layout-tools/self-leveling-line-lasers/12v-max-compatible-red-cross-line-laser/dw088lr

↑ Back to top Tweet itShare on Facebook

Jason designed the first web based magazine, Computer Mediated Communications, in 1994 and has been at the forefront of digital innovation ever since. He is the co-founder and lead creative at The CranfordTeague Group, which specializes in temporal design thinking and trust by design.

  1. 1

    Thanks for the post, Jason. Good reminder with the Final Word, my team will benefit.

    FYI… I still have a copy of Fluid Web Typography on the bookshelf.

    3
    • 2

      Jason Cranford Teague

      August 15, 2016 7:02 pm

      Thanks Jesse!

      Look for my new book on Web typography coming out later this month.

      2
  2. 3

    Brilliant. I’m taking this to my team – you’ve expressed something I’ve struggled to get out very elegantly.

    2
  3. 5

    Thanks for the post!

    5
  4. 7

    Jerome Domurat

    August 17, 2016 7:36 pm

    Interesting article, says a lot about how everyone gives feedback. I agree that it is frustrating that most discussions regarding product design, end up being emotional pot stews. People believe that a discussion about design is their, ‘opinion’ of things. ‘I like it.’ or ‘I don’t like it.’ In the big picture, design deals with everyone’s opinions.

    As you say, learning to express our reasoning of thought is very important for developing a well-rounded products that communicate with clarity. The beliefs and opinions held are the great challenge. I would add, that participants should not just express simple opinions in a critique. ‘Good’ vs. ‘Bad.’ It’s best if they can elucidate their reasons about, ‘How and Why’ they think such a thing. Very difficult to do. A true design skill, is to see in ourselves, ‘How and Why’ we hold a opinion about something? It’s a shame that so little teaching goes into how to give thoughtful examination.

    Keep up the excellent pursuit.

    1
    • 8

      Jason Cranford Teague

      August 28, 2016 5:37 pm

      Thanks Jerome. Your point is spot on about avoiding Good vs Bad in the conversation. There’ works or may not work.

      1
  5. 9

    Very often designers (and entire design teams) underestimate the process they’re required to enter and resolving such decisions about when to entertain fidelity questions in the UI can confuse. Apart from the wasted effort of high fidelity images of UI instances, there’s also the huge limiting factor of how such efforts destroy the creative expansion which should be driven by user feedback on prototypes.

    Jason and his other writings provide a lot of explanation for designers to help them to understand the processes involved in the reality of making interfaces. With techniques and insights to help designers to drop the traditional processes which result in a static output.

    2
  6. 11

    A great UI/UX design initiates from a creative mind. Everyone has their own thought process behind the visuals they create, so you can express your views not come to the end conclusion.

    1
  7. 12

    Aaron Irizarry

    September 6, 2016 9:10 pm

    Good write up! Great seeing more people talk about critique and the conversation surrounding design. If anyone wants more reading I have a book out on the topic https://amzn.com/149190240X

    0
  8. 13

    Hey,
    This is a great topic that you picked. I think every designer should read this so they can understand that how they can explain their design to others in an effective way.

    0

↑ Back to top