← Codex

Cognitive UX

frameworkuxdesigninterfacetransparencycollaborationfeedback

Interface as the perceptual front-end of a reasoning system. Transparency, feedback, structure.

Cognitive UX

What this is

In a thinking system, the interface isn't decoration. It's the first layer of cognition. Input, layout, affordance — they decide what the system perceives, how it interprets, how the user understands what's going on.

This is the pattern set for aligning UX with cognitive architecture.

The interface is part of the intelligence

Perception interface

The interface converts human expression into structured intent. Granularity here directly affects reasoning quality downstream.

Good ones:

  • Allow natural input, but guide structure.
  • Visualise state and reasoning so users can read them.
  • Provide feedback signals — for both user and model.

Reflection interface

Output isn't a final answer. It's an opinion under review. The interface should expose uncertainty, confidence, reasoning chain.

Consumption becomes verification.

Principles

1. Transparency over mystery

Users see how the system got there.

  • Show sources, tool calls, reasoning summaries.
  • Collapsible "Why" panels.
  • Confidence and provenance.

2. Conversational continuity

Each interaction is part of an ongoing thread.

  • Visible history and summary ("Here's what we know.")
  • Surface relevant past decisions.
  • Let users revise context ("Forget this," "Use this version.")

3. Contextual feedback loops

User corrections are learning signals.

  • Inline Approve / Reject / Revise.
  • Lightweight rating tied to specific steps.
  • Feedback updates memory or training data directly.

4. Structured naturalism

Natural language input, structured underneath.

  • Templates with variables ("Summarise [project] for [audience].")
  • Detected entities auto-convert to schema.
  • Progressive disclosure teaches users how to express intent.

5. Visible system state

Show the cognitive state:

  • Reasoning timeline
  • Active goals or sub-tasks
  • Tool invocation status
  • Sources in context

An opaque AI becomes an observable partner.

6. Latency as meaning

Delay is a channel, not just a performance issue.

  • Micro-animations or "thinking" text imply process.
  • During multi-step reasoning, show progress ("Gathering → Analysing → Synthesising.")
  • No silence. Narrate.

7. User as co-reasoner

Frame the human as a peer.

  • Ask clarifying questions.
  • Offer hypothesis choices ("A or B?")
  • Attribute decisions ("Inferred X because Y.")

Interface patterns

| Pattern | Description | Cognitive Effect | | ---------------------------------- | ----------------------------------------------------------------------------------------------- | ------------------------------------------------------- | | Chat Stream with Context Cards | Inline responses with source snippets, graphs, images | Keeps context visible, helps verification | | Command Palette | Unified search/action bar for natural and structured queries | Reduces friction between intent and action | | Adaptive Panels | UI that appears as the system infers relevance | Creates a dynamic perception field | | Reasoning Timeline | Visual trace of decisions, live | Builds trust and a mental model | | Memory Inspector | View of what the system "knows" | Enables correction | | Feedback Scaffold | Inline approval or correction UI | Turns feedback into reinforcement data |

UX to stack

| UX Element | Underlying Layer | Purpose | | -------------------------------- | ------------------- | ------------------------------------------------ | | Input Field / Chat | Perception | Captures intent | | Reasoning Display | Cognition | Exposes intermediate thought | | Source Citations / Context Cards | Knowledge | Grounds answers in retrieved evidence | | Tool Buttons / Action Controls | Action | Invokes functions through human-guided calls | | Feedback Widgets | Reflection | Provides evaluative signals | | Session Summary / Memory View | Memory | Continuity and editable context |

Design and architecture meet here. The interface is a window into system state.

Affordances

| Affordance | Description | Benefit | | ------------------------- | ----------------------------------------------------------------------------- | --------------------------- | | Intent Shaping | Autocomplete that nudges toward structured intent | Reduces ambiguity | | Context Pinning | "Pin" key facts for the system to remember in-session | Manual grounding | | Explainability Toggle | User picks depth of reasoning detail | Adjustable transparency | | Confidence Spectrum | Color or type cues for certainty | Better calibration | | Human Override | Button or command to interrupt reasoning | Prevents runaway automation |

Metrics

| Metric | Measures | Method | | ----------------------- | ------------------------------------------------------ | --------------------- | | Interaction Latency | Time from user action to cognitive response | Analytics | | Correction Rate | User interventions per task | Feedback logs | | Comprehension Score | User-reported clarity of reasoning | Surveys / A/B | | Trust Index | Likelihood user accepts suggestion | Behavioural metrics | | Learning Efficiency | Reduction in steps for similar future tasks | Longitudinal analysis |

Cognitive UX done well doesn't just make the product usable. It improves the quality of input and feedback, which makes the system itself more intelligent.

Process changes

Design teams need new habits:

  1. Prototype with live reasoning traces, not static copy.
  2. Test for understanding, not just usability.
  3. Measure comprehension and calibration, not engagement.
  4. Design for iteration. Interfaces evolve with the models behind them.

Designers, system architects, and AI researchers work together.

Why this matters

Cognitive UX is the human interface to machine reasoning. It shapes what the system sees, how it explains itself, and whether anyone trusts it. Done well, it turns the black box into a dialogue.