cesnimda
53 lines
4.9 KiB
Markdown
53 lines
4.9 KiB
Markdown
# USER_JOURNEYS.md
|
|
Five journeys validated against the IA. Format: step → what they see → design element that makes it succeed.
|
|
|
|
---
|
|
|
|
## J1 · Recruiter Silje — LinkedIn → CV in ATS (target: < 60 s)
|
|
1. Clicks site link on LinkedIn (mobile). → Hero: "Connor Babbington — Systems Developer · .NET / React / Docker · Tønsberg, Norway · Open to work." Portrait matches LinkedIn photo. *(Identity confirmed in ~3 s.)*
|
|
2. Thumb-scrolls once. → Proof strip chips: 8+ yrs · UK public sector · work permit ✓ · EN native/NO B1. *(All screening objections cleared without reading prose.)*
|
|
3. Scrolls skills matrix. → Keyword match against job spec: C#, .NET, SQL, React, Docker, CI/CD. *(Chips, not bars — parseable at a glance.)*
|
|
4. Taps persistent **Download CV** in header. → Gets `Connor-Babbington-CV-EN.pdf` (locale-matched). *(Split-button defaults correctly; no hunting.)*
|
|
5. Done — candidate shortlisted. **Exit quality: converted without ever leaving the fast lane.**
|
|
|
|
## J2 · Eng manager Martin — shortlist e-mail → interview recommendation (target: ≤ 7 min)
|
|
1. Opens link on desktop, dark IDE habits → site respects `prefers-color-scheme`, loads instantly. *(First silent evidence.)*
|
|
2. Skims hero, ignores chips, clicks **Projects** in nav. → Two case-study cards with real screenshots + stack chips. Picks InboxIntel (Gmail/OAuth catches his eye).
|
|
3. Case study: reads TL;DR box, jumps via mini-TOC to **Architecture**. → Clean-architecture diagram: React SPA → ASP.NET API → PostgreSQL, background sync worker, Gmail API, token encryption. *(Diagram before prose — his reading order.)*
|
|
4. Reads **Decisions & trade-offs** ("why a hosted worker instead of a queue", "why advisory-only AI"). → Judgement demonstrated, not claimed.
|
|
5. Reads **Security & production notes** (encrypted refresh tokens, confirmed-flag destructive ops, integration tests asserting authz). → *This* is the interview trigger for a production-minded manager.
|
|
6. Opens dev tools out of habit → semantic HTML, no framework soup, fast. Checks the footer "how this site works" link, smirks approvingly.
|
|
7. Replies to recruiter: "Yes, bring him in — ask about the sync worker." **Exit quality: P4 (interviewer prep) journey pre-seeded.**
|
|
|
|
## J3 · CTO Anne (Norwegian) — application → forwarded to colleague (target: ≤ 5 min)
|
|
1. Opens link from application e-mail. Browser prefers `nb-NO` → dismissible hint: "Denne siden finnes på norsk →". Clicks it. → `/no` with natively-written Bokmål. *(Effort signal received before any content.)*
|
|
2. Hero: "Systemutvikler · åtte års erfaring fra britisk offentlig sektor · bosatt i Tønsberg." *(Public-sector frame + local residence = risk questions answered.)*
|
|
3. Reads **Erfaring**: Warwickshire County Council role described in kommune-relatable terms (saksbehandlingssystemer, rapportering, drift).
|
|
4. Reads **Om meg**: photo, plain-spoken 3 paragraphs, "norsk B1, i aktiv utvikling", interests. *(Understated tone; janteloven-compatible.)*
|
|
5. Copies URL of `/no/prosjekter/jobtrack` into e-mail to her senior dev. *(Per-language, per-page URLs make forwarding work.)*
|
|
**Exit quality: converted in Norwegian end-to-end; never saw English.**
|
|
|
|
## J4 · Engineer Priya — interview prep deep-read (target: 10+ min, accuracy critical)
|
|
1. Arrives directly on `/projects/jobtrack` (link from Martin). Reads whole case study top-to-bottom.
|
|
2. Mini-TOC lets her jump back to Architecture while reading Decisions. Screenshots are annotated so she can reference specific UI ("the Gmail import view").
|
|
3. **What I'd improve next** gives her interview questions the candidate is *prepared for*.
|
|
**Design requirement surfaced: every claim in case studies must be true and demoable.**
|
|
|
|
## J5 · Return visitor / language edge cases
|
|
- **Language switch mid-page:** Anne's colleague (English-speaking) receives the `/no/...` link → header `EN` switch → lands on `/projects/jobtrack`, same scroll context (same page mapping, position preserved where feasible).
|
|
- **Theme:** system default on first visit; manual toggle persists; no flash of wrong theme on load (Phase 2 must solve this; Phase 1 flags it as a perceived-quality requirement).
|
|
- **404:** mistyped shared link → bilingual 404 with links to both homepages and projects index. Never a dead end for a recruiter.
|
|
- **Slow connection (mobile, train to Oslo):** text renders first; screenshots lazy-load below fold with fixed aspect-ratio placeholders (no layout shift — see MOTION_GUIDELINES loading states).
|
|
|
|
---
|
|
|
|
## Journey-derived requirements checklist
|
|
- [x] Locale-matched CV default with one-tap access anywhere (J1)
|
|
- [x] Architecture diagram ≤ 2 clicks from entry (J2)
|
|
- [x] Security/testing content in every case study (J2)
|
|
- [x] Native Bokmål, public-sector framing (J3)
|
|
- [x] Stable per-language deep links; switch maps page↔page (J3, J5)
|
|
- [x] Honest, demoable case-study claims (J4)
|
|
- [x] No auto-redirect on language; hint pattern only (J3, J5)
|
|
- [x] Zero layout shift on image load (J5)
|