AI-Native Senior Product Designer · Financial Finesse · 2026
One AI financial coach, designed and built to feel native everywhere — the Hub, client sites, and Microsoft Teams
Aimee is Financial Finesse's AI financial coach. I designed its front end end to end — visual language, interaction model, a component contract, and coded prototypes. Engineering built the SDK in React and A2UI from those, and I merged the design-system layer and four components into it myself.
Aimee is Financial Finesse's AI financial coach, shipping to the Hub, an embeddable client widget, and Microsoft Teams. Engineering built the Aimee SDK in React and A2UI from Bri's coded prototypes and spec. She then merged the design-system layer and the empty-state, conversations, icon, and card-shell components into the production SDK herself (32 commits, July–August 2026).
- Role
- AI-Native Senior Product Designer · front-end design & coded prototypes
- Scope
- Front-end design · Design system · Coded prototypes · Production components
- Surfaces
- Hub · Client sites · MS Teams
- Stack
- Next.js · Tailwind · Recharts · A2UI
Front-end design, coded prototypes, and production components
Defined Aimee's visual language and interaction model — how she talks, streams, surfaces content, and brings in a human coach.
Wrote the spec (DESIGN-SYSTEM.md: tokens, typography, every chat and card component, chart rules, accessibility hard-rules, an anti-patterns list), then the tokens themselves as the styles layer of the production SDK.
Built a locked, approved library — a component "API" of reusable in-chat blocks — that engineering could implement 1:1.
Designed and coded high-fidelity interactive prototypes — real HTML/CSS/JS with live streaming, animation, and state — to test flows before a line of production code.
Designed the embeddable SDK widget for client sites and adapted the same system to Microsoft Teams — all hostable through UberAdmin.
The interactive prototypes (HTML/CSS/JS with live streaming and state), the component contract, the engineering spec (Next.js + Tailwind + A2UI), and, in the production SDK, the design-token layer plus the empty-state, conversations, icon, and card-shell components: 32 commits, July–August 2026.
The Aimee SDK itself, in React and A2UI, built by the platform engineers from my prototypes and spec and implemented 1:1; the host provisioning through UberAdmin; the model and coaching back end.
One coach, three very different homes
One system, not three front ends
Rather than build three front ends, I built one: a documented design system, a locked component library that Aimee "speaks" in, coded prototypes to test with, and a single configurable host. Every response is assembled from typed blocks — never free-form bubbles.
A design-system spec, then tokens as code — DESIGN-SYSTEM.md defines tokens, typography, accessibility hard-rules, and an anti-patterns list; the tokens ship as the styles layer of the production SDK
A locked component "API" — chat primitives, a typed card system, data-viz blocks, and follow-up chips, each built to a documented anatomy and CSS contract
Coded interactive prototypes — real HTML/CSS/JS with live streaming and state, so flows could be felt and tested, not just reviewed
One configurable host — provisioned through UberAdmin so the Hub, client sites, and Teams all deploy from a single system
Honest AI, premium humans
Aimee is labeled an "AI coach," not "virtual" — hiding the AI only breaks trust later. Certified human coaches are framed as a one-click premium upgrade, so Aimee feels capable and humans feel credentialed. A gold-railed escalation card makes the step up feel like an upgrade, not a fallback.
A vocabulary, not free-form bubbles
Every response is assembled from typed blocks — the "vocabulary" Aimee speaks in. A base card with a colored left rail signals its type at a glance.
The user's words never shrink
A rule I enforced across the system: the user's message and Aimee's reply always render at the exact same size (16px mobile / 17px desktop) — never shrink the user's words beneath the AI's. It keeps the conversation feeling like a dialogue between equals. It sits alongside accessibility hard-rules — never yellow text on white, one hover treatment at a time — codified so they can't drift.
The same coach, every surface
The same coaching experience holds up whether it's woven into our platform, floating on a client's marketing site, or wrapped in a completely different host UI.
Designed and coded, end to end
I coded the prototypes instead of drawing them. Real HTML/CSS/JS with live streaming and state became the source of truth, the spec became the build contract, and the component library was locked so engineering could implement it 1:1 in Next.js + Tailwind, with an A2UI model that maps Aimee's structured JSON responses to my components. Then I merged the token layer and four components into that SDK myself, so the same system drives every surface.
"Open the prototype to see the streaming effect — it's the kind of detail that doesn't translate in a screenshot."
Impact
One coherent coach, everywhere it needs to be
Hub, embeddable client widgets, and Teams — from one component library
Documented design system + a locked, approved component library
Next.js · Tailwind · Recharts · A2UI, built 1:1 with the spec
Aimee runs as one coherent AI coach across the Hub, embeddable client widgets, and Teams — one design system, one component library, one source of truth. Designed by one person, built with engineering, and finished in the production code by the same designer.