Xây dựng ứng dụng bán mỹ phẩm trực tuyến và tích hợp phân tích thành phần hóa học trong mỹ phẩm

GIỚI THIỆU

Đặt vấn đề

Hiện nay, nhiều cửa hàng vẫn hoạt động chủ yếu theo phương thức thủ công, dựa vào kinh nghiệm của nhân viên Sự gia tăng về lượng hàng hóa nhập xuất khiến công tác quản lý và mua bán trở nên tốn thời gian và công sức, đồng thời độ chính xác không cao, điều này có thể gây thiệt hại cho cửa hàng.

Giải pháp

Nhóm em đã phát triển ứng dụng hỗ trợ quản lý, bán hàng và mua sắm trực tuyến, mang tên "Xây dựng ứng dụng bán mỹ phẩm trực tuyến và tích hợp phân tích thành phần hóa học trong mỹ phẩm" Ứng dụng này ra đời nhằm hiện đại hóa hệ thống quản lý và bán hàng, thay thế phương pháp quản lý thủ công, đồng thời nâng cao trải nghiệm mua sắm trực tuyến cho người dùng.

Mục tiêu

Phát triển phần mềm quản lý giúp cửa hàng theo dõi sản phẩm và tình trạng đơn hàng, đồng thời cung cấp ứng dụng mua sắm đáp ứng nhu cầu của khách hàng, đặc biệt trong lĩnh vực kinh doanh mỹ phẩm.

Xây dựng giao diện phần mềm một cách trực quan, sinh động, dễ sử dụng, thẩm mỹ

Các xử lý thành phần hoạt động một cách mượt mà để mang đến trải nghiệm thú vị và tiện ích cho người dùng

TỔNG QUAN

Tổng quan về đồ án

• Tên tiếng việt: Xây dựng ứng dụng bán mỹ phẩm trực tuyến và tích hợp phân tích thành phần hóa học trong mỹ phẩm

2.1.2 Link github quản lý source code

- Link github ứng dụng dành cho khách hàng: https://github.com/thanhnga0104/GreenBeauty.git

- Link github ứng dụng dành cho quản trị viên: https://github.com/Lamduy0807/AdminGreenBeauty.git

- Link github Backend: https://github.com/Lamduy0807/GreenBeautyBackend.git

Cơ sở lý thuyết

Đồ án được xây dựng trên những cơ sở lý thuyết sau:

Trong lĩnh vực công nghệ điện toán, thuật ngữ đa nền tảng (cross-platform hoặc multi-platform) ám chỉ đến các phần mềm và phương thức có khả năng hoạt động trên nhiều hệ thống máy tính khác nhau Phần mềm đa nền tảng được chia thành hai loại: loại đầu tiên yêu cầu thiết kế hoặc biên dịch riêng cho từng nền tảng, trong khi loại thứ hai có thể chạy trực tiếp trên bất kỳ nền tảng nào mà không cần chuẩn bị đặc biệt Ví dụ, phần mềm viết bằng ngôn ngữ thông dịch hoặc được biên dịch sang mã bytecode có thể hoạt động nhờ vào trình thông dịch hoặc các gói run-time phổ biến, đảm bảo tính di động trên mọi nền tảng.

Cross platform hay Multi Platform là nền tảng đa ứng dụng cho phép sử dụng một mã nguồn duy nhất trên nhiều nền tảng khác nhau Điều này giúp tiết kiệm thời gian và công sức trong quá trình phát triển ứng dụng.

Cross platform ngày càng trở nên phổ biến trong giới lập trình viên nhờ vào lợi thế phát triển ứng dụng trên nhiều nền tảng Khi lựa chọn framework cho phát triển ứng dụng, cần cân nhắc giữa ưu và nhược điểm của từng công cụ, bởi Cross platform sử dụng các framework đa nền tảng Hiện nay, React-Native, Xamarin và Flutter là ba framework hàng đầu cho phát triển ứng dụng di động, cho phép tạo ra ứng dụng chạy trên cả iOS và Android từ một dự án duy nhất Điều này giúp tiết kiệm thời gian và công sức trong quá trình phát triển.

Hình 2 Ba framework phát triển mobile phổ biến

Sự ra đời của các framework đã tạo nên nhiều trường phái và cộng đồng phát triển ứng dụng, đồng thời khơi dậy những cuộc tranh luận về cách đánh giá và xếp hạng các framework này.

2.2.1.2 Ưu điểm, hạn chế Cross Platform Ưu điểm

• Có thể sử dụng một bản code trên nhiều phiên bản khác nhau

• Sử dụng Cross platform sẽ giúp tiết kiệm được lượng lớn chi phí và công sức viết code

• Cross platform thích hợp với những dự án lớn, đòi hỏi tính linh hoạt và đa dạng Nhược điểm

