![**[INFO]** `The Stories app on a phone — an ADHD-first reading and community app`](https://framerusercontent.com/images/i2DdM98MaRgfO5uv27rJqJfthjI.png?width=6400&height=2536)
Designing an ADHD-first library and community
Stories
A research-led study into adult ADHD
diagnosis that grew into stories.
INDUSTRY
Mental Health / Social
ROLE
UX Researcher & Designer
Platform
Mobile App
Toolkit
Figma • Procreate
The product behind an ADHD research project
Background
Most adult ADHD research is clinical. It studies people with ADHD, and rarely captures how they describe living with it. This project started as Master's research in 2022, using interviews, conversations, observation, and secondary research with adults who had been diagnosed.
Research
2022
Interviews
Observations
Stories - Illustrations
Product
2026
Information Architecture
Taxonomy
Community
The first outcome was a set of illustrated stories and comics. In 2026 I came back to the work as a product designer and rebuilt it from the ground up into stories: a reading and community app for adults with ADHD, with a small set of attention tools alongside it.
The Problem
There is a lot of material explaining ADHD as a diagnosis, and much less that shows how adults experience it day to day. The people I spoke to described difficulty sustaining attention, restlessness, sensitivity to noise, switching hobbies, impulsiveness, a weak sense of time, low self-esteem, and constantly switching tasks. These are not checklist symptoms. They are small, repeating moments in someone's life. That pointed to a clear product question: could a digital experience help people recognise ADHD through real experiences, and support them in the moments they actually need help?
A DAY IN FRAGMENTS
8:10
Can't get out
of bed
→
9:30
Opened laptop
Forgot why
→
11:15
Noise feels unbearable
→
13:40
New hobby
idea
→
15:20
Three tasks open
None started
The Opportunity
Four goals shaped the product. Give people a reason to open the app on a bad day, not only a good one. Make the personalised feed genuinely personal rather than a label. Turn readers into contributors instead of leaving the library static. Build safety into the structure itself rather than adding moderation on top. And keep the product defensible as it grows, so new communities arrive by proposal and vote rather than by a product decision.
People open a library to read and tools when struggling. Retention means both must be independently useful.
A Reason to Open It on a Bad Day
The home screen claims personalisation. The structure has to collect the signal that earns the claim, rather than only showing the label.
Make the personalised feed honest
Every captured thought is a possible piece. The path from a loose fragment to a published story is the app's whole supply of content.
Turn Readers Into Contributors
No private channels exist; support is reachable from every screen. Safety was a core architectural constraint from the first sitemap, not an afterthought.
Keep Safety
Structural
My Role
I led this project independently end to end - research, information architecture, taxonomy and the visual design system. That included writing the site map, the labelling system, the content model, and the governance rules that decide how the product is allowed to grow.
Interviewed diagnosed adults and spoke with mental health professionals
Structured the product’s information architecture
Wrote a closed taxonomy and labelling system for a mental health app
Designed how new communities get proposed, reviewed, and voted in
Documented every screen's empty, loading, offline, and failure state
Kept an explicit record of what was evidenced, inferred, or still an assumption
Understanding User Needs
How I Researched
Literature
Interviews
Experts
Online Spaces
Observations
Insights
Interviews
Experts
Experts
Observations
Conducted qualitative research across four channels.
Secondary research included literature, articles, documentaries, ADHD forums, and webinars.
Primary research involved interviews and conversations with adults diagnosed with ADHD.
Observed and reflected on real-life discussions about ADHD, including personal diagnosis.
Recruitment used college wellness team and clinical contacts.
Personal experience is valuable research material needing careful handling.
What The Research Surfaced
There is no single everyday experience that stands in for everyone. People described very different mixes of attention, energy, time, sensory, and emotional experience.
ADHD looks different from person to person
Behaviour that looks ordinary or careless from the outside can feel completely different to the person living it.
Everyday struggles are easily misread
An adult diagnosis can change how someone reads years of past experience, and how much they blame themselves for it.
Self-understanding matters
A story was often more relatable than a clinical explanation, because it showed the experience instead of naming it.
Recognition is powerful
The First Design Decision
What if the stories were the interface? The project moved away from representing ADHD and towards showing experiences of it. Instead of a line like “ADHD can affect attention,” I wanted to show what losing focus actually looks like in someone's day. I began turning real experiences into short illustrated narratives, and that became the foundation for the storytelling system.
Four people, four reasons to open the app
The product is built around user groups, each with a distinct success condition and not a single "ADHD user" persona standing in for everyone.
Recently diagnosed or self-recognised, 18–34. Wants recognition, not instruction, and reads far more than they post. Success: finding three pieces that describe their experience in the first session.
Newly Diagnosed
Knows their ADHD well; opens the app because a task won't start. Wants capture and focus in under ten seconds. Success: beginning one session within 30 seconds of opening the app.
Stuck in the Moment
Writes, draws, records and has drafts scattered everywhere. Success: an interrupted piece survives being put down and gets posted, anonymously if needed.
The Contributor
A sibling, partner, or parent reading to understand someone else. Success: finding first-person accounts without a clinical voice standing between them and the experience.
Supporting Others
Design Goals
Product Principles
Reduce cognitive load
Keep navigation shallow, cut unnecessary choices, and get people to a useful action quickly.
Design for the moment
Someone may open the app with very little attention to spare. It has to work in that state.
Support without judgement
No streaks, productivity scores, guilt reminders, or language that implies failure.
Give control back to the user
Let people control what they share, what they save, how content is presented, and how stimulating the interface feels.
Make safety part of the product
Support, privacy, and content controls are built in, not hidden away as afterthoughts.
UX Strategy
Information Architecture
I designed the structure before the screens, and kept it shallow. The core rule is Tab, then Screen, then Detail, with no more than three levels for the main structure. Global navigation has five tabs: Home, Explore, Add, Circles, and Me. I deliberately did not create a sixth Tools tab. The tools matter, but giving them their own tab would push the community to the side and make the whole product feel like a productivity app.
The Solution
Stories - Two Halves That Never Merge
The whole product is organised around one idea. A library of other people's experience, and a small set of tools for your own attention, meet in one place: Home, as a fork rather than a blend.
9:41
5G ▪ 100%
find your people
Explore
Search stories, themes, authors
Under 3 min
Comics
Poems
Listens
Books
THEMES
ADHD
Anxiety
Autism
Bipolar
Sensory
Comic · 2 min
Why Am I Wired
Differently
@nivedhya
Poem · 2 min
Dear Anxiety,
@mini.writes
Listen · 32 min
Reflection · 4 min
Home
Explore
+
Add
Circles
Me
01
A Five-Form Library
9:41
5G ▪ 100%
stories
3
Good evening, Nivedhya — one small
thing first?
RIGHT NOW
Capture
a thought
Focus
12 min
Work with
someone
4
Your inbox has 4 loose thoughts
Sort them later, or never
›
FOR YOU
Edit interests
cover — wired differently
ADHD · COMIC · UNDER 3 MIN
Why Am I Wired Differently
A gentle, illustrated tour of what ADHD
actually feels like from the inside.
@nivedhya · 5 pages
Home
Explore
+
Add
Circles
Me
9:41
5G ▪ 100%
‹
✦
ADHD Circle
1,240 members
···
TODAY'S GENTLE PROMPT
What helped you focus today —
even a little?
Open for 14 more hours · 2 answers
R
Ravi
· 32 min
Body-doubling on a video call with a
friend. We just say hello and work — no
talking after that.
♡ Feel this · 9
Reply · 3
L
Lena
· 2 h
I set one timer for 12 minutes and
told myself I could stop after. I never
stop after.
♡ Felt · 14
Reply · 1
K
Kai
· 4 h
Loop earplugs in loud places. I can finally
hear my own thoughts in a café.
♡ Feel this · 21
Reply · 5
?
someone
· 6 h · anonymous
03
Circles: Community by Proposal
11:48
5G ▪ 38%
You're not alone
If you're in distress, please reach out. These lines
are free and answered by people.
iCall (India)
9152987821
Call
Vandrevala Foundation
1860 2662 345
Call
Outside India
iasp.info/resources
Open
Not a crisis, just heavy?
Three stories under two minutes, or a five-
minute focus with someone. Both are here.
Close
04
Structural Safety
A Five-Form Library
Poems, reflections, and comics are created in-app; books and podcasts are recommended with links and credits—five formats, one reading experience.
Right Now: attention tools on Home
Capture, focus, and body-doubling sit as a row on Home rather than a sixth tab, because the person reaching for them is already in the moment that needs one. Each one exists for a specific reason.
Capture. Write or speak a thought and save it without deciding what it means yet. These become Loose thoughts, and they are kept small by design: never turned into tasks, projects, deadlines, or priorities. Capture first, organise later, so the first action stays effortless. A loose thought can later become a focus session or a draft to share.
Focus. Sessions of 5, 12, 25, or 50 minutes, with 12 as the default. People can pause, stop early, or mark that they are stuck. A session ends with a plain recap, never a score. No streaks, no percentages, no “you failed.”
Body-doubling. See who else is focusing at the same time, for a sense of shared presence without any conversation. There is no camera, no microphone, and no private messaging. It stays light, and stays about presence rather than performance.
Circles: Community by Proposal
New Circles arrive through a five-question proposal, a moderator review, and a community vote that passes at 250 yes votes. The product team never creates them. Members can read, reply, share, report, and propose a Circle. There is no private messaging anywhere in the app, and no open profile posting, because every new public surface adds a much larger moderation and safety load. The information architecture also defines who owns moderation and how new Circles and themes get reviewed.
Structural Safety
A closed taxonomy instead of free-text tags. Content warnings that blur sensitive material without hiding it from search. Support reachable from every screen. These are decisions in the data model, not moderation added later by volume.
Key Experiences
Four Flows That Carry the Product
I mapped the main journeys before moving into high-fidelity UI, then connected them into a clickable prototype so they could be tried as one continuous experience. The prototype maps these journeys across the full screen set, including alternate states and recovery paths.
01
Reading
Home → Story → Save / Listen / Feel this → Related experience
Design System
A Warm, Legible System for Two Themes and a Difficult Subject
The visual system pairs Fraunces for display type and the “stories” wordmark with Lexend for everything else — a warm editorial voice paired with a highly legible interface face, built across a light “paper” theme and a dark “ink” theme sharing one accent colour.
Accessibility
Accessibility runs through the product rather than sitting on one settings screen. There are reading preferences, using the Lexend reading font and adjustable text. A low-stimulation mode reduces visual intensity. Reduced motion removes motion when the system preference is set. Content warnings blur sensitive topics such as self-harm, food, and weight until the reader chooses to reveal them. Saved content stays available offline
Typography
Fraunces 600 is used for headlines only, never below 15px, and gives stories and section headings a personal voice. Lexend 300 to 600 handles UI, body, and reading text.
Display
Fraunces 600 · 40/46 · −1.2
Heading 1
27/33 · −0.7
Heading 2 · wordmark
22/33 · −0.55
Heading 3 · story title
19/24 · −0.4
Heading 4 · list title
15/20
Reader body — long-form, generous leading
Lexend 400 · 17/33
UI body — cards, descriptions, prose in app
400 · 14/22
UI label — buttons, rows, toggles
500 · 14.5/20
Meta — author, timestamps, helper
400 · 12.5/17
EYEBROW · SECTION LABEL
600 · 11 · +0.08em
Colour
A warm off-white base (#F7F5F2) in light mode and a near-black base (#16141C) in dark mode, both anchored by the same purple accent (#6A4CA3 in light, #A78BE6 in dark). Purple is the main product accent. Sage carries focus, care, and safety. Sand adds warmth to supporting states.
LIGHT THEME · SURFACE & INK
bg/page
#F7F5F2
bg/raised
#FBF9F5
bg/card
#FFFFFF
border/hairline
#EAE6F0
ink/primary
#201C29
ink/body
#5F5A6B
ink/muted
#6F6B80
ink/meta
#918AA2
ink/disabled
#B3ADC0
ACCENTS — ONE PER MEANING, NEVER DECORATIVE
purple/base
#6A4CA3
primary action, self
purple/press
#5A3E93
purple/tint
#ECE6F6
sage/base
#46583E
focus, safety, care
sage/tint
#E4EBDF
sand/base
#6B5C47
others, warning
sand/tint
#F1EAE0
green/success
#2F9E68
DARK THEME
bg/page
#16141C
bg/reader
#1A1622
bg/card
#201D28
border/hairline
#2D2937
ink/primary
#EAE6F0
purple/base
#A78BE6
purple/tint
#2C2440
purple/ink
#C9B8EE
sage/tint
#263026
green/success
#5CC48F
Components
Cards, buttons, controls, navigation, sheets and content modules share a common visual language across the experience.
CHIP · filter & interest
ADHD ✓
Autism
hover
disabled
All
Replies
COMIC
2 min · do now
TOGGLE · SLIDER · CHECKBOX
text size · seek
unchecked
✓
done
radio selected
STORY CARD · hero, compact, dark, skeleton
cover 16:9 — drop art
ADHD · COMIC · UNDER 3 MIN
Why Am I Wired Differently
A gentle, illustrated tour of what ADHD actually feels like.
@nivedhya · 5 pages
Dear Anxiety,
@mini.writes · 2 min · poem
The Monster
3 min · bipolar · poem
✓
BUTTON · variant × state
primary
Continue
pressed
disabled
accent
Pick it up
pressed
focus green
secondary / ghost
Later
tinted
Skip — show me everything
dark
Continue
secondary
done
FIELD · TAB BAR
Search stories, themes, authors
Typing…
Needs a title before it can post
Home
Explore
+
Add
Circles
Me
BANNER · safety, offline, error, support
A moderated space. No private messages — only kind, public words.
Offline — showing what you saved
That did not post — the connection dropped
Your words are safe in Drafts. Nothing was lost.
Having a hard moment? Find support
→
FOCUS RING · AVATAR STACK · SHEET HEAD
7:24
of 12
R
L
K
+3
Quick capture
Do not disturb on
Key Takeaway
Reflection
Designing for ADHD changed how I think about being helpful. My original research taught me that listening can uncover a very different problem from the one you started with. I began by asking how ADHD could be represented. Then I started listening to people describe their lives, and that led to stories.