Kaizen Teams

Dropdown
Dropdown arrow for the table of contents.

Table of Contents

Dropdown
Clock icon for reading time.
Time to read

·

12

Calendar icon for the publish date.
Published on

·

May 5, 2025

Refresh icon for the last updated date.
Last updated on

·

August 18, 2026

Valentina Ibinete, Marketing Lead at Kaizen Softworks

Valentina Ibinete

LinkedIn icon.

Travel magnet collector

Marketing Lead

AI

AI

Technology

Technology

From Prompt to Prototype in Minutes: Code with Windsurf Editor

Calendar icon for the publish date.
Published on

·

August 18, 2026

Refresh icon for the last updated date.
Last updated on

·

August 18, 2026

Clock icon for reading time.
Time to read

·

12

Valentina Ibinete, Marketing Lead at Kaizen Softworks

Valentina Ibinete

LinkedIn icon.

Marketing Lead

If you're curious about where AI is headed in software development, it's time to pay attention to Windsurf: an IDE powered by artificial intelligence that feels less like a tool and more like a copilot.

In our previous blog post, we went over the basics of what’s Windsurf and how it works. Now, let’s walk through a simple, step-by-step guide to help you get started.

Step 1: Plan Your Project

Before you jump into coding, take a step back and plan. This is where ChatGPT (or another conversational model) can shine. Use it to brainstorm ideas, organize your thoughts, and shape your prompt.

Let’s say you want to build a chatbot. You can ask ChatGPT to help you structure a well-defined prompt tailored for Windsurf.

🔍 Pro tip: The more complex or abstract your prompt is, the higher the chance of messy or overly generic code. If long-term maintainability matters, spend time writing a thoughtful prompt.

Step 2: Choose the Right Model

On the right side of the Windsurf interface, you’ll find Cascade, your AI copilot. Cascade can tap into several powerful foundation models:

Windsurf Editor interface showing options to select different AI models for coding assistance, including ChatGPT, Claude, and Gemini.

Each of these models brings its own strengths, and you can choose which one to use based on your goals or the task complexity. 

Some models, like Sonnet 3.7 (Thinking), use internal reasoning steps before generating final output. You’ll see the model “think out loud,” iterating on your prompt in real time. These “thinking” models are more resource-intensive and slightly slower, but they’re better at solving complex problems. 

However, they can sometimes overcomplicate things or drift off-track. A helpful strategy is to use them for ideation and problem-solving, then switch to a faster, more direct model for implementation.

🧠 Is one model better than the others? Sometimes. But results are non-deterministic. The best way to find what works is to experiment with models and prompt variations.

Step 3: Give Windsurf the Right Context

Windsurf starts every session with a clean slate. This means it doesn’t remember anything you’ve said in past conversations.

Just like you would explain things to a new teammate, you’ll need to provide all the relevant information upfront before asking it to write code. For example:

If you're building a chatbot, you might begin by asking Windsurf to read a README file so it understands the system’s specs and expected behavior.

Context is everything. Without it, Windsurf can’t generate helpful code. Here’s how to provide the right context:

  • Upload or paste documentation (README, API references, etc.)
    • Pro tip, ask Windsurf to generate the README file and documentation in MD format, and then edit it accordingly
  • Use features like rules and memories to keep recurring information handy
Windsurf Editor user interface with the Cascade AI agent in the sidebar, illustrating how users provide context for AI-assisted coding tasks, in this case, continuing integration tests.

⚠️ Reminder: Windsurf doesn’t retain information between sessions unless you explicitly use memory or rule features. Be intentional and include all necessary context up front.

Want to go deeper? Check out our dedicated blog post on giving Windsurf proper context.

Step 4: Paste Your Prompt

Once you’ve set the context, paste your prompt into the same conversation thread. From here, Windsurf takes over, picking the right tools, building your code step by step, and shows you its thinking along the way. 

Before making any changes to the code, always present the plan and ask for confirmation.” That way, we can review it, and models don’t go ahead and make changes on their own. So that’s a rule we should always stick to.

