this and that about programming

# UX Design Principles

Lukasz Kolko 3 min read
principles ux design
Table of Contents

Keep in mind

  • they apply to web, mobile, and physical interfaces
  • they work together—combining multiple principles creates better UX
  • context matters; sometimes principles conflict—trust your research
  • they’re not laws of physics; they’re heuristics with exceptions
  • user testing beats theory every time

Foundation

Clarity

make it obvious

Users shouldn’t guess. Ambiguity kills conversions.

  • “Buy Now” button
  • Clear error message
  • Obvious CTAs

Consistency

reuse familiar patterns

Consistency reduces cognitive load—users learn once, apply everywhere.

  • Same navigation across pages
  • Standard icons
  • Predictable interactions

Simplicity

less clutter, fewer steps

Every element must earn its space.

  • Single-step checkout
  • Minimal form fields
  • Reduced clutter

Accessibility

design for all users

Accessibility isn’t optional—it’s legal and it expands your audience.

  • Alt text for images
  • High-contrast text
  • Keyboard navigation
  • Captions

Feedback

show results of actions

Users need confirmation that their action registered.

  • Loading spinner
  • Button color change
  • Success messages

Progressive Disclosure

reveal complexity gradually

Beginners see basics; power users find depth.

  • “Advanced settings” toggle
  • Collapsible FAQ
  • Details on demand

Design Systems

Defaults & Choice Architecture

defaults shape behavior

Users rarely change defaults—choose wisely.

  • Newsletter opt-in checked
  • Preselected shipping method
  • Default settings handle complexity

Consistency at Scale

Jakob’s Law—users expect familiarity

Familiar patterns need no explanation; they borrow trust from other products.

  • Cart like Amazon
  • Login like Gmail

Aesthetic Usability

attractive = feels easier

Beauty doesn’t just please—it makes interfaces feel more usable.

  • Clean product page
  • Minimal UI design
  • Polished interactions

Perception & Cognition

Hick’s Law

more choices = slower decisions

Every option adds friction to the decision.

  • 3 pricing plans
  • Short dropdown lists

Miller’s Law

~7±2 items fit in working memory

Chunk information beyond that limit—group related items, use progressive disclosure.

  • Max 7 nav items
  • 5-step signup wizard

Tesler’s Law

complexity must live somewhere

Choose your burden strategically.

  • Multi-step setup wizard
  • Default settings handle complexity

Doherty Threshold

respond in <400ms to keep flow

Users forgive waiting if something happens fast. Lag breaks immersion.

  • Instant search results
  • Autocomplete suggestions

Visual Design (Gestalt Principles)

Hierarchy

guide attention with layout and contrast

Your layout teaches users what matters first.

  • Large headline
  • Bold primary CTA
  • Strategic white space

Proximity

close = related

Users naturally group nearby elements.

  • Label next to input
  • Button near form

Similarity

look alike = grouped

Visual similarity broadcasts relationships without text.

  • Same color buttons
  • Matching card styles

Continuity

eyes follow lines and flows

Eyes naturally trace smooth lines over jagged ones.

  • Timeline layout
  • Stepper flow

Closure

people complete missing shapes

Brains fill in the blanks—use this to reduce visual clutter.

  • WWF panda logo
  • Dashed circle looks complete

Figure/Ground

foreground vs. background contrast

Clear figure/ground separation prevents confusion.

  • Modal overlay
  • White text on dark hero image

Common Region

grouped area = related

Enclosure signals: “these things belong together.”

  • Card with border
  • Section box around inputs

Human Psychology

Peak-End Rule

users remember peaks and endings

People don’t remember the average experience—they remember the best and last moments.

  • Reward animation
  • Checkout confirmation

Von Restorff Effect

unique = remembered

Distinctiveness captures attention and sticks in memory.

  • Red “Delete” button
  • Highlighted promo

Zeigarnik Effect

unfinished tasks stick in mind

Unfinished business nags—use this to drive engagement, but don’t abuse it.

  • Incomplete profile reminder
  • Progress bar

Goal-Gradient Effect

motivation rises near completion

Progress toward a goal energises users—make progress visible.

  • 8/10 loyalty stamps
  • “2 steps left”

Interaction

Fitts’s Law

bigger and closer = faster to click

Reduce distance and size targets for frequent actions.

  • Large mobile CTA
  • Sticky bottom nav buttons

Norman’s 3 Levels

objects have three layers: looks, use, meaning

Great design balances all three.

  • Luxury watch (looks)
  • Intuitive controls (use)
  • Apple design language (meaning)

Kano Model

features layer differently

Must-haves prevent dissatisfaction; delighters create surprise. Know which tier your feature occupies.

  • Calls = basic
  • FaceID = delight

Approach

Empathy

design around user needs

Walk through your interface as a beginner—what confuses you?

  • Step-by-step onboarding
  • Helpful tooltips
  • User-friendly language

Closing Thoughts

These principles aren’t rigid rules—they’re patterns backed by cognitive science and user behaviour. The strongest designs layer multiple principles together: clarity (foundation) + hierarchy (visual) + consistency (systems) + empathy (approach). Start with research to understand your users’ actual needs; then apply principles strategically to serve those needs.

Back