Team Design: UI Corrections for Food Delivery App (ITC-504)

Desklib provides past papers and solved assignments for students. This report details UI corrections for a food app.

ITC-504
INTERFACE USABILITY
ASSIGNMENT-4
TEAM DESIGN
Student Name: Raviteja Gattamaneni
Student Name: Venu Gopal Challa
Student Name: Raviteja Gattamaneni
1

Contents
Introduction......................................................................................................................................3
User Interface Design......................................................................................................................4
Corrections by Team Members.....................................................................................................49
Navigation Path of Food App........................................................................................................50
Conclusion.....................................................................................................................................51
References......................................................................................................................................52
2

Introduction
This report consists of the corrections of the interface design of a restaurant application from the
evaluation report that is made by other team members. The corrections will be performed based
on heuristic principle. Certain issue are been identified by the team members of the other group
based on the heuristic principle and corrections will be performed by proper linking, status bars,
popup and adding new images and alert massages for better user experience of the application.
3

User Interface Design
Interface design basically focuses on the activities that a user need to do. Interface designs are
such that the user can easily use it, access it, understand it and the designs are used to facilitate
the actions of the user. User interface design works on the concept of visual design, information
architecture and interaction design.
Elements of Interface design:
 Input Controls: Text fields, buttons, checkbox, radio buttons, dropdown list, list boxes,
date field and toggles.
 Informational components: Icons, progress bar, notifications, message boxes, tooltips,
model windows.
 Navigational Components: Slider, search field, breadcrumb, pagination, tags, slider,
icons.
Outcomes of User interface:
 The Website should be easy to use and familiar from the user when the user visits the4
site for the first time.
 The objective of the user should be accomplished by the website.
 The interface should be such that it should be easy for the users to recall the user
interface and the procedure of using the website every time the user visits the website
(Interaction design, 2018).
Screen 1:
4

Figure 1: Interface Design of Table booking
Screen 1 is the table booking screen which enables the user to book a table for their family and
friends. This screen is provided with blank spaces for the users to enter the required booking
information’s. This information’s covers the Name of the person booking the table, Total number
of persons and table number that is selected by the user. Entering all the information the user can
book a table for them.
Components: This page consists of logo of the food application, space bar for entering the
credentials that are required, navigations and login buttons.
Navigations:
5

Figure 2: Navigation path from notification icon to notification page
Purpose: The terms and condition button that is provided on the top right cormer if the page will
nevigate the user to the terms and conditions page.
Figure 3: Navigation path from book table to login page
Purpose: The book table option that is provided at the botton of the page will navigate the user to
the login page where the user needs to enter the required login credentials for making a order of
the items that user wish to have from the restaurent.
6

Figure 4: Navigation path from book table to left drawer
Purpose: The menu button provided at the extreame left cormer of the booking table page
navigate the user to the left drawer where the user will find all the features that are incorporated
in the application which includes home, table booking, cart best seller, logout option and terms
and conditions.
Screen 2 :
7

Figure 5: Interface design of login page
Screen 2 is the login page that includes the login credentials that are required for using the
application for placing an order for the required food items. It requires the name of the user,
password for login and other login options (Facebook and gmail). New register option is
provided for the new users of the applications who are not registered earlier. Password reset
option is provided if the user has forgotten the registered password (Interactiondesign, 2018).
Components: This page consists of logo of the food application, space bar for entering the
credentials that are required, navigations and login buttons.
Navigations:
8

Figure 6: Navigation path from login page to table booking page
Purpose: The back button provided at the left corner will navigate the user back to the table
booking page.
Figure 7: Navigation path from login page to password reset page
Purpose: The forgot pasword optiopn provided will navigate the user to the password reset page.
Where the user can enter new password for login.
9

Figure 8: Navigation path from login page to facebook login page
Purpose: The gmail login option that is provided at the botton left corner of the applicatiojn will
navigate the user to the facebook login page.where the useer need to enter the credentials for
facebook login.
Figure 9: Navigation page from login page to Gmail login page
10

Purpose: The Google login option that is provided at the left corner of the page will navigate the
user to the google login page. Fron where the user can use their gmail account for login.
Figure 10: Navigation path from login page to menu page
Purpose: On entering the information at the login page it will navigate the user to the menu of
the restaurent.
11

Figure 11: Navigation path from login page to registration page of the user is new to the application
Prupose: The signup option provided at the bottom of the page will navigate the user to the
registration page if the user is new to the application.
Screen 3:
Figure 12: Interface design of password reset page
12