01. Research context
Cognitive distance names a gap completion metrics miss
People send money, book doctors, and renew licenses online every day. Most finish without errors. Many leave unsure whether the payment left, who will call them, or when a document arrives. Usability research measures time on task, completion rate, and errors. None of those answer: did the user understand what just happened?
Cognitive load describes effort and capacity limits. Cognitive distance describes alignment: whether someone can explain, predict, and transfer the system's logic into their own reasoning. A user who completes in three taps but cannot say if money has left was not overloaded. They were not informed.
The Everyday Services Study operationalises that gap. I designed the construct, built the Cognitive Distance Index (CDI), pre registered five hypotheses, and shipped a live international platform at everydayservices.study. The conceptual paper is under peer review. This page documents the engineering behind the instrument.
02. The experiment
Three services, two registers, one isolated variable
The design is deliberately austere. Interface language register is the only variable that moves. Every click, field, and outcome stays identical across arms. If participants diverge on effort or completion time, the manipulation failed.
Between subjects. Each participant sees one register across all three modules. Version A (vA2 today) uses plain language that names who acts next and when. Version B uses institutional copy matching real bank and government services. Module order is balanced across six rotations of banking, medical, and license renewal.
What participants do. They complete three simulated tasks: send a bank transfer, book a specialist appointment, pay and mail a license renewal. After each module they answer prediction questions while the result screen stays visible, write open explanations, and rate ease, effort, understanding, and certainty. Session length is about fifteen minutes.
What the platform measures. CDI scores open explanations against a rubric. Five pre registered hypotheses test whether institutional register raises CDI, widens confidence miscalibration, and shifts which service participants name as most uncertain. Manipulation checks flag arm leakage in real time on the researcher panel.
Version A (vA2)
Plain language. Names the next actor, timeline, and outcome in words a participant can repeat back.
Version B
Institutional register. Same UI chrome and flow. Copy matches the opacity of real public and financial services.
Locales
EN, ES, and PT-BR. Shell and structure identical across arms so translation never becomes a hidden variable.

Banking result, Version A. Plain language names who receives funds and when.

Medical result, Version A. The screen states who will contact the patient and when.
03. Engineering constraint
The manipulation must be airtight
Research validity depends on isolation. If Version A and Version B differ in layout, timing, or affordances, the data is noise. The engineering job is to make language the only moving part while the participant experience still feels like a real service.
The codebase shares one component tree per module. Copy lives in isolated i18n namespaces per lane (bankingA2, bankingB, and equivalents for medical and license). Silent server side assignment balances arms without participant cookies. Events, answers, and open text stream to Supabase for CDI scoring and hypothesis charts.
04. Pilot data
The construct worked. The first copy pass did not.
A friends and family pilot ran on vA1 clear language against vB institutional copy. Cognitive Distance Index separated the arms sharply: roughly 1 on clear language versus roughly 38 on institutional copy in the pilot sample. The manipulation did what the theory predicted.
Task time told a different story. vA1 clear language was slower than vB. For a study grounded in cognitive load theory, that is the wrong direction. Clear copy should not cost more time if the only change is register. The pilot surfaced a copy and interaction problem, not a platform problem.
The engineering response was deliberate iteration, not a rewrite. Archive vA1 strings under lib/i18n/archive/a1/. Add prototype_version on participants. Route /banking/a2 alongside a1 and b. Point new assignments at vA2. Keep vB unchanged as the control arm. Preserve vA1 rows in the panel for comparison.
CDI separation
Pilot ratio near 1:38 between clear and institutional arms. Strong signal that the instrument detects register, not task difficulty alone.
Task time inversion
vA1 slower than vB on module completion. Triggered microcopy pass, static stepper, and removal of dwell animation on vA2.
Versioning in place
Nine interactive routes and nine walkthrough routes from one repo. New participants never see vA1 unless assigned for comparison.

