Resources
Team WorkflowsIntermediate3 min read

UI Design Reviews for Designers: Compare the Intended and Shipped Experience

A designer’s guide to reviewing implemented interfaces with realistic content, distinguishing component problems from local exceptions, and writing useful handoff notes.

By Design Audit Team · Updated

Review the relationship the design was meant to create

A UI design audit examines how hierarchy, spacing, typography, controls, and states work in the implemented interface. For a designer, the goal is to understand whether the shipped page preserves the intended relationships. A screenshot difference may be harmless; a lost relationship may affect the task.

Imagine a directory where a provider’s availability belongs beside its booking action. The implementation matches the intended colors but moves availability below unrelated details. The important concern is the separation of information from the decision, not the number of pixels between two blocks.

Use content that challenges the composition

Review long provider names, missing portraits, mixed-length descriptions, and unavailable appointments. A component that works only with the shortest sample data may break during routine content updates. Inspect narrow and intermediate widths as well as the approved desktop composition.

Note which variations are intentional. A compact card inside a search result can differ from a full provider profile. The question is whether equivalent information follows a coherent rule in each context, not whether every page looks identical.

Find the right level for the correction

If all directory cards misalign their actions when descriptions wrap, inspect the shared card. If only one profile behaves differently, look for a local override or content issue. A design-system change should solve a shared problem without forcing unrelated components into the same arrangement.

Write the handoff around the intended relationship: “Keep availability and the booking action together when the description wraps.” Include the relevant width, content example, and current capture. Engineering can then choose an implementation that respects the layout constraints.

Combine visual findings with interaction review

Design Audit can attach evaluation findings to a captured public page. Designers can use that evidence to locate a concern and discuss the intended hierarchy or wording. Compare against the approved design separately; this workflow does not promise automatic comparison with a Figma file.

Follow menus, focus movement, errors, and other interactive states in the actual interface. A visual finding can start the investigation, but the designer still needs to assess how the change behaves beyond the captured state.

Review checklist

  • Describe the intended information or control relationship.
  • Use long, incomplete, and unavailable content states.
  • Separate shared-component concerns from local exceptions.
  • Include interaction states in the implementation handoff.

References and further reading

Apply the guidance to a public page

Choose relevant evaluations and inspect the captured evidence before deciding what to change.