Skip to content
A parallel-motion drafting machine in hairline isometric, exploded into its jointed arm and scale head, its counterweighted column and a rack of interchangeable pen heads.
02 · Case study2023–2026

Elfie

Founding product team · Head of Design

From solo designer to a design-driven team building health products across 15+ countries.

3M+downloads
1.5Mmonthly active users
15+countries
$3–5Ksaved every month

Source: Elfie, ch. 4

The situation

When I joined Elfie, I was the entire product team. The design system was inconsistent, files were scattered, specifications were incomplete, and product knowledge lived mostly in people’s heads.

01
Create order

Turn product archaeology into shared memory.

Blocked byAn inconsistent design system, scattered files, incomplete specifications, and product knowledge that lived mostly in people's heads.

I captured and mapped the whole application, then separated it into Core systems and health Programs. Each feature received a versioned file structure so its evolution could be understood and handed over.

I rebuilt the most reused elements into components incrementally. Friday afternoons became a deliberate maintenance ritual rather than a risky big-bang migration.

UnlockedOrganized workflows, reusable components, and product knowledge the team could share.

Structure as described in the case; feature names not shown.

Application structure Elfie was mapped and split into.
A soil core sampler: its split sample tube opened along its length, the core lifted out in three cut sections resting on a tray.
02
Close the specification gap

Put the right context where work happens.

Blocked bySpecification logic buried inside engineering and QA, with no layer of its own for the rest of the team to read.

I extracted logic from engineering and QA, then separated specifications into two layers. Design specs lived beside screens in Figma; technical specs captured stories, formulas, data schemas, objectives, and change logs.

For UAT, I recorded staging builds and compared them directly with the intended behavior and visual system.

UnlockedFaster handoff, clearer test cases, and less interpretation between product, design, QA, and engineering.
Design specsTechnical specs
Beside screens, in FigmaStories · Formulas · Data schemas · Objectives · Change logs
The two-layer specification split.
03
Prototype the unknown

Use AI to move learning before engineering.

Blocked byTesting an idea's feasibility or usability meant waiting for engineering to commit to building it first.

I turned early product specs into working Next.js prototypes using AI-assisted development, then tested rough MVPs inside the product team before asking engineering to commit.

The same curiosity led to AI stress analysis, coaching chat and video features shipping in March 2023, before generative AI became a standard product expectation.

UnlockedA product team able to test feasibility and usability without waiting for production development.
Mar 2023AI stress analysis, coaching chat and video shipped
AI stress analysis, coaching chat and video: ship date.
A bench test jig: a rack of interchangeable probe heads above a socketed fixture, one head lifted clear of its socket.
04
Scale the team

Make design-led delivery repeatable.

Blocked byA one-person product function, propped up by several separate third-party services, trying to support a health app growing into new countries.

I helped launch Elfie Console to manage content, segments, campaigns, user data, and AI prompts. It replaced several third-party services and saved approximately $3K–$5K per month.

From one person, the product function grew to include a global PM, product owners, and mobile design, supported by a vertical operating model that gave each owner meaningful depth.

UnlockedA scalable product organization supporting a global health super-app.
Elfie Console: third-party cost replaced, per month.
Boards

Product archaeology, drawn.

