Establishing a unified design language with robust, cohesive and scalable Eventz.ai Design System

My Role: Sr. Product Designer, XiPhi.ai

Team: Me (Design Systems Lead), 1 Sr. Designer, 1 Design Manager, 1 Data Expert, 1 Software Engineer, 1 ML Engineer

Timeline: Jun - Aug 2025

Contribution: Competitive Audit, Design Principles, Component and Pattern Libraries, Documentation, Mentoring Team Members,

CHAPTER 0: OVERVIEW

Project Overview

As Eventz.ai app scaled, the product team faced design inconsistencies, repetitive workflows, and technical debt. There was no single source of truth for design or engineering, making it hard to deliver cohesive experiences.

To establish a unified design language, I single-handedly spearheaded the end-to-end development of a scalable design system for the AI interface that would accelerate workflows and ensure a cohesive, and accessible user experience. Process involved,

CHAPTER 1: COMPETITIVE AUDITS

Competitive Audit & Base System: I conducted a detailed competitive audit of leading design systems like Google's Material UI 3, Microsoft's Fluent, Uber's Base, and IBM's Carbon. I closely studied the documentation and application of each. I ultimately decided to build our system on top of Google's Material UI 3 for its approachable and accessible foundation.

Core principles for designing Eventz.ai Design System: Consistency, Scalability, Accessibility, Minimalistic, Functional, Efficient

CHAPTER 2: DESIGN SYSTEM FOUNDATIONS

I designed and documented core components, including color palettes, typography, and design tokens, ensuring every design decision had a single source of truth. I specifically designed AI interface components from scratch to work seamlessly with the broader Material Design system.

Color system for futuristic, minimalistic, accessible look & feel, with Light/Dark modes

(Click on image to enlarge)

Typography design tokens for responsive web

CHAPTER 3: COMPONENT DESIGN

Custom Components: Designing custom AI components to seamlessly integrate component usage across traditional UX and AI conversation interface.

Decide Custom Comp 1.png
Decide Custom Comp 2.png
Decide Custom Comp 3.png

New custom component libraries (Click on image to enlarge)

Existing component libraries (Click on image to enlarge)

CHAPTER 4: COLLABORATION & MENTORSHIP

Empowering the Team: Being the most technically proficient member in the design group, I, through peer-learning approach guided design team, through the entire process from complex component creation in Figma to its final publication in our design system library.

This ensured the team could independently contribute, maintain, and scale our component library, fostering a more collaborative and efficient workflow.

CHAPTER 5: IMPACT

Impact

  1. 3X increase in design efficiency

  2. 60% faster handoffs to engineering

  3. ~10 hrs saved per designer per week

  4. Built a scalable system bridging AI + traditional UX

My Learnings

  1. Designing design systems for AI-native products.

  2. Peer mentoring.

  3. Handoff for the engineering team.