semi project is an introductory course that introduces us to the basic services needed to host manage and access a secure website you will learn about back end and front end technology

User Requirements.1.1 Functional Requirements- These are the functional requirements that our website must meet the needs of users:+ Reservation function: The website allows customers to

ASSIGNMENT 1 FRONT SHEET

Unit number and title

1

❒Summative Feedback: ❒Resubmission Feedback:

Signature & Date:

2

1.3 Use case Diagram 8

II System Designs 16

1 Site Map 16

1 Entity Relationship Diagram (ERD) 17

III Wireframes and specific explanation 19

IV About of website 29

3

Table of Figure

Figure 1:use case 9

Figure 2:erd 1 20

Figure 3:erd 2 20

Figure 4:home page 1 22

Figure 5:home page 2 23

Figure 6:sign in 24

Figure 7:sign up 26

Figure 8:car rentals 1 26

Figure 9:car rentals 2 27

Figure 10:attraction 1 28

Figure 11:attraction 2 29

Figure 12:airport taxis 30

Figure 13:home page 31

4

A Introduction

Semi-Project is an introductory course that introduces us to the basic services needed to host, manage, and access a secure website You will learn about back-end and front-end technology This is my personal report The following report will include the following sections:

+ User requirements+ System design+ Perform.

5

B Body of ReportI User Requirements.1.1 Functional Requirements

- These are the functional requirements that our website must meet the needs of users:

+ Reservation function: The website allows customers to make hotel reservations easily and conveniently Usershave the ability to search and view detailed information about hotels, including prices, amenities, reviews and reviews from past customers.

+ Order management: Booking.com has the function of recording and storing information about customer orders The web application can store details of check-in date, check-out date, number of guests, contact information and other special requests of the customer.

+ Safe and convenient payment: Booking.com provides a safe and convenient way to pay customers The site supports various payment methods, including credit cards, bank transfers, and other popular online payment services.

+ Booking Confirmation and Receipt: After the customer completes the booking process, the web application will provide a detailed booking confirmation, including information about the customer, check-in date, check-out date, room type booked, total cost and selected payment method In addition, the app also provides

6

detailed receipts to customers, including the customer's name, list of ordered items, the cost of each item, and the total payment amount.

+ Transaction Statistics: Booking.com should provide weekly, monthly, and yearly transaction statistics This allows management to see total bookings, revenue, and other related metrics for specific time periods.+ Customer support: Booking.com provides a customer support channel to deal with issues, questions, or

complaints from customers The direct contact function or online support will help customers interact and receive quick support from the customer care team.

- Here are some necessary and pragmatic cases for our Booking.com website:

+ When a customer makes a reservation, their booking information will be recorded using our web application This includes information on check-in, check-out dates, number of guests, contact information and other special requests.

+ Our web application is capable of handling customer communication efficiently and quickly This ensures that any changes, adjustments or cancellations are handled accurately and in a timely manner.

+ Once the customer completes the payment, the website will provide a detailed receipt to the customer This receipt should include the customer's name, a list of items purchased, the total cost of each item, and the total amount paid.

+ Our website will provide transaction statistics by week, month, and year This helps management track revenue, total bookings, and other important metrics to analyze and evaluate business performance.1.2 Non-Functional Requirements.

+ Performance: The system needs to meet performance requirements, including fast page load times, handling

user requests quickly, and responding to multiple users at once without interruption.

7

+ Security: The system must comply with high security standards to protect customers' personal information, ensure transaction safety and prevent unauthorized access.

+ Scalability: Booking.com needs to be able to scale the system to accommodate the increased user load and scale the business in the future without compromising on performance.

+ User Interface: The interface of Booking.com websites and applications should have a user-friendly, use and intuitive design that helps users find information and perform operations easily and conveniently.

easy-to-8

1.3 Use case Diagram

Figure 1:use case

a UC01 (Login)

9

Name Login Code UC01

Description Allow actor login to the system

Pre−condition The actor has an account

Post condition Go to the homepage with the corresponding role

Main Flow: login successfully

From any screen, the actor selects Login

Load page Login

Enter the required information.

10

Validation input information

Edit (if a wrong password or username).

Load the main page

b UC02 (Register)

Description Actor provides information to create an account to access the system

Pre−condition The actor has an account

Post condition Register successfully!

11

Main Flow: add new user successfullyFrom any screen, the actor selects Register

Load page Register

Enter the required information.

Validation input informationEdit (if a wrong password or username).

Load the main page

c UC03 (Logout)

Description Actor stops accessing the system.

12

Actor User/admin Trigger Actor click button [log out] on the main page

Pre-condition User has logged in accountPost condition Logout successfully!

Main Flow: login successfully

From any screen, the actor selects Logout

Load the main page

13

d UC04 (Search)

Description This use case describes the process of searching for booking options on the booking website Users can enter search criteria such as location, check-in date, and check-out date to find suitable hotels or accommodations based on their needs.

Pre-condition The booking website has been loaded.

Post condition The user is presented with a list of available options matching the search criteria.

Main Flow:

14

User enters search criteria, such as location, check-indate, and check-out date.

User submits the search request.

System validates the search criteria.System retrieves and presents a list of available options based on the search criteria.User reviews the list of available options.

User selects a desired option from the list.

System displays detailed information about the selected option.

e UC05 (Booking)

Description This use case describes the process of making a reservation on the booking website Users can select a hotel, choose a room, provide reservation details, and complete the booking process.

15

Pre-condition The booking website has been loaded.

Post condition The user successfully makes a reservation and receives a confirmation.

Main Flow:

User searches for hotels by entering search criteria such as location, check-in date, and check-out date User selects a desired hotel from the search results.

User chooses a specific room type or package from the hotel's available options

User provides reservation details, including guest names, payment information, and any special requests.User reviews the reservation details and confirms the booking

System processes the reservation and generates a confirmation.

System displays the reservation confirmation to the user.

16

II System Designs1 Site Map

A sitemap is an outline for your site that helps web search tools in finding, slithering, and ordering the totality of your material Sitemaps additionally illuminate web crawlers about the most fundamental pages on your site.

17

1 Entity Relationship Diagram (ERD).

18

Figure 3:erd 2

III Wireframes and specific explanation

Wireframing is a procedure for planning a site's construction A wireframe is a graph that shows how data and usefulness on a site ought to be laid up, thinking about client requests and excursions

- From the get-go in the improvement cycle, wireframes are utilized to assemble the key structure of a page before visual plan and content are added

20

- A wireframe is a website page design that shows what interface parts will be available on significant pages It's a significant stage in the interface configuration process

- A wireframe's motivation is to make a visual portrayal of a page from the get-go in a venture so partners and task colleagues might endorse it before the innovative flow starts.

Our website is carefully wireframed with a clear and detailed plan that includes the following pages:Home page

21

22

Sign in page

23

Sign up page

24

Car rentals page

26

Attraction page

27

28

29

Airport taxis page

30

IV About of website

Booking is the name of my website - an online hotel booking website If people are busy and do not have time to go to the hotel to make a reservation, they can go to this website to book a room In addition, the website also allows you to hire a taxi or rent acar to visit the city.

31

32

C Conclusion

After completing this report, I sketched the website design using a wireframe tool with full features to meet the requirements of users and customers After the sketch, I proceed to design the website with my brand In addition, I learned more front-end and back-end, functional and non-functional requirements I have scheduled a test to determine speed and use it to review your website functionality.

33