Khóa luận tốt nghiệp Công nghệ thông tin: Ứng dung quản lý quán ăn tại Thủ Đức

1 Đối với người dùng chưa có tài khoản, họ có quyền thực hiện các chức năng như điều hướng, tìm kiếm và đềxuất nhà hàng dựa trên thời tiết dựa trên đánh giá của người dùng khác.. Chức nă

ĐẠI HỌC QUỐC GIA TP HÒ CHÍ MINH

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN

KHOA KHOA HỌC VÀ KỸ THUẬT THÔNG TIN

Trần Hữu Hoàn — 19521526

Nguyễn Thanh Minh — 19521846

KHÓA LUẬN TÓT NGHIỆP

Ứng dụng quản lý quán ăn tại Thành phố Thủ Đức

Restaurant management application in Thu Duc city

CU NHAN NGANH CONG NGHE THONG TIN

GIANG VIEN HUONG DAN

TS Nguyễn Gia Tuấn Anh

TP HO CHÍ MINH, 2023

LỜI CẢM ƠN

Chúng tôi xin gửi lời cảm ơn chân thành đến tất cả các quý thầy cô

Khoa Khoa học và Kỹ Thuật Thông Tin, trường Dai hoc Công Nghệ ThôngTin thành phố Hồ Chí Minh — Đại học Quốc gia thành phố Hồ Chí Minh đã

tạo cơ hội cho chúng tôi được học tập, rèn luyện và tích lũy kiến thức, kỹnăng dé chúng tôi hoàn thành khóa luận tốt nghiệp của minh

Đặc biệt, chúng tôi vô cùng biết ơn Giáng viên hướng dẫn T.s NguyễnGia Tuấn Anh đã động viên, hướng dẫn và hỗ trợ tận tình trong suốt quá

trình thực hiện nghiên cứu này Chuyên môn, phản hồi sâu sắc và những lời

khuyên bé ích của thay là công cụ giúp chúng tôi định hình phương hướng

và chất lượng của đề tài này

Chúng tôi cũng xin cảm ơn những người đã cộng tác và sẵn lòng chia

sẻ sự hiểu biết, kinh nghiệm của họ Những đóng góp này đã góp phần quan

trọng trong quá trình hình thành kết quá của nghiên cứu

Chúng tôi xin gửi lời cảm ơn sâu sắc đến Công Ty Cổ Phan Ứng Dụng

Bản Đồ Việt (VIETMAP JSC) đã tư vấn, tạo điều kiện và cung cấp nhữnggiải pháp thích hợp cho chúng tôi.

Cuối cùng, chúng tôi muốn thể hiện sự cam ơn đối với toàn bộ các tácgia đã giúp đỡ dưới mọi cách thức khác nhau, kể cả qua trao đỗi, bình luận

hoặc hiệu đính Những đóng góp của mọi cá nhân đã đóng một vai trò quan

trọng giúp chúng tôi nâng cao chất lượng của đề tài này

Chúng tôi xin cam đoan đề tài “Ứng dụng quản lý quán ăn tại thànhphố Thi Đức” là công trình nghiên cứu của chúng tôi và dưới sự hướng dẫn

của Giảng viên T.s Nguyễn Gia Tuấn Anh Toàn bộ dữ liệu trong đề tài đềuđược chúng tôi thu thập một cách trung thực Do còn hạn chế về mặt kiến

thức và kinh nghiệm thực tiễn nên nội dung khóa luận khó tránh được sự sai

sót Chúng tôi rất mong được nhận sự góp ý từ quý thầy cô

Chúng tôi xin kính chúc quý thầy cô luôn thật nhiều sức khóc và đạt đượcnhiều thành công hơn trong công việc

Xin chân thành cảm ơn.

5 Phương pháp nghiên CỨU ¿+ + 22252 2 E22 +EEEErrrrrrkrrrree 3

.6 Đóng góp khóa luận ¿+ +5++++++ tt re 4(7 Cu trite kh6a sa n.: ÔỎ 4Chuong 2 KHAO SAT ĐỜI THUC cescescccscsccsssssssssesesecsssessssecsssecasessssesessecssseease 5

2.1 Khảo sát giao diện và chức năng . ¿-¿555cc+csrerercrexrrrrsre 5

2.1.1 Ung dụng FOody -©2cccce2ccveeecrvererrxerrrrrercee 52.1.2 Ứng dụng Grab Food 2-22c¿+22+ev2ccvereersrrrsrrercee 72.1.3 Ứng dụng ClingMe -¿-©ccccceccvercerserrrrrercee 9

2.1.4 Nhận xét ưu nhược điểm các ứng dụng -+++s+c<cscsxcee 10

2.2 Các công nghệ xây dựng ứng dụng Mobile - 5:55 10 2.2.1 Native App Development .- -¿- «+ xe 10

2.2.2 Cross Platform - +22 S* 2 trước 11 2.2.3 Hybrid App

2.2.4 So sánh các công nghệ Làn HH gưưn 122.3 Các quy trình phát triển ứng dụng,

2.3.1 Mô hình thác nước (waterfall mode]) - -¿ «+sc+cs+x<exsvxsxse 13

2.3.2 Mô hình xoắn ốc (Spiral Model)

2.3.3 So sánh mô hìnhh 2555252 S*2* 2222 2 E22 Exrrrererrrree 16

3.1.7 Dẫn đường trên bản đồ -2:©222+++22v+rrtcrxrrrrrrrrrrrrxee 18

3.1.8 _ Gợi ý quán ăn c Ăn HH HH Hi, 19 3.2 Phân tích các use-case cho các chức năng trên -‹-5-++++s+ 19

3.2.1 Use-case đăng ký c SH, 21

3.2.2 Use-case đăng nhập - cà St 223.2.3 Use-case tìm kiếm cccccrrrirrrrrrrrrirerrierrree 23

3.2.14 Use-case điều chỉnh ThUC 0 30

4.3.1 React Native FTramWOK - c1 vn ng gi 35

4.3.2 Phác thảo cấu trúc ứng dụng -. ¿ z+2+c+cxsczrxerrrxerrree 36Chương 5 CÀI ĐẶT VÀ TRIEN KHAI UNG DỤNG . - 40

