# Interface Design - DRAFT

In UI, UX, and product design, we make many decisions, consciously and subconsciously, in order to communicate information and ideas. But why do those particular choices convey the meaning that they do? Which ones are superlative or simply aesthetic, and which are actually doing the heavy lifting? -- https://matthewstrom.com/writing/ui-density/

A group of 20th century German psychologists explored how humans understand and interpret shapes and patterns, and described principles that make things appear ordered and symmetrical.

We consider these Gestalt principles useful as a way to understand how we perceive and interpret visual information.

  • Proximity: we perceive things that are close together a comprising a single group
  • Similarity: objects that are similar in shape, size, color, or in other ways, appear related to one another.
  • Closure: our minds fill in gaps in designs so that we tend to see whole shapes, even if there are none
  • Symmetry: if we see shapes that are symmetrical to each other, we perceive them as a group formed around a center point
  • Common fate: when objects move, we mentally group the ones that move in the same way
  • Continuity: we can perceive objects as separate even when they overlap
  • Past experience: we recognize familiar shapes and patterns even in unfamiliar contexts. Our expectations are based on what we’ve learned from our past experience of those shapes and patterns.
  • Figure-ground relationship: we interpret what we see in a three-dimensional way, allowing even flat 2d images to have foreground and background elements.

Examples of Gestalt Principles: https://matthewstrom.com/writing/ui-density/
Examples of Gestalt Principles: https://matthewstrom.com/writing/ui-density/

These principles can be used to guide interface design. e.g. a heading placed near a widget will be perceived as a label for that widget due to proximity. Buttons with similar visual styling will be perceived as a group due to similarity.