The challenge
Creating a quiz involves more than writing questions. Users need to decide what to ask, which information to collect, how to present the experience, and where it should lead.
My challenge was to support those decisions without making users figure out the whole product before they could begin.
That thinking shaped three parts of Quizr: how it introduces itself, how it helps people create their first quiz, and how it gives them the tools to build a page around it.
01 — Make the first impression count
The landing page is the first part of Quizr that everyone encounters. It needed to explain the product and set an expectation for using it.
I chose a bold, playful visual direction to communicate an approachable tool. Direct headlines, clear actions, and a visible quiz example work together to show visitors what they can create and where to begin.
The visual identity carries personality, but it also has a job: make the product feel understandable from the first interaction.
02 — Give people a useful starting point
A quiz builder can offer plenty of options and still leave someone unsure what to do first.
I designed the template wizard to give users a relevant setup and question flow from the beginning. Instead of constructing everything from scratch, they have a starting point they can review, adapt, and make their own.
The same thinking informed the collection screen. Quick actions make it possible to add the fields needed to collect information directly where that task happens.
These decisions bring common tasks closer to the user's immediate intention: start with an appropriate structure, then make the changes that matter.
03 — Move beyond the blank canvas
When someone starts designing a page, an empty canvas can become an obstacle. Before they understand the editor, they are already being asked to make decisions about layout, content, and presentation.
I designed templates covering different industries and uses to give people something relevant to work with immediately. The intention was to shorten the distance between starting a page and publishing it.
But the template is only the beginning.
People learn an editor by exploring it. They click something, look for a response, and work out whether that action helped them do what they intended—or taught them how to do it.
That shaped my approach to Pagebldr: give users a clear starting point, then make its capability discoverable as they work.
An experience other developers can build on
The investment in Pagebldr also had a wider purpose: developing a reusable package for other developers.
That work is now published as @startupmedia/pagebldr. It extends the work beyond Quizr, making the page-building experience available to use in other products.
How I worked
I started by understanding what Quizr needed to communicate and what people needed to accomplish with it.
I used AI to prototype ideas quickly, helping me explore directions and decide what worked before committing to implementation. I then developed those ideas into working experiences with live data, using the product to assess whether the proposed interactions held up in practice.
AI supported the speed of exploration and implementation. I directed the product, made the design decisions, and evaluated the resulting experience.
The result
Quizr brings those decisions together in a working product: a clear introduction, guided quiz creation, immediate collection-field setup, and a page builder with relevant starting points and room for exploration.
The finished experience demonstrates the connection I aim to make between product purpose, visual identity, interaction design, and implementation.