BrandUXProduct DesignWeb

COMPONENT FACTORY

Nobody had heard of agentic components before. Our job was to make sure they understood — and wanted in — in under sixty seconds.

Component Factory

Role

Lead UX/UI Designer

Client

ComponentFactory.ai

Scope

Brand · Website · Product UI

The Problem

Explaining something that didn't exist yet

“You can't design for something people don't have a word for yet.”

ComponentFactory is built around a genuinely new idea — that AI agents shouldn't write one-off code from scratch every time, but instead assemble pre-built, battle-tested building blocks called agentic components. It's a compelling idea. It's also one most people have never encountered.

The challenge wasn't making something look good. It was making an unfamiliar concept feel inevitable — the kind of thing where, once someone understands it, they can't imagine doing it the other way. We started with nothing. No brand, no visual direction, no existing language to borrow from. Just a product and a founding team who knew exactly what they were building, but needed the world to understand it too.

What Made This Hard

01

The concept had to land before the product could

Most products solve a problem people already know they have. ComponentFactory solves a problem most developers haven't fully named yet — that vibe coding at scale is messy, unpredictable, and secretly expensive. The design had to do the work of making that problem feel real before introducing the solution. Get that order wrong and the product never lands.

02

Three very different people had to feel at home

A solo developer browsing on a Sunday afternoon reads a page completely differently than an enterprise security officer evaluating vendor risk. And neither of them read it like an AI agent crawling for structured data. All three needed to find what they came for — without the page feeling like it was trying to be everything to everyone.

03

Industrial credibility without feeling cold

ComponentFactory is a serious infrastructure product — it's backed by NVIDIA, it handles enterprise security, it's the kind of thing that gets evaluated by legal and compliance teams. But it's also free, community-driven, and trying to build a movement. The design had to carry both. Too polished and it loses the builder energy. Too rough and enterprise buyers don't trust it.

How We Solved It

01

Brand Direction

The first real decision was tone. A lot of AI products default to soft gradients, friendly illustrations, and reassuring language. ComponentFactory needed to feel different — more like a factory floor than a SaaS dashboard. The black and yellow palette came from that instinct. It's the color of caution tape, of heavy machinery, of things that are built to last. Monospaced UI type signals precision and developer credibility.

02

Catalog: Option A — Search-first

Drop users into a search bar and let them find what they need. Fast for people who know what they want. Completely unhelpful for everyone else — and discovery doesn't happen. Not chosen.

03

Catalog: Option B — Browse + Validate ← Selected

A structured, browsable library where every component shows its validation status, community badges, and lineage upfront. People can search, but they can also explore — and the trust signals are visible before they even click. Chosen because credibility has to be visible before it can be felt.

04

Catalog: Option C — Community-led feed

Surface the most popular and recently added components. Good for engagement, bad for trust — new users can't tell what's reliable from what's experimental. Rejected early. Not chosen.

Key Screens

Screen 01 — Landing Page

ComponentFactory landing page — hero section with agentic components concept

Making the concept land in the first scroll

The homepage had one job above everything else: make someone who has never heard of agentic components understand why they should care. The hero section uses the analogy of a laptop — you wouldn't build your own hard drive, so why would your agent write its own tools from scratch? That framing does the heavy lifting before any feature is mentioned.

Screen 02 — Component Catalog

ComponentFactory component catalog with validation badges

The catalog: where trust gets built or lost

Every component in the catalog shows its validation level immediately — automated tests, community validation, sponsor validation, manual certification. You don't have to dig to find out if something is reliable. The badge system was designed to be understood in a glance, because a developer evaluating a component shouldn't have to read documentation just to know if it's safe to use.

Screen 03 — Factory Build UI

ComponentFactory build interface — plain English to validated component

Building something new in minutes, not days

The factory interface is where someone describes what they need in plain English and gets a working, validated component back — ready to drop into their agent stack. The design had to make a genuinely complex process feel straightforward without hiding what's happening. Developers trust tools that show their work.

What Changed

270×

Faster agent assembly — the core claim, made visually credible through the design system

3

Distinct audiences — developers, enterprise, and AI agents — served by one coherent design language

0→1

Complete brand built from nothing — identity, website, product UI, and component catalog

Looking Back

The analogy is the design

The most useful thing I did on this project wasn't picking a color or laying out a page. It was understanding that the right analogy — you don't build a laptop from scratch, you assemble it — could do more communication work than any visual element. Once that framing was clear, everything else had direction.

Trust is a design material

The validation badge system on the catalog wasn't a feature request — it was a design necessity. A developer won't use something they can't verify. Building trust signals directly into the browse experience, rather than hiding them in documentation, changed how the whole catalog felt. Credibility has to be visible before it can be felt.

Starting from scratch is a gift — if you don't waste it

No existing brand meant no constraints, but also no shortcuts. Every decision had to be made on purpose. The industrial direction could have easily gone generic. It didn't because we committed to it early and didn't second-guess it every time something felt unfamiliar. Conviction is part of the craft.

What I'd do differently

I'd spend more time earlier with the developer community — the actual people who would browse the catalog and decide whether to trust it. A few rounds of honest feedback from that audience before launch would have sharpened the badge system and the catalog layout considerably.

Next

Want to see the full prototype?

View Prototype →