Mặc dù tiết kiệm chi phí và mang lại tính linh hoạt cao, nhưng hiện tại chưa có khả năng khai thác thư viện từ các nền tảng lớn như Android hoặc iOS.

• Quá trình cấp phép cho công nghệ của ứng dụng Cross platform gặp nhiều khó khăn và phức tạp

API (Giao diện lập trình ứng dụng) là bộ quy tắc và cơ chế cho phép các ứng dụng hoặc thành phần tương tác với nhau Nó có khả năng trả về dữ liệu dưới các định dạng phổ biến như JSON hoặc XML.

Restful (REpresentational State Transfer) là một dạng chuyển đổi cấu trúc dữ liệu,

Kiến trúc REST là một phương pháp hiệu quả để viết API, sử dụng các phương thức HTTP đơn giản nhằm tạo ra giao tiếp giữa các máy Thay vì chỉ sử dụng một URL để xử lý thông tin người dùng, REST cho phép gửi các yêu cầu HTTP như GET, POST, DELETE đến các URL cụ thể để quản lý và xử lý dữ liệu.

RestAPI là một tiêu chuẩn thiết kế API cho ứng dụng web, giúp quản lý tài nguyên hiệu quả RESTful là kiểu thiết kế API phổ biến hiện nay, cho phép các ứng dụng web và di động giao tiếp linh hoạt với nhau.

Chức năng chính của REST là quy định cách sử dụng các phương thức HTTP như GET, POST, PUT, DELETE và cách định dạng URL cho ứng dụng web nhằm quản lý các tài nguyên RESTful không quy định logic mã nguồn của ứng dụng và không bị giới hạn bởi ngôn ngữ lập trình, cho phép bất kỳ ngôn ngữ hoặc framework nào cũng có thể được sử dụng để thiết kế một API RESTful.

REST hoạt động chủ yếu dựa vào giao thức HTTP Các hoạt động cơ bản nêu trên sẽ sử dụng những phương thức HTTP riêng

• GET (SELECT): Trả về một Resource hoặc một danh sách Resource

• POST (CREATE): Tạo mới một Resource

• PUT (UPDATE): Cập nhật thông tin cho Resource

• DELETE (DELETE): Xoá một Resource

Những phương thức hay hoạt động này thường được gọi là CRUD tương ứng với Create, Read, Update, Delete – Tạo, Đọc, Sửa, Xóa

Hình 3 Django rest framework

Django Rest framework là một công cụ mạnh mẽ và linh hoạt trong việc xây dựng Web APIs

Một vài lý do nên sử dụng django rest framework:

- API rất hữu dụng cho developers

- Quyền xác thực trong django Rest framework gồm hai package OAuth1 và OAuth2

- Serialization hỗ trợ cả ORM và non-ORM data-sources

- Tài liệu phong phú và hỗ trợ cộng đồng

- Được sử dụng và tin cậy bởi các công ty được quốc tế công nhận bao gồm Mozilla, Red Hat, Heroku và Eventbrite.

Công nghệ sử dụng

2.3.1 Ngôn ngữ lập trình Java-scripts

JavaScript là ngôn ngữ lập trình phổ biến nhất trên thế giới trong suốt 20 năm qua Nó cũng là một trong số 3 ngôn ngữ chính của lập trình web:

• HTML: Giúp bạn thêm nội dung cho trang web

• CSS: Định dạng thiết kế, bố cục, phong cách, canh lề của trang web

• JavaScript: Cải thiện cách hoạt động của trang web

JavaScript là ngôn ngữ lập trình dễ học và linh hoạt, phù hợp cho nhiều mục đích như nâng cao tính năng website, phát triển game và xây dựng ứng dụng web Đặc biệt, cộng đồng lập trình viên, nhất là trên Github, đã đóng góp hàng ngàn mẫu template và ứng dụng JavaScript, giúp người dùng dễ dàng tiếp cận và áp dụng.

Hình 4 Ngôn ngữ Javascript

2.3.1.1 Lịch sử hình thành javaScripts

JavaScript, được phát triển trong mười ngày bởi Brandan Eich tại Netscape vào tháng 9 năm 1995, ban đầu mang tên Mocha, sau đó đổi thành Mona và LiveScript trước khi trở thành JavaScript nổi tiếng Phiên bản đầu tiên của ngôn ngữ này có tính năng hạn chế và bị giới hạn độc quyền bởi Netscape, nhưng đã phát triển mạnh mẽ theo thời gian nhờ sự đóng góp của cộng đồng lập trình viên.

Vào năm 1996, JavaScript chính thức được gọi là ECMAScript Phiên bản ECMAScript 2 được phát hành vào năm 1998, tiếp theo là ECMAScript 3 vào năm 1999 Từ đó, JavaScript đã liên tục phát triển và hiện nay hoạt động trên mọi trình duyệt cũng như trên các thiết bị từ di động đến máy tính bàn.

