FOODIES App: Webpage Design Report, Functional and Technical Details

This report provides a detailed analysis of the design and implementation of the FOODIES app, focusing on its webpage design and underlying system model. It outlines the software requirements, functional specifications, and user interface specifications necessary for creating an online food ordering platform. The report explores the core components of the system, including menu management, online ordering, and order retrieval systems. It delves into the technical aspects, such as the use of JAVA for front-end development and SQL for the database, and the utilization of Firebase as a real-time database. The report further elaborates on the implementation details, covering main activities like login, registration, and home-based functionalities, along with the addition of restaurant and street food activities, user profile displays, and the functionalities for certified critics and admin users. The report also includes documentation of the design, including a class diagram, and outlines the planning of the tests conducted to validate the functionality of the application. The report concludes with an overview of the testing and implementation phases, providing a comprehensive view of the FOODIES app development process.

Running head: WEBPAGE DESIGN FOR FOODIES APP
WEBPAGE DESIGN FOR FOODIES APP
Name of the student:
Name of the university:
Author Note:

1WEBPAGE DESIGN FOR FOODIES APP
Table of Contents
Introduction...........................................................................................................................................2
System model........................................................................................................................................2
Requirements of the software................................................................................................................2
Functional requirements........................................................................................................................3
Online ordering system......................................................................................................................3
Management system of menus...........................................................................................................3
Order retrieval systems......................................................................................................................4
User Interface Specifications.................................................................................................................4
Online ordering system......................................................................................................................4
Management system of menus...........................................................................................................5
Order retrieval systems......................................................................................................................5
Documentation of Design......................................................................................................................5
Fire Base............................................................................................................................................6
Planning of the test............................................................................................................................7
Implementation......................................................................................................................................7
Development.........................................................................................................................................7
Main activity......................................................................................................................................7
Registration activity...........................................................................................................................7
Home based activity..........................................................................................................................8
Adding activities of the restaurant...................................................................................................14
Street food activity...........................................................................................................................17
Display of the profile activity..........................................................................................................22
Display of the activities of other users.............................................................................................25
Addition of certified critic...............................................................................................................26
Addition of admin............................................................................................................................28
Documentation of the Test...................................................................................................................30
Conclusion...........................................................................................................................................31
References...........................................................................................................................................32

2WEBPAGE DESIGN FOR FOODIES APP
Introduction
This report aims to address the software and the required system specifications favorable for
the purpose of designing a food app named FOODIES. The functional requirements of the app
fetching the desired requirements of updating the customer information, adding address, placing the
order, modification of the order are elaborated in this report. This report also mentions the provision
of adding user profiles and modifying the same based on certain criterion.
System model
The infrastructure of a food application, in this particular event of FOODIE APP, incorporates
3 fundamental components. The first constituent should address the management of the menu that
eventually will permit the restaurants to efficiently manage the orders placed by the customers. The
second succeeding constituent in this regard is the ordering system that is entirely managed and
controlled by the web and eventually facilitates the customers to place their required orders and enter
all their necessary credentials (Banerjee et al. 2016). The ultimate logical component is the retrieval
system for the order. This system efficiently monitors all the orders of the system that has been placed
by the customers, the orders that have undergone modifications before the preparation of the food,
sets up the delivery time. This component eventually retrieves all the information that are being
portrayed on the app and updates all the orders that have been processed.
Figure 1: Infrastructure of the system
Source:
Requirements of the software
The software specifications that would efficiently fetch the desired purpose of developing the
FOODIE APP are organized in the subsequent section:

3WEBPAGE DESIGN FOR FOODIES APP
1. JAVA will be used as the coding language that will fetch the operational activities of
the front end of the applications.
2. SQL is generally opted for coding the database of an online FOOD delivery
application like the FOODIE APP that would eventually serve the purpose of
designing the database for the back end of the application.
Functional requirements
The functional requirements for the infrastructure of the food application FOODIE are
categorized into subdivisions as elaborated in the subsequent section:
Online ordering system
The online ordering infrastructure of the FOODIE should address the following requirements:
1. The preliminary step is the creation of an account for the user.
2. This should render the provision for the management of the account of the customers.
3. The immediate step is the successful log in of the customers into the system.
4. This should grant the access to the customers to navigate the menu of the restaurant.
5. The immediate step is the selection of a particular item or an array of items by the
customers.
6. The app should provide the facilities for the customization of an opted item.
7. The customers should be able to add an item to their existing order (Banerjee et al.
2016).
8. The app should also provide the facilities to the customer that will facilitate them to
review their order prior to the transaction.
9. The app needs to be user friendly in the regard that it should enable the customers to
remove an item from their order list prior to the preparation of the food.
10. The app should reflect the payment details and at the same time should portray the
estimated delivery time.
11. The customers will be benefited with the options of cashback on the placement of
their first order.
12. Finally, the app should notify the customers with a confirmation mail on their behalf
about the successful placing of an order, order number and the transaction details as
well.
Management system of menus
The management system for the menus is equally important. The management of the menu
system provided by the graphical interface should address the following requirements:

