Zoan AI – AI Workflow Management

May 1, 2025 (8mo ago)

Zoan AI is currently preparing for launch.
Product preview available at: https://zoan.app/

Before joining Zoan AI, I used to ask myself:

“Will AI replace UI/UX Designers?”

But leading this project—from system rebuilding and UI redesign to shaping cross-platform experiences—made me realize something else:

👉 I wasn’t being replaced by AI. I was designing the interface for an AI platform.

herogif

Overview

Zoan AI enables teams and partners to build AI-generated interactive content through unified desktop workflows and a mobile chat-to-creation experience.

overviewimg

My responsibility covered the entire product surface:

• UI audit and redesign
• Design system foundations & component library
• Web & mobile experience alignment


Phase 1: Visual Challenges

As an early-stage product, the interface lacked structure and brand consistency.
This became the starting point for rebuilding the system from the ground up.


Phase 2: System Foundations

Resetting the visual language:

Colors

color

Typography

typography

Variable System

tokenpreview

A scalable token structure ensured consistency across both desktop and mobile platforms.


Phase 3: Component System

Building out the component library:

• Controls, forms, and overlays
• Cards, lists, and tables
• Navigation patterns
• Clear state variations

Each component included guidelines for behavior and implementation.

componentsystem


Phase 4: Cross-Platform Application

Desktop

• Dashboard and workflow management
• Asset and content organization
• Review and iteration screens

desktop1 desktop2 desktop3 desktop4

Mobile Experience

The same system was adapted for smaller screens to enable:

• Chat-based creation
• Interactive previews
• Quick content iteration

mobileflow


Phase 5: Motion & Micro-Interaction Design

Motion was introduced to:

• Guide attention and transitions
• Reinforce hierarchy and interaction states
• Elevate the experience beyond static UI

Timeline motion

timelineMotion

App transition motion

appMotion

These animations were designed modularly to scale with future features.


Outcome

The renewed system:

• Provided a scalable foundation for future development
• Reduced design–engineering friction
• Established a strong visual identity for fundraising and go-to-market

Working on Zoan AI didn’t show me that AI replaces designers.
It showed me that designers shape how humans interact with AI.