Design UI With Restraint

Design clear interfaces

Structure and hierarchy

• Build the layout around what the user needs to understand or do.
• Give each page, section, or card one clear title.
• Add headings, labels, badges, numbers, and descriptions only when they provide useful information.
• Use cards, navigation, buttons, and other familiar patterns when they suit the content, not by default.
• Keep implementation notes, demo-data disclaimers, and internal explanations out of the interface unless they matter to the user.

Visuals and interaction

• Match the visual style to the project and its audience.
• Make charts, diagrams, images, and animations clearly reflect the underlying content.
• Keep spacing, alignment, typography, image sizes, and visual groupings consistent.
• Make interactions clear, useful, and predictable.
• Check the rendered result for visual errors, awkward motion, and responsive layout problems.

Editing

• Change only what the request calls for and preserve the rest.
• When an element adds nothing, remove it. When it helps, keep it.

Examples

• Remove Schedule above a card already titled Calendar.
• Remove decorative 01, 02, 03 numbering when the order does not matter.
• Place related chart items together and use matching colors for the same group.