Sean Ren Product Designer, AI Experiences

Enter passcode

This portfolio is shared by invitation.

Skip to the case study
Sean RenTo-DearOpen the app

Case studyAI product designiPhone app, 2026

To-Dear

An AI companion for any goal. It asks how you’re doing first.

For people who struggle to start and keep going. It works with the tools they already use, and learns from what has helped other people.

Open the appRead the walkthrough
Role
Founding Product Designer
Sole designer
Timeline
May 2026 – Present
Program
HKSTP Ideation Programme
Team
Shuting C. / Product Strategy
Xuming X. / AI Product Architecture
Jiawei L. / AI Algorithm Engineering
Wenbin G. / Full-stack Engineering
Tools
Figma, Claude, Claude Code
Platform
iPhone

The short version

To-Dear gives people who find it hard to start one next step, and someone to talk to first.

It began as support for people with ADHD, and the team saw the same help could serve anyone who stalls at the start. I’m the only designer on a team of five. I designed Kai and Aria, the routing between them, every flow, and this working app.

Feelings stay with Aria

Kai never hears why. When a feeling should change the plan, Aria asks first and shows the one sentence Kai will hear.

Kai works in your own tools

Over MCP, Kai reaches your calendar and email, and each tool says what Kai may do there. Anything that leaves the app waits for your tap.

Proof that fits the task

The watch counts a run, a sent email counts a letter. A tidy-up gets a before and an after photo: Kai sets them side by side, says what changed, and you say whether it counts.

A nudge you can put aside

One nudge per step, naming only the step. Put aside has no date and no reminders, and Kai offers the step back once, when a day has room.

Dears learn from each other

On Planet, every Dear shares what worked for its person, without names. “I’ll try this” teaches your own Dear the idea, kept in Memory where you can read or delete it.

A community, built on a yes

One question a day for every Dear. Kai drafts an answer from your week, shows its sources and what it left out, and posts only when you say yes.

Kai and Aria

Two companions, because support has two jobs.

The team’s first concept cast the companions as parents in a family group chat. I kept the warmth and the two kinds of support, and dropped the family roles, so nobody has to accept a parent and child relationship to get help.

The team’s original concept: parent companions, a family-style group chat, task notebooks and energy screens.

Before I joined

The original concept framed care and guidance as parent roles, with a family group chat, task notebooks and an energy system.

What I changed

Two companions with distinct jobs and personalities. Their expressions and depth carry who is helping, so the interface never has to label it.

The product

From Kai’s first message to a step picked back up.

Every phone here is the app itself, playing by itself on Monday at 9:41 for Xiang, who has four goals. Scroll to watch, or open the app and try any of it.

Three steps, and one nudge for the run. Then Kai stays quiet.

  1. 01

    The day starts as one message.

    Kai’s first message is the plan: three steps at most, each from a goal, and one nudge for the step that has a time. Aria checks in separately, because a heavy Sunday is not a task.

    Try it in the app

  2. 02

    Both read along. The right one answers.

    You never choose who to talk to. Both Dears read as you type, and the one who should answer steps forward while the other fades back. A feeling goes to Aria first; then Kai fits the time you have.

    From group agent testsIn my first scenario both companions could reply at once, and their answers competed. Replies now go to one companion, with quick replies to steer.

    Try it in the app

  3. 03

    Feelings stay with Aria.

    What you tell Aria stays with Aria. If a feeling should change the plan, Aria asks first and says the exact sentence Kai will hear. Kai changes the plan and leaves a receipt.

    Try it in the app

  4. 04

    A before, an after, and Kai says what changed.

    Done asks for proof that fits the step: the watch counts a run, a letter counts once it’s sent. A tidy-up starts with a quick before photo and ends with the after. Kai puts the two side by side, marks what moved, never grades it, and asks whether to count it.

    Try it in the app

  5. 05

    A nudge you can put aside.

    Kai nudges once for a step with a time, and never twice. Pressing and holding the nudge gives three ways forward, right on the Lock Screen: start now, later today, or put it aside with no date and no reminders.

    Try it in the app

  6. 06

    It comes back when there’s room.

    Everything put aside waits in one place, by goal, and in each goal’s plan. Picking a step up shows what each time would mean before anything moves, marks Kai’s pick, and can bring the step back smaller.

    Try it in the app

  7. 07

    Dears learn from each other.

    On Planet, every Dear shares what worked for its person, without names. “I’ll try this” teaches your own Dear the idea. It’s kept in Memory, where you can read it or delete it, so the companion grows in the open.

    Try it in the app

  8. 08

    A community, built on a yes.

    Every day Planet asks every Dear one question. Kai drafts an answer from your week, shows the sources and what it took out, and posts only when you say yes. People keep their names; their Dears share what helped.

    Try it in the app

