IMPORTANT - Components vs Frames

There's an important distinction between what I'm trying to achieve with Frames and what I'm building with the Krafter Components Library.

Although there is some overlap, they are designed to solve two different problems.

1. Frames are about complete layouts and speed.

Frames are pre-designed sections such as Heroes, Testimonials, Pricing Tables, Features, FAQs, and Contact sections.

The idea behind Frames is simple: instead of building an entire section from scratch, you can insert a professionally designed layout that already follows your design system, including typography, spacing, colours, and responsive settings.

Frames are primarily about getting a complete section onto your page quickly and then customising it for that particular page.

2. Components are about smaller, reusable building blocks.

The Krafter Components Library focuses more on individual design elements such as Cards, Buttons, Notices, CTAs, Pricing Cards, Feature Cards, and other UI elements.

These are the building blocks you use to assemble more complex layouts.

For example, imagine you want to create a services section containing six cards.

With Frames, you could insert an entire pre-designed services section.

With Components, you could choose individual card designs, arrange them however you want, and create a completely unique services section.

You could also save that finished section as a Divi Component if you wanted to reuse and synchronise it across your website.

3. The biggest difference is where AI comes into the workflow.

This is actually one of the main reasons I want to keep the two concepts separate.

My long-term vision for KrafterPRO is an AI-assisted workflow where AI understands your design system and has access to a library of individual components.

Instead of asking AI to insert the same pre-designed section repeatedly, I want it to intelligently select and assemble components to create unique layouts.

For example, AI could take a heading, three feature cards, a testimonial, and a CTA component and assemble them into a completely new section based on the user's requirements.

That gives us much more flexibility and helps avoid the generic, repetitive AI-generated websites we're seeing today.

If everything is packaged into complete sections, we lose some of that flexibility. We'd often need to break those sections apart or work around their existing structure to access and rearrange the individual elements.

4. Divi Components are the technology, not necessarily the product structure.

This is probably the most important distinction.

I'm not saying that Frames and Components need completely different underlying technologies. In fact, they can absolutely share the same foundation.

Divi Components provide the ability to save and reuse elements, including synchronising changes where appropriate.

But that doesn't mean every reusable element serves the same purpose.

Think of it this way:

• Components = The individual building blocks.
• Frames = Complete, ready-to-use sections assembled from those building blocks.
• KrafterPRO = The design system and tools that help keep everything consistent.

Ideally, these should all work together.

5. What about maintenance and development?

The goal is to reuse as much of the underlying architecture as possible while keeping the user experience focused on two different workflows: building complete pages quickly with Frames and building custom layouts using individual Components.

Ultimately, I want users to have a choice. Someone who wants to build a website quickly can use Frames, while someone who wants more granular control, or wants to work with AI to assemble unique layouts, can use Components.

The bigger vision isn't simply to create another Divi layout library. It's to build an ecosystem where design systems, reusable components, complete layouts, and AI all work together.