Welcome funnel: locale detection before consent, layered consent summary, no storage until Agree and start.
05. Architecture
Assignment, sync, and scoring in production
Participants never see their arm. A POST to /api/experiment/assign reads live counts from module_runs, picks the underrepresented variant and module order, and writes variant, order, and prototype_version atomically. Events stream to Supabase as the participant moves. Answers and open text feed comprehension scoring on the panel.
Silent balanced assignment
Counts per module and variant drive assignment. No cookies, no client side randomisation. The server is the source of truth for balance.
Supabase schema with migrations
Participants, events, answers, module_runs, pilot_links, prototype_archives. Idempotent SQL migrations. Health route verifies consent columns and DB reachability on deploy.
Trilingual copy namespaces
bankingA2, bankingA1, bankingB (and medical, license) as separate i18n exports. Shell chrome shared. Manipulation copy isolated per lane.
Panel analytics
Passcode session, CDI gauge, H1 to H5 views, manipulation checks, blind scoring queue, CSV export, prototype filter for A1 vs A2.
Multi domain Vercel deploy
everydayservices.study plus panel subdomain and alternate TLDs. Middleware rewrites panel hosts. NEXT_PUBLIC_SITE_URL keeps recruitment links canonical.
Walkthrough mode
Non interactive replays for all nine module and lane pairs. Same components as the live study for IRB walkthroughs without touching assignment state.
06. Data layer
Tables, events, and prototype lineage
The research dataset stores no PII. Participants get a random identifier. Consent timestamps and locale sit on the row. Every screen transition is an event with module, step, and timing metadata. Post task scales and open explanations land in answers with typed question keys so panel charts do not parse free text twice.
prototype_version is the lineage key. Pilot vA1 rows stay queryable. vA2 rows accumulate for open recruitment. Cloud archive snapshots preserve A1 pilot exports without mixing cohorts in live dashboards.
Core tables
- participants: variant, module order, locale, consent, prototype_version
- module_runs: per module timing, completion, assignment balance input
- events: funnel and step telemetry
- answers: scales, predictions, explanations, manipulation checks
- open_scores: blind comprehension coding queue
07. Participant engineering
Mobile first funnel participants trust
Most participants arrive on a phone. The welcome funnel detects locale before consent, shows a layered privacy summary, and writes nothing to storage until Agree and start. The question dock keeps the result screen visible while prediction and explanation questions slide up from the bottom. Primary actions stay fixed outside the scroll area so the sheet never hides the commit button.

Prediction question on mobile. Review screen stays visible while participants answer.
Bottom sheet up to 55vh. Background never reflows when the sheet opens.

Mobile welcome. Calm eConsent language, single elevated session card.
Consent and privacy engineering
Trilingual privacy notice. GDPR and LGPD aligned rights copy. Researcher panel behind httpOnly session cookie. Participants stay anonymous in the dataset.
Question dock pattern
Post task questions overlay the flow without navigation. Preserves context for prediction items. Reduces false completions from users who forgot what they just did.
Manipulation checks
Ease, effort, understanding, and certainty scales after each module. Panel flags arm pairs that diverge on effort, which would invalidate the language only claim.
Walkthrough parity
Walkthrough routes render the same components without POST side effects. Training, IRB review, and QA share one code path with live assignment.

Desktop banking result on vA2. Vertical sub stepper tracks payment lifecycle in plain language.
08. Researcher panel
Analytics that stay honest about inference
The panel is where comprehension becomes a number. CDI aggregates open explanations against a rubric. Hypothesis views chart directional comparisons with thresholds printed inline. Every verdict is descriptive until the manuscript claims otherwise. Export is one click for researchers who want their own models.
The A1 vs A2 filter is the iteration dashboard. It answers whether vA2 fixed task time while holding the CDI gap. That is the question the pilot raised, and the platform was built to answer it without a redeploy.

Post task scales captured after each module. Manipulation checks surface arm leakage before it pollutes CDI.
09. Prototype versioning
vA1, vA2, and vB from one tree
Dynamic segments [version] generate static params for a1, a2, and b. Legacy /banking/a aliases resolve to the active clear language lane (vA2). Flow components accept clearPrototype so researcher previews and participant assignment use the same UI code paths.
Versioning is a data and i18n problem, not a fork. The next copy pass is a namespace diff plus a migration default on assignment. vB stays frozen. vA1 stays archived for comparison. vA2 is what new participants see today.
10. Stack
What runs in production
Next.js 16 App Router, React 19, Tailwind CSS 4, TypeScript throughout. Supabase Postgres with Row Level Security. Vercel deployment with /api/health check. No participant cookies. httpOnly session cookie for researcher access only.
Production stack
- Application: Next.js 16, React 19, TypeScript, Tailwind 4
- Data: Supabase Postgres, typed tables, Row Level Security
- Auth: httpOnly session cookie for panel, anonymous key for participant funnel
- Infra: Vercel, health check, environment scoped secrets
- i18n: per lane namespaces, archived A1 strings, shared shell chrome
Outcome
Instrument live, iteration cheap
The research question needs a platform that isolates language as the only moving variable. Owning the stack means copy can iterate at the speed of insight. vA2 is live. vB is unchanged. vA1 is preserved. The panel reports whether the iteration fixed task time while the CDI gap holds.
This is design engineering in service of evidence: a study participants trust, a dataset reviewers can audit, and a versioning model that treats wording as deployable infrastructure.
Ship the instrument. Let the data argue with your first copy pass. Version in place. Keep the control arm frozen.
Open recruitment on vA2. Manuscript under peer review. Platform extensible to automation and AI mediated flows.
Within this project
More from the Everyday Services Study
Research and design case study
Construct theory, study diagrams, hypotheses, and interface rationale on the design portfolio.
Researcher panel
CDI gauges, hypothesis views, A1 vs A2 cohort filter. Opens in read only demo mode.
Privacy notice
Trilingual participant rights, GDPR and LGPD aligned.
Cognitive distance essay
The conceptual paper behind the construct and experiment.