Simplifying Bookings for Private Cinema Experiences.
Classification
COZYPLACE
Overview
Cozyplace is the market leader for private movie room experiences in Singapore, providing a cozy space to enjoy Netflix and other streaming services. Their existing booking system spanned two separate websites and a 5-page user flow, leading to confusion, high abandonment rates, and a heavy reliance on manual bookings. This case study outlines how I redesigned their experience into a unified, mobile-friendly, one-page booking system, simplifying the process while elevating the brand experience.
Service
UI/UX Design
Visual Design
Information Architecture
Content
Duration
1 month — Launching in 1–2 months , Freelance Project
The Challenge
Cozyplace’s booking experience was fragmented and confusing — split across two websites and stretched over five pages. Users faced information overload, inconsistent UI, complex package structures, and a mobile-unfriendly design, leading to high drop-off rates and an increase in manual bookings via WhatsApp.
Understanding The Problem
Fragmented User Journey — Two separate websites (one for info, one for bookings) disrupted the user flow. Complex 5-Page Booking Flow — Dense content, unclear navigation, and package confusion led to booking abandonment. Complex Package Information and Pricing — The dynamic pricing, variable pax options, and numerous add-ons created a confusing landscape, making it difficult for customers to decipher and select suitable packages. Manual Bookings — Frustrated users then booked via WhatsApp, increasing staff workload. Poor Mobile Usability — Unresponsive layouts and small tap targets hindered mobile conversions. These resulted in higher support load (unnecessary inquiries) and decreased booking rates from confused customers.
'Normally I just Whatsapp Cozyplace, as there are too many packages to digest' - Regular at Cozyplace
The Solution
To solve Cozyplace’s disjointed booking flow and usability issues, I focused on simplifying the user journey, unifying the experience, and optimizing for clarity and mobile use. The result is a seamless, intuitive system built around four core improvements:
Merged the two separate platforms (informational and booking) into a single cohesive website. This improved brand consistency and reduced user confusion by offering all essential content — from room details to booking — in one place.
By transforming Cozyplace's complex 5-step booking system, featuring over 30 different packages, into a clear, one-page layout. Users can now browse room options, select a date/time, and confirm their booking without leaving the page. The design uses visual hierarchy, color coding, and live summaries to guide users seamlessly from start to finish.
Understanding that mobile is the primary booking platform for Cozyplace users, we prioritized a mobile-first design approach. This yielded a fast-loading, responsive interface with large touch targets, delivering a frictionless booking experience across devices and maximizing accessibility for on-the-go users.
By transforming Cozyplace's complex 5-step booking system, featuring over 30 different packages, into a clear, one-page layout with just 4 distinct options, we significantly improved the user experience. This, combined with intuitive navigation and transparent pricing breakdowns (including peak/off-peak rates, discounts, and totals), empowers users to make informed decisions quickly, reducing drop-offs and improving overall satisfaction.
The Result
The redesign is expected to streamline booking, leading to increased conversion rates and reduced manual bookings, while enhancing user satisfaction through improved navigation and mobile optimization. Consolidating the website will strengthen brand cohesion and simplify back-end management. Ultimately, the one-page booking system is designed to boost online booking conversions by providing a clear and efficient user experience. 🚀 The new platform is set to launch in 1-2 months, marking a major step forward in digital transformation for Cozyplace.
View Prototype:
Branding
A dark mode color palette was intentionally chosen to evoke the ambiance of a cinema or movie theater. This aesthetic enhances the user's immersion and aligns with Cozyplace's core offering of private movie screenings. While Cozyplace's primary brand colors are green and orange, the design strategically utilizes a vibrant orange for call-to-action (CTA) buttons. This choice ensures that key interactive elements stand out prominently against the dark background, guiding users through the booking process. To maintain brand recognition, the brand's green color is subtly incorporated into the website's footer, providing a consistent visual link to Cozyplace's established branding. The use of a limited color palette ensures visual harmony and prevents overwhelming the user.
Colors
A cohesive design system was established to ensure consistency across the entire website. This system encompasses reusable UI components, typography styles, color palettes, and spacing guidelines, promoting efficiency in design and development. The system emphasizes clean, minimalist elements to facilitate easy information consumption. The design system is created to be scalable, allowing for future expansion of the website with new features and content.
Typography
A dark mode color palette was intentionally chosen to evoke the ambiance of a cinema or movie theater. This aesthetic enhances the user's immersion and aligns with Cozyplace's core offering of private movie screenings. While Cozyplace's primary brand colors are green and orange, the design strategically utilizes a vibrant orange for call-to-action (CTA) buttons. This choice ensures that key interactive elements stand out prominently against the dark background, guiding users through the booking process. To maintain brand recognition, the brand's green color is subtly incorporated into the website's footer, providing a consistent visual link to Cozyplace's established branding. The use of a limited color palette ensures visual harmony and prevents overwhelming the user.
Spacing
An 8-point grid system was implemented to maintain consistent spacing and alignment throughout the design. This grid system promotes visual balance and ensures a clean, organized layout. This grid system is also implemented on the mobile design, which allows the mobile design to look clean and organised.
Corporate Event Portal
A cohesive design system was established to ensure consistency across the entire website. This system encompasses reusable UI components, typography styles, color palettes, and spacing guidelines, promoting efficiency in design and development. The system emphasizes clean, minimalist elements to facilitate easy information consumption. The design system is created to be scalable, allowing for future expansion of the website with new features and content.
This project reinforced the power of simplicity in user experience design, demonstrating that transforming a complex five-page booking process into a clear, single-page system, coupled with transparent pricing and a mobile-first approach, significantly improves user satisfaction and drives business efficiency. It highlighted the importance of clear visual hierarchy and understanding the user's journey to create intuitive and effective digital solutions. Post-launch, we will focus on rigorous monitoring and analysis of key metrics to assess the project's impact and inform iterative improvements. This includes refining content, exploring additional features like personalization, and continuously optimizing the booking experience based on user feedback to ensure sustained user engagement and business growth.