5.1 Cài đặt và thiết lập kết nói với cơ sở dữ liệu ¿ -¿ccc5csce2 405.2 Cài đặt và triển khai ứng dụng -s¿+2+++2++2cxxtzrxrerrxrsrrrcersree 405.2.1 _ Cài đặt môi trường 222ccccccrrreerrrrrrrrrrreerrree 41 5.2.1.1 CàiLđặt Java gn Ăn ctke 41 5.2.1.2 Cài đặt Android Studio -cccccccccvccecvreersrrrrrrerxee 43 5.2.2 Màn hình trang Home - ¿+ 2 + +++++£+£+x+xz£ersesxree 44 5.2.3 Màn hình trang đăng ký c5 Street 44 5.2.4 Màn hình đăng nhập - St ssekrersrrrekrrrrrrerree 47

5.2.5 Màn hình thông tin người dùng 6 5S sseereereex 48

5.2.6 Màn hình chỉ tiết quán ăn ¿ ¿©2+++2++t2xEttrxerrrkesrrrcrrk 50

5.2.7 Màn hình trang bản đồ -¿22+z222tc22EEcEEkerrrkrerrrrrrr 52

5.2.8 Màn hình trang quán ăn yêu thích ¿+ +c+x+xecxexseseeee 545.2.9 Màn hình tìm kiếm -¿©2+2V++t2E++tEEveEEErerkrrrrrrerrrrrrr 565.2.10 Man hình bình luận - -.¿- 2c 2 +23 S23 £+ESEeeEeesereeeserreesssee 57 5.2.11 Màn hình gợi ý Sàn HH hàn 59

5.2.12 Màn hình đặt bàn 7-5 S+sseieerererrrrrrrrrrrerrrrrre 60

5.2.13 Man hình phía nhà hàng

5.2.14 Man hình thống kê 222¿2222+22EEEEEELEtEEEErrrrrrrrrtree 62Chuong6 ĐÁNH GIA KHÓA LUẬN

6.1 Phát triển ứng dụng : 2¿-©+¿222++22E++2E++22EE2EEE2EAvEEEerrrrrrrvee 646.2 So sánh hiệu năng.

Màn hình ứng dụng Clingme 9

Hình 7: Mô hình thác nước 14

Hình 8: Mô hình xoắn ốc „l5

Hình 9: Sơ đồ Use Case 20

Hình 10: Sơ đồ use case của Quán lý nhà hàng . -¿z52s++22sz+cvxesrx 21

Hình 11: Logo FireBase - 6c tk HH HH Hư 32

Hình 12: Các thực thể -22-222+222222212222122211227112211222112711 2111211221 xe 34

Hình 13: Logo React NatÏV€ cv tt HE HH hờn 35

Hình 14: Trang HOIe - S5 tt tk E*E RE gkgg ggrưưn 36

Hình 15: Trang chỉ tiết quán ăn -2¿-222222222222YE+2EEEEEtEEEEErtrrrrrrrrrrrrrrrr 37

Hình 16: Trang đăng nhập và đăng ký ¿+ xexereEererrkekerererrree 38

Hình 17: Trang bình luận và trang prOfiÏ€ - ¿+++++x+x++xvEervrevexerererere 39

Hình 18: Thêm biến môi trường ¿-2¿©2++++++2++££EEE+2EEEtSEEErrrxerrrrrsrk 4I

Hình 19: Thêm biến JAVA_HOME -: 55c 222 viet 42

Hình 20: Kiểm tra cài đặt JAVA sssssseecesscscssssssssssnseeeeeeesscssesssssnnseseeeseseessesssnnnneess 43Hình 21: Thêm biến ANDROID_HOME - 5S Sky 44Hinh 22: Man hinh dang kyo 46

Hình 23: Man hình đăng nhap 00.0 ccc cceeeseceeeeseeseeeeeeeeeeeeeceeeeeseeseseeeeneaeeseneneeeee 47

Hình 24: Màn hình thông tin người dùng eeeeteeeeeeeeeeeeeeeeneneeeeeeeeeeee 49

Hình 25: Màn hình chỉ tiết quán ăn 22-©222+22E+v22E222EE223E221222Eecrrkrrrr 51Hình 26: Màn hình trang ban 6 ccccscsscssssessssessssesssessssecsssecsseesssesssseeesseesseeesseees 53

Hình 27: Màn hình trang quán ăn yêu thích ¿-¿- + ++x+x+xvxvrvrteveversrerrree 55 Hình 28: Mann hinh no 0 57

Hình 29: Màn hình bình luận - + 2 222222 S332 E2£E£EE£E£vEeEeEerketseverxrssexre 58

Hình 30: Các chức năng gợi Ý 5+2 St St vtsEeerrrrrrsrrrrrrrrrrrrrree 59

Hình 31: Chon số lượng người, thời gian, món ăn và thanh toán - 60

Hình 32: Thông tin đơn hàng đang duyệt hoặc đã duyệt -. . - + 61

Hình 33: Màn hình phía nha hang eeseeseseeseseeeeeeeeescneseeeseseeneesseaeesereeeeee 62Hình 34: Màn hình thống kê 2 22+£©E+++2EE++++EEE++ttEEEEretrxrrrrrrrrrrrrk 63

DANH MỤC BANG

Bang 1: Bảng so sánh công nghé - - St xE‡veEvekerrkerrkerrkrrrrerrrree 13 Bang 2: Bảng so sánh mô hình 5c tt t 39E22EESvekexsrererrrekrkrkrrerrrrrke 16

Bang 3: Use case đăng ký nh HH nhàn 22

Bang 4: Use case đăng nhập - St St t2 2kg 23

Bảng 5: Use case tìm kiếm - 2-2222 222222E2122312221122312711 2211211221 xe 23

Bang 6: Use case EÏÏt€T tt tt TT HH HH1 24

Bảng 7: Use case dẫn đường - ¿222222222 22t 221221221122111112111211211 211.1 25

Bang 8: Use case danh sách quan ăn + Et‡t‡EtSkeEEkerekerrkerrrrrrrie 25 Bang 9: Use case đặt bản 2t t1 2t t1 911111111112111111111111121111101 ke 26 Bang 10: Use case bình luận tt v39 EEEEESEkEEErrrrrrrrkrkrkrrrrrrrrke 27 Bang 11: Use case đánh giá - tt Ỳ 2121121 27 Bang 12: Use case gợi ý theo thời tiẾt tt tư 28

