My submission for the 2021 OCBC Hack-It! Hackathon, UX/UI Track Final Assessment. Total time taken to produce this: 14 Hours. Did not win Top 3 but it was a valiant attempt of my own effort. UX/UI all created by hand and did not use any UX templates or follow the obvious UX trends on Behance.

1. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
UX/UI Track
OCBC HACK-IT! Final Assessment
Welcome to
Oscar Cineplexes
PROPOSED BY
Tan Si Ying, Deniece I dtsyi100@gmail.com

2. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
2
Hi, my name is Deniece.
I’m the designer behind this deck.
I’ve decided to present my work as
a business case, so that it will make
a little more enjoyable for you to
review. I sincerely hope you’ll enjoy
this UX/UI journey as much as I did!
FOR MORE ABOUT ME,
SCAN THE QR CODE

3. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
3
Executive Summary
Welcome to Oscar Cineplexes.
Oscar Cineplexes is a mega cinema chain in Singapore. Before Covid-19, the
chain had a simple booking website for moviegoers to purchase tickets online.
The website was not mobile responsive, and its system was inflexible when seat
layouts had to be changed regularly due to the safe-distancing regulations.
This left customers more frustrated, dissatisfied and often dropping off before
completing their bookings. To drive revenue and keep their position as market
leader, we have proposed a digital transformation strategy starting with a UX/UI
driven mobile booking app.
🎬

4. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
4
Insights & Pain Points
🤯 😩
Here are the biggest findings uncovered by through 4 user interviews.
”It’s really annoying to find
out that there’s no seats
available after selecting
the movie and timing. I
wish they could have told
me from the get-go.”
“I just want to book my
movie and get out.
I would love it if there’s
a virtual butler to compare
available times across
different cinemas and
help me book quickly.
“There is literally no one
to help me if I’ve made a
mistake with my booking.
I practically need to suck it
up and buy another
ticket.”
“Why must I be charged
a booking fee when I
purchase my movie
tickets online? It’s self-
service and I’m doing
more that I need to than
over the counter.”
😡 😤

5. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
5
Problem Statement
How might we design an enjoyable movie going
experience by giving them personalized help when
purchasing their movie tickets on mobile?

6. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
6
Proposed Idea
Introducing Oscar, the AI Chatbot.
The fastest way to book your movies. Ever.
1 Oscar emulates the experience of
buying tickets over the counter.
Only faster and more intuitive.
2 When you input your movie choice
and seats needed, it will offer you
suitable locations and timeslots.
3 If you change your mind about any
detail, Oscar will instantly tell you
the next best alternatives.
4 If you made a booking mistake 4
hours before showtime, Oscar is
here to help rectify it at no cost.
Features

7. No
Yes
Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
7
Proposed UX/UI Flow
Customer
App
Front-end
App
Back-end
Starts app
Oscar
suggests
actions
Chooses their
action
a) Quick Book
via voice
b) Browse mode
Selects movie
& no. of seats
Backend
pushes avail
options
Selects time
& location
Confirmation
success
Oscar pulls
timeslots for
movies w. seats
Confirms
booking
Payment
Gateway Loads
Receives
confirmation
& QR tickets
Backend
pushes avail
options
Backend
processes
payment
Oscar provides
alternate
options
Collects Order
Data for BI

8. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
8
User Flow Included
1 Home Screen
Quick Book – Oscar Chatbot
Search Results
Movie Details
Screening Times
Seat Selection
Payment Details
Booking Confirmation
Edge Case
2
3
4
5
6
7
8
9

9. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
9
Movie Search
1 Home Screen
• Top Nav – QR Ticket (Ticket
Wallet), Oscar Assist (Help)
• Movie Carousel – Swipe left/right,
View all movies
• Member Promotions – Swipe
left/right, View all promos
• Bottom Nav – Promos, Quick
Book, Account
1 2
2 Quick Book, Oscar AI Chatbot
• Quick Book via Voice/Typing – AI
Chatbot will listen for keywords (NLP)
and search for the input movie title
• Exit Button – Terminate Quick Book
interaction anytime

10. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
10
Movie Details
3 4
3 Search Results
• Located Movie – Title, Movie
Rating Type, Duration
• Proceed Button – View selected
movie details
• Go Again Button – Re-input movie
title in the event searched movie is
not what user is looking for
4 Movie Details Page
• Trailer – Movie Video Trailer (min. 480p
resolution)
• Details – Genre, Duration, Country,
Synopsis, Actors List
• Ticket Quantity – Simple (-) (+) toggle
to add or reduce tickets required
• Date – Simple (-) (+) toggle to change
date of movies
• See Options Button – Check available
movie screening options

11. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
11
Availability
5 6
5 Available Times
• Selected Movie Dashboard – Ticket
Quantity, Date can be changed at this
point, not required to restart selection
• Joined Seat Options – Side-by-side
seat options, Red Times indicated fast
filling timeslots
• Separate Seat Options – Mainly for
popular movies and for customers who
don’t mind sitting apart
6 Available Seats
• Seat Legend – Legend for seat type
• Rotate Screen – For landscape view
• Booking Summary – Location, date can
be changed. If you selected more seats
than previously input, app will seek for
confirmation of choice
• Slide to Confirm – Total booking cost is
displayed on button. User is required to
slide button to confirm booking.

12. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
12
Rotate Screen
6
6 Landscape View
• Bigger Seating Plan – More comfort
for users to select seats in bigger
movie halls.
• Countdown Timer – Inform user of
session timeout.
• COVID-19 Seat Blocking – Backend
system is enabled to block out seats
according to regulations.
• Selected Seat Indicator – Once a seat
is selected, there will be a clear yellow
bubble to show up when hovered upon
displaying seats selected.

13. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
13
Payment
7 8
7 Payment & Authentication
• Booking Summary – Location, date
and seats can still be changed.
• Booking Details – Login to account
required, Forgot Password and Quick
Signup Function (can be performed
without leaving the app).
• Slide to Pay – Slide button to pay
ensures that the user understands and
agrees to the next step of action.
• Oscar Assist – Payment help and
troubleshooting.
8 Confirmation
• Add to Calendar – Allow user the
movie to add to their calendar.
• QR Ticket – For immediate entry to
cinema or to share QR code with
companion.
• Home – Return to Home Screen

14. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
14
Edge Case – Double Book
9
9 Unavailable Seat due to Double Booking
• Notification Bubble – Friendly notification to select
another available seat.
• Absence of Price Button – Inform user of session
timeout.

15. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
15
Concluding Notes 🙏
1 Identified Opportunities for Oscar App Features:
1. Chatbot capabilities – Payment, Search, Reviews
2. Oscar Wallet for Movies Credits, Cinema F&B, Merchandise, Loyalty Redemption
3. Movie-related Content Augmented Reality features
4. Booking widget on Home Screen without entering Oscar app
Total time clocked: 14 hours
• 2 hr for shortened 4 user interviews
• 3 hrs for ideation and deck fundamentals
• 7 hrs UX wireframe creation (XD)
• 2 hrs for slide documentation
2

16. Copyright
©
by
2021
Deniece
Tan.
All
rights
reserved.
16
Appendix
Photos from Unsplash.
Icons from Flaticon.
Vectors from Freepik.
Movie posters from Google.
Kindly do not reuse for commercial work.