A prototype in Aha! Builder is a shareable application you can use to test a product concept, gather feedback, and refine the experience. Unlike prototypes in Aha! Roadmaps, Aha! Builder prototypes are interactive and backed by a real database — so stakeholders can click through the workflows and react to something close to the real thing.
In this article, we will build a prototype together from scratch. Let's say we are on a customer experience team, and we have an idea for a self-service survey tool. Product managers across the company should be able to create surveys, share them with customers as a link, and review response summaries in a dashboard. Before we ask engineering to build it, we want to validate the concept with a few internal stakeholders. Follow along — in just a few minutes, we can share something interactive that gets a true reaction.
Click any of the following links to skip ahead:
Launch the getting started wizard
To start, navigate to the Applications page and click Create.
On the Welcome, let's start building screen, click Create a prototype. The wizard is going to walk us through a few short steps that give Elle (the AI assistant in Aha! software) the context needed to design something useful on the first try.
Elle introduces itself and explains how the wizard works. Click Let's go to begin.
If we already had a tight idea in mind, we could click Skip the getting started wizard and go straight to chatting with Elle. But because we want Elle to make smart decisions about layout and design, we will work through the wizard.
Describe the prototype
In the Vision step, we describe the concept we want to test. We will focus on the problem to solve and the workflows stakeholders will react to. And we do not need a detailed specification — Elle will ask for the rest later.
For our survey tool, we will type:
"I want to prototype a customer survey management tool. Product managers should be able to create surveys with custom questions, share them with customers by link, and review response summaries in a dashboard."
That is enough to get started. Click Next.
Choose a name
In the Name step, Elle reads our vision and suggests three names. For our survey tool, we might see suggestions like "SurveyPulse," "FeedbackFlow," and "AskCustomers." We will go with SurveyPulse. It is short, memorable, and recognizable to the stakeholders we plan to share it with.
If none of the suggestions fit, we could select Custom name and enter our own. Click Next.
Describe who we are designing for
In the Personas step, we describe the people we are designing for and what each one needs to do. This helps Elle build more realistic workflows and navigation for our audience.
For SurveyPulse, we will describe two personas:
Product managers who create surveys, share them with customers, and review the responses to inform product decisions
Customers who receive a survey link, answer the questions, and submit their responses
Click Next. If we wanted to come back to this later, we could click Skip instead. Elle would then make reasonable assumptions, and we could refine them later.
Outline the user experience
In the Capabilities step, we describe the main use cases stakeholders should be able to try. For a prototype, we want to focus on the one or two workflows where feedback matters most. Elle will use those workflows in the first build.
For SurveyPulse, we will list:
Creating a new survey with a mix of multiple-choice and open-text questions
Generating a shareable customer link for each survey
Reviewing a response dashboard that summarizes results across questions
That gives stakeholders enough to click through and react to. Click Next.
Choose a navigation layout
In the Navigation step, we select the layout that fits our concept:
Horizontal: A top navigation bar. This is a good starting point for simpler prototypes.
Vertical: A left sidebar. This is a better fit for prototypes with more sections or deeper navigation.
SurveyPulse will only have a few top-level areas — surveys, responses, and settings — so we should go with Horizontal. Click Next.
Set the visual style
In the Style step, we describe how we want the prototype to look and feel. A short description is enough.
For SurveyPulse, we will type:
"Clean and minimal dashboard layout, rounded corners, neutral colors with one bright accent for primary actions, friendly but professional."
We can also give Elle visual context to work from:
Drag any reference images into the upload area. Accepted formats are PNG, JPEG, and SVG.
Add a link to a public design system or public brand guidelines in the description.
Click Next.
On the Aha! Builder Team and Scale plans, you can create a reusable design system for your prototype after it is built, so its components stay consistent as you refine.
Answer Elle's clarifying questions
On the Elle is almost ready to start designing screen, Elle reviews everything we have entered and asks up to three follow-up questions. For SurveyPulse, Elle might ask whether responses should be anonymous, whether the dashboard should support filtering by date range, and whether product managers should see individual responses or only aggregates.
We will answer each question in one or two sentences. For our prototype, we will say responses are anonymous, the dashboard should filter by date, and product managers should be able to drill into individual responses.
If Elle asks a question we have not thought through yet, we can click Skip. Elle will make a reasonable assumption that we can refine later.
When we are ready, we can click Design my app.
Elle now generates a working prototype with a real React front end, a TypeScript back end, and a PostgreSQL database (when necessary). The build takes a few minutes, so we will keep the browser tab open while it runs.
A prototype in Aha! Builder is a working application, not a static mockup. Any data we enter while previewing the prototype is saved in the preview database for us to review.
Refine the prototype with Elle
When the build finishes, we land in Preview mode looking at the first version of SurveyPulse. We can click around, create a sample survey, and see what Elle built. The first build will be close to our vision, but rarely exactly right — and that is what makes prototypes useful. Each round of refinement gets us closer to something stakeholders will respond to.
We will use the Elle panel on the right side of the Preview screen to make changes in plain language. If we send another request before Elle finishes the current one, Aha! Builder queues it for us.
Looking at SurveyPulse, we notice three things to adjust:
The dashboard shows total response counts, but no completion rate. We will type into the Elle panel: "On the dashboard, add a completion rate next to each survey showing the percentage of recipients who finished the survey."
The survey creation form does not preview the customer-facing version. We will click Select elements in the preview toolbar, click the Create survey form, and type: "Add a 'Preview as customer' button at the bottom of this form that opens a sample of the survey."
The accent color came back a little too cool. We will type: "Update the accent color to a warmer blue. More friendly, less corporate."
Each request takes a minute or two. As Elle works, we can keep adding the next request. Aha! Builder applies them in order. Each change is tracked in the code history, so we can review what changed at any point or roll back if a refinement does not land the way we expected.
If something breaks during a refinement, Aha! Builder shows a Fix with AI button. Click it, then refresh the page once Elle completes the request.
We will keep refining until SurveyPulse looks and works the way we want stakeholders to see it.
Share the prototype for feedback
A prototype is only useful if the right people can react to it. Once SurveyPulse feels close, we are ready to share.
Click the Production dropdown, then Deploy the application to production. This is the view that stakeholders outside our account will be able to see.
Copy the URL and share it with the people we want feedback from: a few product managers, a designer, and a customer success lead.
Stakeholders can click through SurveyPulse, create their own sample surveys, and send us notes on what works and what is missing. Their data lives in the same production database, so we can review it in the dashboard ourselves.
As feedback comes in, we head back to the Elle panel and keep refining. When the concept earns enough confidence to invest further, we can keep building in Aha! Builder and prepare SurveyPulse to deploy as a real internal tool — without starting over.