Start with a theme, build the system, then just talk

How a flexible base theme, a real component library and the Figma MCP can put a non-designer in the seat of an experienced UI/UX designer.

If you’re an ecommerce person who isn’t a designer, this is the post I’d want you to read first. Because the way you set up your design foundation decides whether AI becomes your design team or just another toy.

Start with a base theme

Whatever platform you’re on, start by finding a base theme. Not one that represents your brand perfectly today. One that’s flexible enough to accomplish everything you have in mind as an ecommerce goal, or a digital goal in general, especially if it’s conversion related.

That flexibility matters more than how it looks out of the box. You’re going to build on it for a long time.

Build it out as a component library

Then get that theme built out correctly as a component library. Every button, card, section and template, defined once and reused everywhere.

And focus on the style guide and design system right at the beginning. I can’t hammer this in enough. This is the part people skip because it doesn’t feel like progress. It’s the part that makes everything after it possible.

Connect AI to it

Once the foundation is there, connect Claude to Figma through the Figma MCP, alongside whatever other AI tools you use. Give it your rules: the design system, the component library, the things your AI has to follow.

At that point, if you’re willing to just speak, you’ve put yourself in a position where you’ve almost effectively replaced the role of a UI/UX designer.

Then you can start with simple things

Say you want to update your navigation. You can just ask:

  • Let’s do an analysis of my current site navigation and its UI/UX.
  • Now let’s look at what the leading competitors, the leading players in this space, are doing.
  • Let’s rifle through what those options are.

Claude, connected to Figma, is great at getting all of those options in front of you to choose from. You pick, you refine, and you go bit by bit, building and building and building.

The whole time, you keep Claude in compliance with your rules. It follows your design system and your component library, and everything stays linked up. Nothing drifts off-brand, because the system is the source of truth, not the AI’s taste.

Why the foundation pays off

This is where it gets good. Creating clickable prototypes, and going from where you are to dev, becomes very, very easy, because you started with a theme and built the system on top of it.

You’ve spent your time acting like a true, experienced ecommerce veteran, just by speaking with Claude a little bit, because you took the time to set up your foundation right.

This is Springspot

That same concept applies in many different areas: your platform, your marketing, your processes. Set the foundation up right, give AI the rules, then talk. That’s really the underlying theme of Springspot.

The design system is Checkpoint 1 for a reason. If you want to see where yours stands, take the Score.

Frequently asked questions

Can a non-designer use AI to design an ecommerce site?

Yes, if the foundation is right: a flexible base theme, built out as a component library with a style guide and design system, and Claude connected to Figma and given those rules. Then you can work by describing what you want.

How do I connect Claude to Figma?

Through the Figma MCP, alongside whatever other AI tools you use. Give it your design system, your component library and the rules it has to follow.

How do I keep AI-generated designs on-brand?

Keep Claude in compliance with your design system and component library. The system is the source of truth, not the AI's taste, so nothing drifts off-brand.

What's a good first design task to give Claude?

Something simple like your site navigation: ask for an analysis of its current UI/UX, then what leading competitors do, then the options. Pick, refine and build step by step.