AI vs Visual Design Implementation in Xperience by Kentico Projects

Hi everyone,

I wanted to start a discussion about how AI and agentic development are changing our workflows in projects built with Xperience by Kentico.

In my experience, AI works extremely well for business logic and backend style tasks. My role has shifted toward orchestrating agents and reviewing generated code, and with MCP servers in place this becomes even more efficient.

Where I still see AI struggling is the visual to code phase. Clients often deliver custom visual designs without a design system, and turning those into production ready templates is still largely manual work. I have tried Figma based agents and similar tooling, but most of the time I end up cleaning things up myself.

At Kentico Connection I heard claims that front end or template coding roles are becoming obsolete. That might be true for generic designs, but for carefully crafted sites with strong art direction I am not convinced yet.

So I am curious:

  • How do you and your teams handle design to code today?
  • Are you using AI successfully in this phase?
  • Has your workflow or tooling changed in the last year?

Looking forward to hearing your experiences.

Tags:
CSS Developer tools HTML JavaScript
1

Answers

In my experience, AI works extremely well for business logic and backend style tasks.

If you mean "back office" styles, this has been my experience as well. Line-of-business apps are often forms-over-data driven user interfaces - as long as the forms work correctly and are legible, the styles and UX don't need a heavy hand.

Clients often deliver custom visual designs without a design system, and turning those into production ready templates is still largely manual work.

I imagine this will be common for awhile. Are those designs crafted to work well with AI tools or even human front-end developer workflows and best practices? There's still a lot of disconnect between web design and web design implementation.

At Kentico Connection I heard claims that front end or template coding roles are becoming obsolete.

I do believe this is happening, but it requires professionals that are vertically integrated (i.e. in the same team or agency), using the right tools, and understand how the deliverables of one person are used by the next in a workflow.

The Kentico Community Portal has a pretty simple design and still it needs some some TLC. I rely on an existing design system and components that I can quickly reuse and AI agents that quickly create several variants of new designs. I know some of the designs will look bad, but with enough variations to pick from there's always something that is acceptable.

If I was working on new designs... well, I wouldn't be 😅, I'd have a team to back me up and produce the assets, style guides, and components I use.

1

How do you and your teams handle design to code today?

For the Kentico projects, still largely manual. We are fortunate to work primarily with in-house designs built on an established design system. While it’s not flawless, having that structure allows us to feed component designs into AI to generate a "decent starting point." However, when a client provides a "free-form" design without a system, the AI struggle you described is very real.

Are you using AI successfully in this phase?

Success is currently tied to intent. If the wireframes and designs were created with a modular, component-based mindset, AI is a great accelerator. However, we find that maintenance and amendments remain manual. Feeding AI-generated code back into the project for changes is not something we've figured out how to do effectively and often creates more problems than it solves.

Has your workflow or tooling changed in the last year?

The biggest shift hasn't been the tools themselves, but the mindset of the roles. Designers are now more aware of how their deliverables (variables, tokens, auto-layouts in Figma) are consumed downstream. This is important in general, but moreso now if we have any hope of leveraging AI. Something as simple as making sure variables are used for border radius in Figma makes a massive difference down the line.

At Kentico Connection I heard claims that front end or template coding roles are becoming obsolete.

With regards to this, I don’t believe FE roles are becoming obsolete, but the boundaries are blurring and not only because of AI.

For example, tools like Figma, Framer and Plasmic, where UIs can be built without knowing how to code them, and can generate component libraries in whatever framework. From then, a back-end developer knows enough to be able to implement those component libraries without further input.

On the AI front, the focus for me is on how the FE role can expand. By leveraging AI to handle mundane, tedious tasks (like boilerplate HTML or basic CSS), our team can focus on higher-value work: test automation, building mock APIs, and deeper integration into the .NET/Razor environment.

2

Where I still see AI struggling is the visual to code phase. Clients often deliver custom visual designs without a design system, and turning those into production ready templates is still largely manual work.

I can't agree more. In my experience, many designers are yet to shift their ways of working to make their designs more "AI friendly".

Currently AI is more than capable of handling simple and "boring" frontend components that have very little logic in them, like text and images, simple galleries or carousels, accordions, etc.

However, when it comes to more sophisticated stuff like search with filters, facets, ordering and pagination; dynamic forms with validation - we see AI struggling because there are many interdependent moving parts. The worst is, when it looks like it's 80% complete, "fixing" the remaining 20% seems to be taking forever as agents tend to break other things while fixing a specific bug. And even providing a whole architectural context is not always helpful. That's why I think solving complex tasks remains a frontend crafting skill even in 2026.

3

Great thread, Milan.

I went through the same frustrations everyone's describing here. Reviewed over half a dozen Figma-to-code products. Most of them gave us exactly what you're all talking about: bloated code, arbitrary Tailwind classes, unnecessary CSS. The only way to improve the output was going back to Figma, restructuring layers, and retrying. Tedious and expensive.

But we kept looking and found approaches that produce genuinely good results. Our developers are actually impressed with the generated front-end code now, which was not the case six months ago.

The difference isn't whether AI can do it. It's the type of tool.

The products most of us tried first are one-shot conversion tools. Import design, click button, get code. No way to provide agent instructions or start with your own boilerplate. No real iteration on the output.

What works for us are tools that let you:

  • Provide rules and instructions for the agent before it starts
  • Begin with your own boilerplate code and patterns
  • Set up code-quality tooling (we use linting plugins that turn arbitrary Tailwind classes into build errors)
  • Let designers iterate on the output directly, without going back to Figma

That iteration piece is the big one. Designers give feedback, adjust styles, refine until the code matches their intent. Just like we iterate with agents on backend code.

Specifically what's working for us:

  • Builder.io Fusion lets us set up a repo with our tools and instructions first. Designers iterate and commit into git for review.
  • Claude Code with Figma MCP and Chrome DevTools MCP offers the same flexibility with a different workflow.

Both start with example code patterns, agent instructions, and code-quality tools.

The result is code that follows our team's patterns and migrates smoothly into Xperience by Kentico without the cleanup we got used to with the one-shot tools.

Dmitry, your point about complex interactive components is real. Search with filters, forms with validation, those are harder problems. However, we are making progress on that, too. The easy cases, are styling interactive components that are already in our boilerplate, like search and navigation. However, designers are even able to create new interactive components if the AI tools have rules, instructions, and quality checks that control the technical output.

It's not an easy button. There's setup work. But the output quality and the control you get over the process provided stunning results.

2

To response this discussion, you have to login first.