Ten working boards from 2023 and 2024: four from the app, six from Elfie Console. They are what “captured and mapped the whole application” looks like when it is finished: every screen, every branch, and the states nobody demos.

  • The full onboarding, titled and dated on the board itself. The five stacked lanes down the left are the same journey entered five different ways, and the difference between a flow and a map is that a map has to hold all five.

    Onboarding · Oct 2023

    The full onboarding, titled and dated on the board itself. The five stacked lanes down the left are the same journey entered five different ways, and the difference between a flow and a map is that a map has to hold all five.

    The full onboarding, titled and dated on the board itself. The five stacked lanes down the left are the same journey entered five different ways, and the difference between a flow and a map is that a map has to hold all five.

  • The second version of Challenges, drawn as a flow rather than as screens. A v2 board exists because the first one shipped and taught something; the board is where that was written down.

    Challenge · v2

    The second version of Challenges, drawn as a flow rather than as screens. A v2 board exists because the first one shipped and taught something; the board is where that was written down.

    The second version of Challenges, drawn as a flow rather than as screens. A v2 board exists because the first one shipped and taught something; the board is where that was written down.

  • One game mechanic end to end: question, timer, answer, streak, result, and the paths out of it when the timer wins.

    Speed quiz

    One game mechanic end to end: question, timer, answer, streak, result, and the paths out of it when the timer wins.

    One game mechanic end to end: question, timer, answer, streak, result, and the paths out of it when the timer wins.

  • A Program rather than a Core system, and it shows: the board is organised as Entry points, Introduction and scanning, Results, and a Body-scan detail page: four zones instead of one line, because a scan is entered from anywhere and read afterwards.

    Body scan

    A Program rather than a Core system, and it shows: the board is organised as Entry points, Introduction and scanning, Results, and a Body-scan detail page: four zones instead of one line, because a scan is entered from anywhere and read afterwards.

    A Program rather than a Core system, and it shows: the board is organised as Entry points, Introduction and scanning, Results, and a Body-scan detail page: four zones instead of one line, because a scan is entered from anywhere and read afterwards.

  • Elfie Console, the internal tool that replaced several third-party services. Sign-in, and every state around it that is not the happy path.

    Console · authentication

    Elfie Console, the internal tool that replaced several third-party services. Sign-in, and every state around it that is not the happy path.

    Elfie Console, the internal tool that replaced several third-party services. Sign-in, and every state around it that is not the happy path.

  • The admin view for Clients and Partners, drawn as its five states across the top (Blank, Create, Active, Edit/View, Delete) with the inline errors and tooltips demonstrated below rather than described.

    Console · clients

    The admin view for Clients and Partners, drawn as its five states across the top (Blank, Create, Active, Edit/View, Delete) with the inline errors and tooltips demonstrated below rather than described.

    The admin view for Clients and Partners, drawn as its five states across the top (Blank, Create, Active, Edit/View, Delete) with the inline errors and tooltips demonstrated below rather than described.

  • The analytics surface: cohort gauges, a trend line per programme, and the dark-mode variants of the same charts drawn beside them rather than left to interpretation.

    Console · analytics

    The analytics surface: cohort gauges, a trend line per programme, and the dark-mode variants of the same charts drawn beside them rather than left to interpretation.

    The analytics surface: cohort gauges, a trend line per programme, and the dark-mode variants of the same charts drawn beside them rather than left to interpretation.

  • Reward management: what an operator can create, what they can edit after it is live, and what happens to a reward already in someone's account when they change it.

    Console · rewards

    Reward management: what an operator can create, what they can edit after it is live, and what happens to a reward already in someone's account when they change it.

    Reward management: what an operator can create, what they can edit after it is live, and what happens to a reward already in someone's account when they change it.

  • The operator's side of the Challenge the app board above draws for the member, the same feature seen from the other end of the product.

    Console · challenges

    The operator's side of the Challenge the app board above draws for the member, the same feature seen from the other end of the product.

    The operator's side of the Challenge the app board above draws for the member, the same feature seen from the other end of the product.

  • The shortest board here, and deliberately: a lucky draw is a small feature with a long tail of rules, so the board is one line of screens and a great deal of specification beside it.

    Console · lucky draw

    The shortest board here, and deliberately: a lucky draw is a small feature with a long tail of rules, so the board is one line of screens and a great deal of specification beside it.

    The shortest board here, and deliberately: a lucky draw is a small feature with a long tail of rules, so the board is one line of screens and a great deal of specification beside it.

Boards by Jang Trịnh with the Elfie product team, 2023–2024. Recovered from the owner's own archive; screened before publishing.

Prototypes

Motion, specified rather than described.

Four pieces of the app's motion system, recorded in 2023. A written spec for a loading state is a paragraph two people read differently; this is the same spec as a file that cannot be misread.

  • 2023 · The loading state: what the app does with the seconds it cannot avoid spending.

  • 2023 · Coinland: the reward animation, and the rule for how a coin gets from the screen to the balance.

  • 2023 · The same currency arriving on the home screen, so both ends of the reward read as one motion.

  • 2023 · Body scan guidance: a camera instruction that has to be understood while the customer is already standing in position.

Motion by Jang Trịnh with the Elfie product team, 2023.

Reflection
The breakthrough was not a single interface. It was converting hidden knowledge into reusable infrastructure: files, components, specifications, prototypes, and rituals that made the whole team more capable.
Elfie