You can ask for edits, improvements, or further explanations as you go.

Step 5: Run Your App on Localhost

One of Windsurf’s most powerful features is its ability to generate full-stack applications (frontend and backend) in just minutes. It can:

  • Configure your environment
  • Generate working code
  • Run it locally using the “One Shot” flow

One Shot = one solid prompt → full app prototype

This is fantastic for prototyping and fast iteration. But it’s not a replacement for good software engineering practices.

💡 Important: One Shot outputs aren’t production-ready. Always review the code. AI can take you far, but great software still needs great developers behind it.

Step 6: Make Changes & Refine

Windsurf extends beyond the chat interface by offering intelligent autocompletion within the code editor, providing contextually relevant suggestions as you type.

Plus, there's this cool shortcut: Command + L. By selecting a portion of code and using this command, you can then enter instructions such as "comment this function," and Windsurf will propose the corresponding modification.

For every change Windsurf suggests, a little window will show up where you can check out the proposed code edits and either click "Accept" or "Decline".

Now, here's the deal: If you don't like what Windsurf makes and you just keep telling it to change stuff over and over, it can start adding a bunch of extra, messy code. It will keep adding new styles without getting rid of the old ones. It can get into this weird loop where it just keeps piling on code, and you won't even know what's being used and what's just junk.

Think about it this way: when you come back to your project tomorrow, Windsurf won't remember any of your previous chats. So, it'll use its search tool, find some old style that's not even being used, and try to change that instead. Then, nothing works, and you're wondering what's going on.

Remember, Windsurf's memory is short. It's like saying "hi" and having to introduce yourself again the next time. That's why writing clean, organized code makes it way easier for Windsurf's search tools to do their job right.

So, one of the best ways to handle this is to go back a step. You can literally tell Windsurf, "Forget that," using the "truncate conversation" feature. It's pretty sweet because you can hit "Revert this step," confirm it, and Windsurf will not only forget what it just did but also undo the code changes.

Bottom line: It's usually better to tweak your original prompt and go back than to keep asking Windsurf to fix something you didn't like in the first place. 

Wrap Up

Start small. Test different models. And most importantly, don’t skip the human touch. Even with powerful AI, great software still depends on great developers.

👉 Next up: We'll walk through the best ways to give Windsurf context so you can get even more of its potential.

If you're curious about where AI is headed in software development, it's time to pay attention to Windsurf: an IDE powered by artificial intelligence that feels less like a tool and more like a copilot.

In our previous blog post, we went over the basics of what’s Windsurf and how it works. Now, let’s walk through a simple, step-by-step guide to help you get started.

Step 1: Plan Your Project

Before you jump into coding, take a step back and plan. This is where ChatGPT (or another conversational model) can shine. Use it to brainstorm ideas, organize your thoughts, and shape your prompt.

Let’s say you want to build a chatbot. You can ask ChatGPT to help you structure a well-defined prompt tailored for Windsurf.

🔍 Pro tip: The more complex or abstract your prompt is, the higher the chance of messy or overly generic code. If long-term maintainability matters, spend time writing a thoughtful prompt.

Step 2: Choose the Right Model

On the right side of the Windsurf interface, you’ll find Cascade, your AI copilot. Cascade can tap into several powerful foundation models:

Windsurf Editor interface showing options to select different AI models for coding assistance, including ChatGPT, Claude, and Gemini.

Each of these models brings its own strengths, and you can choose which one to use based on your goals or the task complexity. 

Some models, like Sonnet 3.7 (Thinking), use internal reasoning steps before generating final output. You’ll see the model “think out loud,” iterating on your prompt in real time. These “thinking” models are more resource-intensive and slightly slower, but they’re better at solving complex problems. 

However, they can sometimes overcomplicate things or drift off-track. A helpful strategy is to use them for ideation and problem-solving, then switch to a faster, more direct model for implementation.

