dytto rebrand

Delivered as a full working prototype with micro-interactions, covering login, the chat flow and email detail views rather than static screens.

Following the rebrand, Dytto secured pre-seed funding and is now an actively growing product. The design system continues to serve as the foundation for both the desktop app and the website.

A full rebrand and design system build for Dytto, an AI-powered accounting assistant that intercepts incoming mail, extracts financial data, and handles bookkeeping tasks for you. The project spanned user research, brand exploration, a component-level design system, and an interactive prototype for the desktop app.

Using style tiles, we had the client adjust brand sliders (formal vs. warm, affordable vs. premium) to map out the tonal space. After several rounds, we landed on a playful, approachable direction: hand-drawn animation, a warm color palette, and rounded corners that soften the experience without losing professionalism.

I extracted a complete design system from the wireframes: tokens for color, typography, spacing, and radius; reusable components for buttons, inputs, cards, modals, and navigation; and documentation to keep the branding consistent as the product grows.

Using the design system, I built an interactive Figma prototype covering login, the chat flow and email detail views. The key interaction decisions:

• The pigeon mascot carries the AI's state - it animates across idle, thinking and waiting, inspired by Notion AI, so the assistant's status is legible from the mascot alone.
• Glow marks what the AI touched - incoming email actions and AI-processed components are highlighted, separating the assistant's work from the user's own.
• Referenced content pops out inline - files and customer profiles open in place rather than on a new screen, so users never lose their context in the conversation.

The focus was on making every transition feel intentional. Chat responses build smoothly, email cards surface the right details at the right moment, and the pigeon's state changes give users a clear signal of what the AI is doing without relying on loading spinners or text.