Giving Actionable Feedback on UI Design

I cringe when I hear a GUI described as “ugly”. It’s not that I don’t see it too, but the feedback isn’t helpful. I can’t set the ugliness lower.

If something looks “ugly” to you, use that to guide your attention and analysis. What we often perceive as ugly is rooted in rules of perception and communication.

To give you an idea, considering just the visual look of a design (not its interactions), try to judge

  • How easy is it to see the entire UI as various levels: as a whole, as a collection of a few parts, at a detail level.
  • How quickly can you scan and visually acquire a component.
  • How correct is your intuition on how a component would work based on what it looks like
  • How easy it is to tell things apart.
  • How easy is it to group things

Then, try to express you critique as: this “attribute of the design” doesn’t accomplish “this specific communication goal”

Here are some examples of what I mean:

  • The button icons aren’t easy to tell apart so they are hard to find right away.
  • The buttons need more padding because the text is too close to the border, making it harder to read.
  • I can’t tell the difference between the various header levels
  • The colors of the icons don’t feel like they come from a unified palette. Let’s try to match their saturation and brightness levels.
  • It isn’t clear if this visualization means that the state of the system is good or bad — it needs more context
  • There isn’t enough contrast between the most important parts and rest of the UI
  • There isn’t enough whitespace helping to form a hierarchy of information
  • The spacing between paragraphs isn’t proportionate to the font and line height. It makes it harder to read the text.

Look at the visual variables: colors, values (lightness/darkness), sizes, positions, and shapes. Consider whitespace. Look at the relationships between the components.

Consider if there is too much or too little contrast. Is there harmony between things that are supposed to be the same? Do the most important things draw the eye? Can you scan?

These are just the surface level. Bad UIs are usually bad at a level deeper than that. But if it looks “ugly”, expressing that as contrast/harmony of visual variables is more actionable.