Lumiere Theatre's website design was crafted to enhance user experience, boost engagement, and elevate the brand's online presence.

Lumiere Theatre's website design was crafted to enhance user experience, boost engagement, and elevate the brand's online presence.

UX/UI Design

UX/UI Design

Web Development

Web Development

Project Overview

Project Overview

Project Overview

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.

UX Research

UX Research

UX Research

Understanding our audience

Understanding our audience

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.

Breaking down the goal

Breaking down the goal

To guide our product, we created the following list of goals:

To guide our product, we created the following refined problem statement and list of goals:


Problem Statement: Devil Den’s existing website no longer reflects the immersive experience and natural beauty of the spring itself. With outdated visuals, limited user flow, and a lack of engaging elements, the site falls short in capturing user interest and communicating the brand's identity. A redesign was needed to enhance the overall user experience, increase engagement, and bring the brand to life through modern, cohesive design.

To guide our product, we created the following refined problem statement and list of goals:


Problem Statement: Devil Den’s existing website no longer reflects the immersive experience and natural beauty of the spring itself. With outdated visuals, limited user flow, and a lack of engaging elements, the site falls short in capturing user interest and communicating the brand's identity. A redesign was needed to enhance the overall user experience, increase engagement, and bring the brand to life through modern, cohesive design.

Create a Visually Elegant

and User-Friendly Interface

Implement Streamlined

Navigation for Key Features

Establish a Modern,

Refined Brand Presence Online

Design Solution

Design Solution

  • 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

Design Process

Design Process

Design Process

Structuring the site

Structuring the site

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

Low-Fidelity Wireframes

Low-Fidelity Wireframes

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.

Final Designs

Final Designs

Final Designs

High-Fidelity Wireframes

High-Fidelity Wireframes

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.

Reflecting Back

Reflecting Back

Reflecting Back

Challenges

Challenges

  • 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.

Key Takeaways

Key Takeaways

  • 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.