Nexad Rebrand and Scaleable Design System
2026
A design system and rebrand built to scale with an AI-native advertising platform.
After Nexad absorbed a sub-brand and scaled into a full marketing suite, the platform needed a cohesive design language to match its expanded scope.
As the sole designer, I worked closely with the PM and developers to evolve the brand identity and build a design system from scratch on shadcn/ui, establishing foundational tokens, components, and standards across their new agent MVP and marketing website.
Team
1 Designer
1 PM
2 Software Engineers
Role
Product Designer
Tool
Figma
Claude Code
Nano Banana
Duration
2.5 Months
The System in Action
Nexad is an ad-tech startup building an AI-native advertising platform that delivers personalized, real-time, context-aware ads within AI applications like chatbots and AI search engines. I established a early design system from scratch for marketing website and product use.
The new system streamlined team collaboration and ensured a consistent brand identity and user experience across platforms. Website traffic grew 10x and conversion rate lifted 34%.
Context
After merging with its sub-brand Soku.ai, Nexad evolved from an AI chatbot ad agent into a full-suite marketing agent
Because of this expansion, the company needed to update its brand image and consolidate its multiple platforms into a single, unified product for its clients.
Design Challenge
This growth stage needed a unified brand identity and a scalable design system.
After analyzing the product features and collaborating with the PM to identify stakeholder needs, we realized that to align with the new vision, we needed a complete rebrand and a scalable design system to resolve the following issues:
Abstract Brand Messaging
Only abstract visuals, leaving marketing clients confused about Nexad's core offerings.
Fragmented Visual Identity
Evolving independently left Nexad and Soku with disjointed visuals and an inconsistent user experience.
Unscalable UI Foundation
A lack of shared design tokens and scalable standards caused frequent developer handoff misalignments.
Brand Direction
Organic visual, contextual photography, and a minimal interface that makes enterprise-level automation feel effortless.
Nexad’s SMB clients want results over complexity, so the brand had to signal capability without raising the bar. Following the Aesthetics of AI framework, I positioned Nexad toward creative, approachable, and rooted in human-AI synergy tone.
Design System
Audit on shadcn/ui as foundation and building with atomic design methodology
With a new brand identity in place, a cohesive design system was needed across both the marketing site and product. Working within a tight MVP timeline, I audited shadcn as the foundation, aligned with the PM on scope, and built custom components in layers.
Three-tier token structure
After benchmarking the token architectures of Atlassian, Material Design, and Geist, and how shadcn/ui names its defaults. I landed on a three-tier structure: primitives, semantic aliases, and component-level tokens.
For a small team, low-maintenance scalability mattered more than a custom architecture.
Customized components
Component-File list Item
As the AI agent runs tasks, it generates various files. I designed this component so users can see what is happening behind the scenes, easily identify different file types, and feel in control.
To optimize vertical pace, I moved forward with the list structure. The final design was chosen because it makes critical file metadata instantly scannable while reflecting our vibrant new visual identity.
Component-Task card
While the AI automates complex workflows, transparency is critical. Designed for a fluid 4-column Kanban board layout, this card surfaces real-time task data, allowing users to easily manage operations and take timely action.
To handle the complexity, I worked with the PM to break this component down into four parts. Recognizing the user's need for live visibility, I evolved the static design by adding progress indicators and real-time timestamps, optimizing the UI for spatial efficiency.
Design System Documentation
The Figma design system was built using the Obra shadcn/ui kit. I added detailed explanations to ensure other team members understand usage better.
Reflection
Shared rules make better teams
Design system goes far beyond just ensuring a consistent user experience. It kept design and engineering perfectly aligned. While our tight timeline meant skipping a changelog this round, I realized establishing one early is essential to keep everyone on the same page as the product evolves.
AI expanded what I could do alone
s the only designer, I leaned on AI to fill the gaps: generating imagery, iterating on design tokens, and prototyping features with the PM and engineers through Claude Code, moving faster than I could have otherwise.