Bảng 13: Use case gợi ý theo độ tuôi -22-222 2222212 22212223127122212 222cc 28

Bang 14: Use case gợi ý theo đánh giá - St tttrtkeriririekerrerree 29 Bang 15: Bang so sánh khóa luận hiện tại và trước đó - -.- ++c+c++csxvsxe+ 65 Bang 16: Bảng so sánh hiệu năng S222 232v 2t2xexsxeErrrrrtrtrrersrrrrrre 65

DANH MỤC TỪ VIET TAT

STT | Viết tắt Từ viết tắt

1 TS Thac si

2 HTML Hypertext Markup Language

3 CSS Cascading Style Sheets

9 URL Uniform Resource Locator

10 API Application Programming Interface

TÓM TÁT KHÓA LUẬN

Trong đề tài này, chúng tôi xây dựng ứng dụng tìm kiếm và giới thiệu các nhà

hàng, quán ăn; quán ăn ven đường cho người dùng trên thiết bị di động, với ý tưởng

lấy từ khóa luận tốt nghiệp khóa trước

Nghiên cứu điểm mạnh và điểm yếu trong chức năng của các ứng dụng liênquan, ví dụ: ClingMe, Foody dé tạo ra các chức năng khác biệt với chúng

Ứng dụng sử dụng (1) React Native để tạo giao diện người dùng (2) FB do

Google phát triển, cung cấp một bộ công cụ và dịch vụ hoàn chỉnh để xây dựng các

ứng dụng web và di động, bao gồm các API = đơn giản và mạnh mẽ, không cần phụtrợ hoặc máy chủ FB cung cấp lưu trữ dit liệu, xác thực, cơ sở dit liệu thời gian thực

và các chức năng khác.

Một số kết quả sau khi hoàn thành ứng dụng: Tạo tài khoản cho người chưa

có tài khoản và người có tài khoản trên thiết bị Android (1) Đối với người dùng chưa

có tài khoản, họ có quyền thực hiện các chức năng như điều hướng, tìm kiếm và đềxuất nhà hàng dựa trên thời tiết dựa trên đánh giá của người dùng khác (2) Đối với

chủ tài khoản sẽ được sử dụng các chức năng trên cũng như các chức năng khác như:

yêu thích, đặt bàn, gợi ý độ tuôi, bình luận, đánh giá Cuối cùng, FB sẽ nhận thôngtin từ Cloud Firestore và gửi lại cho ứng dụng dưới dang JSON.

Được lấy cảm hứng từ đề tài khóa luận tốt nghiệp “Phát triển ứng dụng gợi ý phim cho người dùng” do Vũ

Cao Nguyên thực hiện trong năm học 2020 - 2021.

Chương 1 TONG QUAN

Tom tắt chương: Chương 1, chúng tôi trình bay sơ lược cấu trúc của dé tài và nêu

ra những lý do khiến chúng tôi quyết định thực hiện dé tài này Qua đó xác định đượcmục đính, đối tượng và phạm vi nghiên cứu, các phương pháp thực hiện Nêu ranhững vấn đề cần giải quyết

1.1 Lý do chọn đề tài

Các App như GrabFood, ClingMe, Foody hiện đang có chức năng đặt đồ ăn trực tiếp

về tận nhà Tùy vào nhu cầu người dùng, việc ăn uống tại nhà cũng nảy sinh nhiều

vấn đề như: dọn đẹp sau bữa ăn, chỉ phí giao hàng, không gian chật hẹp hoặc nhàmchán Lúc đó việc đi trực tiếp các quán ăn, nhà hàng sẽ giải quyết các vấn đề trên.Chúng ta sẽ không phải lo về việc dọn đẹp, chỉ phí giao hàng, không gian không thuận

tiện cho việc ăn chơi thoải với bạn bè, gia đình sau những giờ học tập, làm việc vất

vả.

Đây là lý do dé chúng tôi muốn phát trién một ứng dụng có thé dan người dùng tới

các địa điểm ăn uóng, gợi ý các địa điểm ăn uống, đặt bàn tại các địa điểm đó

thêm vào danh sách yêu thích.

Đối với những người không tìm được địa điểm phù hợp, ứng dụng sẽ đưa ra những

gợi ý ràng buộc theo những quy tắc nhất định: độ tuổi, thời tiết, những đánh giá

1.3 Đối tượng.

Đề tài tập chung vào nhóm người dùng có nhu cầu di chuyền trực tiếp ra các quán ăn

Họ thường là những người không thích việc don dep sau khi ăn tại nhà, đổi khôngkhí, không thích làm phiền hàng xóm hoặc những người có đam mê với việc thưởng

thức các món ăn khác nhau ở những quán khác nhau, sẽ có nhu cầu đặt bàn hoặc là

không.

1.4 Phạm vi nghiên cứu.

Phạm vi nghiên cứu của chúng tôi xoay quanh các việc sau:

- Thu thập thông tin các quán ăn (Tên, địa chỉ, Menu, Danh mục)

-_ Tìm hiểu học hỏi cách mà các ứng dụng khác xây dựng giao diện

- Tìm hiểu về điểm nồi bật, những điểm cần tránh của các ứng dụng khác, sau

đó học hỏi và tạo ra các chức năng khác biệt so với họ.

- Tìm hiểu về GIS

- Tim hiểu và áp dụng FB va trong ứng dụng

1.5 Phương pháp nghiên cứu.

Chúng tôi sử dụng các phương pháp nghiên cứu:

- Thực hiện nhúng bản đồ thêm current location (vị trí của User) và vị trí của

quán ăn, nhà hàng Thực hiện chỉ đường cho User tới quan đó, và có lộ trình

di chuyển

- Dựng khung cho phan giao diện

- Thu thập thông tin của quán ăn Từ đó thiết kết dữ liệu đưới một hình key —

value VD Mô tả tên của của một quán ăn sẽ có key là “Tên” và value là “Nha

hàng Góc Huế”, tương tự cho các quán ăn khác

- Cài đặt và cầu hình FB cho một dy án RN Sau đó đồ dữ liệu về giao diện

- Sit dụng Authentication của FB để tạo trang đăng nhập và đăng ký

Xây dựng những chức năng cập nhật dữ liệu, thêm, xóa.

1.6 Đóng góp khóa luận.

Các đóng góp của khóa luận:

- Bộ dé liệu gồm 20 quán với thông tin chỉ tiết như: Tên, địa chỉ, toa độ