JavaScript đã phát triển mạnh mẽ và đạt tỷ lệ 92% các website sử dụng vào năm 2016 Chỉ sau 20 năm, ngôn ngữ lập trình này đã trở thành công cụ thiết yếu trong bộ công cụ của các lập trình viên web Nếu bạn lướt web, chắc chắn bạn đã từng tương tác với JavaScript.

2.3.1.2 Ưu nhược điểm của javaScripts Ưu điểm của Javascript

JavaScript cho phép tương tác với người dùng ở phía client và đảm bảo tính tách biệt giữa các phiên làm việc của người dùng Chẳng hạn, khi hai người dùng truy cập vào hai trình duyệt khác nhau, mỗi người sẽ có các phiên xử lý JavaScript độc lập, không làm ảnh hưởng đến nhau.

• Javascript có thể hoạt động trên nhiều nền tảng khác nhau, từ Windows, macOS cho đến các hệ điều hành trên mobile

• Javascript là một ngôn ngữ dễ tiếp cận, bạn sẽ dễ dàng học nó mà không cần phải cài đặt quá nhiều phần mềm

Ngôn ngữ lập trình dễ bị lộ code, khiến nó trở thành mục tiêu dễ dàng cho các hacker Họ có thể chèn mã độc vào khung console của trình duyệt, và trình duyệt sẽ coi đó là mã hợp lệ, cho phép hacker gửi các yêu cầu đến máy chủ một cách dễ dàng.

Javascript Framework là tập hợp các thư viện phát triển dựa trên ngôn ngữ lập trình Javascript, mỗi framework phục vụ cho những mục đích khác nhau Chẳng hạn, Angular và React được thiết kế để xử lý frontend, trong khi NodeJS chuyên về backend Ngoài ra, jQuery là một thư viện mạnh mẽ trong việc xử lý DOM HTML và CSS.

Sức mạnh của Javascript là không thể chối cãi, bằng chứng là hiện nay có rất nhiều libraries và framework được viết bằng Javascript ra đời như:

• Angular: Một thư viện dùng để xây dựng ứng dụng Single Page

• NodeJS: Một thư viện được phát triển phía Server dùng để xây dựng ứng dụng realtime

• Sencha Touch: Một Framework dùng để xây dựng ứng dụng Mobile

• ExtJS: Một Framework dùng xây dựng ứng dụng quản lý (Web Applications)

• jQuery: Một thư viện rất mạnh về hiệu ứng

• ReactJS: Một thư viện viết ứng dụng web

• Và còn nhiều thư viện khác

2.3.2.1 Tổng quan về React-native Được phát triển bởi Facebook, React Native là một framework hướng đến phát triển ứng dụng di động đa nền tảng Với sự trợ giúp của React Native, lập trình viên (developer) có thể sử dụng JavaScript để tạo ra mobile apps (ứng dụng di động) hỗ trợ cho cả nền tảng Android và iOS Instagram, Facebook, Skype,… là những ứng dụng nổi bật sử dụng React Native

Hình 5 Framework React Native

React Native đã chính thức trở thành mã nguồn mở vào tháng 3 năm 2015 và từ đó đã được áp dụng rộng rãi trong nhiều ứng dụng cả trong nước và quốc tế.

2.3.2.2 Các thức hoạt động của React native

React Native hoạt động được nhờ tích hợp 2 thread là Main Thread và JS Thread cho ứng dụng mobile Trong đó:

• Main Thread: cập nhật giao diện người dùng(UI) và xử lý tương tác người dùng

• JS Thread: thực thi và xử lý code Javascript

Hai luồng Main Thread và JS Thread hoạt động độc lập nhưng tương tác thông qua một cầu nối Cầu nối này có nhiệm vụ chuyển đổi dữ liệu giữa các luồng, đảm bảo sự giao tiếp hiệu quả giữa chúng.

2.3.2.3 Ưu điểm của React native

Có thể tái sử dụng code

React Native cho phép các nhà phát triển tái sử dụng đến 80-90% mã nguồn khi xây dựng ứng dụng đa nền tảng, giúp tiết kiệm thời gian và công sức so với việc viết mã riêng cho từng nền tảng Ưu điểm này mang lại lợi ích lớn cho người dùng.

• Tiết kiệm thời gian và giảm chi phí phát triển của một ứng dụng

• Tận dụng nguồn nhân lực tốt hơn

• Duy trì ít code hơn, ít bugs hơn

• Các tính năng trong cả 2 platforms cũng tương tự nhau

Cộng đồng người dùng lớn

React Native là một trong những framework phổ biến nhất, theo khảo sát của Stack Overflow năm 2019 Với cộng đồng người dùng rộng lớn toàn cầu, bạn có thể dễ dàng tìm kiếm sự hỗ trợ khi gặp phải lỗi.