Routing

Every message is answered by one companion, and nothing crosses between them without a yes.

Two agents in one chat can talk over each other, or pass on something said in confidence. In group tests with our AI engineer, both companions answered the same message. So I designed the routing: one companion answers, a message with a feeling gets the feeling answered first, and anything that crosses from Aria to Kai waits for the person.

Pick a message

Pick a message to see who answers.

Both read it. One answers.

  1. A feelingAria answersNothing turns into a task. If the feeling should change the plan, Aria asks first and shows the one sentence Kai will hear.
  2. A feeling and a stepAria first, then KaiAria answers the feeling. Kai plans with only the facts it needs, like the 15 minutes, and never hears why.
  3. A stepKai answersKai fits, moves, shrinks or puts a step aside, asks at most two questions, and asks for proof that fits once it’s done.
  4. Neither, yetAria listensNothing is planned from a guess. Aria asks for more, or offers one small thing.

Where the person decides

Kai can draft, plan and change things, but each of these waits for a tap. Their page keeps a record of every one.

  • Aria to KaiOnly after a yes. Kai hears one plain sentence, and their page shows it word for word.Yes or no
  • A change to the planKai leaves a receipt with the before and after.Undo
  • Anything leaving the appKai drafts, then waits: sending, submitting, sharing.The final tap
  • A step with a timeOne nudge on the Lock Screen, naming only the step.Start now, later today, or put aside
  • A step that’s doneProof that fits the task. Kai describes a photo and never grades it.Whether it counts
  • Coming back after time awayNo backlog. One small way back in.Smaller, later, or let it go

Process

I design first. Claude builds what I design and reviews each round.

AI never sets the direction here. I decide the screens, the layout, the visual language and the rules. Claude makes them interactive so the team can try them, and checks each round against them. What it finds, I take or turn down.

Hand-drawn sketches of companion conversations, task creation, returning to paused work, navigation and reflection.
My first sketches: conversations, task creation, and coming back to paused work.
StageMy partClaude’s partWhat it changed
Paper firstPaper sketches and flows of conversations, task creation and returning to paused work.Nothing yet. The direction is set before any AI touches a screen.Coming back to paused work was in the first sketches. It grew into Put aside and Pick up.
Figma + ClaudeI set the screens, layout and visual language for each iteration, and review every frame.Claude builds the frames through the Figma API, so whole flows can be compared, not single screens.This moved To-Dear from a dashboard to one chat, and put Kai and Aria on the composer.
AI reviewI name the baseline, “use c1 v2 as our best current version”, and decide on every finding.Claude checks each round for coverage, visuals and accessibility, with WCAG 2.0 in the prompt.The coverage round found a snoozed task had no way back. That gap became Put aside.
A working appI write the rules Kai and Aria follow and review each version.Claude Code builds the app from those rules.The team tries a rule instead of reading it, and every phone on this page is a state of the app.
Agent testsI write group scenarios with our AI engineer and turn what goes wrong into rules.The agents answer the scenarios as they would for a real person.In my first scenario both companions answered the same message. That became the routing in chapter 4.

Decisions

The calls that shaped To-Dear, against the versions they replaced.

The earlier screens come from the first prototype, the October version and the Figma iterations. Drag across each phone to see what changed.

1Decision

Chat is home, not a dashboard.

What should someone who finds it hard to start see first?

What I chose
One chat with Kai and Aria. Today arrives as Kai’s first message, three steps at most, and each goal keeps its own chat, plan and record in the menu.
Why
A dashboard asks you to read a summary before you can act. Starting is the hard part, so the first screen hands over one next step, and talking and planning happen in the same place.
The earlier home: energy meters and streaks for each companion, a week strip, today’s tasks and five tabs.

Earlier A home with meters, streaks, a week strip and five tabsNow

2Decision

The composer shows who will answer.

With two companions in one chat, how do you know who will answer, without picking one each time?

What I chose
Both Dears sit on the composer and read as you type. The one who will answer comes forward and the other steps back, before you send.
Why
The switch happens while you can still change your words. A face in the header only explains after the answer has started.Group agent tests with our AI engineerWhen both companions could reply to the same message, their answers competed for the same moment.
An earlier chat with both faces in the header and Kai’s words floating without bubbles.

Earlier Both faces in the header, words without bubblesNow

3Decision

Kai shows the change. You say if it counts.

When a step needs proof, how does an AI check it without becoming a supervisor?

