In early 2025, our team at Hotovo faced a challenge that will sound familiar to anyone maintaining enterprise software: delivering an AI-assisted frontend migration from a legacy stack to React. The system had hundreds of UI screens. The codebase was a decade old. And the team couldn’t stop shipping new features to do it.

The client was Protecht, an Australian enterprise risk management company we’ve worked with since 2011. Their platform serves governments, regulators, and businesses worldwide.

The migration had to be seamless, secure, and fast.

We decided to use AI-assisted frontend migration not as an experiment, but as a core part of the migration workflow. Here’s what we learned.

The challenge: hundreds of screens, zero room for downtime

Protecht’s ERM platform had accumulated significant technical debt in its UI layer. The business needed a modern React frontend to improve development velocity, attract talent, and support future features. But the migration had hard constraints:

1. Feature development could not stop. Revenue depended on continued delivery.
2. The output had to match the existing UI pixel-for-pixel — a 1:1 design migration using the React component library our team had built and refined over five years.
3. Strict data security requirements meant not all AI tools were viable. We needed to vet providers for compliance.
4. A 10-developer team needed to adopt new AI workflows without a productivity dip during onboarding.

Our approach: AI as a structured engineering tool, not a magic wand

We did not simply hand developers ChatGPT and say “go faster.” We designed a systematic AI-assisted frontend migration workflow with five components:

1. Context engineering: We invested upfront in teaching the AI models how we work. This meant defining rules and memory banks so the LLMs understood our coding conventions, component library patterns, and architectural decisions. When the model generated code, it generated code our way — not generic React patterns.
2. Prompt engineering for migration tasks: We developed a library of reusable prompts specifically for screen migration: analyze the legacy component, identify its data dependencies, map it to our React component library, generate the new component, and generate the corresponding test. Each prompt was iterated and validated against real screens before being rolled out to the team.
3. Model Context Protocol (MCP) integration: We used MCPs to give the AI models access to our codebase structure, component documentation, and design system. This dramatically reduced hallucination and improved the relevance of generated code.
4. Custom AI personas: We created specialized personas for different migration tasks: one for component analysis, one for code generation, one for test writing, one for review. Each persona had different system prompts, context windows, and quality thresholds.
5. Human approval gates: Every AI-generated artifact went through our standard code review process. The AI accelerated production; humans ensured quality. We maintained a strong focus on planning and execution, including writing tests and reviewing code during the approval phase.

The tools we chose

After evaluating multiple options for security, quality, and integration capability, we settled on:

1. IDE: VS Code with Roo Code for inline AI assistance
2. LLM provider: Requesty (for routing and compliance)
3. Most-used models: Claude Sonnet 3.7, Claude Sonnet 4, and Gemini 2.5 Pro

The model selection was deliberate. Claude excelled at understanding existing code patterns and generating architecturally consistent React components. Gemini was strongest for documentation-heavy tasks and test generation. We used both, routed by task type.

Results: what the numbers looked like

AI-assisted frontend migration exceeded what both Hotovo and Protecht expected:

1. 60%+ boost in developer efficiency — measured by screens migrated per developer per sprint compared to manual migration baseline.
2. Significant cost savings on the migration through reduced manual refactoring.
3. Zero disruption to ongoing product development. The two tracks — migration and feature delivery — ran in parallel throughout.
4. Faster onboarding of the AI-enhanced workflow than the client anticipated. The full 10-developer team was productive within the first sprint.
5. A future-ready architecture for scalable growth on a modern stack.

What we’d do differently next time

If we were starting this project today, we would invest even more in the context engineering phase. The quality of AI output is directly proportional to the quality of context it receives. The teams that treat AI assistants like junior developers — giving them clear instructions, relevant context, and explicit constraints — get the best results.

We would also formalize the evaluation step earlier. We now run structured evals on prompt effectiveness, measuring not just whether the generated code compiles but whether it meets our component library’s patterns, handles edge cases, and produces clean test coverage.

The bigger takeaway

AI code assistants are not a replacement for engineering discipline. They are an amplifier. The 60% efficiency gain we achieved was possible because we had a mature codebase, a well-defined component library, clear migration patterns, and a team that understood what good output looks like.

Without that foundation, the same tools would have produced faster garbage. The AI made our team more productive because our team was already structured for productivity.

We’ve been working with Protecht since 2011. It’s been a 15-year journey through technology shifts, architectural changes, and now AI-assisted workflows. The partnership endures because both teams invest in doing things properly, even when there’s a faster shortcut available.

"I’ve been very impressed at their openness to innovate, their openness to collaborate. And not just be an organisation that’s there to do what they’re told, but an organisation that’s there to make our organisation much more technologically stronger." Matt Hyne, CTO at Protecht

If you’re considering AI-assisted migration for your own systems, we’re happy to share what we’ve learned. Reach out at sales@hotovo.com or visit our AI integration services page.