Tính ổn định và tối ưu Được phát triển bởi Facebook, React Native có hiệu năng ổn định khá cao

• Mã React Native giúp đơn giản hóa quá trình xử lý dữ liệu

• Đội ngũ phát triển ứng dụng không quá lớn

• Xây dựng ứng dụng ít native code nhất cho nhiều hệ điều hành khác nhau

• Trải nghiệm người dùng tốt hơn khi so sánh với ứng dụng Hybrid

2.3.2.4 Nhược điểm của React native

• Hiệu năng kém hơn so với Native App

Bảo mật của ứng dụng chưa đạt yêu cầu do việc sử dụng JavaScript Người dùng sẽ gặp phải những vấn đề liên quan đến đặc điểm của JavaScript, như tính dễ làm và dễ mắc lỗi, điều này dẫn đến khó khăn trong việc duy trì và phát triển ứng dụng trong tương lai.

• Tùy biến chưa thật sự tốt ở một số module

• Không thích hợp cho các app cần năng lực tính toán cao (hash, crypto, etc)

2.3.3 Phần mềm lập trình VSCode

Visual Studio Code (VS Code) là một trong những trình soạn thảo mã nguồn phổ biến nhất cho lập trình viên nhờ vào tốc độ nhanh, tính năng nhẹ nhàng và hỗ trợ đa nền tảng Với nhiều tính năng nổi bật và mã nguồn mở, VS Code ngày càng được ưa chuộng và ứng dụng rộng rãi trong cộng đồng lập trình.

Hình 6 Phần mềm lập trình VSCode

Visual Studio Code là một trình biên tập mã nguồn miễn phí, được phát triển bởi Microsoft và hỗ trợ trên các hệ điều hành Windows, Linux và macOS Đây là sự kết hợp hoàn hảo giữa IDE và Code Editor, mang đến trải nghiệm lập trình hiệu quả cho người dùng.

PHÂN TÍCH, THIẾT KẾ

Cơ sở dữ liệu

Hình 7 Sơ đồ lớp

3.1.2 Chi tiết các thuộc tính

STT Thuộc tính Kiểu dữ liệu Diễn giải

1 Id String ID của từng người dùng

2 Email String Email đăng ký tài khoản của người dùng

3 Password String Password của tài khoản người dùng

4 Is_verified Boolean Người dùng đã xác nhận email đăng ký hay chưa

5 Is_active Boolean Tài khoản người dùng có hoạt động hay không

6 Is_staff Boolean Phân quyền tài khoản người dùng

7 Create_at DateTime Thời gian tạo tài khoản

8 Update_at DateTime Thời gian update thông tin

9 Avt Image Avatar người dùng

10 Name String Tên người dùng

11 Phone String Số điện thoại người dùng

13 Orders Int Số lượng đơn hàng đã đặt

Bảng 1 Bảng chi tiết các thuộc tính của class User

1 Id String Id của sản phẩm

2 Name String Tên sản phẩm

3 Description String Mô tả sản phẩm

4 Price Float Giá sản phẩm

5 Sold Int Số lượng đã bán

6 Quantity Int Số lượng sản phẩm trong kho

7 Instruction String Hướng dẫn sử dụng sản phẩm

8 Ingredients String Thành phần sản phẩm

9 Origin String Xuất xứ sản phẩm

10 isActive Boolean Sản phẩm có đang hoạt động hay không

11 Category Int Loại sản phẩm

12 isFlashsale Boolean Sản phẩm có đang giảm giá hay không

13 Pricesale Float Giá sản phẩm khi đang được giảm giá

14 Imagepresent Image Hình ảnh đại diện sản phẩm

Bảng 2 Bảng chi tiết các thuộc tính của class Product

1 Id String Id Loại sản phẩm

2 Name String Tên loại sản phẩm

3 Producttype String Loại hình sản phẩm

4 Imagecategory Image Hình ảnh của loại sản phẩm

Bảng 3 Bảng chi tiết các thuộc tính của class ProductCategory

2 Name String Tên loại sản phẩm

Bảng 4 Chi tiết thuộc tính của class ProductType

2 img Image Hình ảnh sản phẩm

3 Product Int Id sản phẩm

Bảng 5 Bảng chi tiết các thuộc tính của class ProductImage

1 Id String Id đánh giá

2 Dayandtime DateTime Thời gian đánh giá

3 Rattingpoint Int Điểm đánh giá

4 Rattingcomment String Nội dung đánh giá

5 Img Image Hình ảnh đính kèm

7 User Int ID người dùng

Bảng 6 Bảng chi tiết các thuộc tính của class Rating

1 Id String Id yêu thích

2 Product_id Int Id sản phẩm yêu thích

3 Customer_id Int Id người dùng