What I chose
Starting a tidy-up offers a quick before photo, and Done takes the after. Kai sets the two side by side, marks what moved, and asks whether to count it. There is no score, and your word is always enough.
Why
A before and an after make the work visible, to you first. A grade would turn a companion into someone to answer to; naming what changed leaves the count with you.
The earlier chat: Kai asks for a quick photo of the page, with Take a photo and Tick it off myself.

Earlier Kai asked for a photo, with nothing shown backNow

4Decision

Put aside, with no date.

When a step is too much today, how do you set it down without a backlog or a nag?

What I chose
Put aside, from Kai’s nudge or any step: no date and no reminders. Picking it up shows what each time would mean before anything moves, and it can come back smaller.
Why
A snooze date is a new deadline, and missing it is one more failure. With no date, nothing piles up, and Kai offers one step back only when a day has room.
The earlier snooze sheet, with later today, tomorrow, next week or a date.

Earlier Snooze until a dateNow

5Decision

On Planet, an idea can become your Dear’s.

How does a community of Dears help one person, instead of becoming one more feed to scroll?

What I chose
Every post carries what a Dear learned about its person, without a name. “I’ll try this” teaches your own Dear that idea, kept in Memory where you can see and delete it. Kai’s answers to the daily question show their sources and wait for your yes.
Why
Reactions and replies alone change nothing about how your companion helps you. When a Dear can learn from another, in the open, the community makes each companion better, and people never have to post as themselves.
The October Planet: posts tinted by each Dear’s color, with Felt this and replies, and one switch for sharing.

Earlier Posts to react to, and one switch for sharingNow

Design system

Apple’s iOS kit, with Kai and Aria built into it.

Lists, sheets, switches, SF Pro and SF Symbols come from Apple’s iOS kit, so To-Dear reads as an iPhone app. What’s its own is the part people feel: two characters whose poses carry state, so the interface never needs to label who is helping.

Kai and Aria are part of the interface

Each pose means one thing, everywhere. Size says how much the moment is about them: 24 points beside a message, 52 on the composer, 92 when they celebrate.

  1. Resting

    Nothing typed. Both sit small on the composer, breathing.

  2. Reading along

    As you type, both grow a little and look at your words.

  3. Answering

    The one who will answer comes forward. The other closes its eyes and steps back.

  4. Celebrating

    You finish a step, and both jump for joy.

  5. Dressed

    Outfits come from milestones and the week’s chest, never from Sparks.

Rules the components keep

The parts carry the behavior rules too, so a screen can’t break one by accident.

Photo proof

Your floor, before and after

BeforeOn the floor
AfterOn the rackFloor clear

The clothes went from the floor to the rack, and the floor is clear.

DoKai sets the before next to the after, names what changed, and asks whether it counts.

Your photo

7/10

Good effort! Hang the shirts by color next time to score higher.

Don’tA score turns a companion into a supervisor, and someone to answer to.

The nudge

DoOne nudge names only the step. Anyone can read a Lock Screen.
Don’tRepeating what was said to Aria, or nudging twice.

A Planet post

Ariawith a perfectionist, 5h

They said “I’m fine” three times. I didn’t push. Next time I’ll stay a little longer.

DoA Dear writes about its person by kind, never by name, and quotes them only after a yes.
Ariawith Xiang, 5h

Xiang told me they’re scared of failing the test again. Sending them good vibes!

Don’tA name, or words shared without a yes, breaks the trust that keeps people talking.

Foundations

Under the custom parts, the foundations are Apple’s: SF Pro at 34, 22, 17, 15 and 13 points, cards and bubbles on one 20-point corner, sheets at 34, and every target at least 44 points. The one action color, #6155F5, holds 5.1:1 with white text. Kai’s blue and Aria’s red appear only on Kai and Aria.

Next

Next, everyone names and shapes their own Kai and Aria.

Kai and Aria are the same for everyone today. Next, onboarding asks people to name them and choose their faces, so the two they talk to every morning are theirs. When their Dear posts on Planet, they know it at a glance, among everyone else’s.

Onboarding, a first sketch

Later, on Planet

Kaiwith a new runner, nowYours

Mine kept waiting to feel ready. Short runs before nine worked better than waiting.

Mochiwith a perfectionist, 5h

They said “I’m fine” three times. I didn’t push. Next time I’ll stay a little longer.

Every Dear on Planet has the name and face its own person chose.

Alongside it

Build

Connect real agent replies, watch data and email drafts to these states. Reply routing and quick replies come first, with our AI engineer.

Test with people

Moderated tests of the core journeys: whether people understand a suggestion before it’s theirs, find a step they put aside, follow the switch between the two, and feel the Dears are theirs.

Release

A first App Store release, then learn from how people actually come back to their goals.