
Web and app prototyping: how AI is transforming the design of marketing journeys

Article updated in 2026.
Reading time: 10 min.
A landing page that can be browsed, a form that reacts to answers, a simulator that can be tried: prototyping brings an idea to life before undertaking its complete realization.
With artificial intelligence, this step takes on a whole new dimension. Teams can generate screens, explore multiple variations, and build interactions from a brief. Some tools even produce executable code.
For MarTech professionals , however, the stakes go beyond speed of development. Prototyping helps reduce uncertainty about a user journey, a value proposition, or an interaction before investing in its deployment. It's crucial to distinguish what you're trying to validate: the structure of a page, its functionality, its technical feasibility, or its commercial utility.
Zoning, wireframe, mock-up, prototype and POC: different objectives
These terms refer to deliverables that can complement each other. They are not interchangeable and do not necessarily constitute a mandatory sequence of steps.
| Notion | What it represents | The question she answers |
|---|---|---|
| zoning | The distribution of the main areas of a page: navigation, value proposition, content, reassurance, call to action. | Where should the essential elements be placed? |
| wireframe | A more detailed schematic representation of the contents and components, generally without graphic finish. | How to organize information and actions? |
| Graphic model | The intended appearance: typography, colours, images, components and brand identity. | What will the interface look like? |
| Prototype | A representation allowing exploration or testing of a function, with simulated or executed interactions. | How does the user understand and use the learning path? |
| POC — proof of concept | A limited experiment intended to verify the feasibility of a hypothesis, often technical. | Can this mechanism actually be made to work? |
| MVP — minimum viable product | A product with a limited scope, usable by real users to learn from its use. | Does this first version offer sufficient value? |
A prototype is therefore not synonymous with a proof of concept (POC). A clickable process can show how a prospect requests a demonstration without transmitting any data to the CRM . Conversely, a POC can verify this transmission without having a fully developed interface.
The boundary between wireframe and prototype also depends on the use case. A static wireframe represents a structure; a series of wireframes linked by interactions can constitute a low-fidelity prototype.
To remember
The level of polish doesn't define the value of a prototype. A few schematic screens can be enough to detect a misunderstanding. A highly realistic interface may be necessary to test a more complex interaction.
How AI is changing prototyping
From brief to a first testable interface
Digital prototyping already relied on component libraries and visual tools. AI adds another way of working: describing an expected result, then interacting with the tool to refine it.
Figma Make allows you to create functional prototypes and web applications from instructions, with the ability to use existing designs and modify the result. In Figma Design, AI can also add interactions between selected screens. See Figma Make documentation and information on interactions with Figma AI.
This development facilitates the participation of marketing and product teams. They can make an idea tangible before having all the resources necessary for its implementation.
Easier-to-explore variations
The value of AI is not limited to quickly obtaining a first version. It also facilitates the comparison of several approaches: a one-page or multi-step form, navigation by need or by category, a value proposition oriented towards results or functionality.
The gain becomes useful when the variants correspond to distinct hypotheses. Generating ten similar interfaces is of little value if the team doesn't know what it's trying to learn.
A component library and branding guidelines remain invaluable for guiding this exploration. Without this context, the results may appear polished but be generic or unsuitable for the target audience.
Prototypes that perform part of the course
Code generation tools allow you to go beyond simply displaying a series of screens. A prototype can calculate a result, apply conditional rules, or manipulate a dataset.
Canva Code offers the ability to generate interactive experiences; v0 can produce interfaces with content, logic, and a backend. These capabilities pave the way for more realistic demonstrators. Canva Code , v0 presentation.
But a prototype that works in a few scenarios isn't automatically production-ready . Safety, robustness, performance, and maintainability are other requirements. This distinction existed before AI and remains essential. GOV.UK — Making prototypes.
Why prototyping is becoming strategic for MarTech
In MarTech, an interface generally belongs to a larger journey. A campaign brings a visitor to a page; the visitor views an offer, completes a form, receives a confirmation and may enter a follow-up scenario.
The prototype makes this process understandable to the marketing, design, product, and technical teams. It helps to discuss the actual user journey, rather than a collection of isolated pages.
Let's take a B2B demo request . The page layout organizes the page. The wireframe specifies the placement of the form and reassurance elements. The prototype allows us to observe whether prospects understand the questions and find the next step. A separate proof of concept (POC) can verify that the data is correctly entered into the CRM.
This separation avoids a common mistake: assuming that a "Your request has been sent" message proves that the entire chain is working.
Test comprehension before measuring conversion
A prototype can reveal that a user doesn't understand an offer, hesitates over a field, or can't find the expected button. These are valuable insights for improving the user journey.
It alone cannot demonstrate an increase in the conversion rate . This measurement requires experimentation on an operational system, with appropriate traffic and protocol.
The same caution applies to AI-simulated personas and attention predictions: they can suggest avenues, but do not replace feedback from people belonging to the target audience.
What tools should be used for prototyping with AI?
The tools cover different needs. Some focus on interface design; others on website creation or the generation of executable applications.
Features verified in October 2026. Their availability and limitations vary depending on the offer.
| Tool | Useful AI features | Example of use for MarTech | Point to check |
|---|---|---|---|
| Figma | Generating prototypes and applications with Figma Make; adding interactions in Figma Design. | Explore a or a process for requesting a demonstration based on existing designs. | Consistency with the company's components and the methods for taking over the result. |
| Canva | Generating interactive experiences with Canva Code, then personalizing them. | Test a calculator, a quiz, or an interactive sales tool. | The possibilities for data integration, publication and management. |
| framer | Page structure generation responsive using Wireframer. | Explore the organization of a landing page or campaign site. | The distinction between a site structure and an application journey prototype. |
| uizard | Generation of multi-screen prototypes and modification of components via instructions. | To quickly make an application idea tangible during a workshop. | The precision of the interactions required for the test. |
| v0 | Code generation for interfaces and applications including logic and a backend. | Build a dashboard demo or a journey with conditional rules. | The quality of the code and the conditions for connecting to existing systems. |
To make a choice, it's better to start with the question to be solved rather than a general ranking. An ideation workshop, a navigation test, and a CRM integration POC rarely require the same environment.
One method: start with the hypothesis, not the immediate
The first task is to formulate a precise question. "Improve our landing page" is too vague. "Do visitors understand what they will get after requesting a demo?" provides an actionable direction.
The brief given to the AI must then specify the audience, the task to be accomplished, the available content, brand constraints, and expected behaviors. It must also indicate what will be simulated.
For a form prototype, this means anticipating possibilities beyond the ideal workflow: incomplete fields, invalid addresses, backtracking, waiting, and confirmation. Error situations are part of the experience to be tested.
The team can then observe target users, identify difficulties, and refine the prototype. The expected decision must remain explicit: continue, modify the hypothesis, launch a technical proof of concept, or abandon the idea.
Example of a brief
Design a mobile prototype of a demo request for B2B marketing managers. Test whether the promise and steps are understood. Include a two-step form, input errors, and a confirmation prompt. Use only dummy data and simulate sending the request to the CRM. Adhere to the provided components and brand guidelines.
Maintaining control over the transition to production
A generated interface may give an impression of completion when several points remain to be solved: keyboard navigation, readability, behavior on mobile, reliability of calculations, error handling or technical dependencies.
For MarTech companies, it's also essential to clarify the connections to the CRM, the data collected, and the events necessary to measure the customer journey. The simulated functions must be identifiable so that decision-makers understand what the demonstration actually proves.
AI-assisted prototyping truly shines when it accelerates learning. Producing an interface faster is useful; discovering earlier that a user journey needs to change is even more so.
In conclusion: towards prototypes that will evolve with usage?
AI is already accelerating the transition from an idea to a testable interface. The next evolution could concern how prototypes are built, how they are tested in real-world use, and how they evolve through learning.
One initial hypothesis is that of prototypes capable of adapting during testing . Rather than preparing each variation in advance, teams could ask an assistant to modify a route based on observed difficulties: simplifying a step, reformulating instructions, or suggesting an alternative navigation path. Each modification should nevertheless remain traceable, to understand what actually improved the experience.
Prototyping could also extend beyond the interface to represent a complete marketing journey . In a test environment, a team would explore the landing page, lead qualification, CRM navigation, and follow-up messages together. For MarTech companies, this would be a way to verify earlier the consistency between the promise made to the visitor and the experience actually delivered.
Another perspective: user simulations could help explore more situations before human testing. Their role would then be to identify inconsistencies and suggest overlooked scenarios. Their credibility would depend on their comparison with real-world behavior : simulating a user is not enough to understand their expectations.
Finally, the line between prototype and product could become more blurred. Some generated components would be incorporated into the final version, while others would remain for experimentation. This continuity would make it even more necessary to distinguish between what has been demonstrated, what has been tested, and what is ready for deployment.
In these possible futures, the decisive skill would be less the ability to produce screens than the art of formulating a hypothesis, organizing its testing, and interpreting the results . If tomorrow almost any idea can become a prototype, the real advantage will be knowing which ones deserve to become a product.
Some references
- « Prompt, prototype, perfect: Figma Make is now available to all users » – David Kossnick – Figma Blog – July 2025.
- « Show don't tell: Embed Make prototypes everywhere you work in Figma » – Nikolas Klein – Figma Blog – January 2026.
- « Wireframer » – Framer Team – Framer Updates – May 2025.
- « v0.dev → v0.app » – Zeb Hermann – Vercel Blog – August 2025.
- « Making prototypes » – Design community – GOV.UK Service Manual – October 2016.
















