Part 2 •
Augmented IQ
Design System for an Enterprise Productivity AI
I created a design system from the ground up, starting with the essentials and evolving it into a foundation. This made my team faster and our product more consistent.
My role
UI Designer
Industry
Enterprise AI
Team
2 Designer, 3 Developers, Project Manager
Challenge
We needed to launch an MVP demo quickly for enterprises interested in Augmented IQ. Each was with different requirements and expectations, while earning their trust in our product and vision.
Product Overview
Augmented IQ is a customizable AI assistant built for your private cloud, designed to amplify enterprise productivity. It brings together all your organisational data, documents, and applications into one unified knowledge fabric, securely connected to your preferred LLM and ready for your knowledge workers to access. The platform features RAG-powered UX design tailored to your preferences, with permission-aware access controls, Human-in-the-Loop (HITL) feedback mechanisms, and agentic workflows that handle complex tasks autonomously. Think of it as a Living Library that grows smarter with every interaction.
What I executed
Decoding the Wireframes
Before touching any design tools, I interrogated every element in the wireframes: Why does this button need to be primary? What's the user's emotional state when they reach this screen? Which actions are critical versus nice-to-haves?
Understanding priority was essential. A wireframe shows you the "what," but only conversation reveals the "why." Those discussions shaped everything that followed.
Crafting the Visual Foundation
The color palette was about creating a flexible foundation that could adapt to any future company branding collaboration. I kept it simple: one primary, one secondary, and one accent color. This structure gave us enough to establish visual hierarchy while leaving room to evolve as the brand matured.
Speed-Running the First Design System
I built what I call a "minimum viable design system"—not every component we'd ever need, but the core building blocks required to bring those wireframes to life. Buttons, form fields, cards, navigation patterns, typography scales. I documented the rules quickly but thoughtfully, knowing that perfect would be the enemy of shipped.
Adapted and by the Team and evolved
Once the workflow wireframes were complete, my design style guide became a force multiplier. My teammates could apply the design system to new sections without waiting for me to design every screen. We moved from a bottleneck model to a collaborative one.
For the demo, the team used the guidelines across the entire experience. Screens designed by multiple hands felt like one cohesive voice.
The system was becoming intuitive not just for users, but for the team building it. What started as a basic toolkit was maturing into a genuine design language.
QA revealed gaps I hadn't anticipated
The biggest revelations came from understanding the dev team's challenges. I learned about REM units when my pixel-perfect specs didn't translate well across different screen resolutions. These technical issues became opportunities to bridge the gap between design intention and development reality.
What I Learned