Lumière Theater offers a cozy, upscale cinema experience complemented by a full-service menu. The goal of this project is to design and develop a website that effectively showcases the theater’s distinctive ambiance—defined by comfort and class. The new website will serve as a digital extension of the Lumière experience, enhancing its online presence, attracting new patrons, and supporting overall sales performance.
Lumière’s primary audience consists of young professionals, couples, and social groups who value immersive, comfortable entertainment paired with elevated dining. These moviegoers are drawn to experiences that feel exclusive and thoughtfully curated. They expect a seamless and refined digital browsing experience that mirrors the theater’s upscale brand and enhances their decision-making process—from exploring showtimes to reserving premium seats.

Create a Visually Elegant
and User-Friendly Interface

Implement Streamlined
Navigation for Key Features

Establish a Modern,
Refined Brand Presence Online
Design a layout and user experience that visually communicates comfort and sophistication, ensuring every interaction feels smooth, intuitive, and upscale.
Showcase premium amenities through photography, icons, and concise copy to showcase Lumière Theater’s upscale features.
Prioritize seamless access to essential functions—such as ticket booking, viewing menus, and event schedules—through clear navigation and thoughtfully placed calls to action.
Reflect a modern, refined tone that aligns with the audience’s education and income level
We consolidated our research into detailed user personas, which gave us valuable insight into the different types of people seeking an upscale theater experience. Using these personas, we developed an information architecture for the site to ensure the content and structure align with our users’ needs. This process helped us identify key content areas and features based on the user research.
Desktop Wireframe Initial Sketches
We began with rough sketches—mapping out ideas, structure, and flow inspired by what our users truly value.
Mobile Wireframe Initial Sketches
Here’s the low-fidelity wireframe I developed in Figma to bring our initial sketches to life and begin translating user needs into a clear, functional layout.
The final design brings Lumière’s vision to life—merging elegance with usability. From refined visuals to streamlined navigation, every element was crafted to meet user goals and reflect the theater’s upscale identity. The site was then developed using HTML and CSS, ensuring both form and function work seamlessly together.
Establishing a design system that offers consistency without limiting creativity.
Organizing the content into clear, logical sections and determining the most intuitive placement for each within the overall layout.
Overcame challenges in organizing and prioritizing content for clarity and ease of navigation.
Learned how to balance visual aesthetics with functionality and user flow.
Designed with the user in mind—matching content flow to real user behaviors and goals.