Bảng 7 Bảng chi tiết các thuộc tính của class LoveList

1 Id String Id chất hóa học

3 Levelofsafe Int Chỉ số an toàn

4 Description String Mô tả công dụng của chất

5 Slug String Slug của tên chất

Bảng 8 Bảng chi tiết các thuộc tính của class Ingedient

Bảng 9 Bảng chi tiết các thuộc tính của class Provinces

Bảng 10 Bảng chi tiết các thuộc tính của class Districts

1 Id String Id quận/ xã

2 Name String Tên quận/ xã

Bảng 11 Bảng chi tiết các thuộc tính của class Wards

1 Id String Id thông tin vận chuyện

2 User Int Id người dùng

5 Ward Int Id quận/ xã

6 Address String Địa chỉ chi tiết nơi ở như số nhà/tên đường

7 Fulladdress String Địa chỉ đầy đủ bao gồm số nhà/tên đường + xã/phường + quận/huyện + tỉnh/thành

8 Defauladdress String Địa chỉ mà người dùng chọn làm mặc định

9 Phone String Số điện thoại người nhận

10 Receivename String Tên người nhận

11 Receivegender String Giới tính người nhận

Bảng 12 Bảng chi tiết các thuộc tính của class Delivery

1 Id String Id đơn hàng

2 Datecreate DateTime Ngày khởi tạo đơn hàng

3 Daterecieve DateTime Ngày nhận hàng

4 Status String Trạng thái đơn hàng

5 cancelationReason String Nguyên nhân hủy đơn

6 User Int Id người dùng

7 Delivery Int Id thông tin vận chuyển

Bảng 13 Bảng chi tiết các thuộc tính của class Order

1 Id String Id chi tiết đơn hàng

2 Order Int Id đơn hàng

4 Quantities Int Số lượng sản phẩm

5 isRating Boolean Đơn hàng đã được đánh giá chưa

Bảng 14 Bảng chi tiết các thuộc tính của class DetailOrder

1 Id String Id giỏ hàng

3 isSelections Boolean Có được chọn không

4 Quantities Int Số lượng sản phẩm được chọn

Bảng 15 Bảng chi tiết các thuộc tính của class Cart

2 Img Image Hình ảnh của banner

Bảng 16 Bảng chi tiết các thuộc tính của class Banner

Yêu cầu chức năng

Hình 8 Sơ đồ use case

STT Tên tác nhân Mô tả

1 Khách hàng Khách hàng sử dụng ứng dụng mua mỹ phẩm

2 Admin Quản trị viên của hệ thống, xử lý các nghiệp vụ của phía người bán

Bảng 176 Mô tả tác nhân

STT Tên Chức Năng Mô tả

1 Đăng ký Đăng ký tài khoản mới

2 Đăng nhập Đăng nhập vào ứng dụng

3 Đổi mật khẩu Đổi mật khẩu đăng nhập tài khoản ứng dụng

4 Quên mật khẩu Cho phép người dùng gửi yêu cầu đặt lại mật khẩu mới

5 Thiết lập tài khoản Người dùng cập nhật các thông tin như họ tên, ngày sinh, giới tính, ảnh đại diện

6 Tìm kiếm sản phẩm Chức năng cho phép khách hàng tìm kiếm sản phẩm theo tên

7 Thêm vào giỏ hàng Thêm sản phẩm muốn mua vào giỏ hàng

8 CRUD địa chỉ nhận hàng

Hỗ trợ các thao tác thêm, đọc, sửa, xóa địa chỉ giao hàng

9 Đặt hàng Người dùng chọn mua sản phẩm

10 Thêm vào mục yêu thích

Chức năng cho phép người dùng thêm sản phẩm vào mục yêu thích và có thể xem lại vào những lần truy cập sau

11 Đánh giá Chức năng cho phép khách hàng đánh giá về chất lượng và trải nghiệm về sản phẩm

12 Theo dõi đơn hàng Người dùng có thể theo dõi trạng thái của đơn hàng như chờ xác nhận, đang lấy hàng, đang giao…

13 Tra cứu thành phần Tra cứu mức độ an toàn của thành phần hóa học trong mỹ phẩm đối với da

14 Khóa tài khoản Chức năng cho phép quản trị viên khóa một tài khoản khi tỉ lệ hủy đơn cao

15 CRUD sản phẩm Hỗ trợ các thao tác thêm, đọc, sửa, xóa thông tin sản phẩm

16 Cập nhật trạng thái đơn hàng

Quản trị viên có thể cập nhật trạng thái của đơn hàng như chờ xác nhận, đang lấy hàng, đang giao…

Bảng 18 Mô tả use case

Đặc tả use case

Tên use case Đăng ký

Mô tả Use case cho phép khách hàng đăng ký tài khoản ứng dụng

