> ## Documentation Index
> Fetch the complete documentation index at: https://patterns.heurilens.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Consistency

> A measurable UX pattern where users lose confidence and efficiency because interface rules change across pages, states, or components.

## Consistency as a UX failure pattern

A **Consistency Breakdown** occurs when the same elements, actions, or meanings
behave or appear differently across the product.

Users rely on **learned rules**.\
When those rules change unexpectedly, users slow down, hesitate, or make mistakes.

Consistency is not visual sameness.\
It is **predictability of meaning and behavior**.

<Note>
  Consistency is measurable because broken expectations produce hesitation, errors, and backtracking — not complaints.
</Note>

## What typically breaks consistency

Common causes include:

* buttons that look the same but act differently
* the same action labeled differently across pages
* inconsistent spacing, alignment, or grouping rules
* components that change style or behavior between states
* navigation patterns that shift across sections
* form fields that validate differently in similar contexts

<Frame>
  <img src="https://mintcdn.com/heurilens/gl-jdYlebDR0ByAq/images/consistency.png?fit=max&auto=format&n=gl-jdYlebDR0ByAq&q=85&s=28903445443f462cfe9bbb5bc3f1b892" alt="A measurable UX pattern where users lose confidence and efficiency because interface rules change across pages, states, or components." className="rounded-xl" noZoom={true} width="1200" height="442" data-path="images/consistency.png" />
</Frame>

## Observable user behavior signals

When consistency breaks, users often:

* pause before interacting with familiar elements
* re-check labels or hover for confirmation
* make incorrect selections
* backtrack to “verify” what they just learned
* lose speed in otherwise simple flows

> When users stop trusting patterns, every step becomes a decision.

## Product-level signals Heurilens looks for

Heurilens flags consistency issues when it detects:

* identical components with different visual treatments
* repeated actions placed in different locations
* inconsistent feedback patterns (success, error, loading)
* similar pages using different hierarchy rules
* mismatched interaction states (hover, focus, disabled)

## How Heurilens detects this pattern

<CardGroup cols={2}>
  <Card title="Component parity check" icon="cubes">
    Compares shared components across pages to detect visual or behavioral drift.
  </Card>

  <Card title="Label & meaning alignment" icon="tag">
    Checks whether the same action uses consistent wording and intent.
  </Card>

  <Card title="Interaction state analysis" icon="toggle-on">
    Evaluates hover, focus, loading, and error states for consistency.
  </Card>

  <Card title="Layout rule comparison" icon="grid">
    Detects spacing, alignment, and grouping inconsistencies across sections.
  </Card>
</CardGroup>

## Real-world examples (what this looks like on websites)

<AccordionGroup>
  <Accordion title="Example 1 — CTA inconsistency across pages" icon="bullseye">
    Typical signals:

    * “Get started” on one page, “Try free” on another, “Sign up” elsewhere
    * primary CTA placement changes between pages

    What users do:

    * hesitate before clicking
    * re-read button labels
    * delay commitment
  </Accordion>

  <Accordion title="Example 2 — Form behavior inconsistency" icon="clipboard-list">
    Typical signals:

    * required fields differ without explanation
    * validation appears sometimes inline, sometimes after submit

    What users do:

    * make repeat errors
    * re-enter information
    * abandon forms out of frustration
  </Accordion>

  <Accordion title="Example 3 — Navigation rule changes" icon="bars">
    Typical signals:

    * similar pages structured differently
    * active states unclear or inconsistent

    What users do:

    * lose orientation
    * rely on back button
    * explore less deeply
  </Accordion>
</AccordionGroup>

## Example output from Heurilens

<Card title="Consistency Breakdown Detected" icon="triangle-exclamation">
  Shared components and actions behave inconsistently across pages.

  Users are required to re-learn interaction rules,
  increasing hesitation and reducing flow efficiency.
</Card>

## Example fix direction generated by Heurilens

Rather than enforcing sameness, Heurilens recommends **rule alignment**:

* define a single meaning per action (one label, one intent)
* standardize component behavior across states
* apply spacing and hierarchy rules consistently
* centralize feedback patterns (success, error, loading)
* treat navigation as a system, not page-by-page decisions

<Tip>
  Consistency fixes reduce mental effort by preserving learned behavior — not by limiting design flexibility.
</Tip>

## Why this pattern matters

Consistency breakdowns rarely block users immediately.\
They erode **confidence and momentum**.

Over time, users:

* trust the product less
* move more cautiously
* convert less efficiently

This makes consistency issues subtle, cumulative, and expensive.

## Related patterns

<CardGroup cols={2}>
  <Card title="Visual Hierarchy" icon="layer-group" href="/modules/core-ux/visual-hierarchy">
    Inconsistent hierarchy rules confuse attention priorities.
  </Card>

  <Card title="Cognitive Load" icon="brain" href="/modules/core-ux/cognitive-load">
    Re-learning rules increases mental effort.
  </Card>

  <Card title="Readability" icon="book-open" href="/modules/core-ux/readability">
    Inconsistent text structure slows comprehension.
  </Card>

  <Card title="Forms CRO" icon="clipboard-list" href="/modules/trust-conversion/forms-cro">
    Forms amplify the cost of inconsistent rules.
  </Card>
</CardGroup>

<Card title="See consistency issues on your product" icon="sparkles" href="https://heurilens.com/auth/signup">
  Run an analysis and see where interface rules change unexpectedly.
</Card>