🧠 Is one model better than the others? Sometimes. But results are non-deterministic. The best way to find what works is to experiment with models and prompt variations.

Step 3: Give Windsurf the Right Context

Windsurf starts every session with a clean slate. This means it doesn’t remember anything you’ve said in past conversations.

Just like you would explain things to a new teammate, you’ll need to provide all the relevant information upfront before asking it to write code. For example:

If you're building a chatbot, you might begin by asking Windsurf to read a README file so it understands the system’s specs and expected behavior.

Context is everything. Without it, Windsurf can’t generate helpful code. Here’s how to provide the right context:

  • Upload or paste documentation (README, API references, etc.)
    • Pro tip, ask Windsurf to generate the README file and documentation in MD format, and then edit it accordingly
  • Use features like rules and memories to keep recurring information handy
Windsurf Editor user interface with the Cascade AI agent in the sidebar, illustrating how users provide context for AI-assisted coding tasks, in this case, continuing integration tests.

⚠️ Reminder: Windsurf doesn’t retain information between sessions unless you explicitly use memory or rule features. Be intentional and include all necessary context up front.

Want to go deeper? Check out our dedicated blog post on giving Windsurf proper context.

Step 4: Paste Your Prompt

Once you’ve set the context, paste your prompt into the same conversation thread. From here, Windsurf takes over, picking the right tools, building your code step by step, and shows you its thinking along the way. 

Before making any changes to the code, always present the plan and ask for confirmation.” That way, we can review it, and models don’t go ahead and make changes on their own. So that’s a rule we should always stick to.

You can ask for edits, improvements, or further explanations as you go.

Step 5: Run Your App on Localhost

One of Windsurf’s most powerful features is its ability to generate full-stack applications (frontend and backend) in just minutes. It can:

  • Configure your environment
  • Generate working code
  • Run it locally using the “One Shot” flow

One Shot = one solid prompt → full app prototype

This is fantastic for prototyping and fast iteration. But it’s not a replacement for good software engineering practices.

💡 Important: One Shot outputs aren’t production-ready. Always review the code. AI can take you far, but great software still needs great developers behind it.

Step 6: Make Changes & Refine

Windsurf extends beyond the chat interface by offering intelligent autocompletion within the code editor, providing contextually relevant suggestions as you type.

Plus, there's this cool shortcut: Command + L. By selecting a portion of code and using this command, you can then enter instructions such as "comment this function," and Windsurf will propose the corresponding modification.

For every change Windsurf suggests, a little window will show up where you can check out the proposed code edits and either click "Accept" or "Decline".

Now, here's the deal: If you don't like what Windsurf makes and you just keep telling it to change stuff over and over, it can start adding a bunch of extra, messy code. It will keep adding new styles without getting rid of the old ones. It can get into this weird loop where it just keeps piling on code, and you won't even know what's being used and what's just junk.

Think about it this way: when you come back to your project tomorrow, Windsurf won't remember any of your previous chats. So, it'll use its search tool, find some old style that's not even being used, and try to change that instead. Then, nothing works, and you're wondering what's going on.

Remember, Windsurf's memory is short. It's like saying "hi" and having to introduce yourself again the next time. That's why writing clean, organized code makes it way easier for Windsurf's search tools to do their job right.

So, one of the best ways to handle this is to go back a step. You can literally tell Windsurf, "Forget that," using the "truncate conversation" feature. It's pretty sweet because you can hit "Revert this step," confirm it, and Windsurf will not only forget what it just did but also undo the code changes.

Bottom line: It's usually better to tweak your original prompt and go back than to keep asking Windsurf to fix something you didn't like in the first place. 

Wrap Up

Start small. Test different models. And most importantly, don’t skip the human touch. Even with powerful AI, great software still depends on great developers.

👉 Next up: We'll walk through the best ways to give Windsurf context so you can get even more of its potential.

Related Articles

View all articles
AI
UX Design
Victoria Santos, Content Strategist at Kaizen Softworks