- _ Xây dựng giao điện mobile đẹp, dễ sử dụng với mọi tang lớp

- Có một số chức năng khác biệt nhằm thỏa mãn những nhu cầu thực như chức

năng chỉ đường, đặt bàn, gợi ý.

- Gợi ý các nhà hàng nếu người dùng không biết chọn gì Họ có thé Sign In /

Sign Up và họ sẽ nhận được những gợi ý về các quán ăn phù hợp với nhữngthông tin đã cung cấp

- Các chức năng đánh giá, bình luận.

1.7 Cấu trúc khóa luận

Cấu trúc khóa luận:

- Chwong 1: Tổng quan

- Chương 2: Khao sát đời thực.

- _ Chương 3: Các chức năng ứng dụng.

- _ Chương 4: Thiết kế ứng dụng

- Chương 5: Cài đặt và triển khai ứng dụng

- _ Chương 6: Đánh giá kết quả với khóa luận kế thừa

- _ Chương 7: Kết luận và hướng phát triển

Chương 2 KHẢO SÁT ĐỜI THỰC

Tóm tắt chương: Chương 2, chúng tôi tiến hành khảo sát, trải nghiệm các ứng dụng

đi trước phổ biến trên các nền tảng Android và IOS Tìm điểm mạnh, yếu, các tínhnăng nổi trội của các ứng dụng đó Áp dụng và thiết kế giao diện, chức năng khácbiệt so với những ứng dụng đi trước.

2.1 Khảo sát giao diện và chức năng.

Các ứng dụng đặt bàn kết hợp định tuyến cho người đùng hiện nay chưa phổ biến

Nên chúng tôi sẽ tiến hành khảo sát các ứng dụng gần giống như ý tưởng mà chúngtôi muốn thực hiện Cụ thể là các ứng dụng như đặt đồ ăn, giao đồ ăn (Foody,ClingMe, GrabFood) Cả 3 ứng dụng trên đều có trên 2 nền tảng là IOS và Android

Chúng tôi tiến hành trải nghiệm thực tế và đưa ra các nhận xét về giao diện và chức

năng Từ những gì chúng tôi trải nghiệm chúng tôi sẽ tiến hành xây dựng giao diện

và các chức năng tối ưu hon

2.1.1 Ứng dụng Foody

Ứng dụng được xây dựng vào năm 2012 tại TP.HCM Ứng dụng phô biến trên cácnền tảng di động và website Với Foody mọi người có thể tìm kiếm các địa điểm ănuống: nhà hàng, quán ăn, quán nước tại Việt Nam Foody cho phép các thành viên

đặt hàng, bình luận và đánh giá các địa điểm ăn uống Phương thức thanh toán phổbiến là ví ShopeePay

Sau quá trình trải nghiệm ứng dụng, c

chức năng như sau:

Hình 2: Màn hình ứng dụng Foody

húng tôi đưa ra những nhận xét về giao diện và

Giao diện với màu sắc chủ đạo là đỏ và trắng Các nút tương tác sẽ đổi sang

màu đỏ va background sẽ đổi t

được bố trí ở cuối màn hình Tr

hành màu xám khi chọn Thanh điều hướng sẽ

ang thông tin nhà hang, quan ăn khá trực quan,

hiện đầy đủ các thông tin của quán như: Tên, địa chỉ, giá, tình trạng Người

dùng có thể xem bình luận, dan! giá Tuy phan giao diện đơn giản, dé sử dụngnhưng chữ và các nút bam thêm vào giỏ hang khá nhỏ

Chức năng: Đăng nhập/ Đăng ký, thêm vào giỏ hàng, lưu quán ăn, bình luận

và đánh giá, gợi ý các chủ đề mà người dùng hay xem, đặt hàng bằng phươngthức gọi điện trực tiếp, đặt giao đồ ăn, gợi ý theo vị trí hiện tai

2.1.2 Ứng dụng Grab Food

GrabFood là dịch vụ giao đồ ăn được vận hành bởi Grab - Nền tảng giao hàng, đặt xetheo yêu cầu hàng đầu châu A Ứng dụng được sử dụng phổ biến trên các nền tang diđộng Người dùng có thê thực hiện đặt đồ ăn trên ứng dụng và thanh toán bằng nhiềuhình thức khác nhau Bạn cũng thể xem các bình luận và đánh giá về các quán ăn một

cách dễ dàng

Tiệm Ăn Vặt HARU

- Màu chủ đạo là xanh lá kết hop với màu trắng Phan header bao gồm vi trí

hiện tại của user, danh mục yêu thích, các đơn hàng, thanh tìm kiếm Các núttương tác khá mượt Phần phông chữ có kích thước hợp lý Thông tin về quán

ăn còn hạn chế Tuy vậy phần hiền thị thực đơn khá gọn gàng và đẹp mắt

- _ Chức năng: Chức năng đăng nhập/ đăng ký (bắt buộc) Đặt món, thanh toán,

thêm yêu thích, tìm kiếm, gợi ý các quán ăn phổ biến và phù hợp với vi trí của

người dùng, các quán đang có khuyến mãi, tinh trạng đơn hàng

Machin “Dhhềm noose Hn G408 Tôm ch on gaping

