ITC504: Cinema Life App Interface Usability Report

Desklib offers solved assignments and past papers to help students succeed.

ITC504 INTERFACE
USABILITY
ASSESSMENT ITEM 4
Student 1: Shiva Prasad Achanti
Student 2: Triveni Suryadevara
Student 3: Mounika Nallapati

Table of Contents
Introduction......................................................................................................................................2
Interface Design...............................................................................................................................3
Prototype 1: Login Page..............................................................................................................3
Prototype 2: Registration Page....................................................................................................7
Prototype 3: Home Page..............................................................................................................8
Prototype 4: Navigation Page....................................................................................................13
Prototype 5: Movies Page..........................................................................................................19
Prototype 6: Movie Detail Page.................................................................................................20
Prototype 7: Ticket Details Page...............................................................................................22
Prototype 8: Booking Confirmation Page..................................................................................23
Prototype 9: Parking Page.........................................................................................................24
Prototype 10: Car Booking Page...............................................................................................25
Prototype 11: Change Password Page.......................................................................................26
Prototype 12: Seat Selection Page.............................................................................................28
Prototype 13: OTP Page............................................................................................................29
Prototype 14: Find Tickets Page................................................................................................30
Prototype 15: Car Booking Details Page...................................................................................31

Table of Figures
Figure 1: Login Page.......................................................................................................................5
Figure 2: Screen navigate from Login Page to Home Page.............................................................6
Figure 3: Screen Navigate from Login Page to Facebook Login Page...........................................6
Figure 4: Screen Navigate from the Login page to Google Login Page.........................................7
Figure 5: Screen Navigate from Login Page to Forgot Password Page..........................................8
Figure 6: Screen Navigate from Login Page to Registration Page..................................................8
Figure 7: Registration Page.............................................................................................................9
Figure 8: Navigate from Registration Page to Login Page............................................................10
Figure 9: Home Page.....................................................................................................................10
Figure 10: Screen Navigate from Home Page to Movie Page.......................................................11
Figure 11: Screen Navigate from Home Page to Parking Page.....................................................12
Figure 12: Screen Navigate from Home Page to Ticket Detail Page............................................12
Figure 13: Screen Navigate from Home Page to Navigation Pane...............................................13
Figure 14: Screen Navigate from Home Page to Logout Confirmation Page...............................14
Figure 15: Navigation Page...........................................................................................................15
Figure 16: Screen Navigate from Navigation Page to Home Page...............................................16
Figure 17: Screen Navigate from Navigation Page to Profile Page..............................................16
Figure 18: Screen Navigate from Navigation Page to Ticket Details Page...................................17
Figure 19: Screen Navigate from Navigation Page to Offers Page...............................................18
Figure 20: Screen Navigate form Navigation Page to Car Booking Page.....................................18
Figure 21: Screen Navigate from Navigation Page to Find Ticket Page.......................................19
Figure 22: Screen navigate from Navigation Page to Logout Confirmation Page........................20
Figure 23: Screen Navigate from Navigation Page to Feedback Page..........................................20
Figure 24: Movies Page.................................................................................................................21
Figure 25: Screen Navigate from Movie Page to Movie Detail Page...........................................22
Figure 26: Movie Details Page......................................................................................................22
Figure 27: Screen Navigate from Movie Detail Page to Theatre Page..........................................23
Figure 28: Ticket Details Page......................................................................................................24
Figure 29: Screen Navigate from Ticket Details Page to Home Page...........................................25
Figure 30: Booking Confirmation Page.........................................................................................25
Figure 31: Screen Navigate from Booking Confirmation Page to Home Page.............................26
Figure 32: Parking Page.................................................................................................................26
Figure 33: Screen Navigate from Parking Page to Car Booking Page..........................................27
Figure 34: Screen Navigate from Car Booking Page to Print Ticket Page...................................28
Figure 35: Change Password Page................................................................................................28
Figure 36: Screen Navigate from Change Password Page to Login Page.....................................29
Figure 37: Seat Selection Page......................................................................................................30
Figure 38: Screen Navigate from Seat Selection page to Seat Selection Popup page...................31
Figure 39: OTP Page.....................................................................................................................31