Victoria Santos

·

Oct 23, 2026

How to build high-fidelity prototypes with AI

How a design system lets Marketing and Product teams use AI to build on-brand prototypes, based on Kaizen’s own experience and turnaround numbers.

Clock icon for reading time.

12 read time

Read more

AI makes it easier for more people across a company to create a first visual version without relying on Design for every step.

Marketing can generate campaign assets. Product managers can turn ideas into prototypes. Teams can make an idea visible earlier in the process.

That creates a new design problem.

If more people can create, how do you make sure the output still reflects the decisions Design has already made about hierarchy, typography, spacing, composition, and brand?

A design system can help.

When its rules, components, templates, and examples are available to AI tools, other teams can create within boundaries Design has already defined.

Design does not have to build every first version. It can focus on reviewing important decisions and improving the system when recurring problems appear.

A design system can carry judgment beyond the Design team

A design system gives teams shared rules for creating consistent work.

It can define:

  • Color, typography, spacing, and composition.
  • Components and how they behave.
  • Templates for recurring layouts.
  • Examples that show how those decisions work together.

That context is useful for AI too.

Without it, someone creating a page, presentation, or social post has to explain what “on brand” or “well designed” means in a prompt.

With a design system, many of those decisions are already documented. AI has a reference for how content should be structured, which components belong together, and what kinds of compositions fit the brand.

Teams get a starting point that is closer to the company’s existing visual language without having to describe it from scratch.

What this can look like across teams

Marketing can create recurring assets with less production dependency

Marketing often works with recurring formats such as social posts, campaign pages, and event assets.

Templates can give the team enough structure to create a usable first version independently. A social template, for example, can define typography, spacing, image treatment, and composition while leaving room for the content to change.

Design can then focus its review on the decisions that need attention.

Product teams can make ideas visible earlier

Product managers often need something visual before they need production-ready design.

If an AI tool has access to the same components and rules the product already uses, a PM can create a rough prototype that is closer to the real product than a generic wireframe.

The prototype is not a design direction by itself. It gives Product and Design something concrete to discuss.

Instead of spending time explaining what an idea might look like, they can focus on whether the flow makes sense, what needs to change, and where deeper design work is needed.

Generated work can show where the system is weak

AI does not only use the design system. Its output can also reveal where the system needs more guidance.

We saw this while using our own design system with AI at Kaizen.

Our Design team created the system while redesigning the Kaizen website. It documented the site’s colors, typography, composition rules, components, and templates. Marketing later began using that same system with AI to create website prototypes and social content.

One pattern kept appearing.

The AI put almost everything inside boxes.

Text, images, and entire sections appeared inside containers, even when a more open composition would have worked better.

Design reviewed the source material and found that many of the examples and rules leaned toward contained compositions. The AI was reproducing the patterns it had been given.

The team added guidance and examples for other layout approaches. The generated work became more varied and used more open compositions.

Instead of correcting the same problem in each new asset, the team improved the guidance that influenced future outputs.

That is one of the useful side effects of this process: recurring corrections can point to gaps in the system itself.

Autonomy still needs boundaries

Giving more people the ability to create does not mean every deliverable should follow the same workflow.

A recurring social post built from an established template may only need a quick review. A new product workflow may need much more involvement from Product and Design before anyone treats the prototype as a direction.

Teams can start by agreeing on three things:

What can teams create independently?

Identify recurring formats where the main design decisions are already understood.

What needs Design review?

Decide which outputs need a light check and which need deeper involvement.

What should go back into the system?

When the same correction happens repeatedly, update the shared rule, component, template, or example.

These boundaries make it clear where teams can move independently and where Design’s judgment is still needed.

What this changed for us at Kaizen

Before introducing this process, a LinkedIn visual could take more than two weeks from request to delivery once other priorities, coordination, review, and revisions were included.

We now estimate that a similar piece can move from copy to something ready to publish in about one afternoon.

