Xscape Theater Redesign

[DESKTOP] Unauthenticated User

TIMELINE

  • September 2023

[DESKTOP] Authenticated User

MY ROLL

  • Solo Project

SOFTWARE USED

  • Figma

SUMMARY

This project walks through a redesign of my local theater. After using the website myself and talking with many locals, multiple issues stood out. Problems with searching/browsing movies and information display were primarily brought up. Accessibility within the website was lacking and seat selection during the ticket checkout process used inaccessible colors to represent open and taken seats. TYPE MORE ABOUT WHAT I DID IN THE PROJECT

PROBLEM

  1. No movie filtering options which makes browsing and searching for movies frustrating and time-consuming.

  2. Poor accessibility, especially for seat selection as it uses the colors red and green to represent open and taken seats. Red-green colorblindness is the most common form of colorblindness.

SOLUTION

  1. Add movie filtering options by genre and rating.

  2. Use accessible colors, patterns, and icons to help accessibility of the seat selection process during checkout.

USER STATEMENTS

  • “I feel overwhelmed looking at all the movies. There’s so many and no way to filter them!” 

  • “When I go onto the theaters website to look at their current movie showings a day, I can’t filter my view of the movies. It feels overwhelming to view the full list of movies. I would like to sort by genre and rating so I can see a specific/shorter list of movies I want to see.” 

  • “When I try to reserve seating the colors are green for available and red for taken. I am red-green colorblind so I can’t tell which seats are taken or available. This makes the entire process very time consuming and frustrating.” 

  • “As a disabled person I am unable to book seats for a movie I want to watch online and I don’t want to have to go to the theater itself to purchase tickets in person.”

TARGET AUDIENCE

25-39 year old’s

MEASURE OF SYSTEM SUCCESS

  • Conversion Rate

    • The website conversion is the measurement of how many users complete a desired action on the website, in this case purchasing a ticket online.

  • Number of Transactions

    • An increase in online transactions, and revenue, can be useful in determining the success of these system changes.

  • Bounce Rates

    • Assessing bounce rates of the website can also indicate success or need for improvement. A high bounce rate means users that come to the site typically leave after a single page visit while a lower bounce rate means users typically visit more than one page (Google Analytics, 2022). Lower bounce rates than previously seen before the update to the system can indicate users are using more of the features and filters.

  • Usage of Filters and How it Leads to Purchases

    • Looking deeper at the user's overall experience on the website and the resulting online transactions will be an indicator of the success of the system.

UNDERSTANDING THE SYSTEM

Use Case Diagram

Functional Requirement Specifications:

    • Community Groups

    • Employees

    • Managers

    • Shareholders

    • Users

    • Database

    • Payment Processing

    • Staff

  • Current Implementations

    • Users can view different cities where Xscape Theaters are located.

    • Users can select a movie location to view more information such as address, phone number, hours, general information, ticket pricing, and accessibility services.

    • Users can view movies currently playing and coming soon.

    • Users can filter movies by genre and rating.

    • When users select a movie, they will see an image for the movie, movie information (genre, rating, duration), movie description, and showtimes (day/time).

    • Users can select one, to a max of eight, seat(s) per purchase.

    • When selecting the number of tickets to purchase, users will see the total cost of the selected tickets.

    • Users can book their own seats for a selected movie showing of their choice.

    • While selecting their seats, users can see available, taken, and selected seating.

    • The booking seat system will not allow users to select more seats than the previously confirmed number of tickets purchased.

    • Booking seat system will use color awareness so those with color blindness can successfully book tickets.

    • The system will serve users as first come first serve.

    • The system will work with the database to keep track of processes.

    • The database will keep information about theaters, movies, theater rooms, showtimes, users, and taken or available seats.

    Future Implementations

    • For future improvements for this system, adding more options to filter movies would be very useful. In addition to genre and rating, users could also filter movies by showtime and customer reviews. Including a search bar for uses to look up specific movie titles would also be beneficial.

    • Users could have the ability to input their order number and email and cancel an order online. This can either trigger a refund or a voucher for the paid price for future use.

    • A useful accessibility feature that can be implemented is the addition of users to use an 24/7 automated phone booking system.

    • Seats are put on hold for ten minutes while the user finishes purchasing the tickets and payment is accepted.

    • Users can be placed on a waitlist for tickets if some become available for users whose preferred showtime for a movie is full.

    • Thus if there are any cancellations, users on the waitlist can be notified by email or text that there is an availability. They have a certain amount of time to accept and purchase the tickets before it moves onto the next person in the waitlist.

    • Users can also request additional needed accommodations in the theater when booking online and can see the number for an automated booking feature over the phone.

System Sequence Diagram

Domain Model

INITIAL SCREEN MOCK-UPS

20140301_Trade-151_0124-copy.jpg
20140228_Trade 151_0046.jpg
Aro Ha_0428.jpg

FINAL DESIGNS

20140301_Trade-151_0124-copy.jpg
20140228_Trade 151_0046.jpg
Aro Ha_0428.jpg

IMPROVEMENTS MADE

First, I split the ‘Movie’ tab into ‘Now Playing’ and ‘Coming Soon. Originally, I had designed it so users can select a movies tab and switch back and forth between ‘Playing Now’ and ‘Coming Soon’ on that page. Breaking out the tabs helps users see options more clearly. In addition, during the checkout process I added a side section so users can see their order as it currently is (which movie they are buying tickets for, the showtime they selected, how many tickets they are purchasing, and which seats they have selected).

I also adjusted how movies are shown to the user. I find the updated layout much easier to understand and navigate than the initial screen mock-ups and less clunky. In the initial mock-up users could see showtimes for select days and times at the top of the page. Now I have showtimes showing on the movie information page. In addition, I have adjusted the filter so users can easily find movies by filtering genres and ratings. In the revised final mock-up, users can select the ‘Theater Info’ tab to view Xscape Theater locations and view more information. Previously users had to select a primary theater first to view information and movies. 

Apart from general improvements like automating processes like movies (show as now playing and coming soon by date) and showtimes (days and times are calculated for each movie and theater room), there are some website features I would like to add. For the ‘Now Playing’ page I would like to add more filter options like review ratings and showtimes. In addition, a search bar so users can search movies by title. Currently, all the locations are shown on the ‘Now Playing’ page, but I would like to add a dropdown below the title where users can select one theater location to view the movies they show. Lastly, the inclusion of a fully functioning 24/7 automated phone booking system would make the entire movie booking system more accessible.