What is Prototype Testing?
Prototype testing allows you to evaluate early design concepts before development by observing how users interact with a clickable prototype built via Figma. This helps you validate assumptions, identify usability issues, and refine the design before investing in development.
- Within an unmoderated study, you can add multiple prototype tasks (if you have several prototypes to test) or add multiple sub-tasks (called “steps” in Hubble) if you want to create a layered, step-by-step flow within a given prototype.
Why Test Early Design Concepts?
- Catch usability issues early: Avoid costly design changes later.
- Validate user expectations: Ensure the interface aligns with user mental models.
- Improve navigation and interactions: Identify confusing elements before coding.
- Gather real user feedback: Understand how users interpret your design.
How to Setup Prototype Testing
Prototype tasks are available in unmoderated studies. First, you need to create a new study with the builder view like below.
Step 1. Add a Prototype Task
Select + Add Task to toggle a list of available tasks. Select Prototype Task to refine your prototype details.
Step 2. Add Figma prototype link
If it's your first time setting up a prototype task, you'll be prompted to sign in to Figma to activate our Figma integration.
Input your Figma link in the box above. Please refer to the best practices for using Figma prototype links in this article.
- Some high-level tldr; is to use frames and separate your Figma design file in case your design file size is large. Large design file size can affect the loading process.
Step 3 (Optional). Add "Steps" or sub-tasks within the prototype task
You can add sub-tasks by clicking + Add Step, which work as step-by-step tasks within the given prototype task. Steps are especially useful if you have multiple questions or tasks you want the participants to complete.
Each step will be displayed one at a time to the participants. Whenever participants believe they are complete with a task, they'll select Next to proceed to the next step in the testing module.
Steps are especially useful at exploratory stage of research especially when you want participants to think-aloud, or answer to a particular question before proceeding to the next instruction.
- For example, a common approach is asking participants to think-aloud what their initial thoughts or overall first impression is before specifying the task details.
Step 4. Specify Parameters
There are multiple settings you can specify and toggle to make sure your prototype tasks are designed and displayed as you expect them to be. You can specify the parameters below:
- Toggle on/off whether you want to collect screen recording, audio, or video from participants
- Success Criteria: Decides whether you want to count task success only if participant follows a pre-determined user flow OR if participant reaches a certain end screen
- Show hotspot hints on click: Participants will be able to see hints in blue highlights on where they could click while interacting with a prototype.
- End task when last screen is reached: Enabling this option will automatically end the task when participants reach the end screen of the prototype flow instead of having them to manually select End Task during the study.