For website work, a process that previously took around two weeks can now start with a Marketing-generated prototype in about two days, followed by roughly two days of Design refinement and production.

These are elapsed turnaround estimates, not active design hours. Reusable templates, the design system, clearer responsibilities, and the review process all contribute to the difference.

The biggest change is where the work starts.

Marketing can reach a concrete first version sooner. Design can spend more time refining important decisions and improving the system that will influence the next piece too.

For teams exploring this approach, start with one repeatable format.

Define the rules, examples, and templates needed to create a reasonable first version. Agree on where Design should enter the process. Then pay attention to recurring corrections.

If the same typography, layout, or composition problem keeps appearing, improve the shared guidance instead of fixing the same issue every time.

The goal is to make Design’s decisions reusable while keeping Design involved where its judgment matters most.

If you are working through the same questions, we can help you turn your existing design decisions into practical rules, templates, and review workflows your teams can use with AI.

‍

Technology
AI
Victoria Santos, Content Strategist at Kaizen Softworks

Victoria Santos

·

Oct 21, 2026

How to modernize legacy software without disrupting daily operations

How to modernize legacy software without disrupting daily operations: migration strategy, defining requirements, user validation, and where AI actually helps.

Clock icon for reading time.

12 read time

Read more

Legacy software does not become a problem just because it is old.

It becomes a problem when it starts limiting the business.

In one of our modernization projects, a legacy application was still central to the client's product. Customers used it every day to search and book flights, hotels, transportation, and other travel services.

But maintaining it had become expensive. Routine changes took too long, the technology was no longer supported, and the application struggled to meet current accessibility, usability, and security requirements.

The company needed to replace it without interrupting the customers who depended on it.

There is no single right way to modernize legacy software. The right approach depends on how the system works, how users depend on it, and what it will cost to run the old and new systems during the transition.

TLDR

  • Modernize when the existing system is creating business problems, not simply because the technology is old.
  • Compare incremental migration with building the replacement separately.
  • Treat legacy code as a reference, not the specification.
  • Define scope, expected behavior, and acceptance criteria clearly.
  • Validate the replacement with real users before broad migration.
  • Treat launching the new system and retiring the old one as separate milestones.
  • AI can speed up implementation, but it cannot resolve unclear requirements.

Start with the business problem

An old system may still serve the business well.

Modernization becomes more urgent when maintaining it starts getting in the way of what the company needs to do.

Common signs include:

  • Routine changes taking too much engineering time.
  • Security or compliance requirements becoming harder to meet.
  • Integrations becoming difficult to maintain.
  • Customer requests becoming expensive to deliver.
  • Teams avoiding necessary changes because they fear breaking the system.

These problems give the modernization a purpose.

Instead of asking, “How do we rebuild this application in newer technology?”, ask:

What constraints does the replacement need to remove?

That question helps keep the project focused on business needs rather than technology for its own sake.

Decide how the old and new systems will coexist

One of the first decisions is whether to migrate gradually or build the replacement separately.

An incremental migration can work well when parts of the system can move independently. But it also means the old and new applications may need to work together for months.

That temporary architecture has a cost.

In this project, the team initially considered releasing parts of the replacement while the rest of the product remained in the legacy application. They even started working that way.

But the approach introduced additional complexity. Each new feature needed to work alongside the legacy system, requiring compatibility, security, and interoperability work that would eventually have to be removed. With tight deadlines, the extra development effort and future maintenance costs made this approach impractical.

The team decided to build the replacement separately while keeping the legacy application in production. Once the new application was ready, selected customers began using it and reporting issues or missing functionality before the broader migration.

In other projects, moving functionality gradually has made more sense because workflows could be separated cleanly.

The useful question is:

What temporary work does each migration strategy create?

If gradual migration requires months of disposable compatibility work, a separate replacement may be easier to control. If capabilities can move independently, incremental migration may reduce risk.

Make that trade-off explicit before development starts.

Treat legacy code as evidence, not the specification

One of the hardest questions in a modernization is simple:

