03TELATRIS

Designing and shipping a startup MVP in code

FINALThe full customer workflow, running on a front end I designed and built.

IT service providers manage cloud services for dozens of customers, and they track them by hand in spreadsheets. Savings get missed, and problems surface only once they escalate. I joined Telatris as founding designer and took the product from vision to a coded front end.

0→1AI
RoleFounding Designer
TimelineJun–Dec 2025 · Jun 2026–Present
TeamFounders, 3 Engineers

Problem

Savings hide in spreadsheets

Our users are partners, the IT service providers who manage software costs for dozens of customers. Finding savings is slow work, done by hand in spreadsheets and admin portals. It’s too complex and too sensitive to hand to junior staff, so experts do it themselves.
An advisor’s tracking spreadsheet, with customer names anonymized
An advisor’s tracking spreadsheet, anonymized.

Approach

Real data, a sharper problem

I used AI to turn an advisor’s own data into mock services, and had a working prototype running on it within a week. With his customers on screen, he named the friction he lived with: services creep toward their usage limits, and nothing warns him until one escalates.
Coded prototype screen running on mock data
Customers, one tenant’s users, and an account flagged inactive, all anonymized.

Selected Work

Foundations before features

I put the foundations in place first, a component library and a lightweight brand, so we wouldn’t start taking on design debt. Every screen after that came from real components, and with AI I could turn feedback around in days.

1

Design System

Engineers needed a front end they could build on without waiting on design. I built a token-based React component library covering colors, typography, and UI patterns. I generated components in v0 and iterated in Claude Code, then pushed the library to the engineering repo so the team could adopt it directly. The library now lives in Storybook, where I iterate on components and push updates to the team.

The first local build of the library, since moved into Storybook.
2

Brand System

I designed a lightweight brand package to give the startup credibility from day one, structured enough to hold up across product screens and investor decks.

Stealth startup brand identity
Logo and icon in light, dark, and brand colorways, ready for product and pitch.
3

Onboarding Flow

I designed the first-run flow around bulk sync: a provider connects Partner Center and every tenant lands in one pass, with a manual path for the ones outside it.

The first-run flow, from an empty account to every tenant synced.
4

Alerts

I designed Alerts to sort problems by when to act, so usage creeping toward a limit shows up before it escalates. I chose this over a metrics dashboard, which showed the state of every tenant without saying what to do next. Partners get each alert as a task in the app, or in their own AI tools over MCP.

Alerts grouped into Act today and Deadlines, with customer, category, change and age columns
One list across every customer, with escalated alerts flagged.

Outcomes

Ramp to release

I handed over a coded front end: real components from the design system, ready for the backend to connect to. Tables, alerts, toasts, each with usage notes for the engineers picking them up. The brand went with it, giving the founders something to work from in investor conversations. The product is still pre-release. I’m testing it with more partner advisors and putting AI up front in the experience.

What I learned

AI has changed every phase of my process. Prototyping a product UI is easy now, yet designing a considered UX still requires the fundamentals of connecting the user’s pain point with a valid business solution. Most of the build ran in v0 and Claude Code, and I got better results giving the model an outcome and constraints than giving it instructions. I’m still working through a systematic way of leveraging AI tools to stay true to my product design craft.