Case study · Product design

Between the Lines

A journal that reflects your own patterns back to you.
In your own words, and never as a diagnosis.

RoleProduct & UX Designer
ScopeDesign, build and ship, solo
ContextStarted at AI Product Masterclass · Nueve Design
Year2026
BuildReact · TypeScript · Supabase · OAuth 2.1 · MCP
AccessibilityKeyboard and screen reader throughout
An evening with the journal open: the week's entries on the left, the Insights card reading between them. The running build, composited into a photo.
An evening with the journal open: the week's entries on the left, the Insights card reading between them. The running build, composited into a photo.
At a glance
Problem
Journaling tools sit at two extremes: a blank page or a mood emoji. More and more people take their inner life to a general chatbot instead. In a 2025 US survey, ~49% of people with an ongoing mental-health condition used one for support. The tool they confide in only agrees with them.
My role
Product & UX Designer, solo design and build. The journal started in the AI Product Masterclass (Nueve Design, 2026, a five-week intensive) and kept going after it ended. I designed it and took it to production. Writing separated from rating. Mood as a two-axis grid reachable by keyboard. Dictation rebuilt around Whisper. A Companion grounded in the journal. Past the course, it became a real product: accounts on a Postgres database, semantic search over entries, an OAuth 2.1 authorisation server, and an MCP server that lets an AI assistant read and write the journal with the owner’s consent.
Value
  • Shipped live: a working product you can open and try, not a clickable mockup
  • Write first, rate later: writing and judging are separate steps on one distraction-free screen
  • Keyboard and screen reader throughout: including the two-axis mood grid, which answers to arrow keys and reads its position back in words
  • Consent is the boundary: the deeper AI reflection is opt-in per entry, and an assistant reaches the journal only through OAuth the owner grants and can revoke
Try it
Try it live
Stack
ViteReactTypeScriptTailwindshadcn/uiTiptapSupabase PostgrespgvectorOAuth 2.1MCPStripeVercel functionsxAI GrokGroq Whisper
Solo course project · working demo · no real users yet
01 · Origin

A course exercise became a product with a point of view

It started as a course project. A mentor suggested it as a way to learn a heavier, more technical toolchain. From the first sketch I steered it toward something I believed in. I added the features it actually needed, not the ones the exercise asked for. It could have stayed a throwaway. It grew into a working tool for self-knowledge.

02 · The problem

People are already treating a chatbot as a therapist that only agrees with them

Therapy is seen as expensive, or hard to trust. So people improvise. More and more of them bring their mental health to a general-purpose chatbot. It knows nothing about their week. The risk is quiet. These tools affirm rather than ground or challenge. They can state things with a confidence they have not earned.

The quiet risk, sketched: a chat that nods along, states things confidently, and knows nothing about the person's week.
The quiet risk, sketched: a chat that nods along, states things confidently, and knows nothing about the person's week.
US survey of people with an ongoing mental health condition. Sentio University, 2025.
~49%
use a general-purpose language model for mental-health support
03 · The landscape

Most journaling apps are either an empty text box or a mood-emoji tracker

The tools made for reflection sit at two extremes. The blank page gives you nowhere to start. The mood tracker shrinks a whole day to one tapped face. It never says anything back. Neither closes the loop between writing and understanding. That loop is the only reason to keep a journal.

04 · Context

In a country that funds mental health heavily, it is still the costliest condition

Norway spends more on mental health than almost any country. It is still the single costliest condition there, close to three percent of GDP. Care exists. Access is uneven. The everyday layer, the one with low stakes, is thin. There is room before and beside professional care for something cheap and private. Something that helps a person notice their own patterns.

Public Norwegian sources. Illustrative, 2026.
~3%
of GDP: mental disorders, the single costliest condition in Norway
~20%
of new depression diagnoses referred to specialised care
05 · Diagnosis

The first build made the same mistake it set out to fix

The first version worked. It had never really been designed. Writing, mood rating and tagging were crammed onto one screen. No focus. No payoff for the effort. It was the exact shape of the problem, staring back at me.

v1 from the first build, audited finding by finding: writing, rating and tagging crammed onto one screen, with demo text.
v1 from the first build, audited finding by finding: writing, rating and tagging crammed onto one screen, with demo text.
06 · Guiding policy

One rule held the scope: an adjunct, never a replacement

Every decision ran through one commitment. Complement care and self-knowledge. Never impersonate a therapist. Each reflection carries the same line: patterns in your own words, not a diagnosis.

The evidence base was the partner

The design does not invent its own claims. It defers to validated psychology and cites it.

  • Russell’s circumplex model of affect, for mood.
  • Pennebaker’s expressive-writing research, for the language reflection.
  • CBT vocabulary, for the prompts.
  • Low-validity personality quizzes refused, such as MBTI and the Enneagram.
The evidence base as the design partner: borrowed psychology, one refused shortcut, and the line that runs under everything.
The evidence base as the design partner: borrowed psychology, one refused shortcut, and the line that runs under everything.
07 · The build

A focused two-step flow: write first, rate later

Writing and judging are different mental modes. So they were separated. Step one is a distraction-free editor and nothing else. Step two comes only after the writing. It asks for mood and themes. One home, one task. The navigation and the clutter came out. Nothing floats over the writing surface.

The two-step entry in motion: write first, then the reflect step appears.
The two-step entry in motion: write first, then the reflect step appears.
The Journal home: the entry timeline with the insight card and a single New entry action.
The Journal home: the entry timeline with the insight card and a single New entry action.
08 · Component

Mood became two axes, because calm and exhausted are not the same low

