Clarifai is one of the early pioneers in computer vision and machine learning. When I joined, the product was powerful but visually fragmented, with inconsistent workflows and an interface that didn’t reflect the sophistication of the technology behind it.

‍

My role was to reimagine the platform’s entire user experience, create a scalable design system, and help visualize AI concepts in a way that felt intuitive and accessible. The work spanned across product design, onboarding, marketing, and one of the first-ever web-based text-to-image modules, long before generative AI tools became mainstream.

‍

‍

Building the Clarifai Design System

To bring consistency across multiple products and web properties, I designed a complete design system that unified the brand’s digital experience.

‍

Key Highlights

- Defined an extensive color palette, typography scale, and grid system for better scalability.
- Built a modular component library including buttons, charts, forms, inputs, modals, and data visualization elements.
- Established accessibility and spacing standards to improve clarity and usability.
- Enabled faster design-to-dev handoff with detailed documentation and reusable components.

‍

This system became the foundation for every part of the product, from dashboards and onboarding to marketing and documentation.

‍

‍

Modernizing the Platform Interface

Clarifai’s previous interface was powerful but visually outdated and dense. The redesign introduced a lighter, more approachable aesthetic with clear hierarchies and simplified workflows.

- Created a new visual identity aligned with Clarifai’s evolving brand.
- Simplified information layout, improved navigation, and added model metadata for clarity.
- Enhanced readability, accessibility, and user focus through spacing, typography, and structure.

‍

‍

Designing the Clarifai Community

‍

To transform the platform from a standalone tool into an open ecosystem, I helped design the Community page, a space where users could share, explore, and build upon each other’s AI models.

‍

Objectives

- Make AI collaboration visible and accessible.
- Simplify model discovery through structured filters, tags, and categories.
- Highlight creators and their contributions through personalized profiles and activity cards.

‍

Design Highlights

‍

- A clean model directory with metadata, usage stats, and “Use this Model” actions.
- A network visualization showing how models relate by type, function, or popularity.
- Community profiles that fostered recognition and transparency.

‍

Impact

The community page positioned the platform as one of the first AI marketplaces, encouraging openness and shared learning before that concept became common in the industry.

‍

‍

Crafting the Onboarding & App Creation Experience

Onboarding was one of the most complex and essential parts of the platform. Users could enter from multiple paths, marketplace, login, or app creation, each requiring its own guidance and contextual experience.

‍

Design Focus

- Guided Tours: Step-by-step flows for creating new apps and models.
- Flexible Entry Points: Supported users joining from templates, community models, or blank projects.
- Personalization: Added AI-randomized avatars and custom user IDs during onboarding.
- Smart Defaults: Auto-filled workflows and API setup to reduce friction.

‍

This approach turned a technically demanding process into an intuitive guided setup, helping both developers and non-technical users get started quickly.

‍

‍

Designing the Text-to-Image Generation Module

‍

Before generative AI became mainstream, I got to design one of the first web-based text-to-image UIs, empowering users to generate visuals from prompts and customize output styles.

‍

Features

- Prompt suggestions to guide creativity.
- Style presets such as Abstract, Vintage, and Photorealistic.
- Real-time previews with regeneratable outputs.
- Clean workflow for text entry, generation, and result management.

‍

Impact

Enabled users to explore AI-generated content with minimal effort and inspired early experimentation that predated modern tools like DALL·E and Midjourney.

‍

‍

Visualizing AI Model Creation

‍

Explaining complex AI workflows visually was one of the biggest challenges. I developed an entire library of visual metaphors to help users understand what each model type did, without needing to read long documentation.

‍

- Designed visual cards for model types like Classifiers, Detectors, Embedders, and Segmenters.
- Used shape language and color coding to represent different AI behaviors.
- Created modular illustrations for marketing and documentation, aligning Clarifai’s technical side with a more creative, approachable voice.

‍

Outcome

These visuals simplified the mental model for users, reducing friction in the learning curve and helping the brand communicate complex technology in human terms.

‍

‍

Results

The redesign redefined how users interacted with Clarifai’s AI tools, both functionally and visually.

‍

- Established a scalable design system used across product and marketing.
- Reduced onboarding friction through guided setup flows.
- Enhanced discoverability and community engagement around AI models.
- Positioned Clarifai as one of the first design-forward AI platforms, bridging engineering and creativity.

Reflection

This project remains one of my most formative experiences in designing for artificial intelligence. It taught me how to translate abstract AI concepts into visual, human-centered interfaces, years before generative AI became a household term.

‍