Setup Flow - Web
Company: QRStuff is an all-in-one platform for creating, tracking and managing QR codes.
Project type: Web design
Role: Product Designer
Overview
Part of the integrations with QRStuff and Monday.com involved generating QR codes directly from the information on Monday.com. This streamlined the process for Monday.com users when creating QR codes for various purposes. I was tasked with designing the flow through which users would create their QR codes.
Implementation
The task was to design a flow that was as simple, smooth, and seamless as possible to demonstrate the ease of integration with QRStuff.
Multi-step flow vs Single-step flow
I chose a multi-step flow instead of a single-step flow for the following reasons:
Conditional logic: each subsequent question depended on the previous one. Multi-step flows can adjust subsequent steps based on previous answers, showing or hiding relevant sections dynamically.
Reduced intimidation: Breaking up the form can make it seam less overwhelming and distracting.
Progress indication: Multi-step flows can provide progress indicators , which can motivate users to complete it.
The design
Let's dive into the design!
Skeleton of the flow
Flow - Step 1
Flow - Step 2
Flow - Step 3
Flow - Step 3 cont.
Flow - Step 4
A mini flow within a flow
Flow - Step 5
Flow - Summary
Before the user commits to generate the QR codes, we present them with a summary. The summary acts as a final checkpoint that enhances user clarity, confidence and satisfaction in the user journey.
Flow - End
Thanks for reading!
❤️