A single sad-to-happy scale hides half of how a day feels. Calm and exhausted both score low. They are not the same day. The emoji gave way to an Affect Grid: a square where one axis is mood and the other is energy, drawn from Russell’s circumplex. One placed dot captures both at once. Pleasant or heavy. Wired or worn out.

The reflect step: the Affect Grid places one dot and reads it back as mood and energy.
The reflect step: the Affect Grid places one dot and reads it back as mood and energy.
09 · Iteration

Dictation worked in Chrome and nowhere else, so it was rebuilt

Voice input was added to lower the barrier to writing. The first version sat on the browser’s built-in speech API. It failed silently outside Chrome. It was torn out. The rebuild records audio and transcribes it server-side with Whisper. That works everywhere, including mobile. A small, honest loop: build, test, adapt, with a concrete cause.

10 · The payoff

It reads between the lines only when asked

The reward for journaling is the Between the Lines card. By default it shows a plain-language conclusion computed on the device. This week against last, next to a swipeable mood-and-energy trend. No model is called to produce it.

The deeper AI reflection is one deliberate tap away, and opt-in every time. By default no entry is sent off for reflection. What every entry does get is a search embedding, so it can be found later by meaning.

The entries live in the writer’s own account. The line this product defends is consent, not secrecy. Nothing is read for reflection that was not explicitly offered up. That is what personvern and GDPR actually ask for.

A reflection in detail: the on-device conclusion with the honest privacy note underneath.
A reflection in detail: the on-device conclusion with the honest privacy note underneath.
The Insights card from the running build. The circled Saturday is the reason mood became two axes.
The Insights card from the running build. The circled Saturday is the reason mood became two axes.
11 · The Companion

The Companion answers the chatbot problem instead of ignoring it

A journal that reads between the lines invites an obvious next wish: someone to talk to about it. The product does not pretend that wish away. It ships a conversation built the other way round from the generic chatbot. The Companion opens from the page. It quotes what the week actually says. It hands a question back before it answers one. When the language crosses a crisis threshold, it drops the conversation and shows Norway’s real help lines, right in the thread. The same rule as everywhere else: an adjunct, never a therapist. Only now it can hold a conversation without breaking it.

The Companion in the running build: a grounded opening, a question handed back, and the crisis guardrail with Norway's real help lines.
The Companion in the running build: a grounded opening, a question handed back, and the crisis guardrail with Norway's real help lines.

The reply to a chatbot that always agrees is not silence. It is a companion that asks back.

12 · Delivery

From a course project to a product with accounts, payments and an API

The point of the technical layer is a design that ships, not just a mockup. The course version ran on React and TypeScript, a Tiptap editor and Vercel serverless functions. Whisper did the dictation. Grok models wrote the reflections and the Companion’s replies.

What it became after the course is the part worth reading. Entries moved into a Postgres database behind real accounts. Search became hybrid: meaning through pgvector embeddings, wording through trigrams. So “that argument in July” finds the entry that never used the word. Subscriptions run on Stripe with idempotent webhooks.

Then the journal grew an OAuth 2.1 authorisation server and an MCP server. An AI assistant can read and write it on the owner’s behalf. Dynamic client registration. PKCE. Refresh tokens that rotate. A reused token invalidates its whole chain.

AI was the accelerator throughout. The judgement was mine. What to build. When it was genuinely done. Which shortcut to refuse. Every decision in that repository is one I can defend.

Four screens from the running build: the journal home, the two-step entry, the Affect Grid, and the Insights card.
Four screens from the running build: the journal home, the two-step entry, the Affect Grid, and the Insights card.
Between the Lines in the hand: the journal home with the week's trend, in a lifestyle photo.
Between the Lines in the hand: the journal home with the week's trend, in a lifestyle photo.

Not a mockup to imagine, a product to open.

13 · Accessibility

The component that defines this product is the one most likely to lock someone out

A square you drag a dot into is a pointer-only idea. And the two-axis grid is the heart of the product. It ships as a slider. Focusable. Driven by the arrow keys. It announces its position in words, “pleasant, low energy”, not as coordinates nobody can picture.

The Companion had the quieter version of the same bug. Its typing indicator carried an aria-label on a plain div. A plain div announces nothing. For a screen reader the wait was simply silence. It became a live region instead. Motion follows the system’s reduced-motion setting throughout.

An automated scan catches the contrast. It does not catch a grid that only answers to a mouse.

14 · Lessons

What the project taught, and where it goes next

Building it, rather than only drawing it, made every trade-off concrete.

  • Subtraction did more than addition. The navigation, the clutter and the crude single mood axis all came out.
  • Constraints from the evidence base sharpened the work. They did not narrow it.
  • The most honest feature is also the most trustworthy. On demand, clearly labelled, never pretending to diagnose.
  • With no real users yet, every choice is still a hypothesis. Real journalers are the next test.

The product will keep developing: real journalers first, then deeper analysis of language over time.

15 · Sources

The public material behind the framing

Cited as references, not claimed as fieldwork. US usage data and Norwegian market context are kept separate. Re-verify the figures against the primary texts before any public use.

  • Sentio University (2025). Survey of people with an ongoing mental health condition; about half use language models for mental-health support.
  • Healthline; Toronto Metropolitan University; Psychiatric Times (2025 to 2026). Expert warnings that chatbots affirm rather than challenge, can state false information confidently, and are an adjunct, not a replacement.
  • Norwegian GP-DEP Study; NCDNOR. Depression treatment and referral patterns in Norwegian general practice, and uneven access to specialised care.
  • ScienceDirect welfare-state review (2024). Mental disorders as the costliest condition in Norway, close to three percent of GDP.