CASE STUDY

Electric Dusk Website Redesign

Electric Dusk is a Drive-In movie theater located in Los Angeles, CA.  The drive-in experience offers a unique and fun night out for family or friends. They show new and old films plus provide concessions.

Project Type: General Assembly UI/UX Design Immersive
Role: UX/UI Designer

Tools Used: Figma, Maze
Timeline: 5 weeks

The Problem: Movigoers are having a hard time navigating the website and purchasing tickets

Moviegoers are having a difficult time discovering movies, showtimes and purchasing tickets on the Electric Dusk website. They need an easy, intuitive, and transparent way to find and buy tickets with explicitly stated covid guidelines. They’d also like to be able to use the site on a mobile device.

COMPArATIVE/COmpetitive RESEARCH

Understanding the ticketing checkout process of other venues and event sellers

A large part of our research was devoted to the the checkout process of companies in a similar space, where tickets are required for entry. We did checkout flow analysis of three companies. These included Fandango, SeatGeek, and Alamo Drafthouse. The major takeaway from this analysis was the clarity in choosing seating options, the inclusion of the ticket details throughout the checkout flow, and the effortless transition from finding events to a ticket purchase.

USER Research

Understanding the moviegoers current experience

We conducted five user interviews. These people identified as frequent moviegoers. We asked them to complete several tasks on the current website. These tasks included finding a movie trailer, purchasing a ticket, and finding showtimes. Some of the key insights from our interviews were:

  • They wished fees were included in the ticket options.
  • They preferred that concessions be included inside the checkout process.
  • They like to checkout without having to make an account.
  • They were overwhelmed with the amount of (visual) clutter.

IDEATING SOLUTIONS

Ideating new solutions to help Electric Dusk customers use the site with ease

During our design workshops we focused on a few key areas. making the movies and trailers easy to find, adding clarity to the ticket options, adding concessions to the checkout process, and including an explicit COVID policy.

USER TESTING

Testing the New Site

After designing features that  would  help solve our users problems. It was time to put it all together and see if our users would be able to navigate through the app. We tested them on three tasks:

  1. Find a specific movie
  2. Find VIP Tickets to that movie
  3. Add additional tickets/seats to your order
  4. Add concessions to your order and checkout

Key Takeways from the Prototype Test

  • Testers spent less than 6 seconds on each screen, the prototype was easy to navigate.
  • No carts were abandoned. The checkout process was easily completed.
  • One user stated: “Didn’t have to spend a lot of time to find what I needed to proceed. I honestly didn’t even read a lot of what was on screen, it was that easy.”

DESIGN

Final Website Designs

The client no existing branding to speak of. We chose a color palette based on the clients existing logo. We made the designs modular in nature so they could adapt to multiple screen sizes. There was little iterations from the prototype phase, so we went straight to high-fidelity mockups.

Takeaways and next steps

Doing a usability test with the existing site made it obvious was very insightful, it felt like the fastest way to discovering real user issues and feelings. Due to the amount of time allotted to the project, we only did testing on our mobile design. Although the site design was responsive and similar in design, I think going forward we should test all sizes of the site.