Interactive Kitchen Wizard for Arbel Kitchen
This case study describes the design and development of a responsive, step‑by‑step quotation wizard for Arbel Kitchen. The goal was to create an engaging and minimalist landing page that guides users through selecting their kitchen style, lifestyle requirements and layout, and then calculates a personalized quote.
Project Objectives and Scope
The project started with a clear objective: transform a static landing page into a dynamic funnel that collects user preferences through multiple‑choice questions.
I collaborated with the client to define the five key steps—style selection, budget range, layout shape, lifestyle needs and contact details—so that the final recommendation feels both personal and accurate.
A strong emphasis was placed on conversion: the wizard needed to be friendly enough for non‑technical homeowners yet robust enough to deliver qualified leads for the sales team.
UX/UI Design
I crafted a modern and minimalistic interface that works seamlessly on mobile and desktop.
A progress bar at the top indicates the current step, while concise headings and microcopy explain each question. Custom illustrations and icons accompany the choices, and buttons provide immediate visual feedback.
The design uses generous spacing, soft colors and clear typography to keep the focus on the content. RTL support was implemented for Hebrew, ensuring intuitive reading direction and alignment.
Front‑End Development and Logic
The wizard flow was implemented in vanilla JavaScript with modular functions controlling state, navigation and validation.
The progress bar dynamically updates as users advance through the steps, and transitions are animated for a smooth experience. When users reach the final step, their selections are compiled and a real‑time estimate is displayed before the contact form.
SweetAlert2 is used for notification modals, and all interactions are optimized for performance. The codebase is lightweight, loading only what is needed, and image assets are lazy‑loaded to improve load times.
Outcome
The resulting landing page offers a guided experience that feels like a conversation.
Users can explore different kitchen styles, express their needs and instantly see how their choices affect the quote.
This interactive approach has increased user engagement and improved lead quality for Arbel Kitchen.