(EB tan đong c mê gud tna thêm hoàn én ›

Màu chủ đạo là màu trắng và cam Thanh điều hướng được dính ở dưới cuối

màn hình Trên cùng là thanh tìm kiếm Các nút bam được tương ứng với mỗiicon và màu sắc khác nhau giúp người dùng dễ dàng thao tác Ở trang thông

tin nhà hàng, các thông tin như Tên, địa chỉ, giờ mở cửa, đều được hiển thịđầy đủ

Chức năng: Chức năng nồi bật của ClingMe là chức năng cá nhân hóa cho mỗingười dùng, tức là với mỗi người dùng khác nhau sẽ có các đề xuất khác nhau.Chức năng đặt đồ ăn và thanh toán cũng được áp dụng Người dùng có thé sănthưởng dé nhận được nhiều ưu đãi

2.1.4 Nhận xét ưu nhược điểm các ứng dụng

Sau quá trình sử dụng, trải nghiệm các ứng dụng trên chúng tôi đúc kết được một

sô ưu - nhược điêm chung.

2.2.

Native

Uu diém:

o Chức năng đặt đồ ăn tiện lợi

o Chức năng thanh toán da dạng.

o Chức năng chỉ đường

o Một số ứng dụng có chức năng đặt đơn theo nhóm

o Giao diện các ứng dụng dé sử dụng

Nhược điểm:

o Chưa có chức năng đặt bàn, đặt chỗ trên ứng dụng

o Một số ứng dụng quảng cáo khá nhiều

Các công nghệ xây dựng ứng dụng Mobile.

2.2.1 Native App Development.

App: tạo các ứng dụng riêng biệt cho các nền tảng cụ thé, chẳng hạn như IOS(sử dung Swift hoặc Objective-C) và Android (sử dụng Java hoặc Kotlin).

Ưu điểm:

Performance sẽ tốt hơn các công nghệ Hybird, Cross Platform

10

- Bảo mật dữ liệu

- Vi Performance tốt nên trải nghiệm khách hàng cũng sẽ được nâng cao

- Quá trình build sẽ nhẹ hon

Nhược điểm:

- Vì phải xây dựng trên 2 nền tảng nên sẽ tốn nhiều công sức

- C6 một số tính năng không có sẵn trên Android hoặc IOS

- Qua trình bảo trì cũng tốn nhiều thời gian

2.2.2 Cross Platform

Cross-Platform App: nha phát triển viết mã một lần và trién khai nó trên nhiều nềntảng khác nhau Vì điều đó tiết kiệm được nhiều thời gian Một số Frameworks :React Native, Flutter và Xamarin.

Ưu điểm:

- Chi sử dụng một ban code cho cả 2 nền tàng

- Chỉ phí thấp

- Hợp với các dự án đòi hỏi tính da dạng

- Cac framework đa nên tảng thường cung cấp các công cụ và thư viện cho phép

phát triển nhanh chóng

Nhược điểm:

- Hạn chế về hiệu suất

- Phụ thuộc vào Framework

- Về trải nghiệm sẽ không tốt bằng Native App

2.2.3 Hybrid App

Hyprid App là sự kết hợp giữa Native app va Web app Hybrid App được viết băng

HTML, CSS, JavaScript Không cần lập trình cho 2 hệ điều hành riêng biệt (IOS và

Android)

11

Những thách thức về trải nghiệm người dùng

Phê duyệt App Store 2.2.4 So sánh các công nghệ

Studio Native App STT Development Cross Platform Hybrid App

Riéng biệt cho 2 nên| Duy nhât | đoạn mã | Duy nhât 1 đoạn mã

1 Codebase ` `

tảng cho 2 nên tảng cho 2 nên tảng

Không phụ thuộc ` 5

l l Phụ thuộc nhiêu vào |Phụ thuộc nhiêu vào

2 Thư viện | vào các thư viện và : :

` các thư viện các thư viện

các mã nguôn mở

Phu thuộc vào các [Native + web debug|

3 Debug Native debug tool

framework tool

Xcode, Adroid React native, Tonic, Apache

4 Tools

Xamarin,Flutter Cordova

° Performance | s Sử dụng một | s Chi phí thaptốt bản code cho ca2 |» Phát triển ứng

° Bảo mật nên tàng dụng nhanh

° Trải nghiệm | s Tiết kiệm Tái sử dung

5 Ưu điểm khách hàng được chi phi ma

-° Build nhẹ Dê mo rong |« Dé bao tri

xây dựng và bảo hơn Native hơn Native

6 | Nhược điểm | trì + Phụthuộccác| « Chức năng

«Chi phi cao framework han ché

5 Phê duyệt của

App Store

Bang 1: Bảng so sánh công nghệ

2.3 Các quy trình phát triển ứng dụng

2.3.1 Mô hình thác nước (waterfall model)

Mô hình thác nước là một mô hình tuần tự Trong đó các giai đoạn sẽ được tuần tựphát triển và mỗi giai đoạn sẽ là một công việc, mục tiêu khác nhau Output của giai

đoạn này sẽ là Input của giai đoạn khác.

13

Hình 7: Mô hình thác nước

https://www.geeksforgeeks.org/software-engineering-classical-waterfall-model/

¢ Feasibility Study: Xem xét về mặt tài chính va kỹ thuật có đủ dé phát triển

ứng dụng hay không.

¢ Requirements Analysis and Specification: Thu thập yêu cầu, thông tin của

khác hàng Lưu lại các đặc tả của yêu cầu

© Design: thiết kế chỉ tiết và cấp cao cũng như kiến trúc phần mềm tổng thẻ

¢ Coding and Unit Testing: các lập trình viên bắt đầu quá trình coding và kiểm

thử các Outpout

e Integration and System testing: tích hợp các mô-đun khác nhau được thực

hiện ngay sau khi Coding and Unit Testing

¢ Maintenance: Bảo trì và nâng cấp

Ưu điểm:

- Mô hình đơn giản tuần tự khá dé hiểu

- Các giai đoạn sẽ có các nhiệm vụ và mục tiêu riêng biệt.

Nhược điểm:

14

- Khi đã qua giai đoạn khác và ở giai đoạn trước đó có lỗi thì rất khó dé quay

lại các giai đoạn trước đó.

2.3.2 Mô hình xoắn ốc (Spiral Model)

Là phiên bản nâng cấp của Mô hình thác nước Mô hình xoắn ốc sẽ kết hợp môhình lặp theo vòng Mô hình xoắn ốc hoạt động như sau: Lập kế hoạch => Phântích lỗi và rủi ro => Phát triển và triển khai ứng dụng => Lập kế hoạch cho bướctiếp theo

- Giám sát dự án hiểu quả

-_ Khắc phục các điểm yếu của các mô hình khác

2.3.3 So sánh mô hình

STT 'Waterfall model Spiral Model

1 Mức độ phức tạp Don giản |Phức tạp hơn.

2_ |Phương pháp [Tuân tự Lặp lại các bước

3 Phát hiện và khac phục |Sau khi hoàn thành các lkhác phục sớm

lỗi , rủi ro giai đoạn

4 Quy mô INhỏ Lớn

5 [Tính linh hoạt |Khó IKhông khó

6 |Rủiro Cao [Thâp

7 Chiphí [Tháp Cao

8 [Tai sử dung IKhé |Có thé

Bang 2: Bảng so sánh mô hình

16

Chương 3 CÁC CHỨC NĂNG

Tóm tắt chương: Chương 3, chúng tôi sẽ đưa ra các chức năng của ứng dụng, mô tả

sơ lược về các chức năng Sau đó sẽ tiến hành phân tích các use-case của các chứcnăng trên.

3.1 Các chức năng cơ bản trong ứng dụng

3.1.1 Đăng nhập/ Đăng ký

- Tại màn hình đăng ký, chúng tôi sử dụng các trường dữ liệu: Tên, email, số

điện thoại, mật khẩu

- Đối với mỗi trường nhập dữ liệu, chúng tôi có những giới hạn nhất định yêu

cầu người dùng cung cap đủ thông tin trước khi tiến hành tạo tài khoản

- Mỗi thông tin sẽ được sử dụng cho các mục đích: tư vấn theo độ tuổi, đặt hàng

Nhờ đó, người dùng sẽ thuận tiện hơn khi sử dụng chức năng đăng nhập/đăng

ký Ngoài ra, nếu bạn là chủ của quán ăn, nhà hàng, thông tin của người

dùng cũng sẽ giúp ích rất nhiều

3.1.2 Tìm kiếm

- Vé chức năng tìm kiếm, đây là chức năng cơ bản phải có Đối với những người

dùng đã biết các quán ăn qua các phương tiện khác, họ có thé tìm kiếm và đitrực tiếp đến quán

- Autocomplete API là một tính năng do VIETMAP cung cấp, gợi ý các vị trí

có thể có khi người dùng tiến hành tìm kiếm, giúp người dùng dễ dàng tìm vàchọn điểm đến mong muốn hơn

3.1.3 Danh sách quán ăn yêu thích

- Chúng tôi cho phép người dùng có tài khoản lưu thông tin các quán ăn mà họ

cảm thấy ưng ý Sau khi nhắn vào biểu tượng trái tim, quán ăn sẽ được thêm

vào danh sách yêu thích.

- Với những người chưa có tài khoản, họ bắt buộc phải đăng ký một tài khoản

cho riêng mình.

17

3.1.4 Filter

Đối với chức năng này chúng tôi xây dựng bộ dữ liệu gồm nhà hàng và các

danh mục mà nhà hàng đó kinh doanh Chức năng này sẽ cho phép người dùng lựachọn và tìm những danh mục yêu thích trong quán ăn mà họ muốn, sau đó chúng sẽ

trả về các kết quả tương ứng Người dùng sẽ không cần đăng nhập để thực hiện chức

năng này.

3.1.5 Đặt bàn

Đề đảm bảo sự an toàn cho cả 2 phía nhà hàng và người dùng Chúng tôi yêu cầu

người dùng phải thực hiện đăng nhập dé có thé sử dụng chức năng này Sau khi đăng

nhập người dùng cần cung cấp một số thông tin sau:

Số lượng người tham dự

Ngày

Khoảng thời gian nhận bàn.

Các món ăn muôn lựa chọn

Sau khi người dùng điền đầy đủ các thông tin sẽ tới bước xác nhận lại những thông

tin mà người dùng đã điền

3.1.6 Bình luận/ Đánh giá

Chức năng bình luận và đánh giá sẽ phải yêu cầu người dùng đăng nhập để

thực hiện Người dùng có thể xem các bình luận của các User khác

Người dùng có tài khoản sẽ được phép bình luận và đưa ra các nhận xét vềquán ăn Những bình luận dé lại sẽ giúp những người dùng khác tham khảo

3.1.7 Dẫn đường trên bản đồ

Về chức năng dẫn đường trên bản đồ Cần 2 cặp tọa độ gồm: Tọa độ của User

và Nhà hàng.

18

- Tọa độ của User: ứng dụng sẽ tự động cập nhật vị trí hiện tại cua User Vi trí

hiện tại được biểu diễn bằng cặp tọa độ Longitude và Latitude cặp tọa độ này

sẽ tự động cập nhật địa chỉ của User thông qua API của VIETMAP.

- Tọa độ của Nhà hàng: dữ liệu sẽ được lấy từ FB

-_ Cặp tọa độ đó sẽ được biểu diễn như POINT

- Sau khi có được 2 tọa độ, chúng tôi sẽ sử dụng Route Maps API được cung

cấp bởi VIETMAP, các API đó sẽ trả về dự liệu định tuyến giữa 2 điểm đó

Khi có được dữ liệu chúng tôi sẽ biểu diễn đường đi (LINESTRING) và tiến

hành mô phỏng dẫn đường.

3.1.8 Gợi ý quán ăn.

Về chức năng gợi ý, chúng tôi xây dựng chức năng gợi ý theo các Rule-based

Các Rule bao gồm:

- Thời tiết hiện tại

- Độ tuổi của User

Phổ biến

Về rule độ tuổi của User, chúng tôi sẽ yêu cau User phải đăng nhập

3.2 Phân tích các use-case cho các chức năng trên.

- Ching tôi phân tích các trường hợp sử dụng của người dùng Sau đó sẽ mô tả

về các use-case đó Các chức năng bao gồm: Đăng nhập, đăng ký, tìm kiếm,

xem danh sách yêu thích, filter, đặt bàn, bình luận, đánh giá, dẫn đường, gợi

ý Chúng tôi sẽ tiền hành phân tích các use - case cho các chức năng trên

19

<cextend>> ~A/Goi, theo tài tết

Hinh 9: So dé Use Case

20

Đăng ký thực đơn

Quản lý nhà hàng

Duyệt đơn hảng

3 Người dùng chưa đăng nhập hoặc đã đăng nhập

a 1 Người dùng có thé tao tai khoản thành công và chuyênHậu điêu kiện h

5 Kiểm tra form

6 Thông tin hợp lệ => đăng nhập.

21

Luỗng sự kiện

Đăng ký thất bại:

1 Khi đăng ký thất bị sẽ có thông báo "Đăng ký thất bại!!

Vui lòng kiểm tra " Lỗi"

phụ 2 Người dùng nhập lại thông tin chưa hợp lệ.

Người dùng không đăng ký tài khoản và thoát:

Chuyên người dùng về trang đăng nhập

Bảng 3: Use case đăng ký

3.2.2 Use-case đăng nhập

Tên Đăng nhập

Mô tả Người sử dụng Gmail và mật khâu dé đăng nhập

Tiền điều kiện

1 Thiết bị có internet

2 Đã có tài khoản

3 Người dùng chưa đăng nhập hoặc đã đăng xuất

Hậu điều kiện Người dùng đăng nhập thành công và chuyền đến trang Home

FB Authentication xác thực thông tin

“Aw > lệ Chuyén người dùng về trang Home

Người dùng bên phía nhà hàng:

1 Người dùng cần qua trang đăng nhập riêng của ứng dụng

Nhập Gmail và mật khẩu

Nhân nút đăng nhập

FB Authentication xác thực thông tin

APF YN Chuyển người dùng về trang quản lý của nhà hàng

2

Luéng sự kiện

phụ

Đăng nhập thất bại:

1. Khi đăng nhập thất bị sẽ có thông báo "Đăng nhập thất

bại!! Vui lòng kiểm tra " Lỗi"

Người dùng nhập lại thông tin chưa hợp lệ.

Người dùng thoát trang đăng nhập:

Chuyển người về trang trước đó

Người dùng đăng ký tài khoảnChuyển người dùng đến trang đăng ký

3.2.3 Use

Bảng 4: Use case đăng nhập

-case tìm kiếm

Tén Tìm kiêm

Mô tả Người dùng gõ từ khóa và thanh tìm kiêm

Tiên điêu kiện Thiét bi có internet

Hau diéu kién Tim kiêm được các món ăn, quan ăn cân tim.

Luồng sự kiện

chính

1. Người dùng click vào biéu tượng tìm kiếm ở Tab chuyên

hướng.

Ứng dụng sẽ chuyển người dùng đến trang tìm kiếm

Người dùng có thê nhập tên các món ăn, tên các nhàhàng.

Những nhà hàng có các món ăn hoặc tên nhà hàng cótrong từ khóa sẽ được hiên thị cho người dùng

Sau khi hiển thị người dùng có thé click và chọn 1 nhà

hàng.

Ứng dụng sẽ chuyền họ đến trang thông tin của nhà hang

và xem các thông tin của nhà hàng.

Bảng 5: Use case tìm kiếm

23

3.2.4 Use -case tim Filter

Tén Filter

Mô tả Lọc các danh mục món ăn cho người dùng

Tiên điêu kiện Thiết bị có internet

Hậu điêu kiện Tra về danh sách các quán ăn thuộc danh mục lựa chọn

Luéng su kién

chinh

1 Người dùng vào trang Home

2 Người dùng tim danh mục các quán ăn.

3 Người dùng lựa chon | danh mục VD: Danh mục

Người dùng sẽ thực hiện các sự kiện sau:

1 Có thê xem đường đi giữa vi trí bản thân với quán ăn.

Mô tả 2 Xem được khoảng cách, lộ trình, thời gian.

3 Mô phỏng tính năng dẫn đường trực tuyến như Google

Map.

Tiền điều kiện Thiết bị có internet

Người dùng phải cho phép thiết bị sử dụng location

Hậu điều kiện Người dùng nhận được đường di, vi trí, thời gian di chuyền, lộ

trình đi chuyền

Luéng su kién

chinh

Người dùng di chuyên từ trang thông tin nhà hang sang

1 Người dùng xem thông tin nhà hang và quyết định

2 Người dùng click vào nút di chuyển đến nhà hàng

3 Người được chuyền đến trang dẫn đường

4 Người dùng muốn xem lộ trình chuyến đi và các thông

tin khác.

5 Người dùng di chuyển đến quán ăn

Người dùng di chuyền từ trang tìm kiếm sang

24

1 Người dùng thực hiện các luồng sự kiện đã nêu ở

use-case tìm kiếm

2 Sau khi lựa chọn được quán ăn.

3 Người dùng được chuyền đến trang dẫn đường

4 Người dùng xem lộ trình chuyến dj và các thông tin

=> Trả người dùng về trang trước đó

Bảng 7: Use case dẫn đường

3.2.6 Xem danh sách quán ăn yêu thích

Tên Xem danh sách quán ăn yêu thích

Mô tả Người dùng có thể xem danh sách họ đã yêu thích

Tiền điều kiện Thiết bị có internet

Người dùng phải đăng nhập

Hậu điều kiện

Người dùng thêm các quán yêu thích vào danh sách của mình.

Họ có thể xem và loại bỏ những quán có trong danh sách yêu

thích.

Luồng sự kiện

chính

Người dùng chuyên đến trang thông tin nhà hàng

1 Người dùng xem các thông tin Và thực hiện chức năng

mở rộng là thêm quán yêu thích bằng cách click vào biểu

tượng trái tim.

2 Khi biểu tượng đổi sang màu đỏ => quan ăn đã được

thêm vào.

3 Sau khi thêm quán vào danh sách

4 Họ có thé xem danh sách những quán mà họ đã yêu

thích.

Luéng su kién Người dùng không còn yêu thích 1 quán nao đó.

Click vào biểu tượng trái tim màu đỏ để thực hiện loại bỏ quán

Mô tả Người dùng có thé đặt bàn trực tiếp ngay trên ứng dụng.

Tiền điều kiện Thiết bị có internet

Người dùng phải đăng nhập

Hậu điều kiện Người dùng có thể đặt bàn và xem các thông tin đặt bàn

Luỗng sự kiện

chính

Người dùng chuyên đến trang thông tin nhà hàng

1 Người dùng click vào nút đặt bàn

2 Ứng dụng sẽ hỏi người dùng cung cấp các thông tin như

- _ Số lượng người (1 — 22 người)

- Ngày (Sẽ có các ràng buộc về ngày chon sẽ là của hiện

và tương lại)

- Giờ tới quán (Không dé trồng)

- Các món ăn đặt trước

Người dùng có thê đặt món trước hoặc không

Sau khi xác nhận thông với ứng dụng.

ww Phía nhà hang sẽ điện thoại trực tiếp dé xác nhận và yêu

cầu thanh toán trước 50%

Luéng su kién

Người dùng cung cấp các thông tin chưa hợp lệ:

- Ung dụng sẽ thông vào và yêu cầu người dùng cung cấp

- Quay về trang trước đó

Bang 9: Use case đặt bàn

3.2.8 Use-case bình luận

Tén Binh luận

Mô ta Người dùng có thé xem và thêm bình luận

Tiên điêu kiện Thiết bị có internet

Người dùng phải đăng nhập

Hậu điều kiện Người dùng có thể xem và thêm bình luận.

Binh luận sẽ hiển thị sau khi gửi

Luéng sự kiện

chính

Người dùng chuyên đến trang thông tin nhà hàng:

1 Người ding xem các thông hang hàng bao gồm tên, món

ăn, và các bình luận đánh giá.

26

2 Click vào nút thực hiện chức năng xem bình luận.

3 Xem được bình luận của bản thân (nếu có) và của người

khác.

4 Thực hiện viết đánh giá và gửiLuéng su kién

Người dùng đã xem xong hoặc đã bình luận

- Chuyên người dùng đến trang nhà hang

Người dùng chưa đăng nhập:

pau - Nêu chưa đăng nhập sẽ thực hiện yêu câu đăng nhập dé

thực hiện chức năng.

Bảng 10: Use case bình luận

3.2.9 Use-case Đánh giá

Tên Đánh giá

Mô tả Xem được đánh giá và thực hiện đánh giá

Tiền điều kiện Thiết bị có internet

Người dùng phải đăng nhập

Hậu điều kiện Xem được đánh giá và thực hiện đánh giá

Luéng su kién

chinh

Người dùng chuyên đến trang thông tin nhà hàng:

1 Người dùng xem các thông hàng hàng bao gồm tên, món

ăn, và các bình luận đánh giá.

2 Gửi đánh giá

3 Thực hiện viết đánh giá và gửi

Luéng su kién

phu

Người dùng đã xem xong đánh giá

-_ Chuyên người dùng đến trang nhà hàng

Người dùng chưa đăng nhập:

- Nếu chưa đăng nhập sẽ thực hiện yêu cầu đăng nhập dé

thực hiện chức năng.

Bảng 11: Use case đánh giá

3.2.10.Use-case gợi ý theo thời tiết

Tên Goi ý theo thời tiết

Các quán ăn sẽ được gợi ý cho người dùng dựa vào nhiệt độ

Mô tả hiện tại VD: Nhiệt độ hiện tại là 39 °C sẽ đưa ra các quán có

nước uông.

Tiên điêu kiện Thiết bị có internet

Người dùng phải cho phép thiết bị sử dụng location

27

Hậu điều kiện Xem được các quán ăn gợi ý

Luỗng sự kiện

chính

Người dùng chọn gợi ý theo thời tiết:

1 Nhiệt độ từ trên 30°C => tráng miệng, thức uống.

2 Nhiệt độ từ trên 25 - 30°C => Các quán ăn bình thường.

3 Nhiệt độ từ dưới 25 độ => Các món 14u, mì, phở, cơm

Sau khi đưa ra các gợi ý => thực hiện đi chuyền đến trang thông

tin nhà hàng mà người dùng lựa chọn.

Luong sự kiện

phụ Người dùng chọn các use-case gợi ý khác

Bảng 12: Use case gợi ý theo thời tiệt

3.2.11.Use-case gợi ý theo độ tuổi

Tên Gợi ý theo độ tuổi

Các quán ăn sẽ được gợi ý cho người dùng dựa vào độ tuổi hiện

Mô tả tại của người dùng VD: Tuổi hiện tại là 20 sẽ đưa ra các quán

tráng miệng, thức uống, Fast food

Tiên điều kiện Thiết bị có internet

Người dùng phải đăng nhậpHậu điều kiện Xem được các quán ăn gợi ý

Luỗng sự kiện

chính

Người dùng chọn gợi ý theo tuôi:

1 Tuổi từ trên 0 — 20 tudi=> tráng miệng, thức uống, fast

food

2 Tuổi từ trên 21 - 50 tuổi => Các quán ăn bình thường

3 Tuổi độ từ 50 tuổi => Các món lầu, mì, phở, cơm

Sau khi đưa ra các gợi ý => thực hiện di chuyền đến trang thông

tin nhà hàng mà người dùng lựa chọn.

Luỗng sự kiện

phụ

Người dùng chọn các use-case gợi ý khác.

Người dùng không đăng nhập: Chuyên đến trang đăng nhập

Bảng 13: Use case gợi ý theo độ tuôi

3.2.12 Use-case gợi ý theo đánh giá.

Tên Goi ý theo đánh giá

Các quán ăn sẽ được gợi ý cho người dùng dựa vào đánh giá

Mô tả của người dùng khác VD: Tuổi hiện tại là 20 sẽ đưa ra các quán

tráng miệng, thức uống, Fast food.Quan được được người dùng

28

đánh giá 5 sao, 4 sao hoặc thập hơn Đó là dữ liệu đề đưa ra gợi

ý tối ưu nhất

Tiền điều kiện Thiết bị có internet

Hậu điều kiện Xem được các quán ăn gợi ý theo điểm đánh giá từ 1 — 5 sao

Luỗng sự kiện Người dùng chọn gợi ý theo đánh giá: Ứng dụng trả về các quán

chính có rating >= 4

L x kié

T wen Người dùng chọn các use-case gợi ý khác

ụ

Bang 14: Use case gợi ý theo đánh giá

3.2.13 Use-case duyệt đơn hàng.

Tén Duyét don hang

Mô ta - Các quan ăn sẽ được người dùng đặt don đặt hang.

- Sau khi nhận được đơn đặt hàng có thé xem thông tin

người đặt, giờ, só lượng người

- Sau khi xem phía nhà hàng có thê duyệt đơn hoặc không

Tiên điêu kiện Thiết bị có internet

Cần đăng nhập

Hậu điều kiện Duyệt hoặc không duyệt đơn hàng.

Luong sự kiện

chính

Sau sự kiện đặt hàng của user.

1 Phía bên nhà hàng sẽ nhận được đơn đặt hang của User.

2 Sau khi nhận được đơn đặt hàng phía nhà hàng có thé

xem được thông tin đặt hàng (Thông tin User, giờ, các

món ăn đặt trước, số lượng người)

3 Sau khi xác thực các thông tin phía nhà hàng có thé

duyệt đơn hàng và trạng thái đơn hang sẽ thay đổi

Luong sự kiện

phụ

Các thông tin đã được xác thực nhưng vì một sô lý do như hêt bàn, đơn đặt hàng vào ngày nghỉ, Nên đơn hàng sẽ bị hủy và

sẽ có thông báo dành cho User.

Bảng 13: Use case duyệt đơn hàng

29