What should the new system actually do?

“Make it work like the old system” is not enough.

Legacy code can show developers how something was implemented. It cannot always explain which behaviors still matter, why exceptions exist, or what users depend on today.

For each piece of work, define:

  • The scope.
  • The expected behavior.
  • Acceptance criteria.
  • Representative use cases or test cases.

Instead of writing:

“Recreate the functionality from the legacy application.”

Start by defining what the user needs to accomplish. Then describe the steps they take, what information they need to see, how the application should respond, and how the team will verify that the feature works as expected.

Modernization projects will uncover missing details. When they do, make the new work visible instead of quietly expanding the task already in progress.

Protect the team's capacity

Keeping the legacy system running while building its replacement creates two workloads.

Production support can quickly compete with modernization work, especially when the same engineers understand both systems.

Before committing to a schedule, decide:

  • Who supports the legacy application?
  • Which legacy improvements still need to happen?
  • Which requests can wait?
  • How much modernization capacity is protected?
  • What happens when a production issue interrupts the plan?

A deadline is more useful when the capacity behind it is clear.

Validate the replacement with real users

Development being complete does not mean the migration is complete.

Before moving everyone, selected customers on this project used the replacement in their real workflows.

They found bugs, missing information, and behaviors the development team had not anticipated.

Technical completeness does not guarantee that users can complete their work.

Before broad rollout, test realistic tasks with real users. Find out where information is missing, which workflows break down, and where people still need the old system.

Separate launch from legacy shutdown

A migration rarely happens in one event.

The replacement may already be serving customers while the team continues fixing gaps and moving the remaining users.

Treat these as separate milestones:

  1. The replacement is ready for testing.
  2. The replacement is ready for production users.
  3. Customers no longer depend on the legacy system.

Before retiring the old application, confirm that users can complete their important workflows, support teams can resolve problems in the new system, and customers no longer need to return to the legacy application.

If users keep going back, find out why.

The replacement may be missing functionality, require more training, or make an existing task harder.

Migration success is not simply having the new application in production.

It is reaching the point where people can stop depending on the old one.

AI makes clear requirements more important

AI was introduced partway through this modernization project and helped the team implement work faster.

It worked best when the task was already clear.

With defined scope, acceptance criteria, and test cases, developers could use AI to produce more of the implementation and spend more time reviewing the code and checking the expected behavior.

Ambiguous requirements stayed ambiguous.

AI can reduce the effort required to produce code. It cannot decide which legacy behavior matters or what the replacement should do.

As implementation gets faster, understanding the system and defining the work become even more important.

Plan the migration, not just the deadline

A delivery date is not a migration plan.

Teams also need to understand:

  • Which pieces of work depend on each other.
  • What can happen in parallel.
  • Where the biggest unknowns are.
  • How much capacity is available.
  • What must happen before users can migrate.

The plan will change as the team learns more about the legacy system. Having one still gives the team a way to understand whether the deadline remains realistic.

What should be clear before modernization starts?

Before committing to a migration plan, answer four questions:

Why are we modernizing?

Identify the business constraints created by the existing system.

How will the old and new systems coexist?

Compare the temporary cost and risk of each migration approach.

How will expected behavior be defined and validated?

Document acceptance criteria and representative use cases, then test them with real users.

What needs to be true before the old system can be retired?

Define this separately from the launch of the replacement.

Any question the team cannot answer identifies work that should happen before rollout.

Modernization should remove constraints, not reproduce them

A legacy application is an important source of information, but it should not dictate every decision about its replacement.

Understand which business rules still matter. Make expected behavior explicit. Choose a migration strategy based on the real dependencies between the old and new systems. Then validate the replacement with the people who will depend on it.

The goal is not simply to replace old technology.

It is to leave the business with software that is easier to change, support, and rely on.

If you're planning a legacy modernization and need help understanding the existing system, comparing migration strategies, or defining a path to the replacement, let’s start a conversation.

‍

llms.txt