Tác nhân Khách hàng Điều kiện trước Truy cập vào ứng dụng Điều kiện sau Một tài khoản mới được tạo và lưu vào DB

Email xác nhận được gửi đến khách hàng

Các yêu cầu đặc biệt Email phải đúng định dạng

Password có ít nhất 6 ký tự, gồm các chữ cái từ A-Z ,các số và có thể chứa kí tự đặc biệt Retype Password phải giống với Password vừa nhập

Bảng 19 Đặc tả UC1_Đăng ký

Hình 9 Sơ đồ hoạt động UC1_Đăng ký

Tên use case Đăng nhập

Mô tả Use case cho phép người dùng đăng nhập vào ứng dụng

Để truy cập vào màn hình "Trang chủ", người dùng cần có tài khoản ứng dụng Sau khi đăng nhập thành công, hệ thống sẽ hiển thị màn hình "Trang chủ" phù hợp với từng tác nhân, bao gồm cả Admin và khách hàng.

Ngoại lệ Nếu nhập sai tài khoản hoặc mật khẩu sẽ được yêu cầu nhập lại, hoặc người dùng có thể chọn “Quên mật khẩu”

Bảng 20 Đặc tả UC2_Đăng nhập

Hình 10 Sơ đồ hoạt động UC2_Đăng nhập

Tên use case Đổi mật khẩu

Use case mô tả quy trình đổi mật khẩu tài khoản ứng dụng, cho phép người dùng thực hiện thao tác này một cách dễ dàng Tác nhân tham gia bao gồm Admin và khách hàng, yêu cầu người dùng phải đăng nhập vào ứng dụng trước khi tiến hành Sau khi đổi mật khẩu, hệ thống sẽ cập nhật mật khẩu mới vào cơ sở dữ liệu (DB) để đảm bảo tính bảo mật và an toàn cho tài khoản.

Các yêu cầu đặc biệt Không có

Bảng 21 Đặc tả UC3_Đổi mật khẩu

Hình 11 Sơ đồ hoạt động UC3_Đổi mật khẩu

Tên use case Quên mật khẩu

Trong trường hợp người dùng quên mật khẩu, tính năng yêu cầu đặt mật khẩu mới sẽ được kích hoạt Tác nhân thực hiện bao gồm Admin và khách hàng, với điều kiện trước tiên là người dùng đã có tài khoản ứng dụng Sau khi hoàn tất quy trình, mật khẩu mới sẽ được cập nhật vào cơ sở dữ liệu (DB).

Bảng 22 Đặc tả UC4_Quên mật khẩu

Hình 12 Sơ đồ hoạt động UC4_Quên mật khẩu

UC5_Thiết lập tài khoản

Tên use case Thiết lập tài khoản

Mô tả Use case cho phép người dùng thiết lập các thông tin của tài khoản

Tác nhân Admin, Khách hàng Điều kiện trước Đã đăng nhập vào hệ thống Điều kiện sau Thông tin tài khoản được cập nhật

Bảng 23 Đặc tả UC5_Thiết lập tài khoản

Hình 13 Sơ đồ hoạt động UC5_Thiết lập tài khoản

UC6_Tìm kiếm sản phẩm

Tên use case Tìm kiếm sản phẩm

Mô tả Use case cho phép người dùng tìm kiếm sản phẩm

Tác nhân Khách hàng Điều kiện trước Người dùng bấm vào thanh tìm kiếm Điều kiện sau Hiển thị nội dung lọc được bằng nội dung tìm kiếm

Bảng 24 Đặc tả UC6_Tìm kiếm sản phẩm

Hình 14 Sơ đồ hoạt động UC6_Tìm kiếm sản phẩm

UC7_Thêm vào giỏ hàng

Tên use case Thêm vào giỏ hàng

Mô tả Use case cho phép người dùng thêm sản phẩm vào giỏ hàng

Tác nhân Khách hàng Điều kiện trước Không có Điều kiện sau Cập nhật thông tin sản phẩm mới thêm vào giỏ hàng lên DB

Bảng 25 Đặc tả UC7_Thêm vào giỏ hàng

Hình 15 Sơ đồ hoạt động UC7_Thêm vào giỏ hàng

UC8_CRUD địa chỉ nhận hàng

Tên use case CRUD địa chỉ nhận hàng

Mô tả Use case cho phép người dùng có thể thêm, xóa, sửa, xem địa chỉ nhận hàng

Tác nhân Khách hàng Điều kiện trước Đăng nhập với quyền của khách hàng Điều kiện sau Cập nhật thông tin lên DB

Bảng 26 Đặc tả UC8_CRUD địa chỉ nhận hàng

Hình 16 Sơ đồ hoạt động UC8_CRUD địa chỉ nhận hàng

Tên use case Đặt hàng

Mô tả Use case cho phép khách hàng đặt mua sản phẩm