4WEBPAGE DESIGN FOR FOODIES APP
1. The management system should be provisioned to add a vendor to the menu. This
should also have the access to delete certain vendors from their menu. Apart from
that, this should equally be competent to update a vendor in the menu.
2. The app should be capable to add a new variety of food in the menu. In a similar
fashion, this should also be capable to update about the modifications about an item.
Eventually it should provide the options to delete an existing item from the menu
(Dias, Ferreira and Barreiro 2015).
3. The app should render the facilities to reflect the update the pricing of the given food
item.
4. This should categorically render the provisions for the update about a particular item.
5. Finally, it should address the requirements to update or add the specifications about a
given food item.
Order retrieval systems
The retrieval systems dealing with the order, should be designed in a user friendly approach
so that it is easily handled by the restaurant employees and render the following functionalities:
1. The FOODIE app should be able to retrieve the brand new orders from the database.
2. Should provide graphical representation of the placed orders (Dias, Ferreira and
Barreiro 2015).
3. The FOODIE app should equally render the provisions for the marking of an order
that is on the procurement of processing and removing the same from the array of
active orders.
User Interface Specifications
Online ordering system
1. The customers of the online ordering system are required to interact with the FOODIE app
that is facilitated by the series of simple forms. The attached forms provide the facilities for
the drop down menu that will facilitate the customer for opting an item from the drop down.
2. The facility of adding a particular food item in the order list is made feasible by clicking a
single button (Dias, Ferreira and Barreiro 2015).
3. The provision of performing rigorous and thorough navigation through the menu bar is also
facilitated by the online ordering system.
4. The procedure incorporating the entrain of the order details and the payment gateway is also
executed in a similar fashion.

5WEBPAGE DESIGN FOR FOODIES APP
Management system of menus
1. The management system of the menus facilitated by the FOODIE APP, provides the
navigation of the tree based structure to monitor the vendor and the category of the food item.
2. This would also render the provisions of modifying the customer fields even after the placing
of the order is done provided the food is not made.
Order retrieval systems
1. This system embedded within the infrastructure of the FOODIE APP, will retrieve new orders
from the database of the FOODIE APP on a regular basis (Dias, Ferreira and Barreiro 2015).
2. This will portray the estimated time for the delivery of the opted food item, reflected on the
left hand side of the application. For viewing the order details, the user is required to click on
the order number.
3. The details of the order number are reflected in the right-hand panel along with the details.
Documentation of Design
Figure 2: Class diagram
Source:

6WEBPAGE DESIGN FOR FOODIES APP
The class diagram provided above renders a schematic idea about the classes to be used for
the construction of the required database of the FOODIE APP. The opted database for this particular
scenario is the Firebase (Liu et al. 2017). The execution is performed in two steps:
1. Initializing the restaurants.
2. Afterwards, they are stored in the firebase.
Figure 3: Methodology of storing the user defined object in the cloud database.
Source:
Fire Base
Figure 4: Fire database credentials
Source:
One category of the cloud database is the Firebase. This will empower the FOODIE APP to
utilize the firebase as a real time database. The registration procedure of an user is followed by the

7WEBPAGE DESIGN FOR FOODIES APP
saving of the profile details, afterwards the authentication procedure will be implemented (Liu et al.
2017).
Planning of the test
Abiding by each of the functional requirements, the desired test will be executed and the
results will be portrayed.
Implementation
Development
Main activity
This includes the provision of the log in form and also a registration link. The constraints
encountered in due course of this procedure is the 1. The log in form is not limited to specific users. 2.
The registration form is user specific.
Figure 5: Login form
Source:
Registration activity
The registration activity is applicable to the new users who don’t have an existing account in
the FOODIES APP (Liu et al. 2017).

8WEBPAGE DESIGN FOR FOODIES APP
Figure 6: Registration form
Source:
Figure 7: Codes deployed to serve the purpose of successful registration
Source:
Home based activity
This is the fundamental activity that the user is aspire to perform, post the successful login.

9WEBPAGE DESIGN FOR FOODIES APP
Figure 8: Display of home based activities.
Source:

10WEBPAGE DESIGN FOR FOODIES APP
Figure 9: Homepage
Source:
The purpose of retrieving the array of restaurants from the database is facilitated by the
firebase. The corresponding structure is depicted below (Liu et al. 2017).
The corresponding codes for the execution of the database operations are given below:.

11WEBPAGE DESIGN FOR FOODIES APP
The data casting operation is succeeded by the addition to the list view. The selection of a
restaurant is followed by sending the restaurant details to the activities exhibited by the restaurant.
(McClements 2015)
The data passed to the restaurant activity class is then fetched and portrayed.