Figure 40: Screen Navigate from OTP page to Forgot Password Screen......................................32
Figure 41: Find Ticket Page..........................................................................................................32
Figure 42: Screen Navigate from Find Ticket Page to Ticket Details Page..................................33
Figure 43: Car Booking Details Page............................................................................................33

Introduction
This report is prepared for the cinema hall application and the name of the cinema hall is Cinema
Life. The interface designs are completed for this application. In the last assessment, the issues
are identified by another group so in this assessment my team will identify the solutions for them
and implement them in our interface screens. In this report, all the screens will be shown with
proper navigation.

Interface Design
The user interface of the Movie Ticket Booking is designed in the Balsamiq tool for the
organization. It is the tablet-based application which is named by “Cinema Life”. Every
prototype of the designed application is linked to each other. The correction was made by the
team members after proper evaluation of screens. Below, the overall screen was defined below
with proper user guide and the usage of the screens (Sulianta, et al., 2019).
Prototype 1: Login Page
Figure 1: Login Page
Description: This screen is the login screen in which authorized users can log in themselves
in the application with valid login credentials. With the help of Facebook and Google
functionality, new users can register themselves. Forgot password link is also available where
user can change their password if they forgot their password.
Components: Components used are Label, Buttons, tablet layout, icons, logo, and the
organization name.
Prototype Navigation

Figure 2: Screen navigate from Login Page to Home Page
The above screen defines the screen navigation from the login page to the home page by clicking
on the login button. After that user can use the application for book tickets of cinemas.
Figure 3: Screen Navigate from Login Page to Facebook Login Page

The above screen defines the navigation from the Login page to the Facebook login page by
clicking on the Facebook button from the login page. User can log in themselves with the login
credentials of Facebook.
Figure 4: Screen Navigate from the Login page to Google Login Page
The above screen defines the navigation from Login Page to Google login page by clicking on
the Google button from the login page. User can log in themselves with the login credentials of
Google.

Figure 5: Screen Navigate from Login Page to Forgot Password Page
The above screen defines the navigation from Login Page to Forgot Password page by clicking
on the Forgot Password link from the login page. User can change their password if they forgot
their password.
Figure 6: Screen Navigate from Login Page to Registration Page

The above screen defines the navigation from Login Page to the Registration page by clicking on
the “Sign Up Here” link from the login page. User can enter details for getting registered into the
application.
Prototype 2: Registration Page
Figure 7: Registration Page
Description: This screen is the Registration screen where new users can register themselves
manually into the application for accessing other functionalities. For registration, the user has to
enter the required details for register successfully in the tablet-based application.
Components: In this screen, some components used such as Label, Buttons, tablet layout, icons
logo, and the organization name.
Prototype Navigation

Figure 8: Navigate from Registration Page to Login Page
The above screen defines the navigation from Registration Page to the Login page by clicking on
the “Sign Up” button from the registration page. User can enter details for getting registered into
the application.
Prototype 3: Home Page
Figure 9: Home Page
Description: This screen is the home page of the tablet-based application where user can directly
move to the other screens such as Book Movies, Car Parking, and Booking details page. They
can also navigate from this page to another page by clicking on the navigation icon.

Components: In this screen, some components used such as Label, Buttons, tablet layout, icons
logo, and the organization name.
Correction: Logout Functionality is missing and it is resolved by Mounika Nallapati.
Prototype Navigation
Figure 10: Screen Navigate from Home Page to Movie Page
The above screen defines the navigation from Home Page to Movie page by clicking on the
“Book Movie” button from the Home page. User can view the released movie in the cinema hall.