Tác nhân Khách hàng Điều kiện trước Đã đăng nhập vào hệ thống Điều kiện sau Trả về kết quả đặt hàng, lưu dữ liệu vào DB

Bảng 27 Đặc tả UC9_Đặt hàng

Hình 17 Sơ đồ hoạt động UC9_Đặt hàng

UC10_Thêm vào mục yêu thích

Tên use case Thêm mục yêu thích

Mô tả Use case cho phép người dùng thêm sản phẩm vào mục yêu thích để có thể dễ dàng xem lại sản phẩm

Khách hàng sẽ nhấn vào một sản phẩm để truy cập màn hình "Chi tiết sản phẩm", sau đó hệ thống sẽ cập nhật dữ liệu mục yêu thích lên cơ sở dữ liệu.

Bảng 28 Đặc tả UC10_Thêm mục yêu thích

Hình 18 Sơ đồ hoạt động UC10_Thêm mục yêu thích

UC11_Đánh giá sản phẩm

Tên use case Đánh giá

Mô tả Use case cho phép người dùng đánh giá về sản phẩm

Khách hàng cần xác nhận đã mua và nhận sản phẩm trước khi dữ liệu đánh giá được cập nhật vào cơ sở dữ liệu Sau đó, thông tin đánh giá sẽ được hiển thị công khai khi người dùng truy cập vào trang chi tiết sản phẩm.

Bảng 29 Đặc tả UC11_Đánh giá

Hình 19 Sơ đồ hoạt động UC11_Đánh giá

UC12_Theo dõi đơn hàng

Tên use case Theo dõi đơn hàng

Mô tả Use case cho phép khách hàng theo dõi trạng thái đơn hàng đang ở giai đoạn nào

Khách hàng đã thực hiện việc đặt mua sản phẩm trên ứng dụng, và sau đó, dữ liệu đánh giá sẽ được cập nhật lên cơ sở dữ liệu (DB) và hiển thị công khai khi người dùng truy cập vào trang chi tiết sản phẩm.

Bảng 30 Đặc tả UC12_Theo dõi đơn hàng

Hình 20 Sơ đồ hoạt động UC12_Theo dõi đơn hàng

UC13_Tra cứu thành phần

Khách hàng đã mua sản phẩm và xác nhận đã nhận hàng sẽ là tác nhân để cập nhật dữ liệu đánh giá lên cơ sở dữ liệu Sau khi hoàn tất, thông tin đánh giá sẽ được hiển thị công khai khi người dùng truy cập vào trang chi tiết sản phẩm.

Bảng 31 Đặc tả UC13_Tra cứu thành phần

Hình 21 Sơ đồ hoạt động UC13_Tra cứu thành phần

Để cập nhật dữ liệu đánh giá lên cơ sở dữ liệu và hiển thị công khai khi khách hàng xem chi tiết sản phẩm, điều kiện tiên quyết là khách hàng đã mua sản phẩm và xác nhận đã nhận hàng.

Bảng 32 Đặc tả UC14_Khóa tài khoản

Hình 22 Sơ đồ hoạt động UC14_Khóa tài khoản

Tên use case CRUD sản phẩm

Để cập nhật dữ liệu đánh giá sản phẩm, điều kiện tiên quyết là khách hàng phải đã mua sản phẩm và xác nhận đã nhận hàng Sau khi thỏa mãn các điều kiện này, thông tin đánh giá sẽ được cập nhật lên cơ sở dữ liệu và hiển thị công khai khi người dùng truy cập vào trang xem chi tiết sản phẩm.

Bảng 33 Đặc tả UC15_CRUD sản phẩm

Hình 23 Sơ đồ hoạt động UC15_CRUD sản phẩm

UC16_Cập nhật trạng thái đơn hàng

Tên use case Cập nhật trạng thái đơn hàng

Mô tả Use case cho phép admin cập nhật các trạng thái của đơn hàng là

Chờ xác nhận, Chờ lấy hàng, Đang giao

Để thực hiện quy trình cập nhật dữ liệu, tác nhân Admin cần đảm bảo rằng trước khi đăng nhập vào hệ thống, đã có tồn tại đơn hàng Sau khi đăng nhập thành công, Admin sẽ tiến hành cập nhật dữ liệu lên cơ sở dữ liệu (DB) và tải dữ liệu để hiển thị lên giao diện người dùng.

Bảng 34 Đặc tả UC16_Cập nhật trạng thái đơn hàng

Hình 24 Sơ đồ hoạt động UC16_Cập nhật trạng thái đơn hàng

Thiết kế giao diện

Hình 25 Giao diện đăng ký

Hình 26 Giao diện đăng nhập

Hình 27 Giao diện quên mật khẩu

Hình 28 Giao diện thiết lập tài khoản

Hình 29 Giao diện trang chủ của khách hàng

