The biggest AI opportunity in web development might not be the next shiny app.
It might be the old one your company is afraid to touch.
Every day, businesses run on software that still works but no longer feels modern: old admin panels, internal CRMs, Laravel dashboards built years ago, Blade views nobody wants to refactor, reporting tools with confusing filters, support screens with too many columns, and customer portals that still make money but slow down every new feature.
That is where things get interesting.
Most AI conversations focus on building something new from scratch. A founder has an idea, generates a prototype, writes code with an AI assistant, connects a model API, and launches an MVP.
That is a real use case, and it matters.
But most software work does not start with a blank repository. It starts with an existing product, existing users, existing data, existing bugs, existing business rules, and years of decisions that made sense at the time.
AI is not just a startup accelerator.
It is becoming a modernization engine.
The next wave of AI in web development will not only be about launching new products faster. It will also be about upgrading the products companies already depend on.
The real opportunity is not another chatbot
A lot of “AI-powered” products follow the same pattern: take an existing app, add a chat window, and call it innovation.
That is not enough.
A support dashboard does not need a chatbot in the corner. It needs ticket summaries, priority detection, suggested replies, and better routing.
A CRM does not need a generic assistant. It needs account summaries, follow-up suggestions, risk signals, and smarter search.
An accounting tool does not need AI decoration. It needs invoice classification, document extraction, anomaly detection, and review workflows.
The best AI features do not feel like separate products. They feel like the existing product got smarter.
AI should not sit next to the product. AI should make the product better.
That is the key difference.
AI should remove friction from the workflow people already use every day. It should reduce repetitive work, surface useful context, help users make decisions faster, and keep humans in control where judgment matters.
There are two AI development paths now
AI is changing product development in two very different ways.
The first path is greenfield development. This is the startup path. You begin with an idea, write a product brief, explore the interface in Figma, create a functional prototype, validate the flow with users, then build the real application with Laravel, an AI coding agent, and the Laravel AI SDK.
This is powerful because the cost of going from idea to working product has dropped dramatically.
The second path is brownfield modernization. This is the path most real companies need. You already have a working product. Maybe it is profitable. Maybe users rely on it every day. But the UI feels outdated, the codebase has too many patterns, the product is hard to extend, and every improvement feels risky.
This path is not about moving fast and breaking things.
It is about improving one valuable workflow at a time without breaking the business.
Same tools. Different mindset.
- For a new product, the question is: how quickly can we validate this idea?
- For an existing product, the question is: how can we make this system better without turning modernization into a six-month rewrite?
AI helps with both, but the second opportunity may be much larger.
Start with the workflow, not the model
The biggest mistake teams make is starting with the tech stack.
They ask which model to use, which IDE assistant is better, whether to use React or Livewire, whether they need vector search, or whether they should build an agent.
Those questions matter, but they are not the starting point.
The starting point is the workflow.
- What does the user do every day?
- Where do they waste time?
- Where do they copy and paste?
- Where do they wait?
- Where do they make mistakes?
- Where do they need context before making a decision?
- Which part of the workflow is repetitive enough to automate but important enough to improve?
“Modernize our app” is too vague.
“Help support managers review, prioritize, and respond to tickets faster” is specific.
That kind of problem gives every tool a clear job.
Figma helps rethink the user experience. Figma Make helps test the improved flow before production work starts. Figma MCP helps move real design context into the coding environment. An AI coding agent helps inspect the existing codebase and implement focused changes. Laravel provides the application structure. Laravel AI SDK adds intelligent behavior where it actually belongs.
That is a real workflow.
Figma agents are becoming real product tools
Figma’s recent AI updates are important because the agent is no longer just a prompt box that creates a few screen ideas.
Figma has been expanding its design agent with more context, custom tools, reusable skills, and deeper connections to design and development workflows. This direction moves beyond simple prompting toward agents that understand how a team works, use broader project context, and help create reusable tools directly on the canvas.
For modernization work, this matters because context is everything.
If you are redesigning an old support dashboard, you do not want a random “modern SaaS UI.” You want a better version of the actual workflow your team already uses.
That means the agent should understand the current screen, the design system, user feedback, accessibility rules, product requirements, and the business goal behind the redesign.
This is where Figma’s agent becomes useful. It does not replace the designer. It helps the team move from vague feedback to concrete options faster.
Instead of starting from a blank canvas, a team can explore several improved versions of the same workflow, compare them, clean up the hierarchy, standardize components, and create better empty, loading, and error states.
The goal is not to make the old screen prettier.
The goal is to make the workflow easier to understand and faster to use.
Code layers make design and code feel closer
Another important Figma update is code layers.
Code layers bring interactive code onto the Figma canvas. Teams can create a code layer from a frame, ask the Figma agent to generate one, bring in a repository, or upload a local folder. This creates workflows where teams can compare, refine, and update code layers alongside normal design work.
This is especially interesting for legacy products.
Historically, modernization projects often started with screenshots of the old product. Screenshots are useful, but they are dead artifacts. They do not show real behavior, real state, real components, or the connection between design and implementation.
Code layers make the design conversation more practical.
Designers, developers, and product managers can compare the current experience with a proposed future experience in a more interactive way. They can discuss what is purely visual, what requires frontend work, and what depends on backend logic.
This does not mean Figma becomes your production IDE.
It means the gap between “what exists,” “what we designed,” and “what we plan to build” gets smaller.
Figma MCP reduces design-to-code guesswork
Design-to-code has always had a translation problem.
A designer creates a screen. A developer interprets it. Something gets lost. Spacing changes. Components get duplicated. States are forgotten. A table gets rebuilt from scratch even though the app already has one. A modal looks almost like the design system, but not quite.
AI can make this worse if it only works from screenshots or vague prompts.
That is why the Figma MCP Server matters.
Figma MCP can provide AI agents with design context from Figma files, including selected frames, components, variables, layout data, and resources from Figma Make files.
For modernization, the coding agent needs to understand two worlds at the same time:
- the existing Laravel application;
- the new Figma design direction.
If the agent only understands the old code, it may preserve outdated UI patterns. If it only understands the new design, it may produce code that does not fit the actual application.
But when it has both design context and codebase context, it can make more precise changes.
That is when AI becomes useful in real projects.
Not as a magic generator, but as a context-aware assistant.
Code Connect helps prevent component chaos
One of the easiest ways to damage a codebase with AI is to let it create duplicate components.
A new button. A new card. A new modal. A new table. A new dropdown. A new form pattern.
None of them are terrible alone, but together they create a maintenance problem.
After a few weeks, the app may look “AI-modernized,” but the codebase is harder to maintain than before.
Code Connect helps by linking Figma components to real code components. It connects design components with their implementation in code, which helps teams keep design and engineering aligned.
The button in Figma should map to the real button in code. The modal should use the existing modal. The table should follow the existing table pattern. The badge should not be recreated five different ways.
In a new product, this keeps things clean from the beginning.
In a legacy product, it is even more important because modernization should reduce inconsistency, not add more.
AI agents need boundaries. A connected design system gives them those boundaries.
AI in PhpStorm and other IDEs belongs in the real developer workflow
After the new flow is validated in Figma, the work moves into the IDE.
For PHP teams, PhpStorm is one of the most natural places for AI-assisted development. JetBrains AI Assistant supports modern PHP development workflows such as generating and explaining PHP code, multi-file edits, intelligent completion, and AI chat with project context.
JetBrains also has Junie, an AI coding agent that can work in code mode to execute tasks and in ask mode to collaborate on plans and questions.
If your team does not use PhpStorm, the same workflow can work with alternatives such as Cursor, Claude Code, or GitHub Copilot.
The specific tool matters less than the operating model.
A bad prompt is:
Refactor this dashboard.
A better request is:
Explain how this workflow works today. Identify its routes, controllers, models, policies, frontend components, jobs, and tests. List the business rules that must be preserved. Then propose a modernization plan without editing any files.
The agent’s first job should be understanding, not implementation.
After the plan is reviewed, let it change one vertical slice at a time. A ticket detail screen is a reasonable task. An entire support system is not.
Laravel now has an AI stack, not just an AI package
Laravel is especially interesting in this workflow because it has structure.
Routes have a place. Controllers have a place. Models have a place. Migrations have a place. Policies have a place. Jobs have a place. Tests have a place.
That structure helps humans, but it also helps AI agents.
Laravel’s AI tooling now operates at several layers.
Laravel Boost helps AI coding agents write better Laravel code by giving them Laravel-specific context, guidance, and project-aware tools.
Laravel AI SDK helps developers build AI features inside Laravel applications. It provides a Laravel-native way to build AI-powered features with providers, agents, tools, structured output, embeddings, vector workflows, and more.
Laravel MCP helps AI clients and agents interact with tools and resources exposed by Laravel applications. Laravel AI agents can also connect to MCP servers and work with external systems.
These tools solve different problems:
- Boost helps AI write the application.
- AI SDK helps the application use AI.
- MCP helps AI interact with the application and external systems.
A production project may use all three, but it should not install all three simply because they exist.
Start with the workflow. Then choose the tool.
AI can help with framework upgrades too
Legacy modernization is not only about redesigning screens.
It often includes framework upgrades, package updates, new PHP versions, deprecated APIs, test-suite changes, and cleanup around old patterns.
AI-assisted upgrade workflows can help teams compare package versions, follow official upgrade guidance, update repetitive code, run the test suite, and report what still fails.
That does not make an upgrade automatic or risk-free.
An AI agent cannot know every undocumented production dependency, every unusual database record, or every client-specific behavior.
But it can turn an upgrade from a manual search-and-replace exercise into a structured engineering loop.
The team still owns the final diff.
Tests are the safety system for AI-assisted modernization
AI is useful in legacy work only when it makes change safer.
Before asking an agent to refactor old code, use it to help document and test the existing behavior.
These are often called characterization tests: they capture what the application does today, including behavior the team may not fully understand.
For an old support dashboard, that might include authorization rules, filters, sorting, ticket assignments, status transitions, notifications, exports, and tenant isolation.
Once those behaviors are protected, the agent can refactor with a clear signal when something breaks.
AI assistants can help generate unit tests in the IDE and show proposed test code for review.
But this part is important: an AI-generated test is not automatically a good test.
Sometimes the test simply repeats the same wrong assumption as the generated code. Sometimes it tests implementation details instead of behavior. Sometimes it misses authorization, edge cases, failure states, or multi-tenant boundaries.
The developer still needs to ask:
- Is this testing behavior or implementation details?
- Does it cover authorization?
- Does it cover another tenant trying to access the record?
- Does it cover invalid and incomplete data?
- Does it cover failure and retry states?
- Would this test have caught the original bug?
- Did the agent weaken an assertion just to make the suite pass?
The goal is not more tests.
The goal is more confidence.
Laravel PAO makes the test loop better for agents
Laravel recently introduced PAO, or PHP agent-optimized output.
Test runners and analysis tools normally produce terminal output designed for humans: colors, progress dots, tables, warnings, and decorative formatting.
That output can waste context and make it harder for an AI agent to locate the actual failure.
Laravel PAO returns compact, structured output for supported commands when they are being run by an AI agent.
This sounds like a small feature, but it improves the most common agent loop:
- Run the tests.
- Find the failure.
- Edit the relevant code.
- Run the tests again.
When an agent receives the failing assertion, file, line number, and error details directly, it spends less time interpreting terminal noise and more time solving the actual problem.
AI features need their own testing strategy
Adding an AI-powered feature creates a second testing problem.
The application logic may be deterministic, but the model output is not.
Suppose the modernized support dashboard includes an AI-generated ticket summary. A normal test should not call a live provider and compare the exact paragraph returned by the model. That would be slow, expensive, and unreliable.
Instead, the regular application suite should test deterministic boundaries:
- Was the correct agent invoked?
- Was the job dispatched?
- Was tenant authorization enforced?
- Was the result stored in the correct record?
- Did the response match the expected structured schema?
- Was the failure state handled?
- Was an automatic action blocked until human approval?
Laravel AI SDK includes testing helpers such as fakes and assertions for AI operations, allowing teams to test application behavior without making uncontrolled live model calls.
Model quality should be evaluated separately.
Keep a small set of representative examples and expected qualities: correct category, acceptable summary, no invented facts, no cross-tenant data, appropriate escalation, and no unsafe action.
Unit tests protect the application.
Evaluations protect the AI behavior.
You need both.
A practical modernization flow
Imagine an old customer-support dashboard built in Laravel.
It still works, but the ticket table has too many columns, filters are inconsistent, the detail page is difficult to scan, and support managers spend too much time reading repetitive requests.
A practical AI-assisted modernization flow could look like this.
1. Protect the current behavior
Before redesigning anything, map the existing route, controller, policies, database queries, frontend components, jobs, and notifications.
Ask the coding agent to identify missing coverage, then add characterization tests for the behavior users depend on.
Do this before the refactor, not after it.
2. Redesign the workflow with Figma’s agent
Bring the current interface, user feedback, support metrics, design system, and project requirements into Figma.
Ask the agent to explore a cleaner ticket inbox and a more focused ticket detail page.
Create reusable rules or skills that enforce the team’s component, accessibility, and layout standards.
The goal is not a beautiful concept.
The goal is a better working day for the support team.
3. Validate the interaction
Use Figma Make or code-layer workflows to create a working version of the new flow.
Let real support managers use it.
Watch where they hesitate. Check whether the AI summary helps or distracts. Confirm which information they need before approving a suggested response.
Fix the workflow before rebuilding the backend.
4. Connect the design to the real codebase
Use Figma MCP to provide the selected design context to the coding agent.
Map important design components to production components with Code Connect.
The agent should know which table, button, modal, badge, and form components already exist.
5. Implement one vertical slice
In PhpStorm with Junie, or in Cursor, Claude Code, or GitHub Copilot, ask the agent to inspect the existing implementation and propose a plan.
Start with the ticket detail page. Keep the old route available. Ship the new version behind a feature flag. Run the existing and newly generated tests after every meaningful change.
Do not modernize the entire support module in one task.
6. Add one narrow AI feature
Once the new workflow is stable, add ticket summarization through Laravel AI SDK.
Do not begin with full automation. The first version can summarize the request, classify it, suggest urgency, and draft a response for human approval.
That is useful, measurable, and relatively safe.
7. Test, release, and measure
Fake model responses in the normal test suite. Evaluate model quality separately. Use agent-friendly test output to improve the feedback loop. Release the new workflow to a small group and measure review time, error rate, adoption, and support-team feedback.
Then decide whether the next investment should be smarter routing, suggested replies, better search, or simply another redesigned screen.
Guardrails matter more than prompts
A coding agent working in a legacy product should have explicit boundaries.
- It should not rewrite unrelated files.
- It should not introduce a new frontend framework without approval.
- It should not create duplicate components.
- It should not change the database schema without a migration and rollback plan.
- It should not weaken tests to make them pass.
- It should not bypass policies or tenant boundaries.
- It should not send sensitive production data to an external model without an approved data policy.
The agent can inspect, plan, implement, run tests, and review the diff.
The team still owns the architecture, security, product decisions, and release.
That is the real AI modernization stack: not one model and not one magic prompt, but a connected workflow with context at every stage.
Figma’s agent helps the team rethink the experience. Figma MCP and Code Connect carry design intent into development. PhpStorm, Junie, Cursor, Claude Code, or GitHub Copilot help engineers understand and change the codebase. Laravel Boost gives those agents framework-specific context. Laravel AI SDK adds useful intelligence to the product. Tests, fakes, evaluations, and agent-friendly output keep the process under control.
The goal is not to generate more code.
The goal is to improve valuable software without putting the business at risk.
At Kavita Systems, we help teams modernize existing web products, improve legacy Laravel workflows, and introduce practical AI features without committing to a risky full rewrite.
Need to understand where AI can create value in your existing product?
Top comments (0)