Hình 30 Giao diện tìm kiếm sản phâm

Hình 31 Giao diện chi tiết sản phẩm

Hình 32 Giao diện thêm vào giỏ hàng

Hình 33 Giao diện giỏ hàng

3.4.10 CRUD địa chỉ nhận hàng

Hình 34 Giao diện CRUD địa chỉ nhận hàng

Hình 35 Giao diện xác nhận đặt hàng

Hình 36 Giao diện sản phẩm yêu thích

Hình 37 Giao diện danh mục sản phẩm

Hình 38 Giao diện đánh giá sản phẩm

Hình 39 Giao diện tra cứu thành phẩn

Hình 40 Giao diện trạng thái đơn hàng

Hình 41 Giao diện trang chủ (admin)

Hình 42 Giao diện danh sách sản phẩm

Hình 43 Giao diện CRUD sản phẩm

BẢNG PHÂN CÔNG CÔNG VIỆC

Bảng 35 Phân công công việc

Tên và MSSS Công việc thực hiện Mức độ đóng góp Đánh giá Lâm Nguyễn Bửu

• Chức năng quên mật khẩu

• Chức năng Chỉnh sửa tài khoản

• Chức năng theo dõi đơn hàng

• Chức năng tra cứu thành phần

• Chức năng đánh giá sản phẩm

• App admin (CRUD sản phẩm, banner, trạng thái đơn hàng)

• Thiết kế cơ sở dữ liệu

• Chức năng xem sản phẩm

• Chức năng Thêm vào giỏ hàng

• Chức năng Thêm vào mục yêu thích

• Chức năng tìm kiếm sản

• Chức năng lọc sản phẩm

NHẬN XÉT VÀ HƯỚNG PHÁT TRIỂN

Nhận xét

Phần mềm đã hoàn thành mục tiêu phát triển ứng dụng mua sắm trực tuyến trên nền tảng Cross Platform, mang đến nhiều chức năng hữu ích cho người dùng như gợi ý sản phẩm, phân loại sản phẩm theo mục và tìm kiếm sản phẩm Người dùng có thể tham khảo ý kiến từ những người đã mua hàng qua mục Đánh giá sản phẩm, giúp họ có cái nhìn trực quan về sản phẩm Đặc biệt, chức năng phân tích thành phần đóng vai trò quan trọng, hỗ trợ người dùng lựa chọn sản phẩm phù hợp với làn da, tránh kích ứng và dị ứng, đặc biệt cho làn da nhạy cảm.

5.1.2 Đánh giá về ứng dụng

• Giao diện đơn giản, trực quan, dễ tiếp cận, dễ sử dụng

• Ứng dụng có dung lượng nhỏ, tốn ít bộ nhớ

• Tích hợp chức năng đánh giá sản phẩm, người dùng dễ dàng chia sẻ và tiếp nhận thông tin về sản phẩm

• Thông tin sản phẩm cụ thể, súc tích và chi tiết

• Tích hợp khả năng phân tích thành phần, giảm thiểu rủi ro khi sử dụng sản phẩm

• Tích hợp công cụ cho người quản trị dữ liệu có thể thêm dữ liệu

• Ứng dụng còn trong giai đoạn hoàn thiện về mặt trải nghiệm người dùng

• Dữ liệu và hình ảnh còn hạn chế.

Hướng phát triển và mở rộng

- Tiếp tục phát triển ứng dụng theo hướng thương mại hóa

- Khảo sát người dùng để hoàn thiện chức năng hiện có và phát triển thêm chức năng mới

- Phát triển công cụ hỗ trợ người quản trị cơ sở dữ liệu

- Phát triển giao diện và nâng cao trải nghiệm người dùng

YÊU CẦU CÀI ĐẶT

Nhằm đảm bảo phần mềm có thể hoạt động một cách hiệu quả nhất, điện thoại của người dùng cần phải đạt các tối thiểu các yêu cầu sau

Bảng 36 Yêu cầu cài đặt

Hệ điều hành (Android) Tối thiểu Android 9 trở lên

RAM Tối thiểu 512MB trở lên

Dung lượng bộ nhớ (Memory) Tối thiểu 256MB trở lên

Tốc độ bộ xử lý (Processor) Tối thiểu 1.00 GHz trở lên

Tiêu đề	Xây dựng ứng dụng bán mỹ phẩm trực tuyến và tích hợp phân tích thành phần hóa học trong mỹ phẩm
Tác giả	Lâm Nguyễn Bửu Duy, Nguyễn Thanh Nga
Người hướng dẫn	Thầy Huỳnh Tuấn Anh
Trường học	Đại học Quốc gia TP. Hồ Chí Minh
Chuyên ngành	Công nghệ phần mềm
Thể loại	báo cáo đồ án
Năm xuất bản	2021
Thành phố	TP. Hồ Chí Minh