1. Trang chủ
  2. » Giáo Dục - Đào Tạo

Xây dựng Ứng dụng di Động my stylist cung cấp các giải pháp về lĩnh vực làm Đẹp

212 0 0
Tài liệu đã được kiểm tra trùng lặp

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề Xây dựng ứng dụng di động My Stylist cung cấp các giải pháp về lĩnh vực làm đẹp
Tác giả Dư Mỹ Duyên
Người hướng dẫn TS. Mai Anh Thơ
Trường học Trường Đại học Sư phạm Kỹ thuật Thành phố Hồ Chí Minh
Chuyên ngành Công nghệ thông tin
Thể loại Đồ án tốt nghiệp
Năm xuất bản 2024
Thành phố Thành phố Hồ Chí Minh
Định dạng
Số trang 212
Dung lượng 11,91 MB

Cấu trúc

  • 1. LÝ DO CHỌN ĐỀ TÀI (18)
  • 2. Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN (19)
  • 3. MỤC ĐÍCH NGHIÊN CỨU (20)
  • 4. ĐỐI TƯỢNG NGHIÊN CỨU (21)
  • 5. PHẠM VI NGHIÊN CỨU (21)
  • CHƯƠNG 1: CƠ SỞ LÝ THUYẾT (22)
    • 1.1. KIẾN TRÚC CHUNG CỦA HỆ THỐNG (22)
    • 1.2. NGÔN NGỮ JAVA (7)
    • 1.3. NGÔN NGỮ TYPESCRIPT (7)
    • 1.4. SPRING BOOT RESTFUL (7)
    • 1.5. SPRING SECURITY (7)
    • 1.6. SPRING JPA (7)
    • 1.7. POSTGRESQL (7)
    • 1.8. REACT NATIVE (7)
    • 1.9. FIREBASE CLOUD STORAGE (7)
    • 1.10. MÀU SẮC CÁ NHÂN (43)
    • 1.11. HÌNH DÁNG CƠ THỂ (7)
    • 1.12. PHONG CÁCH THỜI TRANG (7)
  • CHƯƠNG 2: MÔ HÌNH HÓA YÊU CẦU (52)
    • 2.1. XÁC ĐỊNH YÊU CẦU (7)
    • 2.2. MÔ HÌNH HÓA YÊU CẦU (7)
  • CHƯƠNG 3: THIẾT KẾ PHẦN MỀM (97)
    • 3.1. LƯỢC ĐỒ TUẦN TỰ (7)
    • 3.2. LƯỢC ĐỒ HOẠT ĐỘNG (121)
    • 3.3. LƯỢC ĐỒ LỚP (146)
    • 3.4. THIẾT KẾ CƠ SỞ DỮ LIỆU (147)
    • 3.5. THIẾT KẾ GIAO DIỆN (154)
  • CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ (197)
    • 4.1. CÀI ĐẶT (197)
    • 4.2. KIỂM THỬ (8)
    • 1. KẾT QUẢ ĐẠT ĐƯỢC (0)
      • 1.1. Về lý thuyết (0)
      • 1.2. Về ứng dụng (0)
    • 2. ƯU ĐIỂM (3)
    • 3. NHƯỢC ĐIỂM (0)
    • 4. HƯỚNG PHÁT TRIỂN (0)
  • TÀI LIỆU THAM KHẢO (0)

Nội dung

Việc phát triển một ứng dụng di động về làm đẹp có thể tận dụng sự phổ biến này để đáp ứng nhu cầu của người tiêu dùng.. Công nghệ ngày càng phát triển, cho phép việc tạo ra các ứng

Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN

Đóng góp kiến thức mới: Nghiên cứu về ứng dụng di động My Stylist trong lĩnh vực làm đẹp có thể mang lại những kiến thức mới về cách công nghệ di động có thể được áp dụng trong lĩnh vực làm đẹp Điều này có thể giúp mở rộng kiến thức về phát triển ứng dụng di động và sự kết hợp của chúng với ngành công nghiệp làm đẹp

Nghiên cứu thực nghiệm: Thông qua việc tạo ra một ứng dụng thực tế, đề tài này cung cấp cơ hội cho các thí nghiệm và nghiên cứu thực nghiệm về cách người dùng tương tác với ứng dụng và ảnh hưởng của nó đối với quy trình làm đẹp của họ

Phân tích thị trường và người dùng: Việc nghiên cứu về thị trường và người dùng trong lĩnh vực làm đẹp có thể cung cấp thông tin quý báu về thị trường tiềm năng, người tiêu dùng mục tiêu, và xu hướng tiêu dùng

Phát triển sản phẩm và dịch vụ: Đề tài này có thể dẫn đến việc phát triển một ứng dụng thực tế giúp người dùng tối ưu hóa trải nghiệm làm đẹp của họ, bao gồm việc tư

16 vấn, mua sắm sản phẩm, và nhiều tính năng khác Điều này có thể giúp nâng cao chất lượng cuộc sống của người dùng

Kinh doanh và tiềm năng lợi nhuận: Nếu ứng dụng My Stylist thành công, nó có thể tạo ra cơ hội kinh doanh và tiềm năng lợi nhuận lớn trong lĩnh vực làm đẹp và công nghệ di động

Tiện ích và tiết kiệm thời gian: Ứng dụng cung cấp tiện ích cho người dùng bằng cách giúp họ tiết kiệm thời gian và nỗ lực trong việc quản lý và nâng cao ngoại hình của họ

Tạo việc làm: Phát triển và quản lý một ứng dụng di động cần nguồn nhân lực, từ lập trình viên đến những người chăm sóc khách hàng Điều này có thể tạo ra cơ hội việc làm và phát triển nguồn nhân lực trong ngành công nghiệp công nghệ và làm đẹp.

MỤC ĐÍCH NGHIÊN CỨU

Phục vụ cho đồ án tốt nghiệp Công nghệ phần mềm Việc phân tích, thiết kế, và phát triển ứng dụng My Stylist là một phần quan trọng của công việc phát triển phần mềm Nghiên cứu này có thể giúp cải thiện kỹ thuật phát triển phần mềm, đặc biệt là trong ngữ cảnh của ứng dụng di động

Tối ưu hóa hiệu suất và tương tác người dùng: Công nghệ phần mềm đóng vai trò quan trọng trong việc tối ưu hóa hiệu suất của ứng dụng và cải thiện tương tác của người dùng Nghiên cứu này có thể liên quan đến việc tối ưu hóa mã nguồn, tối ưu hóa cơ sở dữ liệu, và thiết kế giao diện người dùng hiệu quả

Phân tích dữ liệu và thông tin: Trong quá trình nghiên cứu, có thể có sự sử dụng và phân tích dữ liệu liên quan đến tương tác người dùng và hành vi sử dụng ứng dụng Điều này có thể yêu cầu các kỹ thuật và công cụ phân tích dữ liệu, mà là một phần quan trọng của chuyên ngành công nghệ phần mềm

Quản lý dự án phát triển phần mềm: Phát triển ứng dụng My Stylist là một dự án phát triển phần mềm, và nghiên cứu này có thể liên quan đến quản lý dự án phần mềm, bao gồm việc lập kế hoạch, theo dõi tiến độ, và quản lý tài nguyên

Tích hợp công nghệ mới: Công nghệ phần mềm liên tục tiến hóa Nghiên cứu này có thể tìm cách tích hợp các công nghệ mới như trí tuệ nhân tạo, thực tế ảo, hoặc các giao thức giao tiếp mới vào ứng dụng My Stylist Đảm bảo chất lượng phần mềm: Mục đích có thể liên quan đến đảm bảo chất lượng phần mềm thông qua kiểm thử, kiểm định, và sửa lỗi.

CƠ SỞ LÝ THUYẾT

FIREBASE CLOUD STORAGE

2 CHƯƠNG 2: MÔ HÌNH HÓA YÊU CẦU

2.2 Mô hình hóa yêu cầu

3 CHƯƠNG 3: THIẾT KẾ PHẦN MỀM

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

4 CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ

STT Thời gian Công việc Ghi chú

- Thiết kế usecase và mô hình hóa yêu cầu

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

- Tìm hiểu về Spring Security và cơ chế xác thực bằng Json Web Token

3 31/03/2024 – 08/04/2024 - Tìm hiểu về React Native

- Thiết kế giao diện trên Figma

4 08/04/2024 – 15/05/2024 - Xây dựng các API dựa trên đặc tả yêu cầu

- Hiện thực các giao diện trên Figma bằng React Native

- Kết nối backend, mobile, cơ sở dữ liệu

5 08/04/2024 – 15/05/2024 - Kiểm thử chương trình, sửa lỗi

6 08/04/2024 – 19/05/2024 - Viết và hoàn thiện báo cáo

Người viết đề cương Ý kiến của giáo viên hướng dẫn

(ký và ghi rõ họ tên)

LỜI CẢM ƠN 1 ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP 2

1 LÝ DO CHỌN ĐỀ TÀI 14

2 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN 15

CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 18

1.1 KIẾN TRÚC CHUNG CỦA HỆ THỐNG 18

CHƯƠNG 2: MÔ HÌNH HÓA YÊU CẦU 48

2.2 MÔ HÌNH HÓA YÊU CẦU 52

CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 93

3.4 THIẾT KẾ CƠ SỞ DỮ LIỆU 143

CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 193

Hình 1: Kiến trúc chung của hệ thống 18

Hình 2: Luồng xử lý Token Based Authentication 19

Hình 3: Luồng xử lý yêu cầu Refresh Token khi Access Token hết hạn 20

Hình 4: Hình logo Spring Boot 25

Hình 5: Cấu trúc Json Web Token 29

Hình 7: Hình logo React Native 34

Hình 8: Hình kiến trúc của Zustand 36

Hình 10: Hình mô tả 4 nhóm màu 39

Hình 11: Lược đồ usecase về phía người dùng 52

Hình 12: Lược đồ usecase chức năng khám phá đặc điểm cá nhân 53

Hình 13: Lược đồ usecase chức năng tra cứu phân loại 54

Hình 14: Quản lý bài đăng 54

Hình 15: Lược đồ usecase chức năng quản lý tủ đồ 55

Hình 16: Lược đồ usecase về phía quản trị viên 55

Hình 17: Sequence Diagram “Đăng nhập” 93

Hình 18: Sequence Diagram “Đăng ký” 94

Hình 19: Sequence Diagram “Quên mật khẩu” 95

Hình 20: Sequence Diagram “Nhận dạng màu sắc cá nhân” 95

Hình 21: Sequence Diagram “Xem chi tiết về màu sắc cá nhân” 96

Hình 22: Sequence Diagram “Nhận dạng phong cách” 96

Hình 23: Sequence Diagram “Xem chi tiết về phong cách” 97

Hình 24: Sequence Diagram “Nhận dạng hình dáng cơ thể” 98

Hình 25: Sequence Diagram “Tìm kiếm phân loại” 99

Hình 26: Sequence Diagram “Xem các món đồ thuộc phân loại” 100

Hình 27: Sequence Diagram “Tìm kiếm món đồ” 101

Hình 28: Sequence Diagram “Lọc món đồ dựa trên đặc điểm” 101

Hình 29: Sequence Diagram “Xem chi tiết về món đồ” 102

Hình 30: Sequence Diagram “Xem danh sách các món đồ có trong tủ đồ” 103

Hình 31: Sequence Diagram “Tải món đồ” 104

Hình 32: Sequence Diagram “Xóa món đồ” 105

Hình 33: Sequence Diagram “Xem danh sách các trang phục” 105

Hình 34: Sequence Diagram “Xóa trang phục” 106

Hình 35: Sequence Diagram “Tạo trang phục” 107

Hình 36: Sequence Diagram “Xem gợi ý trang phục” 108

Hình 37: Sequence Diagram “Thay đổi thông tin cá nhân” 109

Hình 38: Sequence Diagram “Xem bài đăng trong cộng đồng” 110

Hình 39: Sequence Diagram “Tạo bài đăng cá nhân” 111

Hình 40: Sequence Diagram “Xem bài đăng cá nhân” 112

Hình 41: Sequence Diagram “Xóa bài đăng cá nhân” 113

Hình 42: Sequence Diagram “Chỉnh sửa bài đăng cá nhân” 114

Hình 43: Sequence Diagram “Xem biểu đồ thống kê về các món đồ” 114

Hình 44: Sequence Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 115

Hình 45: Sequence Diagram “Phê duyệt bài đăng” 116

Hình 46: Activity Diagram “Đăng nhập” 117

Hình 47: Activity Diagram “Đăng ký” 118

Hình 48: Activity Diagram “Quên mật khẩu” 119

Hình 49: Activity Diagram “Nhận dạng màu sắc cá nhân” 120

Hình 50: Activity Diagram “Xem chi tiết về màu sắc cá nhân” 121

Hình 51: Activity Diagram “Nhận dạng phong cách” 122

Hình 52: Activity Diagram “Xem chi tiết về phong cách” 123

Hình 53: Activity Diagram “Nhận dạng hình dáng cơ thể” 124

Hình 54: Activity Diagram “Xem chi tiết về hình dáng cơ thể” 125

Hình 55: Activity Diagram “Tìm kiếm phân loại” 126

Hình 56: Activity Diagram “Xem các món đồ thuộc phân loại” 127

Hình 57: Activity Diagram “Tìm kiếm món đồ” 128

Hình 58: Activity Diagram “Lọc món đồ dựa trên đặc điểm” 129

Hình 59: Activity Diagram “Xem chi tiết về món đồ” 130

Hình 60: Activity Diagram “Xem danh sách các món đồ có trong tủ đồ” 131

Hình 61: Activity Diagram “Tải món đồ” 132

Hình 62: Activity Diagram “Xóa món đồ” 133

Hình 63: Activity Diagram “Xem danh sách các trang phục” 133

Hình 64: Activity Diagram “Tạo trang phục” 134

Hình 65: Activity Diagram “Xóa trang phục” 135

Hình 66: Activity Diagram “Xem gợi ý trang phục” 135

Hình 67: Activity Diagram “Thay đổi thông tin cá nhân” 136

Hình 68: Activity Diagram “Xem bài đăng trong cộng đồng” 137

Hình 69: Activity Diagram “Tạo bài đăng cá nhân” 138

Hình 70: Activity Diagram “Xem bài đăng cá nhân” 139

Hình 71: Activity Diagram “Xóa bài đăng cá nhân” 139

Hình 72: Activity Diagram “Chỉnh sửa bài đăng cá nhân” 140

Hình 73: Activity Diagram “Xem biểu đồ thống kê về món đồ” 141

Hình 74: Activity Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 141

Hình 75: Activity Diagram “Phê duyệt bài đăng” 142

Hình 77: Giao điện đăng ký 150

Hình 78: Giao diện đăng nhập 151

Hình 79: Giao diện quên mật khẩu 152

Hình 80: Giao diện đổi mật khẩu 153

Hình 81: Giao diện trang chủ 154

Hình 82: Giao diện về chi tiết màu sắc cá nhân 155

Hình 83: Giao diện xem bảng màu 156

Hình 84: Giao diện nhận dạng màu sắc cá nhân 157

Hình 85: Giao diện kết quả màu sắc cá nhân 158

Hình 86: Giao diện chi tiết phong cách cá nhân 159

Hình 87: Giao diện nhận dạng phong cách cá nhân 160

Hình 88: Giao diện chi tiết về hình dáng cơ thể 161

Hình 89: Giao diện nhận dạng hình dáng cơ thể 162

Hình 90: Giao diện kết quả hình dáng cơ thể 163

Hình 91: Giao diện phân loại 164

Hình 92: Giao diện tìm kiếm phân loại (có kết quả) 165

Hình 93: Giao diện tìm kiếm phân loại (không có kết quả) 166

Hình 94: Danh sách các món đồ thuộc phân loại 167

Hình 95: Chi tiết món đồ 168

Hình 96: Giao diện tìm kiếm món đồ (có kết quả) 169

Hình 97: Giao diện tìm kiếm món đồ (không có kết quả) 170

Hình 98: Giao diện lọc các món đồ dựa trên đặc điểm 171

Hình 99: Giao diện tủ đồ (danh sách món đồ) 172

Hình 100: Giao diện tủ đồ (danh sách trang phục) 173

Hình 101: Giao diện chi tiết trang phục 174

Hình 102: Giao diện xoá món đồ 175

Hình 103: Giao diện xoá trang phục 176

Hình 104: Giao diện tải món đồ (chọn hình ảnh) 177

Hình 105: Giao diện tải món đồ (chọn phân loại) 178

Hình 106: Giao diện tải món đồ (nhập tên món đồ) 179

Hình 107: Giao diện tạo trang phục 180

Hình 108: Giao diện xem gợi ý trang phục 181

Hình 109: Giao diện xem gợi ý trang phục (dựa trên tủ đồ) 182

Hình 110: Giao diện xem gợi ý trang phục (dựa trên hệ thống) 183

Hình 111: Giao diện xem thông tin cá nhân 184

Hình 112: Giao diện thay đổi thông tin cá nhân 185

Hình 113: Giao diện xem bài đăng trong cộng đồng 186

Hình 114: Giao diện tạo bài đăng cá nhân 187

Hình 115: Giao diện xem bài đăng cá nhân 188

Hình 116: Giao diện xóa bài đăng cá nhân 189

Hình 117: Giao diện chỉnh sửa bài đăng cá nhân 190

Hình 118: Giao diện xem biểu đồ thống kê 191

Hình 119: Giao diện phê duyệt bài đăng 192

Bảng 1: Danh sách câu hỏi xác định tông da 41

Bảng 2: Danh sách câu hỏi xác định độ tương phản sắc tố 41

Bảng 3: Bảng kết quả màu sắc cá nhân 42

Bảng 4: Công thức xác định hình dáng cơ thể 44

Bảng 5: Danh sách câu hỏi xác định phong cách thời trang 47

Bảng 6: Yêu cầu chức năng 49

Bảng 7: Mô tả Usecase “Đăng nhập” 57

Bảng 8: Mô tả Usecase “Đăng ký” 58

Bảng 9: Mô tả Usecase “Quên mật khẩu” 60

Bảng 10: Mô tả Usecase “Nhận dạng màu sắc cá nhân” 60

Bảng 11: Mô tả Usecase “Xem chi tiết về màu sắc cá nhân” 62

Bảng 12: Mô tả Usecase “Nhận dạng phong cách thời trang” 63

Bảng 13: Mô tả Usecase “Xem chi tiết về phong cách” 64

Bảng 14: Mô tả Usecase “Nhận dạng hình dáng cơ thể” 65

Bảng 15: Mô tả Usecase “Xem chi tiết về hình dáng cơ thể” 66

Bảng 16: Mô tả Usecase “Tìm kiếm phân loại” 68

Bảng 17: Mô tả Usecase “Xem các món đồ thuộc phân loại” 69

Bảng 18: Mô tả Usecase “Tìm kiếm món đồ” 70

Bảng 19: Mô tả Usecase “Lọc các món đồ dựa trên đặc điểm” 72

Bảng 20: Mô tả Usecase “Xem chi tiết về món đồ” 74

Bảng 21: Mô tả Usecase “Xem danh sách các món đồ có trong tủ đồ” 74

Bảng 22: Mô tả Usecase “Tải món đồ” 76

Bảng 23: Mô tả Usecase “Xóa món đồ” 77

Bảng 24: Mô tả Usecase “Xem danh sách các trang phục” 78

Bảng 25: Mô tả Usecase “Tạo trang phục” 79

Bảng 26: Mô tả Usecase “Xóa trang phục” 80

Bảng 27: Mô tả Usecase “Xem gợi ý trang phục” 81

Bảng 28: Mô tả Usecase “Thay đổi thông tin cá nhân” 82

Bảng 29: Mô tả Usecase “Xem bài đăng trong cộng đồng" 83

Bảng 30: Mô tả Usecase “Tạo bài đăng cá nhân" 85

Bảng 31: Mô tả Usecase “Xem bài đăng cá nhân" 86

Bảng 32: Mô tả Use Case “Xoá bài đăng cá nhân" 87

Bảng 33: Mô tả Usecase “Chỉnh sửa bài đăng cá nhân" 88

Bảng 34: Mô tả Usecase “Đăng nhập” 89

Bảng 35: Mô tả Usecase “Xem biểu đồ thống kê về các món đồ” 90

Bảng 36: Mô tả Usecase “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 91

Bảng 37: Mô tả Usecase “Phê duyệt bài đăng" 92

Bảng 38: Chi tiết bảng dữ liệu User 144

Bảng 39: Chi tiết bảng dữ liệu Token 145

Bảng 40: Chi tiết bảng dữ liệu Style Type 145

Bảng 41: Chi tiết Chi tiết bảng dữ liệu Seasonal Color 145

Bảng 42: Chi tiết bảng dữ liệu Body Shape 146

Bảng 43: Chi tiết bảng dữ liệu Undertone question 146

Bảng 44: Chi tiết bảng dữ liệu Contrast question 146

Bảng 45: Chi tiết bảng dữ liệu Style question 147

Bảng 46: Chi tiết bảng dữ liệu Item 147

Bảng 47: Chi tiết bảng dữ liệu User Item 148

Bảng 48: Chi tiết bảng dữ liệu Item Category 148

Bảng 49: Chi tiết bảng dữ liệu User Outfit 148

Bảng 50: Chi tiết bảng dữ liệu Outfit User Item 149

Bảng 51: Chi tiết bảng dữ liệu Reason 149

Bảng 52: Chi tiết bảng dữ liệu Post 149

Bảng 53: Mô tả giao điện đăng ký 150

Bảng 54: Mô tả giao diện đăng nhập 151

Bảng 55: Mô tả giao diện quên mật khẩu 152

Bảng 56: Mô tả giao diện đổi mật khẩu 153

Bảng 57: Mô tả giao diện trang chủ 154

Bảng 58: Mô tả giao diện chi tiết về màu sắc cá nhân 155

Bảng 59: Mô tả giao diện xem bảng màu 156

Bảng 60: Mô tả giao diện nhận dạng màu sắc cá nhân 157

Bảng 61: Mô tả giao diện kết quả màu sắc cá nhân 158

Bảng 62: Mô tả giao diện chi tiết phong cách cá nhân 159

Bảng 63: Mô tả giao diện nhận dạng phong cách cá nhân 160

Bảng 64: Mô tả giao diện chi tiết về hình dáng cơ thể 161

Bảng 65: Mô tả giao diện nhận dạng hình dáng cơ thể 162

Bảng 66: Mô tả giao diện kết quả hình dáng cơ thể 163

Bảng 67: Mô tả giao diện kết quả hình dáng cơ thể 164

Bảng 68: Mô tả giao diện tìm kiếm phân loại (có kết quả) 165

Bảng 69: Mô tả giao diện tìm kiếm phân loại (không kết quả) 166

Bảng 70: Mô tả giao diện danh sách các món đồ thuộc phân loại 167

Bảng 71: Mô tả giao diện chi tiết món đồ 168

Bảng 72: Mô tả giao diện tìm kiếm món đồ (có kết quả) 169

Bảng 73: Mô tả giao diện tìm kiếm món đồ (không kết quả) 170

Bảng 74: Mô tả giao diện lọc các món đồ dựa trên đặc điểm 171

Bảng 75: Mô tả giao diện tủ đồ (danh sách món đồ) 172

Bảng 76: Mô tả giao diện tủ đồ (danh sách món đồ) 173

Bảng 77: Mô tả giao diện chi tiết trang phục 174

Bảng 78: Mô tả giao diện xoá món đồ 175

Bảng 79: Mô tả giao diện xoá trang phục 176

Bảng 80: Mô tả giao diện tải món đồ (chọn hình ảnh) 177

Bảng 81: Mô tả giao diện tải món đồ (chọn phân loại) 178

Bảng 82: Mô tả giao diện tải món đồ (nhập tên món đồ) 179

Bảng 83: Mô tả giao diện tạo trang phục 180

Bảng 84: Mô tả giao diện xem gợi ý trang phục 181

Bảng 85: Mô tả giao diện xem gợi ý trang phục (dựa trên tủ đồ) 182

Bảng 86: Mô tả giao diện xem gợi ý trang phục (dựa trên hệ thống) 183

Bảng 87: Mô tả giao diện xem thông tin cá nhân 184

Bảng 88: Mô tả giao diện xem bài đăng trong cộng đồng 186

Bảng 89: Mô tả giao diện tạo bài đăng cá nhân 187

Bảng 90: Mô tả giao diện xem bài đăng cá nhân 188

Bảng 91: Mô tả giao diện xóa bài đăng cá nhân 189

Bảng 92: Mô tả giao diện chỉnh sửa bài đăng cá nhân 190

Bảng 93: Mô tả giao diện xem biểu đồ thống kê 191

Bảng 94: Mô tả giao diện phê duyệt bài đăng 192

Bảng 95: Lịch trình công việc 195

Bảng 97: Yêu cầu hệ điều hành 195

Bảng 98: Yêu cầu phần mềm 195

Bảng 99: Yêu cầu công cụ kiểm thử 196

1 LÝ DO CHỌN ĐỀ TÀI

Trong nhiều năm gần đây, lĩnh vực làm đẹp luôn luôn là một trong những ngành phát triển nhanh chóng và lợi nhuận cao Sự quan tâm của con người đối với việc chăm sóc bản thân và nâng cao ngoại hình ngày càng gia tăng Điều này tạo ra cơ hội lớn cho các ứng dụng di động cung cấp giải pháp trong lĩnh vực này Ứng dụng di động đã trở thành một phần không thể thiếu trong cuộc sống hàng ngày của chúng ta Việc sử dụng điện thoại thông minh để tìm kiếm thông tin, sản phẩm và dịch vụ là một phần tự nhiên của cuộc sống hiện đại Việc phát triển một ứng dụng di động về làm đẹp có thể tận dụng sự phổ biến này để đáp ứng nhu cầu của người tiêu dùng Ứng dụng di động có thể cung cấp một loạt các giải pháp về làm đẹp, bao gồm tư vấn về phong cách, mua sắm sản phẩm làm đẹp, hướng dẫn trang điểm, và nhiều tính năng khác Sự linh hoạt và tính tiện lợi của các ứng dụng di động có thể thu hút một lượng lớn người dùng và tiềm năng khách hàng Công nghệ ngày càng phát triển, cho phép việc tạo ra các ứng dụng di động có khả năng tùy chỉnh, tích hợp trí tuệ nhân tạo, thực tế ảo, và nhiều công nghệ khác để cung cấp trải nghiệm làm đẹp tốt hơn cho người dùng Sự kết hợp giữa công nghệ và làm đẹp có thể tạo ra những sản phẩm độc đáo và hấp dẫn

Thị trường làm đẹp luôn đòi hỏi sự đổi mới và cải tiến liên tục Với sự gia tăng của cơ hội kinh doanh trong lĩnh vực này, việc nghiên cứu và phát triển một ứng dụng di động My Stylist có thể đáp ứng nhu cầu của thị trường và cung cấp giải pháp hiệu quả Ứng dụng di động My Stylist hướng tới người dùng có nhu cầu chăm sóc và nâng cao vẻ đẹp cá nhân, đặc biệt là trong lĩnh vực thời trang, kiểu tóc, và trang điểm Với cuộc sống ngày càng bận rộn và áp lực, việc tìm kiếm, lựa chọn, và thử nghiệm những phong cách mới thường trở thành một thách thức đáng kể Nhiều người đã phải đối mặt với việc tốn thời gian và tiền bạc để tìm ra những trang phục, kiểu tóc, và trang điểm phù hợp với họ Ứng dụng My Stylist ra đời với mục tiêu quan trọng: giải quyết vấn đề này một cách đơn giản và hiệu quả Thay vì gian nan tìm hiểu về các xu hướng thời trang, phong cách, và phương pháp làm đẹp, người dùng có thể giải quyết vấn đề đó với một người

15 bạn đồng hành ảo – My Stylist Ứng dụng này sẽ phân tích các đặc điểm của cá nhân người dùng, bao gồm màu sắc cá nhân, hình dáng cơ thể, và phong cách riêng, từ đó đưa ra các gợi ý, giải pháp, và lựa chọn phù hợp nhất với họ Điều đặc biệt là My Stylist không phải là một công cụ quyết định cứng nhắc Thay vào đó, nó đóng vai trò của một người bạn đồng hành thông minh, hiểu rõ đặc điểm của người dùng Ứng dụng sẽ thúc đẩy sự sáng tạo và tự do trong việc tự thể hiện, không hề ràng buộc theo quy tắc cố định

Bên cạnh đó, ứng dụng My Stylist cũng giúp người dùng quản lý tủ đồ cá nhân một cách tiện lợi Bằng cách theo dõi các món đồ và sản phẩm làm đẹp mà họ đã sở hữu, người dùng có thể dễ dàng tạo ra những bộ trang phục và phong cách hoàn hảo mà họ có sẵn, từ đó tối ưu hóa giá trị của tủ đồ cá nhân

Trên hết, mục tiêu của ứng dụng My Stylist không chỉ đơn thuần là cung cấp các gợi ý và lựa chọn cho người dùng, mà còn là hỗ trợ họ hiểu rõ hơn về bản thân Điều này giúp người dùng thấy tự tin hơn trong việc thể hiện phong cách và sự cá nhân hóa của họ My Stylist không phải là một cỗ máy lạnh không tâm, mà là một người bạn thân thiết, đồng hành trên hành trình chăm sóc và tôn vinh vẻ đẹp cá nhân

2 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN Đóng góp kiến thức mới: Nghiên cứu về ứng dụng di động My Stylist trong lĩnh vực làm đẹp có thể mang lại những kiến thức mới về cách công nghệ di động có thể được áp dụng trong lĩnh vực làm đẹp Điều này có thể giúp mở rộng kiến thức về phát triển ứng dụng di động và sự kết hợp của chúng với ngành công nghiệp làm đẹp

Nghiên cứu thực nghiệm: Thông qua việc tạo ra một ứng dụng thực tế, đề tài này cung cấp cơ hội cho các thí nghiệm và nghiên cứu thực nghiệm về cách người dùng tương tác với ứng dụng và ảnh hưởng của nó đối với quy trình làm đẹp của họ

Phân tích thị trường và người dùng: Việc nghiên cứu về thị trường và người dùng trong lĩnh vực làm đẹp có thể cung cấp thông tin quý báu về thị trường tiềm năng, người tiêu dùng mục tiêu, và xu hướng tiêu dùng

Phát triển sản phẩm và dịch vụ: Đề tài này có thể dẫn đến việc phát triển một ứng dụng thực tế giúp người dùng tối ưu hóa trải nghiệm làm đẹp của họ, bao gồm việc tư

16 vấn, mua sắm sản phẩm, và nhiều tính năng khác Điều này có thể giúp nâng cao chất lượng cuộc sống của người dùng

Kinh doanh và tiềm năng lợi nhuận: Nếu ứng dụng My Stylist thành công, nó có thể tạo ra cơ hội kinh doanh và tiềm năng lợi nhuận lớn trong lĩnh vực làm đẹp và công nghệ di động

Tiện ích và tiết kiệm thời gian: Ứng dụng cung cấp tiện ích cho người dùng bằng cách giúp họ tiết kiệm thời gian và nỗ lực trong việc quản lý và nâng cao ngoại hình của họ

Tạo việc làm: Phát triển và quản lý một ứng dụng di động cần nguồn nhân lực, từ lập trình viên đến những người chăm sóc khách hàng Điều này có thể tạo ra cơ hội việc làm và phát triển nguồn nhân lực trong ngành công nghiệp công nghệ và làm đẹp

Phục vụ cho đồ án tốt nghiệp Công nghệ phần mềm Việc phân tích, thiết kế, và phát triển ứng dụng My Stylist là một phần quan trọng của công việc phát triển phần mềm Nghiên cứu này có thể giúp cải thiện kỹ thuật phát triển phần mềm, đặc biệt là trong ngữ cảnh của ứng dụng di động

Tối ưu hóa hiệu suất và tương tác người dùng: Công nghệ phần mềm đóng vai trò quan trọng trong việc tối ưu hóa hiệu suất của ứng dụng và cải thiện tương tác của người dùng Nghiên cứu này có thể liên quan đến việc tối ưu hóa mã nguồn, tối ưu hóa cơ sở dữ liệu, và thiết kế giao diện người dùng hiệu quả

Phân tích dữ liệu và thông tin: Trong quá trình nghiên cứu, có thể có sự sử dụng và phân tích dữ liệu liên quan đến tương tác người dùng và hành vi sử dụng ứng dụng Điều này có thể yêu cầu các kỹ thuật và công cụ phân tích dữ liệu, mà là một phần quan trọng của chuyên ngành công nghệ phần mềm

PHONG CÁCH THỜI TRANG

2 CHƯƠNG 2: MÔ HÌNH HÓA YÊU CẦU

2.2 Mô hình hóa yêu cầu

3 CHƯƠNG 3: THIẾT KẾ PHẦN MỀM

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

4 CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ

STT Thời gian Công việc Ghi chú

- Thiết kế usecase và mô hình hóa yêu cầu

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

- Tìm hiểu về Spring Security và cơ chế xác thực bằng Json Web Token

3 31/03/2024 – 08/04/2024 - Tìm hiểu về React Native

- Thiết kế giao diện trên Figma

4 08/04/2024 – 15/05/2024 - Xây dựng các API dựa trên đặc tả yêu cầu

- Hiện thực các giao diện trên Figma bằng React Native

- Kết nối backend, mobile, cơ sở dữ liệu

5 08/04/2024 – 15/05/2024 - Kiểm thử chương trình, sửa lỗi

6 08/04/2024 – 19/05/2024 - Viết và hoàn thiện báo cáo

Người viết đề cương Ý kiến của giáo viên hướng dẫn

(ký và ghi rõ họ tên)

LỜI CẢM ƠN 1 ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP 2

1 LÝ DO CHỌN ĐỀ TÀI 14

2 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN 15

CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 18

1.1 KIẾN TRÚC CHUNG CỦA HỆ THỐNG 18

CHƯƠNG 2: MÔ HÌNH HÓA YÊU CẦU 48

2.2 MÔ HÌNH HÓA YÊU CẦU 52

CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 93

3.4 THIẾT KẾ CƠ SỞ DỮ LIỆU 143

CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 193

Hình 1: Kiến trúc chung của hệ thống 18

Hình 2: Luồng xử lý Token Based Authentication 19

Hình 3: Luồng xử lý yêu cầu Refresh Token khi Access Token hết hạn 20

Hình 4: Hình logo Spring Boot 25

Hình 5: Cấu trúc Json Web Token 29

Hình 7: Hình logo React Native 34

Hình 8: Hình kiến trúc của Zustand 36

Hình 10: Hình mô tả 4 nhóm màu 39

Hình 11: Lược đồ usecase về phía người dùng 52

Hình 12: Lược đồ usecase chức năng khám phá đặc điểm cá nhân 53

Hình 13: Lược đồ usecase chức năng tra cứu phân loại 54

Hình 14: Quản lý bài đăng 54

Hình 15: Lược đồ usecase chức năng quản lý tủ đồ 55

Hình 16: Lược đồ usecase về phía quản trị viên 55

Hình 17: Sequence Diagram “Đăng nhập” 93

Hình 18: Sequence Diagram “Đăng ký” 94

Hình 19: Sequence Diagram “Quên mật khẩu” 95

Hình 20: Sequence Diagram “Nhận dạng màu sắc cá nhân” 95

Hình 21: Sequence Diagram “Xem chi tiết về màu sắc cá nhân” 96

Hình 22: Sequence Diagram “Nhận dạng phong cách” 96

Hình 23: Sequence Diagram “Xem chi tiết về phong cách” 97

Hình 24: Sequence Diagram “Nhận dạng hình dáng cơ thể” 98

Hình 25: Sequence Diagram “Tìm kiếm phân loại” 99

Hình 26: Sequence Diagram “Xem các món đồ thuộc phân loại” 100

Hình 27: Sequence Diagram “Tìm kiếm món đồ” 101

Hình 28: Sequence Diagram “Lọc món đồ dựa trên đặc điểm” 101

Hình 29: Sequence Diagram “Xem chi tiết về món đồ” 102

Hình 30: Sequence Diagram “Xem danh sách các món đồ có trong tủ đồ” 103

Hình 31: Sequence Diagram “Tải món đồ” 104

Hình 32: Sequence Diagram “Xóa món đồ” 105

Hình 33: Sequence Diagram “Xem danh sách các trang phục” 105

Hình 34: Sequence Diagram “Xóa trang phục” 106

Hình 35: Sequence Diagram “Tạo trang phục” 107

Hình 36: Sequence Diagram “Xem gợi ý trang phục” 108

Hình 37: Sequence Diagram “Thay đổi thông tin cá nhân” 109

Hình 38: Sequence Diagram “Xem bài đăng trong cộng đồng” 110

Hình 39: Sequence Diagram “Tạo bài đăng cá nhân” 111

Hình 40: Sequence Diagram “Xem bài đăng cá nhân” 112

Hình 41: Sequence Diagram “Xóa bài đăng cá nhân” 113

Hình 42: Sequence Diagram “Chỉnh sửa bài đăng cá nhân” 114

Hình 43: Sequence Diagram “Xem biểu đồ thống kê về các món đồ” 114

Hình 44: Sequence Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 115

Hình 45: Sequence Diagram “Phê duyệt bài đăng” 116

Hình 46: Activity Diagram “Đăng nhập” 117

Hình 47: Activity Diagram “Đăng ký” 118

Hình 48: Activity Diagram “Quên mật khẩu” 119

Hình 49: Activity Diagram “Nhận dạng màu sắc cá nhân” 120

Hình 50: Activity Diagram “Xem chi tiết về màu sắc cá nhân” 121

Hình 51: Activity Diagram “Nhận dạng phong cách” 122

Hình 52: Activity Diagram “Xem chi tiết về phong cách” 123

Hình 53: Activity Diagram “Nhận dạng hình dáng cơ thể” 124

Hình 54: Activity Diagram “Xem chi tiết về hình dáng cơ thể” 125

Hình 55: Activity Diagram “Tìm kiếm phân loại” 126

Hình 56: Activity Diagram “Xem các món đồ thuộc phân loại” 127

Hình 57: Activity Diagram “Tìm kiếm món đồ” 128

Hình 58: Activity Diagram “Lọc món đồ dựa trên đặc điểm” 129

Hình 59: Activity Diagram “Xem chi tiết về món đồ” 130

Hình 60: Activity Diagram “Xem danh sách các món đồ có trong tủ đồ” 131

Hình 61: Activity Diagram “Tải món đồ” 132

Hình 62: Activity Diagram “Xóa món đồ” 133

Hình 63: Activity Diagram “Xem danh sách các trang phục” 133

Hình 64: Activity Diagram “Tạo trang phục” 134

Hình 65: Activity Diagram “Xóa trang phục” 135

Hình 66: Activity Diagram “Xem gợi ý trang phục” 135

Hình 67: Activity Diagram “Thay đổi thông tin cá nhân” 136

Hình 68: Activity Diagram “Xem bài đăng trong cộng đồng” 137

Hình 69: Activity Diagram “Tạo bài đăng cá nhân” 138

Hình 70: Activity Diagram “Xem bài đăng cá nhân” 139

Hình 71: Activity Diagram “Xóa bài đăng cá nhân” 139

Hình 72: Activity Diagram “Chỉnh sửa bài đăng cá nhân” 140

Hình 73: Activity Diagram “Xem biểu đồ thống kê về món đồ” 141

Hình 74: Activity Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 141

Hình 75: Activity Diagram “Phê duyệt bài đăng” 142

Hình 77: Giao điện đăng ký 150

Hình 78: Giao diện đăng nhập 151

Hình 79: Giao diện quên mật khẩu 152

Hình 80: Giao diện đổi mật khẩu 153

Hình 81: Giao diện trang chủ 154

Hình 82: Giao diện về chi tiết màu sắc cá nhân 155

Hình 83: Giao diện xem bảng màu 156

Hình 84: Giao diện nhận dạng màu sắc cá nhân 157

Hình 85: Giao diện kết quả màu sắc cá nhân 158

Hình 86: Giao diện chi tiết phong cách cá nhân 159

Hình 87: Giao diện nhận dạng phong cách cá nhân 160

Hình 88: Giao diện chi tiết về hình dáng cơ thể 161

Hình 89: Giao diện nhận dạng hình dáng cơ thể 162

Hình 90: Giao diện kết quả hình dáng cơ thể 163

Hình 91: Giao diện phân loại 164

Hình 92: Giao diện tìm kiếm phân loại (có kết quả) 165

Hình 93: Giao diện tìm kiếm phân loại (không có kết quả) 166

Hình 94: Danh sách các món đồ thuộc phân loại 167

Hình 95: Chi tiết món đồ 168

Hình 96: Giao diện tìm kiếm món đồ (có kết quả) 169

Hình 97: Giao diện tìm kiếm món đồ (không có kết quả) 170

Hình 98: Giao diện lọc các món đồ dựa trên đặc điểm 171

Hình 99: Giao diện tủ đồ (danh sách món đồ) 172

Hình 100: Giao diện tủ đồ (danh sách trang phục) 173

Hình 101: Giao diện chi tiết trang phục 174

Hình 102: Giao diện xoá món đồ 175

Hình 103: Giao diện xoá trang phục 176

Hình 104: Giao diện tải món đồ (chọn hình ảnh) 177

Hình 105: Giao diện tải món đồ (chọn phân loại) 178

Hình 106: Giao diện tải món đồ (nhập tên món đồ) 179

Hình 107: Giao diện tạo trang phục 180

Hình 108: Giao diện xem gợi ý trang phục 181

Hình 109: Giao diện xem gợi ý trang phục (dựa trên tủ đồ) 182

Hình 110: Giao diện xem gợi ý trang phục (dựa trên hệ thống) 183

Hình 111: Giao diện xem thông tin cá nhân 184

Hình 112: Giao diện thay đổi thông tin cá nhân 185

Hình 113: Giao diện xem bài đăng trong cộng đồng 186

Hình 114: Giao diện tạo bài đăng cá nhân 187

Hình 115: Giao diện xem bài đăng cá nhân 188

Hình 116: Giao diện xóa bài đăng cá nhân 189

Hình 117: Giao diện chỉnh sửa bài đăng cá nhân 190

Hình 118: Giao diện xem biểu đồ thống kê 191

Hình 119: Giao diện phê duyệt bài đăng 192

Bảng 1: Danh sách câu hỏi xác định tông da 41

Bảng 2: Danh sách câu hỏi xác định độ tương phản sắc tố 41

Bảng 3: Bảng kết quả màu sắc cá nhân 42

Bảng 4: Công thức xác định hình dáng cơ thể 44

Bảng 5: Danh sách câu hỏi xác định phong cách thời trang 47

Bảng 6: Yêu cầu chức năng 49

Bảng 7: Mô tả Usecase “Đăng nhập” 57

Bảng 8: Mô tả Usecase “Đăng ký” 58

Bảng 9: Mô tả Usecase “Quên mật khẩu” 60

Bảng 10: Mô tả Usecase “Nhận dạng màu sắc cá nhân” 60

Bảng 11: Mô tả Usecase “Xem chi tiết về màu sắc cá nhân” 62

Bảng 12: Mô tả Usecase “Nhận dạng phong cách thời trang” 63

Bảng 13: Mô tả Usecase “Xem chi tiết về phong cách” 64

Bảng 14: Mô tả Usecase “Nhận dạng hình dáng cơ thể” 65

Bảng 15: Mô tả Usecase “Xem chi tiết về hình dáng cơ thể” 66

Bảng 16: Mô tả Usecase “Tìm kiếm phân loại” 68

Bảng 17: Mô tả Usecase “Xem các món đồ thuộc phân loại” 69

Bảng 18: Mô tả Usecase “Tìm kiếm món đồ” 70

Bảng 19: Mô tả Usecase “Lọc các món đồ dựa trên đặc điểm” 72

Bảng 20: Mô tả Usecase “Xem chi tiết về món đồ” 74

Bảng 21: Mô tả Usecase “Xem danh sách các món đồ có trong tủ đồ” 74

Bảng 22: Mô tả Usecase “Tải món đồ” 76

Bảng 23: Mô tả Usecase “Xóa món đồ” 77

Bảng 24: Mô tả Usecase “Xem danh sách các trang phục” 78

Bảng 25: Mô tả Usecase “Tạo trang phục” 79

Bảng 26: Mô tả Usecase “Xóa trang phục” 80

Bảng 27: Mô tả Usecase “Xem gợi ý trang phục” 81

Bảng 28: Mô tả Usecase “Thay đổi thông tin cá nhân” 82

Bảng 29: Mô tả Usecase “Xem bài đăng trong cộng đồng" 83

Bảng 30: Mô tả Usecase “Tạo bài đăng cá nhân" 85

Bảng 31: Mô tả Usecase “Xem bài đăng cá nhân" 86

Bảng 32: Mô tả Use Case “Xoá bài đăng cá nhân" 87

Bảng 33: Mô tả Usecase “Chỉnh sửa bài đăng cá nhân" 88

Bảng 34: Mô tả Usecase “Đăng nhập” 89

Bảng 35: Mô tả Usecase “Xem biểu đồ thống kê về các món đồ” 90

Bảng 36: Mô tả Usecase “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 91

Bảng 37: Mô tả Usecase “Phê duyệt bài đăng" 92

Bảng 38: Chi tiết bảng dữ liệu User 144

Bảng 39: Chi tiết bảng dữ liệu Token 145

Bảng 40: Chi tiết bảng dữ liệu Style Type 145

Bảng 41: Chi tiết Chi tiết bảng dữ liệu Seasonal Color 145

Bảng 42: Chi tiết bảng dữ liệu Body Shape 146

Bảng 43: Chi tiết bảng dữ liệu Undertone question 146

Bảng 44: Chi tiết bảng dữ liệu Contrast question 146

Bảng 45: Chi tiết bảng dữ liệu Style question 147

Bảng 46: Chi tiết bảng dữ liệu Item 147

Bảng 47: Chi tiết bảng dữ liệu User Item 148

Bảng 48: Chi tiết bảng dữ liệu Item Category 148

Bảng 49: Chi tiết bảng dữ liệu User Outfit 148

Bảng 50: Chi tiết bảng dữ liệu Outfit User Item 149

Bảng 51: Chi tiết bảng dữ liệu Reason 149

Bảng 52: Chi tiết bảng dữ liệu Post 149

Bảng 53: Mô tả giao điện đăng ký 150

Bảng 54: Mô tả giao diện đăng nhập 151

Bảng 55: Mô tả giao diện quên mật khẩu 152

Bảng 56: Mô tả giao diện đổi mật khẩu 153

Bảng 57: Mô tả giao diện trang chủ 154

Bảng 58: Mô tả giao diện chi tiết về màu sắc cá nhân 155

Bảng 59: Mô tả giao diện xem bảng màu 156

Bảng 60: Mô tả giao diện nhận dạng màu sắc cá nhân 157

Bảng 61: Mô tả giao diện kết quả màu sắc cá nhân 158

Bảng 62: Mô tả giao diện chi tiết phong cách cá nhân 159

Bảng 63: Mô tả giao diện nhận dạng phong cách cá nhân 160

Bảng 64: Mô tả giao diện chi tiết về hình dáng cơ thể 161

Bảng 65: Mô tả giao diện nhận dạng hình dáng cơ thể 162

Bảng 66: Mô tả giao diện kết quả hình dáng cơ thể 163

Bảng 67: Mô tả giao diện kết quả hình dáng cơ thể 164

Bảng 68: Mô tả giao diện tìm kiếm phân loại (có kết quả) 165

Bảng 69: Mô tả giao diện tìm kiếm phân loại (không kết quả) 166

Bảng 70: Mô tả giao diện danh sách các món đồ thuộc phân loại 167

Bảng 71: Mô tả giao diện chi tiết món đồ 168

Bảng 72: Mô tả giao diện tìm kiếm món đồ (có kết quả) 169

Bảng 73: Mô tả giao diện tìm kiếm món đồ (không kết quả) 170

Bảng 74: Mô tả giao diện lọc các món đồ dựa trên đặc điểm 171

Bảng 75: Mô tả giao diện tủ đồ (danh sách món đồ) 172

Bảng 76: Mô tả giao diện tủ đồ (danh sách món đồ) 173

Bảng 77: Mô tả giao diện chi tiết trang phục 174

Bảng 78: Mô tả giao diện xoá món đồ 175

Bảng 79: Mô tả giao diện xoá trang phục 176

Bảng 80: Mô tả giao diện tải món đồ (chọn hình ảnh) 177

Bảng 81: Mô tả giao diện tải món đồ (chọn phân loại) 178

Bảng 82: Mô tả giao diện tải món đồ (nhập tên món đồ) 179

Bảng 83: Mô tả giao diện tạo trang phục 180

Bảng 84: Mô tả giao diện xem gợi ý trang phục 181

Bảng 85: Mô tả giao diện xem gợi ý trang phục (dựa trên tủ đồ) 182

Bảng 86: Mô tả giao diện xem gợi ý trang phục (dựa trên hệ thống) 183

Bảng 87: Mô tả giao diện xem thông tin cá nhân 184

Bảng 88: Mô tả giao diện xem bài đăng trong cộng đồng 186

Bảng 89: Mô tả giao diện tạo bài đăng cá nhân 187

Bảng 90: Mô tả giao diện xem bài đăng cá nhân 188

Bảng 91: Mô tả giao diện xóa bài đăng cá nhân 189

Bảng 92: Mô tả giao diện chỉnh sửa bài đăng cá nhân 190

Bảng 93: Mô tả giao diện xem biểu đồ thống kê 191

Bảng 94: Mô tả giao diện phê duyệt bài đăng 192

Bảng 95: Lịch trình công việc 195

Bảng 97: Yêu cầu hệ điều hành 195

Bảng 98: Yêu cầu phần mềm 195

Bảng 99: Yêu cầu công cụ kiểm thử 196

1 LÝ DO CHỌN ĐỀ TÀI

Trong nhiều năm gần đây, lĩnh vực làm đẹp luôn luôn là một trong những ngành phát triển nhanh chóng và lợi nhuận cao Sự quan tâm của con người đối với việc chăm sóc bản thân và nâng cao ngoại hình ngày càng gia tăng Điều này tạo ra cơ hội lớn cho các ứng dụng di động cung cấp giải pháp trong lĩnh vực này Ứng dụng di động đã trở thành một phần không thể thiếu trong cuộc sống hàng ngày của chúng ta Việc sử dụng điện thoại thông minh để tìm kiếm thông tin, sản phẩm và dịch vụ là một phần tự nhiên của cuộc sống hiện đại Việc phát triển một ứng dụng di động về làm đẹp có thể tận dụng sự phổ biến này để đáp ứng nhu cầu của người tiêu dùng Ứng dụng di động có thể cung cấp một loạt các giải pháp về làm đẹp, bao gồm tư vấn về phong cách, mua sắm sản phẩm làm đẹp, hướng dẫn trang điểm, và nhiều tính năng khác Sự linh hoạt và tính tiện lợi của các ứng dụng di động có thể thu hút một lượng lớn người dùng và tiềm năng khách hàng Công nghệ ngày càng phát triển, cho phép việc tạo ra các ứng dụng di động có khả năng tùy chỉnh, tích hợp trí tuệ nhân tạo, thực tế ảo, và nhiều công nghệ khác để cung cấp trải nghiệm làm đẹp tốt hơn cho người dùng Sự kết hợp giữa công nghệ và làm đẹp có thể tạo ra những sản phẩm độc đáo và hấp dẫn

Thị trường làm đẹp luôn đòi hỏi sự đổi mới và cải tiến liên tục Với sự gia tăng của cơ hội kinh doanh trong lĩnh vực này, việc nghiên cứu và phát triển một ứng dụng di động My Stylist có thể đáp ứng nhu cầu của thị trường và cung cấp giải pháp hiệu quả Ứng dụng di động My Stylist hướng tới người dùng có nhu cầu chăm sóc và nâng cao vẻ đẹp cá nhân, đặc biệt là trong lĩnh vực thời trang, kiểu tóc, và trang điểm Với cuộc sống ngày càng bận rộn và áp lực, việc tìm kiếm, lựa chọn, và thử nghiệm những phong cách mới thường trở thành một thách thức đáng kể Nhiều người đã phải đối mặt với việc tốn thời gian và tiền bạc để tìm ra những trang phục, kiểu tóc, và trang điểm phù hợp với họ Ứng dụng My Stylist ra đời với mục tiêu quan trọng: giải quyết vấn đề này một cách đơn giản và hiệu quả Thay vì gian nan tìm hiểu về các xu hướng thời trang, phong cách, và phương pháp làm đẹp, người dùng có thể giải quyết vấn đề đó với một người

15 bạn đồng hành ảo – My Stylist Ứng dụng này sẽ phân tích các đặc điểm của cá nhân người dùng, bao gồm màu sắc cá nhân, hình dáng cơ thể, và phong cách riêng, từ đó đưa ra các gợi ý, giải pháp, và lựa chọn phù hợp nhất với họ Điều đặc biệt là My Stylist không phải là một công cụ quyết định cứng nhắc Thay vào đó, nó đóng vai trò của một người bạn đồng hành thông minh, hiểu rõ đặc điểm của người dùng Ứng dụng sẽ thúc đẩy sự sáng tạo và tự do trong việc tự thể hiện, không hề ràng buộc theo quy tắc cố định

Bên cạnh đó, ứng dụng My Stylist cũng giúp người dùng quản lý tủ đồ cá nhân một cách tiện lợi Bằng cách theo dõi các món đồ và sản phẩm làm đẹp mà họ đã sở hữu, người dùng có thể dễ dàng tạo ra những bộ trang phục và phong cách hoàn hảo mà họ có sẵn, từ đó tối ưu hóa giá trị của tủ đồ cá nhân

Trên hết, mục tiêu của ứng dụng My Stylist không chỉ đơn thuần là cung cấp các gợi ý và lựa chọn cho người dùng, mà còn là hỗ trợ họ hiểu rõ hơn về bản thân Điều này giúp người dùng thấy tự tin hơn trong việc thể hiện phong cách và sự cá nhân hóa của họ My Stylist không phải là một cỗ máy lạnh không tâm, mà là một người bạn thân thiết, đồng hành trên hành trình chăm sóc và tôn vinh vẻ đẹp cá nhân

2 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN Đóng góp kiến thức mới: Nghiên cứu về ứng dụng di động My Stylist trong lĩnh vực làm đẹp có thể mang lại những kiến thức mới về cách công nghệ di động có thể được áp dụng trong lĩnh vực làm đẹp Điều này có thể giúp mở rộng kiến thức về phát triển ứng dụng di động và sự kết hợp của chúng với ngành công nghiệp làm đẹp

Nghiên cứu thực nghiệm: Thông qua việc tạo ra một ứng dụng thực tế, đề tài này cung cấp cơ hội cho các thí nghiệm và nghiên cứu thực nghiệm về cách người dùng tương tác với ứng dụng và ảnh hưởng của nó đối với quy trình làm đẹp của họ

Phân tích thị trường và người dùng: Việc nghiên cứu về thị trường và người dùng trong lĩnh vực làm đẹp có thể cung cấp thông tin quý báu về thị trường tiềm năng, người tiêu dùng mục tiêu, và xu hướng tiêu dùng

Phát triển sản phẩm và dịch vụ: Đề tài này có thể dẫn đến việc phát triển một ứng dụng thực tế giúp người dùng tối ưu hóa trải nghiệm làm đẹp của họ, bao gồm việc tư

16 vấn, mua sắm sản phẩm, và nhiều tính năng khác Điều này có thể giúp nâng cao chất lượng cuộc sống của người dùng

Kinh doanh và tiềm năng lợi nhuận: Nếu ứng dụng My Stylist thành công, nó có thể tạo ra cơ hội kinh doanh và tiềm năng lợi nhuận lớn trong lĩnh vực làm đẹp và công nghệ di động

Tiện ích và tiết kiệm thời gian: Ứng dụng cung cấp tiện ích cho người dùng bằng cách giúp họ tiết kiệm thời gian và nỗ lực trong việc quản lý và nâng cao ngoại hình của họ

Tạo việc làm: Phát triển và quản lý một ứng dụng di động cần nguồn nhân lực, từ lập trình viên đến những người chăm sóc khách hàng Điều này có thể tạo ra cơ hội việc làm và phát triển nguồn nhân lực trong ngành công nghiệp công nghệ và làm đẹp

Phục vụ cho đồ án tốt nghiệp Công nghệ phần mềm Việc phân tích, thiết kế, và phát triển ứng dụng My Stylist là một phần quan trọng của công việc phát triển phần mềm Nghiên cứu này có thể giúp cải thiện kỹ thuật phát triển phần mềm, đặc biệt là trong ngữ cảnh của ứng dụng di động

Tối ưu hóa hiệu suất và tương tác người dùng: Công nghệ phần mềm đóng vai trò quan trọng trong việc tối ưu hóa hiệu suất của ứng dụng và cải thiện tương tác của người dùng Nghiên cứu này có thể liên quan đến việc tối ưu hóa mã nguồn, tối ưu hóa cơ sở dữ liệu, và thiết kế giao diện người dùng hiệu quả

Phân tích dữ liệu và thông tin: Trong quá trình nghiên cứu, có thể có sự sử dụng và phân tích dữ liệu liên quan đến tương tác người dùng và hành vi sử dụng ứng dụng Điều này có thể yêu cầu các kỹ thuật và công cụ phân tích dữ liệu, mà là một phần quan trọng của chuyên ngành công nghệ phần mềm

MÔ HÌNH HÓA YÊU CẦU

MÔ HÌNH HÓA YÊU CẦU

3 CHƯƠNG 3: THIẾT KẾ PHẦN MỀM

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

4 CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ

STT Thời gian Công việc Ghi chú

- Thiết kế usecase và mô hình hóa yêu cầu

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

- Tìm hiểu về Spring Security và cơ chế xác thực bằng Json Web Token

3 31/03/2024 – 08/04/2024 - Tìm hiểu về React Native

- Thiết kế giao diện trên Figma

4 08/04/2024 – 15/05/2024 - Xây dựng các API dựa trên đặc tả yêu cầu

- Hiện thực các giao diện trên Figma bằng React Native

- Kết nối backend, mobile, cơ sở dữ liệu

5 08/04/2024 – 15/05/2024 - Kiểm thử chương trình, sửa lỗi

6 08/04/2024 – 19/05/2024 - Viết và hoàn thiện báo cáo

Người viết đề cương Ý kiến của giáo viên hướng dẫn

(ký và ghi rõ họ tên)

LỜI CẢM ƠN 1 ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP 2

1 LÝ DO CHỌN ĐỀ TÀI 14

2 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN 15

CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 18

1.1 KIẾN TRÚC CHUNG CỦA HỆ THỐNG 18

CHƯƠNG 2: MÔ HÌNH HÓA YÊU CẦU 48

2.2 MÔ HÌNH HÓA YÊU CẦU 52

CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 93

3.4 THIẾT KẾ CƠ SỞ DỮ LIỆU 143

CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 193

Hình 1: Kiến trúc chung của hệ thống 18

Hình 2: Luồng xử lý Token Based Authentication 19

Hình 3: Luồng xử lý yêu cầu Refresh Token khi Access Token hết hạn 20

Hình 4: Hình logo Spring Boot 25

Hình 5: Cấu trúc Json Web Token 29

Hình 7: Hình logo React Native 34

Hình 8: Hình kiến trúc của Zustand 36

Hình 10: Hình mô tả 4 nhóm màu 39

Hình 11: Lược đồ usecase về phía người dùng 52

Hình 12: Lược đồ usecase chức năng khám phá đặc điểm cá nhân 53

Hình 13: Lược đồ usecase chức năng tra cứu phân loại 54

Hình 14: Quản lý bài đăng 54

Hình 15: Lược đồ usecase chức năng quản lý tủ đồ 55

Hình 16: Lược đồ usecase về phía quản trị viên 55

Hình 17: Sequence Diagram “Đăng nhập” 93

Hình 18: Sequence Diagram “Đăng ký” 94

Hình 19: Sequence Diagram “Quên mật khẩu” 95

Hình 20: Sequence Diagram “Nhận dạng màu sắc cá nhân” 95

Hình 21: Sequence Diagram “Xem chi tiết về màu sắc cá nhân” 96

Hình 22: Sequence Diagram “Nhận dạng phong cách” 96

Hình 23: Sequence Diagram “Xem chi tiết về phong cách” 97

Hình 24: Sequence Diagram “Nhận dạng hình dáng cơ thể” 98

Hình 25: Sequence Diagram “Tìm kiếm phân loại” 99

Hình 26: Sequence Diagram “Xem các món đồ thuộc phân loại” 100

Hình 27: Sequence Diagram “Tìm kiếm món đồ” 101

Hình 28: Sequence Diagram “Lọc món đồ dựa trên đặc điểm” 101

Hình 29: Sequence Diagram “Xem chi tiết về món đồ” 102

Hình 30: Sequence Diagram “Xem danh sách các món đồ có trong tủ đồ” 103

Hình 31: Sequence Diagram “Tải món đồ” 104

Hình 32: Sequence Diagram “Xóa món đồ” 105

Hình 33: Sequence Diagram “Xem danh sách các trang phục” 105

Hình 34: Sequence Diagram “Xóa trang phục” 106

Hình 35: Sequence Diagram “Tạo trang phục” 107

Hình 36: Sequence Diagram “Xem gợi ý trang phục” 108

Hình 37: Sequence Diagram “Thay đổi thông tin cá nhân” 109

Hình 38: Sequence Diagram “Xem bài đăng trong cộng đồng” 110

Hình 39: Sequence Diagram “Tạo bài đăng cá nhân” 111

Hình 40: Sequence Diagram “Xem bài đăng cá nhân” 112

Hình 41: Sequence Diagram “Xóa bài đăng cá nhân” 113

Hình 42: Sequence Diagram “Chỉnh sửa bài đăng cá nhân” 114

Hình 43: Sequence Diagram “Xem biểu đồ thống kê về các món đồ” 114

Hình 44: Sequence Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 115

Hình 45: Sequence Diagram “Phê duyệt bài đăng” 116

Hình 46: Activity Diagram “Đăng nhập” 117

Hình 47: Activity Diagram “Đăng ký” 118

Hình 48: Activity Diagram “Quên mật khẩu” 119

Hình 49: Activity Diagram “Nhận dạng màu sắc cá nhân” 120

Hình 50: Activity Diagram “Xem chi tiết về màu sắc cá nhân” 121

Hình 51: Activity Diagram “Nhận dạng phong cách” 122

Hình 52: Activity Diagram “Xem chi tiết về phong cách” 123

Hình 53: Activity Diagram “Nhận dạng hình dáng cơ thể” 124

Hình 54: Activity Diagram “Xem chi tiết về hình dáng cơ thể” 125

Hình 55: Activity Diagram “Tìm kiếm phân loại” 126

Hình 56: Activity Diagram “Xem các món đồ thuộc phân loại” 127

Hình 57: Activity Diagram “Tìm kiếm món đồ” 128

Hình 58: Activity Diagram “Lọc món đồ dựa trên đặc điểm” 129

Hình 59: Activity Diagram “Xem chi tiết về món đồ” 130

Hình 60: Activity Diagram “Xem danh sách các món đồ có trong tủ đồ” 131

Hình 61: Activity Diagram “Tải món đồ” 132

Hình 62: Activity Diagram “Xóa món đồ” 133

Hình 63: Activity Diagram “Xem danh sách các trang phục” 133

Hình 64: Activity Diagram “Tạo trang phục” 134

Hình 65: Activity Diagram “Xóa trang phục” 135

Hình 66: Activity Diagram “Xem gợi ý trang phục” 135

Hình 67: Activity Diagram “Thay đổi thông tin cá nhân” 136

Hình 68: Activity Diagram “Xem bài đăng trong cộng đồng” 137

Hình 69: Activity Diagram “Tạo bài đăng cá nhân” 138

Hình 70: Activity Diagram “Xem bài đăng cá nhân” 139

Hình 71: Activity Diagram “Xóa bài đăng cá nhân” 139

Hình 72: Activity Diagram “Chỉnh sửa bài đăng cá nhân” 140

Hình 73: Activity Diagram “Xem biểu đồ thống kê về món đồ” 141

Hình 74: Activity Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 141

Hình 75: Activity Diagram “Phê duyệt bài đăng” 142

Hình 77: Giao điện đăng ký 150

Hình 78: Giao diện đăng nhập 151

Hình 79: Giao diện quên mật khẩu 152

Hình 80: Giao diện đổi mật khẩu 153

Hình 81: Giao diện trang chủ 154

Hình 82: Giao diện về chi tiết màu sắc cá nhân 155

Hình 83: Giao diện xem bảng màu 156

Hình 84: Giao diện nhận dạng màu sắc cá nhân 157

Hình 85: Giao diện kết quả màu sắc cá nhân 158

Hình 86: Giao diện chi tiết phong cách cá nhân 159

Hình 87: Giao diện nhận dạng phong cách cá nhân 160

Hình 88: Giao diện chi tiết về hình dáng cơ thể 161

Hình 89: Giao diện nhận dạng hình dáng cơ thể 162

Hình 90: Giao diện kết quả hình dáng cơ thể 163

Hình 91: Giao diện phân loại 164

Hình 92: Giao diện tìm kiếm phân loại (có kết quả) 165

Hình 93: Giao diện tìm kiếm phân loại (không có kết quả) 166

Hình 94: Danh sách các món đồ thuộc phân loại 167

Hình 95: Chi tiết món đồ 168

Hình 96: Giao diện tìm kiếm món đồ (có kết quả) 169

Hình 97: Giao diện tìm kiếm món đồ (không có kết quả) 170

Hình 98: Giao diện lọc các món đồ dựa trên đặc điểm 171

Hình 99: Giao diện tủ đồ (danh sách món đồ) 172

Hình 100: Giao diện tủ đồ (danh sách trang phục) 173

Hình 101: Giao diện chi tiết trang phục 174

Hình 102: Giao diện xoá món đồ 175

Hình 103: Giao diện xoá trang phục 176

Hình 104: Giao diện tải món đồ (chọn hình ảnh) 177

Hình 105: Giao diện tải món đồ (chọn phân loại) 178

Hình 106: Giao diện tải món đồ (nhập tên món đồ) 179

Hình 107: Giao diện tạo trang phục 180

Hình 108: Giao diện xem gợi ý trang phục 181

Hình 109: Giao diện xem gợi ý trang phục (dựa trên tủ đồ) 182

Hình 110: Giao diện xem gợi ý trang phục (dựa trên hệ thống) 183

Hình 111: Giao diện xem thông tin cá nhân 184

Hình 112: Giao diện thay đổi thông tin cá nhân 185

Hình 113: Giao diện xem bài đăng trong cộng đồng 186

Hình 114: Giao diện tạo bài đăng cá nhân 187

Hình 115: Giao diện xem bài đăng cá nhân 188

Hình 116: Giao diện xóa bài đăng cá nhân 189

Hình 117: Giao diện chỉnh sửa bài đăng cá nhân 190

Hình 118: Giao diện xem biểu đồ thống kê 191

Hình 119: Giao diện phê duyệt bài đăng 192

Bảng 1: Danh sách câu hỏi xác định tông da 41

Bảng 2: Danh sách câu hỏi xác định độ tương phản sắc tố 41

Bảng 3: Bảng kết quả màu sắc cá nhân 42

Bảng 4: Công thức xác định hình dáng cơ thể 44

Bảng 5: Danh sách câu hỏi xác định phong cách thời trang 47

Bảng 6: Yêu cầu chức năng 49

Bảng 7: Mô tả Usecase “Đăng nhập” 57

Bảng 8: Mô tả Usecase “Đăng ký” 58

Bảng 9: Mô tả Usecase “Quên mật khẩu” 60

Bảng 10: Mô tả Usecase “Nhận dạng màu sắc cá nhân” 60

Bảng 11: Mô tả Usecase “Xem chi tiết về màu sắc cá nhân” 62

Bảng 12: Mô tả Usecase “Nhận dạng phong cách thời trang” 63

Bảng 13: Mô tả Usecase “Xem chi tiết về phong cách” 64

Bảng 14: Mô tả Usecase “Nhận dạng hình dáng cơ thể” 65

Bảng 15: Mô tả Usecase “Xem chi tiết về hình dáng cơ thể” 66

Bảng 16: Mô tả Usecase “Tìm kiếm phân loại” 68

Bảng 17: Mô tả Usecase “Xem các món đồ thuộc phân loại” 69

Bảng 18: Mô tả Usecase “Tìm kiếm món đồ” 70

Bảng 19: Mô tả Usecase “Lọc các món đồ dựa trên đặc điểm” 72

Bảng 20: Mô tả Usecase “Xem chi tiết về món đồ” 74

Bảng 21: Mô tả Usecase “Xem danh sách các món đồ có trong tủ đồ” 74

Bảng 22: Mô tả Usecase “Tải món đồ” 76

Bảng 23: Mô tả Usecase “Xóa món đồ” 77

Bảng 24: Mô tả Usecase “Xem danh sách các trang phục” 78

Bảng 25: Mô tả Usecase “Tạo trang phục” 79

Bảng 26: Mô tả Usecase “Xóa trang phục” 80

Bảng 27: Mô tả Usecase “Xem gợi ý trang phục” 81

Bảng 28: Mô tả Usecase “Thay đổi thông tin cá nhân” 82

Bảng 29: Mô tả Usecase “Xem bài đăng trong cộng đồng" 83

Bảng 30: Mô tả Usecase “Tạo bài đăng cá nhân" 85

Bảng 31: Mô tả Usecase “Xem bài đăng cá nhân" 86

Bảng 32: Mô tả Use Case “Xoá bài đăng cá nhân" 87

Bảng 33: Mô tả Usecase “Chỉnh sửa bài đăng cá nhân" 88

Bảng 34: Mô tả Usecase “Đăng nhập” 89

Bảng 35: Mô tả Usecase “Xem biểu đồ thống kê về các món đồ” 90

Bảng 36: Mô tả Usecase “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 91

Bảng 37: Mô tả Usecase “Phê duyệt bài đăng" 92

Bảng 38: Chi tiết bảng dữ liệu User 144

Bảng 39: Chi tiết bảng dữ liệu Token 145

Bảng 40: Chi tiết bảng dữ liệu Style Type 145

Bảng 41: Chi tiết Chi tiết bảng dữ liệu Seasonal Color 145

Bảng 42: Chi tiết bảng dữ liệu Body Shape 146

Bảng 43: Chi tiết bảng dữ liệu Undertone question 146

Bảng 44: Chi tiết bảng dữ liệu Contrast question 146

Bảng 45: Chi tiết bảng dữ liệu Style question 147

Bảng 46: Chi tiết bảng dữ liệu Item 147

Bảng 47: Chi tiết bảng dữ liệu User Item 148

Bảng 48: Chi tiết bảng dữ liệu Item Category 148

Bảng 49: Chi tiết bảng dữ liệu User Outfit 148

Bảng 50: Chi tiết bảng dữ liệu Outfit User Item 149

Bảng 51: Chi tiết bảng dữ liệu Reason 149

Bảng 52: Chi tiết bảng dữ liệu Post 149

Bảng 53: Mô tả giao điện đăng ký 150

Bảng 54: Mô tả giao diện đăng nhập 151

Bảng 55: Mô tả giao diện quên mật khẩu 152

Bảng 56: Mô tả giao diện đổi mật khẩu 153

Bảng 57: Mô tả giao diện trang chủ 154

Bảng 58: Mô tả giao diện chi tiết về màu sắc cá nhân 155

Bảng 59: Mô tả giao diện xem bảng màu 156

Bảng 60: Mô tả giao diện nhận dạng màu sắc cá nhân 157

Bảng 61: Mô tả giao diện kết quả màu sắc cá nhân 158

Bảng 62: Mô tả giao diện chi tiết phong cách cá nhân 159

Bảng 63: Mô tả giao diện nhận dạng phong cách cá nhân 160

Bảng 64: Mô tả giao diện chi tiết về hình dáng cơ thể 161

Bảng 65: Mô tả giao diện nhận dạng hình dáng cơ thể 162

Bảng 66: Mô tả giao diện kết quả hình dáng cơ thể 163

Bảng 67: Mô tả giao diện kết quả hình dáng cơ thể 164

Bảng 68: Mô tả giao diện tìm kiếm phân loại (có kết quả) 165

Bảng 69: Mô tả giao diện tìm kiếm phân loại (không kết quả) 166

Bảng 70: Mô tả giao diện danh sách các món đồ thuộc phân loại 167

Bảng 71: Mô tả giao diện chi tiết món đồ 168

Bảng 72: Mô tả giao diện tìm kiếm món đồ (có kết quả) 169

Bảng 73: Mô tả giao diện tìm kiếm món đồ (không kết quả) 170

Bảng 74: Mô tả giao diện lọc các món đồ dựa trên đặc điểm 171

Bảng 75: Mô tả giao diện tủ đồ (danh sách món đồ) 172

Bảng 76: Mô tả giao diện tủ đồ (danh sách món đồ) 173

Bảng 77: Mô tả giao diện chi tiết trang phục 174

Bảng 78: Mô tả giao diện xoá món đồ 175

Bảng 79: Mô tả giao diện xoá trang phục 176

Bảng 80: Mô tả giao diện tải món đồ (chọn hình ảnh) 177

Bảng 81: Mô tả giao diện tải món đồ (chọn phân loại) 178

Bảng 82: Mô tả giao diện tải món đồ (nhập tên món đồ) 179

Bảng 83: Mô tả giao diện tạo trang phục 180

Bảng 84: Mô tả giao diện xem gợi ý trang phục 181

Bảng 85: Mô tả giao diện xem gợi ý trang phục (dựa trên tủ đồ) 182

Bảng 86: Mô tả giao diện xem gợi ý trang phục (dựa trên hệ thống) 183

Bảng 87: Mô tả giao diện xem thông tin cá nhân 184

Bảng 88: Mô tả giao diện xem bài đăng trong cộng đồng 186

Bảng 89: Mô tả giao diện tạo bài đăng cá nhân 187

Bảng 90: Mô tả giao diện xem bài đăng cá nhân 188

Bảng 91: Mô tả giao diện xóa bài đăng cá nhân 189

Bảng 92: Mô tả giao diện chỉnh sửa bài đăng cá nhân 190

Bảng 93: Mô tả giao diện xem biểu đồ thống kê 191

Bảng 94: Mô tả giao diện phê duyệt bài đăng 192

Bảng 95: Lịch trình công việc 195

Bảng 97: Yêu cầu hệ điều hành 195

Bảng 98: Yêu cầu phần mềm 195

Bảng 99: Yêu cầu công cụ kiểm thử 196

1 LÝ DO CHỌN ĐỀ TÀI

Trong nhiều năm gần đây, lĩnh vực làm đẹp luôn luôn là một trong những ngành phát triển nhanh chóng và lợi nhuận cao Sự quan tâm của con người đối với việc chăm sóc bản thân và nâng cao ngoại hình ngày càng gia tăng Điều này tạo ra cơ hội lớn cho các ứng dụng di động cung cấp giải pháp trong lĩnh vực này Ứng dụng di động đã trở thành một phần không thể thiếu trong cuộc sống hàng ngày của chúng ta Việc sử dụng điện thoại thông minh để tìm kiếm thông tin, sản phẩm và dịch vụ là một phần tự nhiên của cuộc sống hiện đại Việc phát triển một ứng dụng di động về làm đẹp có thể tận dụng sự phổ biến này để đáp ứng nhu cầu của người tiêu dùng Ứng dụng di động có thể cung cấp một loạt các giải pháp về làm đẹp, bao gồm tư vấn về phong cách, mua sắm sản phẩm làm đẹp, hướng dẫn trang điểm, và nhiều tính năng khác Sự linh hoạt và tính tiện lợi của các ứng dụng di động có thể thu hút một lượng lớn người dùng và tiềm năng khách hàng Công nghệ ngày càng phát triển, cho phép việc tạo ra các ứng dụng di động có khả năng tùy chỉnh, tích hợp trí tuệ nhân tạo, thực tế ảo, và nhiều công nghệ khác để cung cấp trải nghiệm làm đẹp tốt hơn cho người dùng Sự kết hợp giữa công nghệ và làm đẹp có thể tạo ra những sản phẩm độc đáo và hấp dẫn

Thị trường làm đẹp luôn đòi hỏi sự đổi mới và cải tiến liên tục Với sự gia tăng của cơ hội kinh doanh trong lĩnh vực này, việc nghiên cứu và phát triển một ứng dụng di động My Stylist có thể đáp ứng nhu cầu của thị trường và cung cấp giải pháp hiệu quả Ứng dụng di động My Stylist hướng tới người dùng có nhu cầu chăm sóc và nâng cao vẻ đẹp cá nhân, đặc biệt là trong lĩnh vực thời trang, kiểu tóc, và trang điểm Với cuộc sống ngày càng bận rộn và áp lực, việc tìm kiếm, lựa chọn, và thử nghiệm những phong cách mới thường trở thành một thách thức đáng kể Nhiều người đã phải đối mặt với việc tốn thời gian và tiền bạc để tìm ra những trang phục, kiểu tóc, và trang điểm phù hợp với họ Ứng dụng My Stylist ra đời với mục tiêu quan trọng: giải quyết vấn đề này một cách đơn giản và hiệu quả Thay vì gian nan tìm hiểu về các xu hướng thời trang, phong cách, và phương pháp làm đẹp, người dùng có thể giải quyết vấn đề đó với một người

15 bạn đồng hành ảo – My Stylist Ứng dụng này sẽ phân tích các đặc điểm của cá nhân người dùng, bao gồm màu sắc cá nhân, hình dáng cơ thể, và phong cách riêng, từ đó đưa ra các gợi ý, giải pháp, và lựa chọn phù hợp nhất với họ Điều đặc biệt là My Stylist không phải là một công cụ quyết định cứng nhắc Thay vào đó, nó đóng vai trò của một người bạn đồng hành thông minh, hiểu rõ đặc điểm của người dùng Ứng dụng sẽ thúc đẩy sự sáng tạo và tự do trong việc tự thể hiện, không hề ràng buộc theo quy tắc cố định

Bên cạnh đó, ứng dụng My Stylist cũng giúp người dùng quản lý tủ đồ cá nhân một cách tiện lợi Bằng cách theo dõi các món đồ và sản phẩm làm đẹp mà họ đã sở hữu, người dùng có thể dễ dàng tạo ra những bộ trang phục và phong cách hoàn hảo mà họ có sẵn, từ đó tối ưu hóa giá trị của tủ đồ cá nhân

Trên hết, mục tiêu của ứng dụng My Stylist không chỉ đơn thuần là cung cấp các gợi ý và lựa chọn cho người dùng, mà còn là hỗ trợ họ hiểu rõ hơn về bản thân Điều này giúp người dùng thấy tự tin hơn trong việc thể hiện phong cách và sự cá nhân hóa của họ My Stylist không phải là một cỗ máy lạnh không tâm, mà là một người bạn thân thiết, đồng hành trên hành trình chăm sóc và tôn vinh vẻ đẹp cá nhân

2 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN Đóng góp kiến thức mới: Nghiên cứu về ứng dụng di động My Stylist trong lĩnh vực làm đẹp có thể mang lại những kiến thức mới về cách công nghệ di động có thể được áp dụng trong lĩnh vực làm đẹp Điều này có thể giúp mở rộng kiến thức về phát triển ứng dụng di động và sự kết hợp của chúng với ngành công nghiệp làm đẹp

Nghiên cứu thực nghiệm: Thông qua việc tạo ra một ứng dụng thực tế, đề tài này cung cấp cơ hội cho các thí nghiệm và nghiên cứu thực nghiệm về cách người dùng tương tác với ứng dụng và ảnh hưởng của nó đối với quy trình làm đẹp của họ

Phân tích thị trường và người dùng: Việc nghiên cứu về thị trường và người dùng trong lĩnh vực làm đẹp có thể cung cấp thông tin quý báu về thị trường tiềm năng, người tiêu dùng mục tiêu, và xu hướng tiêu dùng

Phát triển sản phẩm và dịch vụ: Đề tài này có thể dẫn đến việc phát triển một ứng dụng thực tế giúp người dùng tối ưu hóa trải nghiệm làm đẹp của họ, bao gồm việc tư

16 vấn, mua sắm sản phẩm, và nhiều tính năng khác Điều này có thể giúp nâng cao chất lượng cuộc sống của người dùng

Kinh doanh và tiềm năng lợi nhuận: Nếu ứng dụng My Stylist thành công, nó có thể tạo ra cơ hội kinh doanh và tiềm năng lợi nhuận lớn trong lĩnh vực làm đẹp và công nghệ di động

Tiện ích và tiết kiệm thời gian: Ứng dụng cung cấp tiện ích cho người dùng bằng cách giúp họ tiết kiệm thời gian và nỗ lực trong việc quản lý và nâng cao ngoại hình của họ

Tạo việc làm: Phát triển và quản lý một ứng dụng di động cần nguồn nhân lực, từ lập trình viên đến những người chăm sóc khách hàng Điều này có thể tạo ra cơ hội việc làm và phát triển nguồn nhân lực trong ngành công nghiệp công nghệ và làm đẹp

Phục vụ cho đồ án tốt nghiệp Công nghệ phần mềm Việc phân tích, thiết kế, và phát triển ứng dụng My Stylist là một phần quan trọng của công việc phát triển phần mềm Nghiên cứu này có thể giúp cải thiện kỹ thuật phát triển phần mềm, đặc biệt là trong ngữ cảnh của ứng dụng di động

Tối ưu hóa hiệu suất và tương tác người dùng: Công nghệ phần mềm đóng vai trò quan trọng trong việc tối ưu hóa hiệu suất của ứng dụng và cải thiện tương tác của người dùng Nghiên cứu này có thể liên quan đến việc tối ưu hóa mã nguồn, tối ưu hóa cơ sở dữ liệu, và thiết kế giao diện người dùng hiệu quả

Phân tích dữ liệu và thông tin: Trong quá trình nghiên cứu, có thể có sự sử dụng và phân tích dữ liệu liên quan đến tương tác người dùng và hành vi sử dụng ứng dụng Điều này có thể yêu cầu các kỹ thuật và công cụ phân tích dữ liệu, mà là một phần quan trọng của chuyên ngành công nghệ phần mềm

THIẾT KẾ PHẦN MỀM

LƯỢC ĐỒ TUẦN TỰ

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

4 CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ

STT Thời gian Công việc Ghi chú

- Thiết kế usecase và mô hình hóa yêu cầu

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

- Tìm hiểu về Spring Security và cơ chế xác thực bằng Json Web Token

3 31/03/2024 – 08/04/2024 - Tìm hiểu về React Native

- Thiết kế giao diện trên Figma

4 08/04/2024 – 15/05/2024 - Xây dựng các API dựa trên đặc tả yêu cầu

- Hiện thực các giao diện trên Figma bằng React Native

- Kết nối backend, mobile, cơ sở dữ liệu

5 08/04/2024 – 15/05/2024 - Kiểm thử chương trình, sửa lỗi

6 08/04/2024 – 19/05/2024 - Viết và hoàn thiện báo cáo

Người viết đề cương Ý kiến của giáo viên hướng dẫn

(ký và ghi rõ họ tên)

LỜI CẢM ƠN 1 ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP 2

1 LÝ DO CHỌN ĐỀ TÀI 14

2 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN 15

CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 18

1.1 KIẾN TRÚC CHUNG CỦA HỆ THỐNG 18

CHƯƠNG 2: MÔ HÌNH HÓA YÊU CẦU 48

2.2 MÔ HÌNH HÓA YÊU CẦU 52

CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 93

3.4 THIẾT KẾ CƠ SỞ DỮ LIỆU 143

CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 193

Hình 1: Kiến trúc chung của hệ thống 18

Hình 2: Luồng xử lý Token Based Authentication 19

Hình 3: Luồng xử lý yêu cầu Refresh Token khi Access Token hết hạn 20

Hình 4: Hình logo Spring Boot 25

Hình 5: Cấu trúc Json Web Token 29

Hình 7: Hình logo React Native 34

Hình 8: Hình kiến trúc của Zustand 36

Hình 10: Hình mô tả 4 nhóm màu 39

Hình 11: Lược đồ usecase về phía người dùng 52

Hình 12: Lược đồ usecase chức năng khám phá đặc điểm cá nhân 53

Hình 13: Lược đồ usecase chức năng tra cứu phân loại 54

Hình 14: Quản lý bài đăng 54

Hình 15: Lược đồ usecase chức năng quản lý tủ đồ 55

Hình 16: Lược đồ usecase về phía quản trị viên 55

Hình 17: Sequence Diagram “Đăng nhập” 93

Hình 18: Sequence Diagram “Đăng ký” 94

Hình 19: Sequence Diagram “Quên mật khẩu” 95

Hình 20: Sequence Diagram “Nhận dạng màu sắc cá nhân” 95

Hình 21: Sequence Diagram “Xem chi tiết về màu sắc cá nhân” 96

Hình 22: Sequence Diagram “Nhận dạng phong cách” 96

Hình 23: Sequence Diagram “Xem chi tiết về phong cách” 97

Hình 24: Sequence Diagram “Nhận dạng hình dáng cơ thể” 98

Hình 25: Sequence Diagram “Tìm kiếm phân loại” 99

Hình 26: Sequence Diagram “Xem các món đồ thuộc phân loại” 100

Hình 27: Sequence Diagram “Tìm kiếm món đồ” 101

Hình 28: Sequence Diagram “Lọc món đồ dựa trên đặc điểm” 101

Hình 29: Sequence Diagram “Xem chi tiết về món đồ” 102

Hình 30: Sequence Diagram “Xem danh sách các món đồ có trong tủ đồ” 103

Hình 31: Sequence Diagram “Tải món đồ” 104

Hình 32: Sequence Diagram “Xóa món đồ” 105

Hình 33: Sequence Diagram “Xem danh sách các trang phục” 105

Hình 34: Sequence Diagram “Xóa trang phục” 106

Hình 35: Sequence Diagram “Tạo trang phục” 107

Hình 36: Sequence Diagram “Xem gợi ý trang phục” 108

Hình 37: Sequence Diagram “Thay đổi thông tin cá nhân” 109

Hình 38: Sequence Diagram “Xem bài đăng trong cộng đồng” 110

Hình 39: Sequence Diagram “Tạo bài đăng cá nhân” 111

Hình 40: Sequence Diagram “Xem bài đăng cá nhân” 112

Hình 41: Sequence Diagram “Xóa bài đăng cá nhân” 113

Hình 42: Sequence Diagram “Chỉnh sửa bài đăng cá nhân” 114

Hình 43: Sequence Diagram “Xem biểu đồ thống kê về các món đồ” 114

Hình 44: Sequence Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 115

Hình 45: Sequence Diagram “Phê duyệt bài đăng” 116

Hình 46: Activity Diagram “Đăng nhập” 117

Hình 47: Activity Diagram “Đăng ký” 118

Hình 48: Activity Diagram “Quên mật khẩu” 119

Hình 49: Activity Diagram “Nhận dạng màu sắc cá nhân” 120

Hình 50: Activity Diagram “Xem chi tiết về màu sắc cá nhân” 121

Hình 51: Activity Diagram “Nhận dạng phong cách” 122

Hình 52: Activity Diagram “Xem chi tiết về phong cách” 123

Hình 53: Activity Diagram “Nhận dạng hình dáng cơ thể” 124

Hình 54: Activity Diagram “Xem chi tiết về hình dáng cơ thể” 125

Hình 55: Activity Diagram “Tìm kiếm phân loại” 126

Hình 56: Activity Diagram “Xem các món đồ thuộc phân loại” 127

Hình 57: Activity Diagram “Tìm kiếm món đồ” 128

Hình 58: Activity Diagram “Lọc món đồ dựa trên đặc điểm” 129

Hình 59: Activity Diagram “Xem chi tiết về món đồ” 130

Hình 60: Activity Diagram “Xem danh sách các món đồ có trong tủ đồ” 131

Hình 61: Activity Diagram “Tải món đồ” 132

Hình 62: Activity Diagram “Xóa món đồ” 133

Hình 63: Activity Diagram “Xem danh sách các trang phục” 133

Hình 64: Activity Diagram “Tạo trang phục” 134

Hình 65: Activity Diagram “Xóa trang phục” 135

Hình 66: Activity Diagram “Xem gợi ý trang phục” 135

Hình 67: Activity Diagram “Thay đổi thông tin cá nhân” 136

Hình 68: Activity Diagram “Xem bài đăng trong cộng đồng” 137

Hình 69: Activity Diagram “Tạo bài đăng cá nhân” 138

Hình 70: Activity Diagram “Xem bài đăng cá nhân” 139

Hình 71: Activity Diagram “Xóa bài đăng cá nhân” 139

Hình 72: Activity Diagram “Chỉnh sửa bài đăng cá nhân” 140

Hình 73: Activity Diagram “Xem biểu đồ thống kê về món đồ” 141

Hình 74: Activity Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 141

Hình 75: Activity Diagram “Phê duyệt bài đăng” 142

Hình 77: Giao điện đăng ký 150

Hình 78: Giao diện đăng nhập 151

Hình 79: Giao diện quên mật khẩu 152

Hình 80: Giao diện đổi mật khẩu 153

Hình 81: Giao diện trang chủ 154

Hình 82: Giao diện về chi tiết màu sắc cá nhân 155

Hình 83: Giao diện xem bảng màu 156

Hình 84: Giao diện nhận dạng màu sắc cá nhân 157

Hình 85: Giao diện kết quả màu sắc cá nhân 158

Hình 86: Giao diện chi tiết phong cách cá nhân 159

Hình 87: Giao diện nhận dạng phong cách cá nhân 160

Hình 88: Giao diện chi tiết về hình dáng cơ thể 161

Hình 89: Giao diện nhận dạng hình dáng cơ thể 162

Hình 90: Giao diện kết quả hình dáng cơ thể 163

Hình 91: Giao diện phân loại 164

Hình 92: Giao diện tìm kiếm phân loại (có kết quả) 165

Hình 93: Giao diện tìm kiếm phân loại (không có kết quả) 166

Hình 94: Danh sách các món đồ thuộc phân loại 167

Hình 95: Chi tiết món đồ 168

Hình 96: Giao diện tìm kiếm món đồ (có kết quả) 169

Hình 97: Giao diện tìm kiếm món đồ (không có kết quả) 170

Hình 98: Giao diện lọc các món đồ dựa trên đặc điểm 171

Hình 99: Giao diện tủ đồ (danh sách món đồ) 172

Hình 100: Giao diện tủ đồ (danh sách trang phục) 173

Hình 101: Giao diện chi tiết trang phục 174

Hình 102: Giao diện xoá món đồ 175

Hình 103: Giao diện xoá trang phục 176

Hình 104: Giao diện tải món đồ (chọn hình ảnh) 177

Hình 105: Giao diện tải món đồ (chọn phân loại) 178

Hình 106: Giao diện tải món đồ (nhập tên món đồ) 179

Hình 107: Giao diện tạo trang phục 180

Hình 108: Giao diện xem gợi ý trang phục 181

Hình 109: Giao diện xem gợi ý trang phục (dựa trên tủ đồ) 182

Hình 110: Giao diện xem gợi ý trang phục (dựa trên hệ thống) 183

Hình 111: Giao diện xem thông tin cá nhân 184

Hình 112: Giao diện thay đổi thông tin cá nhân 185

Hình 113: Giao diện xem bài đăng trong cộng đồng 186

Hình 114: Giao diện tạo bài đăng cá nhân 187

Hình 115: Giao diện xem bài đăng cá nhân 188

Hình 116: Giao diện xóa bài đăng cá nhân 189

Hình 117: Giao diện chỉnh sửa bài đăng cá nhân 190

Hình 118: Giao diện xem biểu đồ thống kê 191

Hình 119: Giao diện phê duyệt bài đăng 192

Bảng 1: Danh sách câu hỏi xác định tông da 41

Bảng 2: Danh sách câu hỏi xác định độ tương phản sắc tố 41

Bảng 3: Bảng kết quả màu sắc cá nhân 42

Bảng 4: Công thức xác định hình dáng cơ thể 44

Bảng 5: Danh sách câu hỏi xác định phong cách thời trang 47

Bảng 6: Yêu cầu chức năng 49

Bảng 7: Mô tả Usecase “Đăng nhập” 57

Bảng 8: Mô tả Usecase “Đăng ký” 58

Bảng 9: Mô tả Usecase “Quên mật khẩu” 60

Bảng 10: Mô tả Usecase “Nhận dạng màu sắc cá nhân” 60

Bảng 11: Mô tả Usecase “Xem chi tiết về màu sắc cá nhân” 62

Bảng 12: Mô tả Usecase “Nhận dạng phong cách thời trang” 63

Bảng 13: Mô tả Usecase “Xem chi tiết về phong cách” 64

Bảng 14: Mô tả Usecase “Nhận dạng hình dáng cơ thể” 65

Bảng 15: Mô tả Usecase “Xem chi tiết về hình dáng cơ thể” 66

Bảng 16: Mô tả Usecase “Tìm kiếm phân loại” 68

Bảng 17: Mô tả Usecase “Xem các món đồ thuộc phân loại” 69

Bảng 18: Mô tả Usecase “Tìm kiếm món đồ” 70

Bảng 19: Mô tả Usecase “Lọc các món đồ dựa trên đặc điểm” 72

Bảng 20: Mô tả Usecase “Xem chi tiết về món đồ” 74

Bảng 21: Mô tả Usecase “Xem danh sách các món đồ có trong tủ đồ” 74

Bảng 22: Mô tả Usecase “Tải món đồ” 76

Bảng 23: Mô tả Usecase “Xóa món đồ” 77

Bảng 24: Mô tả Usecase “Xem danh sách các trang phục” 78

Bảng 25: Mô tả Usecase “Tạo trang phục” 79

Bảng 26: Mô tả Usecase “Xóa trang phục” 80

Bảng 27: Mô tả Usecase “Xem gợi ý trang phục” 81

Bảng 28: Mô tả Usecase “Thay đổi thông tin cá nhân” 82

Bảng 29: Mô tả Usecase “Xem bài đăng trong cộng đồng" 83

Bảng 30: Mô tả Usecase “Tạo bài đăng cá nhân" 85

Bảng 31: Mô tả Usecase “Xem bài đăng cá nhân" 86

Bảng 32: Mô tả Use Case “Xoá bài đăng cá nhân" 87

Bảng 33: Mô tả Usecase “Chỉnh sửa bài đăng cá nhân" 88

Bảng 34: Mô tả Usecase “Đăng nhập” 89

Bảng 35: Mô tả Usecase “Xem biểu đồ thống kê về các món đồ” 90

Bảng 36: Mô tả Usecase “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 91

Bảng 37: Mô tả Usecase “Phê duyệt bài đăng" 92

Bảng 38: Chi tiết bảng dữ liệu User 144

Bảng 39: Chi tiết bảng dữ liệu Token 145

Bảng 40: Chi tiết bảng dữ liệu Style Type 145

Bảng 41: Chi tiết Chi tiết bảng dữ liệu Seasonal Color 145

Bảng 42: Chi tiết bảng dữ liệu Body Shape 146

Bảng 43: Chi tiết bảng dữ liệu Undertone question 146

Bảng 44: Chi tiết bảng dữ liệu Contrast question 146

Bảng 45: Chi tiết bảng dữ liệu Style question 147

Bảng 46: Chi tiết bảng dữ liệu Item 147

Bảng 47: Chi tiết bảng dữ liệu User Item 148

Bảng 48: Chi tiết bảng dữ liệu Item Category 148

Bảng 49: Chi tiết bảng dữ liệu User Outfit 148

Bảng 50: Chi tiết bảng dữ liệu Outfit User Item 149

Bảng 51: Chi tiết bảng dữ liệu Reason 149

Bảng 52: Chi tiết bảng dữ liệu Post 149

Bảng 53: Mô tả giao điện đăng ký 150

Bảng 54: Mô tả giao diện đăng nhập 151

Bảng 55: Mô tả giao diện quên mật khẩu 152

Bảng 56: Mô tả giao diện đổi mật khẩu 153

Bảng 57: Mô tả giao diện trang chủ 154

Bảng 58: Mô tả giao diện chi tiết về màu sắc cá nhân 155

Bảng 59: Mô tả giao diện xem bảng màu 156

Bảng 60: Mô tả giao diện nhận dạng màu sắc cá nhân 157

Bảng 61: Mô tả giao diện kết quả màu sắc cá nhân 158

Bảng 62: Mô tả giao diện chi tiết phong cách cá nhân 159

Bảng 63: Mô tả giao diện nhận dạng phong cách cá nhân 160

Bảng 64: Mô tả giao diện chi tiết về hình dáng cơ thể 161

Bảng 65: Mô tả giao diện nhận dạng hình dáng cơ thể 162

Bảng 66: Mô tả giao diện kết quả hình dáng cơ thể 163

Bảng 67: Mô tả giao diện kết quả hình dáng cơ thể 164

Bảng 68: Mô tả giao diện tìm kiếm phân loại (có kết quả) 165

Bảng 69: Mô tả giao diện tìm kiếm phân loại (không kết quả) 166

Bảng 70: Mô tả giao diện danh sách các món đồ thuộc phân loại 167

Bảng 71: Mô tả giao diện chi tiết món đồ 168

Bảng 72: Mô tả giao diện tìm kiếm món đồ (có kết quả) 169

Bảng 73: Mô tả giao diện tìm kiếm món đồ (không kết quả) 170

Bảng 74: Mô tả giao diện lọc các món đồ dựa trên đặc điểm 171

Bảng 75: Mô tả giao diện tủ đồ (danh sách món đồ) 172

Bảng 76: Mô tả giao diện tủ đồ (danh sách món đồ) 173

Bảng 77: Mô tả giao diện chi tiết trang phục 174

Bảng 78: Mô tả giao diện xoá món đồ 175

Bảng 79: Mô tả giao diện xoá trang phục 176

Bảng 80: Mô tả giao diện tải món đồ (chọn hình ảnh) 177

Bảng 81: Mô tả giao diện tải món đồ (chọn phân loại) 178

Bảng 82: Mô tả giao diện tải món đồ (nhập tên món đồ) 179

Bảng 83: Mô tả giao diện tạo trang phục 180

Bảng 84: Mô tả giao diện xem gợi ý trang phục 181

Bảng 85: Mô tả giao diện xem gợi ý trang phục (dựa trên tủ đồ) 182

Bảng 86: Mô tả giao diện xem gợi ý trang phục (dựa trên hệ thống) 183

Bảng 87: Mô tả giao diện xem thông tin cá nhân 184

Bảng 88: Mô tả giao diện xem bài đăng trong cộng đồng 186

Bảng 89: Mô tả giao diện tạo bài đăng cá nhân 187

Bảng 90: Mô tả giao diện xem bài đăng cá nhân 188

Bảng 91: Mô tả giao diện xóa bài đăng cá nhân 189

Bảng 92: Mô tả giao diện chỉnh sửa bài đăng cá nhân 190

Bảng 93: Mô tả giao diện xem biểu đồ thống kê 191

Bảng 94: Mô tả giao diện phê duyệt bài đăng 192

Bảng 95: Lịch trình công việc 195

Bảng 97: Yêu cầu hệ điều hành 195

Bảng 98: Yêu cầu phần mềm 195

Bảng 99: Yêu cầu công cụ kiểm thử 196

1 LÝ DO CHỌN ĐỀ TÀI

Trong nhiều năm gần đây, lĩnh vực làm đẹp luôn luôn là một trong những ngành phát triển nhanh chóng và lợi nhuận cao Sự quan tâm của con người đối với việc chăm sóc bản thân và nâng cao ngoại hình ngày càng gia tăng Điều này tạo ra cơ hội lớn cho các ứng dụng di động cung cấp giải pháp trong lĩnh vực này Ứng dụng di động đã trở thành một phần không thể thiếu trong cuộc sống hàng ngày của chúng ta Việc sử dụng điện thoại thông minh để tìm kiếm thông tin, sản phẩm và dịch vụ là một phần tự nhiên của cuộc sống hiện đại Việc phát triển một ứng dụng di động về làm đẹp có thể tận dụng sự phổ biến này để đáp ứng nhu cầu của người tiêu dùng Ứng dụng di động có thể cung cấp một loạt các giải pháp về làm đẹp, bao gồm tư vấn về phong cách, mua sắm sản phẩm làm đẹp, hướng dẫn trang điểm, và nhiều tính năng khác Sự linh hoạt và tính tiện lợi của các ứng dụng di động có thể thu hút một lượng lớn người dùng và tiềm năng khách hàng Công nghệ ngày càng phát triển, cho phép việc tạo ra các ứng dụng di động có khả năng tùy chỉnh, tích hợp trí tuệ nhân tạo, thực tế ảo, và nhiều công nghệ khác để cung cấp trải nghiệm làm đẹp tốt hơn cho người dùng Sự kết hợp giữa công nghệ và làm đẹp có thể tạo ra những sản phẩm độc đáo và hấp dẫn

Thị trường làm đẹp luôn đòi hỏi sự đổi mới và cải tiến liên tục Với sự gia tăng của cơ hội kinh doanh trong lĩnh vực này, việc nghiên cứu và phát triển một ứng dụng di động My Stylist có thể đáp ứng nhu cầu của thị trường và cung cấp giải pháp hiệu quả Ứng dụng di động My Stylist hướng tới người dùng có nhu cầu chăm sóc và nâng cao vẻ đẹp cá nhân, đặc biệt là trong lĩnh vực thời trang, kiểu tóc, và trang điểm Với cuộc sống ngày càng bận rộn và áp lực, việc tìm kiếm, lựa chọn, và thử nghiệm những phong cách mới thường trở thành một thách thức đáng kể Nhiều người đã phải đối mặt với việc tốn thời gian và tiền bạc để tìm ra những trang phục, kiểu tóc, và trang điểm phù hợp với họ Ứng dụng My Stylist ra đời với mục tiêu quan trọng: giải quyết vấn đề này một cách đơn giản và hiệu quả Thay vì gian nan tìm hiểu về các xu hướng thời trang, phong cách, và phương pháp làm đẹp, người dùng có thể giải quyết vấn đề đó với một người

15 bạn đồng hành ảo – My Stylist Ứng dụng này sẽ phân tích các đặc điểm của cá nhân người dùng, bao gồm màu sắc cá nhân, hình dáng cơ thể, và phong cách riêng, từ đó đưa ra các gợi ý, giải pháp, và lựa chọn phù hợp nhất với họ Điều đặc biệt là My Stylist không phải là một công cụ quyết định cứng nhắc Thay vào đó, nó đóng vai trò của một người bạn đồng hành thông minh, hiểu rõ đặc điểm của người dùng Ứng dụng sẽ thúc đẩy sự sáng tạo và tự do trong việc tự thể hiện, không hề ràng buộc theo quy tắc cố định

Bên cạnh đó, ứng dụng My Stylist cũng giúp người dùng quản lý tủ đồ cá nhân một cách tiện lợi Bằng cách theo dõi các món đồ và sản phẩm làm đẹp mà họ đã sở hữu, người dùng có thể dễ dàng tạo ra những bộ trang phục và phong cách hoàn hảo mà họ có sẵn, từ đó tối ưu hóa giá trị của tủ đồ cá nhân

Trên hết, mục tiêu của ứng dụng My Stylist không chỉ đơn thuần là cung cấp các gợi ý và lựa chọn cho người dùng, mà còn là hỗ trợ họ hiểu rõ hơn về bản thân Điều này giúp người dùng thấy tự tin hơn trong việc thể hiện phong cách và sự cá nhân hóa của họ My Stylist không phải là một cỗ máy lạnh không tâm, mà là một người bạn thân thiết, đồng hành trên hành trình chăm sóc và tôn vinh vẻ đẹp cá nhân

2 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN Đóng góp kiến thức mới: Nghiên cứu về ứng dụng di động My Stylist trong lĩnh vực làm đẹp có thể mang lại những kiến thức mới về cách công nghệ di động có thể được áp dụng trong lĩnh vực làm đẹp Điều này có thể giúp mở rộng kiến thức về phát triển ứng dụng di động và sự kết hợp của chúng với ngành công nghiệp làm đẹp

Nghiên cứu thực nghiệm: Thông qua việc tạo ra một ứng dụng thực tế, đề tài này cung cấp cơ hội cho các thí nghiệm và nghiên cứu thực nghiệm về cách người dùng tương tác với ứng dụng và ảnh hưởng của nó đối với quy trình làm đẹp của họ

Phân tích thị trường và người dùng: Việc nghiên cứu về thị trường và người dùng trong lĩnh vực làm đẹp có thể cung cấp thông tin quý báu về thị trường tiềm năng, người tiêu dùng mục tiêu, và xu hướng tiêu dùng

Phát triển sản phẩm và dịch vụ: Đề tài này có thể dẫn đến việc phát triển một ứng dụng thực tế giúp người dùng tối ưu hóa trải nghiệm làm đẹp của họ, bao gồm việc tư

16 vấn, mua sắm sản phẩm, và nhiều tính năng khác Điều này có thể giúp nâng cao chất lượng cuộc sống của người dùng

Kinh doanh và tiềm năng lợi nhuận: Nếu ứng dụng My Stylist thành công, nó có thể tạo ra cơ hội kinh doanh và tiềm năng lợi nhuận lớn trong lĩnh vực làm đẹp và công nghệ di động

Tiện ích và tiết kiệm thời gian: Ứng dụng cung cấp tiện ích cho người dùng bằng cách giúp họ tiết kiệm thời gian và nỗ lực trong việc quản lý và nâng cao ngoại hình của họ

Tạo việc làm: Phát triển và quản lý một ứng dụng di động cần nguồn nhân lực, từ lập trình viên đến những người chăm sóc khách hàng Điều này có thể tạo ra cơ hội việc làm và phát triển nguồn nhân lực trong ngành công nghiệp công nghệ và làm đẹp

Phục vụ cho đồ án tốt nghiệp Công nghệ phần mềm Việc phân tích, thiết kế, và phát triển ứng dụng My Stylist là một phần quan trọng của công việc phát triển phần mềm Nghiên cứu này có thể giúp cải thiện kỹ thuật phát triển phần mềm, đặc biệt là trong ngữ cảnh của ứng dụng di động

Tối ưu hóa hiệu suất và tương tác người dùng: Công nghệ phần mềm đóng vai trò quan trọng trong việc tối ưu hóa hiệu suất của ứng dụng và cải thiện tương tác của người dùng Nghiên cứu này có thể liên quan đến việc tối ưu hóa mã nguồn, tối ưu hóa cơ sở dữ liệu, và thiết kế giao diện người dùng hiệu quả

Phân tích dữ liệu và thông tin: Trong quá trình nghiên cứu, có thể có sự sử dụng và phân tích dữ liệu liên quan đến tương tác người dùng và hành vi sử dụng ứng dụng Điều này có thể yêu cầu các kỹ thuật và công cụ phân tích dữ liệu, mà là một phần quan trọng của chuyên ngành công nghệ phần mềm

LƯỢC ĐỒ HOẠT ĐỘNG

Hình 46: Activity Diagram “Đăng nhập”

Hình 47: Activity Diagram “Đăng ký”

3.2.1.3 Activity Diagram “Quên mật khẩu”

Hình 48: Activity Diagram “Quên mật khẩu”

3.2.1.4 Activity Diagram “Nhận dạng màu sắc cá nhân”

Hình 49: Activity Diagram “Nhận dạng màu sắc cá nhân”

3.2.1.5 Activity Diagram “Xem chi tiết về màu sắc cá nhân”

Hình 50: Activity Diagram “Xem chi tiết về màu sắc cá nhân”

3.2.1.6.Activity Diagram “Nhận dạng phong cách”

Hình 51: Activity Diagram “Nhận dạng phong cách”

3.2.1.7 Activity Diagram “Xem chi tiết về phong cách”

Hình 52: Activity Diagram “Xem chi tiết về phong cách”

3.2.1.8 Activity Diagram “Nhận dạng hình dáng cơ thể”

Hình 53: Activity Diagram “Nhận dạng hình dáng cơ thể”

3.2.1.9 Activity Diagram “Xem chi tiết về hình dáng cơ thể”

Hình 54: Activity Diagram “Xem chi tiết về hình dáng cơ thể”

3.2.1.10 Activity Diagram “Tìm kiếm phân loại”

Hình 55: Activity Diagram “Tìm kiếm phân loại”

3.2.1.11 Activity Diagram “Xem các món đồ thuộc phân loại”

Hình 56: Activity Diagram “Xem các món đồ thuộc phân loại”

3.2.1.12 Activity Diagram “Tìm kiếm món đồ”

Hình 57: Activity Diagram “Tìm kiếm món đồ”

3.2.1.13 Activity Diagram “Lọc món đồ dựa trên đặc điểm”

Hình 58: Activity Diagram “Lọc món đồ dựa trên đặc điểm”

3.2.1.14 Activity Diagram “Xem chi tiết về món đồ”

Hình 59: Activity Diagram “Xem chi tiết về món đồ”

3.2.1.15 Activity Diagram “Xem danh sách các món đồ có trong tủ đồ”

Hình 60: Activity Diagram “Xem danh sách các món đồ có trong tủ đồ”

3.2.1.16 Activity Diagram “Tải món đồ”

Hình 61: Activity Diagram “Tải món đồ”

3.2.1.17 Activity Diagram “Xóa món đồ”

Hình 62: Activity Diagram “Xóa món đồ”

3.2.1.18 Activity Diagram “Xem danh sách các trang phục”

Hình 63: Activity Diagram “Xem danh sách các trang phục”

3.2.1.19 Activity Diagram “Tạo trang phục”

Hình 64: Activity Diagram “Tạo trang phục” 3.2.1.20 Activity Diagram “Xóa trang phục”

Hình 65: Activity Diagram “Xóa trang phục”

3.2.1.21 Activity Diagram “Xem gợi ý trang phục”

Hình 66: Activity Diagram “Xem gợi ý trang phục”

3.2.1.22 Activity Diagram “Thay đổi thông tin cá nhân”

Hình 67: Activity Diagram “Thay đổi thông tin cá nhân”

3.2.1.23 Activity Diagram “Xem bài đăng trong cộng đồng”

Hình 68: Activity Diagram “Xem bài đăng trong cộng đồng”

3.2.1.24 Activity Diagram “Tạo bài đăng cá nhân”

Hình 69: Activity Diagram “Tạo bài đăng cá nhân”

3.2.1.25 Activity Diagram “Xem bài đăng cá nhân”

Hình 70: Activity Diagram “Xem bài đăng cá nhân”

3.2.1.26 Activity Diagram “Xóa bài đăng cá nhân”

Hình 71: Activity Diagram “Xóa bài đăng cá nhân”

3.2.1.27 Activity Diagram “Chỉnh sửa bài đăng cá nhân”

Hình 72: Activity Diagram “Chỉnh sửa bài đăng cá nhân”

3.2.2 Phía quản trị viên (Admin)

3.2.2.1 Activity Diagram “Xem biểu đồ thống kê về các món đồ”

Hình 73: Activity Diagram “Xem biểu đồ thống kê về món đồ”

3.2.2.2 Activity Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng”

Hình 74: Activity Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng”

3.2.2.3 Activity Diagram “Phê duyệt bài đăng”

Hình 75: Activity Diagram “Phê duyệt bài đăng”

LƯỢC ĐỒ LỚP

THIẾT KẾ CƠ SỞ DỮ LIỆU

3.4.1 Chi tiết bảng dữ liệu

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

2 created_at Instant Thời gian tạo đối tượng

4 enabled Boolean Trạng thái tài khoản True - Hoạt động

5 name String Tên người dùng

6 password String Mật khẩu Được hash để bảo mật

7 roles String Quyền ROLE_USER -

Người dùng ROLE_ADMIN- Quản trị viên

8 body_shape_id Long Khóa ngoại

10 style_type_id Long Khóa ngoại

11 bust Float Số đo vòng ngực

11 high_hip Float Số đo hông trên

12 hip Float Số đo hông dưới

13 waist Float Số đo vòng eo

Bảng 38: Chi tiết bảng dữ liệu User 3.4.1.2 Token

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

2 blacklisted Boolean Trạng thái token

True - Hoạt động False - Bị khóa

3 expire_date Instant Thời hạn

4 token_string String Được hash để bảo mật

5 type Enum Kiểu token REFRESH

RESET_PASSWORD ONE_TIME_LOGIN

6 user_id Long Khóa ngoại

Bảng 39: Chi tiết bảng dữ liệu Token 3.4.1.3 Style Type

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

2 name String Tên của phong cách

Bảng 40: Chi tiết bảng dữ liệu Style Type 3.4.1.4 Seasonal Color

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

2 name String Tên của màu sắc cá nhân

4 color_palette String Bảng màu

Bảng 41: Chi tiết Chi tiết bảng dữ liệu Seasonal Color 3.4.1.5 Body Shape

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

2 name String Tên của kiểu cơ thể

Bảng 42: Chi tiết bảng dữ liệu Body Shape 3.4.1.6 Undertone question

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

3 cool_option String Đáp án cho cool

4 neutral_option String Đáp án cho neutral

5 warm_option String Đáp án cho warm

Bảng 43: Chi tiết bảng dữ liệu Undertone question 3.4.1.7 Contrast question

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

3 high_option String Đáp án cho high

4 low_option String Đáp án cho low

5 medium_option String Đáp án cho medium

Bảng 44: Chi tiết bảng dữ liệu Contrast question 3.4.1.8 Style question

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

3 classic_option String Đáp án cho classic

4 dramatic_option String Đáp án cho dramatic

5 elegant_option String Đáp án cho elegant

6 feminine_option String Đáp án cho feminine

7 natural_option String Đáp án cho natural

8 sexy_option String Đáp án cho sexy

Bảng 45: Chi tiết bảng dữ liệu Style question 3.4.1.9 Item

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

3 name String Tên của món đồ

4 category_id Long Khóa ngoại

5 body_shape_id Long Khóa ngoại

6 seasonal_color_id Long Khóa ngoại

7 style_type_id Long Khóa ngoại

8 reason_id Long Khoá ngoại

Bảng 46: Chi tiết bảng dữ liệu Item 3.4.1.10 User Item

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

3 name String Tên của món đồ người dùng

4 category_id Long Khóa ngoại

5 user_id Long Khóa ngoại

Bảng 47: Chi tiết bảng dữ liệu User Item 3.4.1.11 Item Category

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

2 name String Tên của phân loại

3 parent Long Danh mục cha

Bảng 48: Chi tiết bảng dữ liệu Item Category 3.4.1.12 User Outfit

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

2 user_id Long Khóa ngoại

Bảng 49: Chi tiết bảng dữ liệu User Outfit 3.4.1.13 Outfit User Item

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

1 outfit_id Long Thành phần của khóa chính, Khóa ngoại

2 user_item_id Long Thành phần của khóa chính, Khóa ngoại

Bảng 50: Chi tiết bảng dữ liệu Outfit User Item 3.4.1.14 Reason

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

2 description String Mô tả lý do

Bảng 51: Chi tiết bảng dữ liệu Reason 3.4.1.15 Post

STT Thuộc tính Kiểu Ý nghĩa Ghi chú

2 description String Mô tả lý do

3 image String Hình của bài đăng

4 created_at Date Ngày tạo

5 isAccepted Boolean True: được phê duyệt

False: không được phê duyệt

Bảng 52: Chi tiết bảng dữ liệu Post

THIẾT KẾ GIAO DIỆN

3.5.1 Giao diện phía người dùng (User)

Hình 77: Giao điện đăng ký

STT Phân loại Mô tả

5 Button Đăng ký tài khoản

Bảng 53: Mô tả giao điện đăng ký

Hình 78: Giao diện đăng nhập

STT Phân loại Mô tả

Bảng 54: Mô tả giao diện đăng nhập

3.5.1.3 Giao diện “Quên mật khẩu”

Hình 79: Giao diện quên mật khẩu

STT Phân loại Mô tả

3 Button Gửi code đến email

Bảng 55: Mô tả giao diện quên mật khẩu

Hình 80: Giao diện đổi mật khẩu

STT Phân loại Mô tả

Bảng 56: Mô tả giao diện đổi mật khẩu

Hình 81: Giao diện trang chủ

STT Phân loại Mô tả

2 Card Làm bài nhận điện (Màu sắc cá nhân, hình dáng cơ thể, phong cách thời trang)

3 Card Xem thông tin chi tiết (Màu sắc cá nhân, hình dáng cơ thể, phong cách thời trang)

Bảng 57: Mô tả giao diện trang chủ

3.5.1.6 Giao diện “Chi tiết về màu sắc cá nhân”

Hình 82: Giao diện về chi tiết màu sắc cá nhân

STT Phân loại Mô tả

1 Button Xem các món đồ phù hợp với màu sắc cá nhân

Bảng 58: Mô tả giao diện chi tiết về màu sắc cá nhân

Hình 83: Giao diện xem bảng màu

STT Phân loại Mô tả

Bảng 59: Mô tả giao diện xem bảng màu

3.5.1.7 Giao diện “Nhận dạng màu sắc cá nhân”

Hình 84: Giao diện nhận dạng màu sắc cá nhân

STT Phân loại Mô tả

1 Textarea Hiển thị câu hỏi

2 Textarea Hiển thị câu trả lời

3 Checkbox Tích chọn câu trả lời

4 Button Quay về câu hỏi trước

5 Button Chuyển đến câu hỏi tiếp theo

Bảng 60: Mô tả giao diện nhận dạng màu sắc cá nhân

Hình 85: Giao diện kết quả màu sắc cá nhân

STT Phân loại Mô tả

1 Card Hiển thị kết quả

2 Button Xem thông tin chi tiết về màu sắc cá nhân

3 Button Quay về trang chủ

Bảng 61: Mô tả giao diện kết quả màu sắc cá nhân

3.5.1.8 Giao diện “Chi tiết về phong cách cá nhân”

Hình 86: Giao diện chi tiết phong cách cá nhân

STT Phân loại Mô tả

1 Button Thu gọn/ đọc thêm mô tả

2 Button Xem các món đồ phù hợp với phong cách cá nhân

Bảng 62: Mô tả giao diện chi tiết phong cách cá nhân

3.5.1.9 Giao diện “Nhận dạng phong cách cá nhân”

Hình 87: Giao diện nhận dạng phong cách cá nhân

STT Phân loại Mô tả

1 Textarea Hiển thị câu hỏi

2 Textarea Hiển thị câu trả lời

3 Checkbox Tích chọn câu trả lời

4 Button Quay về câu hỏi trước

5 Button Chuyển đến câu hỏi tiếp theo

Bảng 63: Mô tả giao diện nhận dạng phong cách cá nhân

3.5.1.10 Giao diện “Chi tiết về hình dáng cơ thể”

Hình 88: Giao diện chi tiết về hình dáng cơ thể

STT Phân loại Mô tả

1 Button Thu gọn/ đọc thêm mô tả

2 Button Xem các món đồ phù hợp với hình dáng cơ thể

Bảng 64: Mô tả giao diện chi tiết về hình dáng cơ thể

3.5.1.11 Giao diện “Nhận dạng hình dáng cơ thể”

Hình 89: Giao diện nhận dạng hình dáng cơ thể

STT Phân loại Mô tả

1 Input Số đo vòng ngực

2 Input Số đo vòng eo

3 Input Số đo vòng hông trên

4 Input Số đo vòng hông dưới

5 Button Nhận diện hình dáng cơ thể

Bảng 65: Mô tả giao diện nhận dạng hình dáng cơ thể

Hình 90: Giao diện kết quả hình dáng cơ thể

STT Phân loại Mô tả

1 Card Hiển thị kết quả

2 Button Xem thông tin chi tiết về hình dáng cơ thể

3 Button Quay về trang chủ

Bảng 66: Mô tả giao diện kết quả hình dáng cơ thể

Hình 91: Giao diện phân loại

STT Phân loại Mô tả

Bảng 67: Mô tả giao diện kết quả hình dáng cơ thể

Hình 92: Giao diện tìm kiếm phân loại (có kết quả)

STT Phân loại Mô tả

Bảng 68: Mô tả giao diện tìm kiếm phân loại (có kết quả)

Hình 93: Giao diện tìm kiếm phân loại (không có kết quả)

STT Phân loại Mô tả

1 Image Hình ảnh khi không có kết quả

Bảng 69: Mô tả giao diện tìm kiếm phân loại (không kết quả)

3.5.1.13 Giao diện “Danh sách các món đồ thuộc phân loại”

Hình 94: Danh sách các món đồ thuộc phân loại

STT Phân loại Mô tả

Bảng 70: Mô tả giao diện danh sách các món đồ thuộc phân loại

Hình 95: Chi tiết món đồ

STT Phân loại Mô tả

1 Button Chuyển đến link mua hàng

Bảng 71: Mô tả giao diện chi tiết món đồ

3.5.1.14 Giao diện “Tìm kiếm món đồ”

Hình 96: Giao diện tìm kiếm món đồ (có kết quả)

STT Phân loại Mô tả

2 Card Các món đồ tìm kiếm được

Bảng 72: Mô tả giao diện tìm kiếm món đồ (có kết quả)

Hình 97: Giao diện tìm kiếm món đồ (không có kết quả)

STT Phân loại Mô tả

1 Image Hình ảnh khi không có kết quả

Bảng 73: Mô tả giao diện tìm kiếm món đồ (không kết quả)

3.5.1.15 Giao diện “Lọc các món đồ dựa trên đặc điểm”

Hình 98: Giao diện lọc các món đồ dựa trên đặc điểm

STT Phân loại Mô tả

1 Button Chọn màu sắc cá nhân

2 Button Chọn hình dáng cơ thể

3 Button Chọn phong cách cá nhân

Bảng 74: Mô tả giao diện lọc các món đồ dựa trên đặc điểm

Hình 99: Giao diện tủ đồ (danh sách món đồ)

STT Phân loại Mô tả

1 Card Món đồ trong tủ đồ

3 Button Chuyển trang giao diện thêm món đồ

Bảng 75: Mô tả giao diện tủ đồ (danh sách món đồ)

Hình 100: Giao diện tủ đồ (danh sách trang phục)

STT Phân loại Mô tả

1 Card Trang phục trong tủ đồ

3 Button Chuyển trang giao diện thêm trang phục

Bảng 76: Mô tả giao diện tủ đồ (danh sách món đồ)

Hình 101: Giao diện chi tiết trang phục

STT Phân loại Mô tả

1 Card Món đồ trong trang phục

Bảng 77: Mô tả giao diện chi tiết trang phục

3.5.1.17 Giao diện “Xoá món đồ”

Hình 102: Giao diện xoá món đồ

STT Phân loại Mô tả

2 Button Hủy xóa món đồ

Bảng 78: Mô tả giao diện xoá món đồ

3.5.1.18 Giao diện “Xoá trang phục”

Hình 103: Giao diện xoá trang phục

STT Phân loại Mô tả

2 Button Hủy xóa trang phục

Bảng 79: Mô tả giao diện xoá trang phục

3.5.1.19 Giao diện “Tải món đồ”

Hình 104: Giao diện tải món đồ (chọn hình ảnh)

STT Phân loại Mô tả

1 Button Chọn phương thức chụp ảnh

2 Button Chọn phương thức lấy ảnh trong thư viện

3 Image Hiển thị hình ảnh

4 Button Chuyển sang bước tiếp theo

Bảng 80: Mô tả giao diện tải món đồ (chọn hình ảnh)

Hình 105: Giao diện tải món đồ (chọn phân loại)

STT Phân loại Mô tả

1 Card Phân loại con cho món đồ

2 Button Chuyển sang bước tiếp theo

Bảng 81: Mô tả giao diện tải món đồ (chọn phân loại)

Hình 106: Giao diện tải món đồ (nhập tên món đồ)

STT Phân loại Mô tả

1 Input Nhập tên món đồ

Bảng 82: Mô tả giao diện tải món đồ (nhập tên món đồ)

3.5.1.20 Giao diện “Tạo trang phục”

Hình 107: Giao diện tạo trang phục

STT Phân loại Mô tả

1 Button Chọn món đồ trong trang phục

Bảng 83: Mô tả giao diện tạo trang phục

3.5.1.21 Giao diện “Xem gợi ý trang phục”

Hình 108: Giao diện xem gợi ý trang phục

STT Phân loại Mô tả

1 Button Chuyển đến giao diện gợi ý trang phục dựa trên tủ đồ

2 Button Chuyển đến giao diện gợi ý trang phục từ hệ thống

Bảng 84: Mô tả giao diện xem gợi ý trang phục

Hình 109: Giao diện xem gợi ý trang phục (dựa trên tủ đồ)

STT Phân loại Mô tả

1 Button Lưu trang phục vào tủ đồ

2 Button Xem gợi ý trang phục khác

Bảng 85: Mô tả giao diện xem gợi ý trang phục (dựa trên tủ đồ)

Hình 110: Giao diện xem gợi ý trang phục (dựa trên hệ thống)

STT Phân loại Mô tả

1 Button Lưu trang phục vào tủ đồ

2 Button Xem gợi ý trang phục khác

Bảng 86: Mô tả giao diện xem gợi ý trang phục (dựa trên hệ thống)

3.5.1.22 Giao diện “Xem thông tin cá nhân”

Hình 111: Giao diện xem thông tin cá nhân

STT Phân loại Mô tả

1 Button Chuyển đến giao diện cập nhật thông tin cá nhân

3 Button Chuyển đến giao diện xem biểu đồ thống kê

Bảng 87: Mô tả giao diện xem thông tin cá nhân

3.5.1.23 Giao diện “Thay đổi thông tin cá nhân”

Hình 112: Giao diện thay đổi thông tin cá nhân

STT Phân loại Mô tả

1 Select Box Hình dáng cơ thể

2 Select Box Màu sắc cá nhân

2 Select Box Phong cách cá nhân

3 Input Số đo vòng ngực

4 Input Số đo vòng eo

5 Input Số đo hông trên

6 Input Số đo hông dưới

Bảng 77: Mô tả giao diện xem thông tin cá nhân 3.2.1.24 Giao diện “Xem bài đăng trong cộng đồng”

Hình 113: Giao diện xem bài đăng trong cộng đồng

STT Phân loại Mô tả

1 Card Bài đăng cộng đồng

Bảng 88: Mô tả giao diện xem bài đăng trong cộng đồng

3.2.1.25 Giao diện “Tạo bài đăng cá nhân”

Hình 114: Giao diện tạo bài đăng cá nhân

STT Phân loại Mô tả

1 Button Chọn phương thức chụp ảnh

2 Button Chọn phương thức lấy ảnh trong thư viện

3 Image Hiển thị hình ảnh

4 Button Chuyển sang bước tiếp theo

Bảng 89: Mô tả giao diện tạo bài đăng cá nhân

3.2.1.26 Giao diện “Xem bài đăng cá nhân”

Hình 115: Giao diện xem bài đăng cá nhân

STT Phân loại Mô tả

1 Button Chỉnh sửa bài đăng

Bảng 90: Mô tả giao diện xem bài đăng cá nhân

3.2.1.27 Giao diện “Xóa bài đăng cá nhân”

Hình 116: Giao diện xóa bài đăng cá nhân

STT Phân loại Mô tả

2 Button Hủy xóa bài đăng

Bảng 91: Mô tả giao diện xóa bài đăng cá nhân

3.2.1.28 Giao diện “Chỉnh sửa bài đăng cá nhân”

Hình 117: Giao diện chỉnh sửa bài đăng cá nhân

STT Phân loại Mô tả

1 Input Nhập mô tả mới

2 Button Thay đổi bài đăng

Bảng 92: Mô tả giao diện chỉnh sửa bài đăng cá nhân

3.5.2 Giao diện phía quản trị viên (Admin)

3.5.2.1 Giao diện “Xem biểu đồ thống kê”

Hình 118: Giao diện xem biểu đồ thống kê

STT Phân loại Mô tả

1 Component Biểu đồ thống kê về các món đồ

2 Component Biểu đồ thống kê về lý do người dùng sử dụng ứng dụng

Bảng 93: Mô tả giao diện xem biểu đồ thống kê

3.5.2.2 Giao diện “Phê duyệt bài đăng”

Hình 119: Giao diện phê duyệt bài đăng

STT Phân loại Mô tả

1 Button Phê duyệt bài đăng

Bảng 94: Mô tả giao diện phê duyệt bài đăng

CÀI ĐẶT VÀ KIỂM THỬ

KIỂM THỬ

STT Thời gian Công việc Ghi chú

- Thiết kế usecase và mô hình hóa yêu cầu

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

- Tìm hiểu về Spring Security và cơ chế xác thực bằng Json Web Token

3 31/03/2024 – 08/04/2024 - Tìm hiểu về React Native

- Thiết kế giao diện trên Figma

4 08/04/2024 – 15/05/2024 - Xây dựng các API dựa trên đặc tả yêu cầu

- Hiện thực các giao diện trên Figma bằng React Native

- Kết nối backend, mobile, cơ sở dữ liệu

5 08/04/2024 – 15/05/2024 - Kiểm thử chương trình, sửa lỗi

6 08/04/2024 – 19/05/2024 - Viết và hoàn thiện báo cáo

Người viết đề cương Ý kiến của giáo viên hướng dẫn

(ký và ghi rõ họ tên)

LỜI CẢM ƠN 1 ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP 2

1 LÝ DO CHỌN ĐỀ TÀI 14

2 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN 15

CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 18

1.1 KIẾN TRÚC CHUNG CỦA HỆ THỐNG 18

CHƯƠNG 2: MÔ HÌNH HÓA YÊU CẦU 48

2.2 MÔ HÌNH HÓA YÊU CẦU 52

CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 93

3.4 THIẾT KẾ CƠ SỞ DỮ LIỆU 143

CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 193

Hình 1: Kiến trúc chung của hệ thống 18

Hình 2: Luồng xử lý Token Based Authentication 19

Hình 3: Luồng xử lý yêu cầu Refresh Token khi Access Token hết hạn 20

Hình 4: Hình logo Spring Boot 25

Hình 5: Cấu trúc Json Web Token 29

Hình 7: Hình logo React Native 34

Hình 8: Hình kiến trúc của Zustand 36

Hình 10: Hình mô tả 4 nhóm màu 39

Hình 11: Lược đồ usecase về phía người dùng 52

Hình 12: Lược đồ usecase chức năng khám phá đặc điểm cá nhân 53

Hình 13: Lược đồ usecase chức năng tra cứu phân loại 54

Hình 14: Quản lý bài đăng 54

Hình 15: Lược đồ usecase chức năng quản lý tủ đồ 55

Hình 16: Lược đồ usecase về phía quản trị viên 55

Hình 17: Sequence Diagram “Đăng nhập” 93

Hình 18: Sequence Diagram “Đăng ký” 94

Hình 19: Sequence Diagram “Quên mật khẩu” 95

Hình 20: Sequence Diagram “Nhận dạng màu sắc cá nhân” 95

Hình 21: Sequence Diagram “Xem chi tiết về màu sắc cá nhân” 96

Hình 22: Sequence Diagram “Nhận dạng phong cách” 96

Hình 23: Sequence Diagram “Xem chi tiết về phong cách” 97

Hình 24: Sequence Diagram “Nhận dạng hình dáng cơ thể” 98

Hình 25: Sequence Diagram “Tìm kiếm phân loại” 99

Hình 26: Sequence Diagram “Xem các món đồ thuộc phân loại” 100

Hình 27: Sequence Diagram “Tìm kiếm món đồ” 101

Hình 28: Sequence Diagram “Lọc món đồ dựa trên đặc điểm” 101

Hình 29: Sequence Diagram “Xem chi tiết về món đồ” 102

Hình 30: Sequence Diagram “Xem danh sách các món đồ có trong tủ đồ” 103

Hình 31: Sequence Diagram “Tải món đồ” 104

Hình 32: Sequence Diagram “Xóa món đồ” 105

Hình 33: Sequence Diagram “Xem danh sách các trang phục” 105

Hình 34: Sequence Diagram “Xóa trang phục” 106

Hình 35: Sequence Diagram “Tạo trang phục” 107

Hình 36: Sequence Diagram “Xem gợi ý trang phục” 108

Hình 37: Sequence Diagram “Thay đổi thông tin cá nhân” 109

Hình 38: Sequence Diagram “Xem bài đăng trong cộng đồng” 110

Hình 39: Sequence Diagram “Tạo bài đăng cá nhân” 111

Hình 40: Sequence Diagram “Xem bài đăng cá nhân” 112

Hình 41: Sequence Diagram “Xóa bài đăng cá nhân” 113

Hình 42: Sequence Diagram “Chỉnh sửa bài đăng cá nhân” 114

Hình 43: Sequence Diagram “Xem biểu đồ thống kê về các món đồ” 114

Hình 44: Sequence Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 115

Hình 45: Sequence Diagram “Phê duyệt bài đăng” 116

Hình 46: Activity Diagram “Đăng nhập” 117

Hình 47: Activity Diagram “Đăng ký” 118

Hình 48: Activity Diagram “Quên mật khẩu” 119

Hình 49: Activity Diagram “Nhận dạng màu sắc cá nhân” 120

Hình 50: Activity Diagram “Xem chi tiết về màu sắc cá nhân” 121

Hình 51: Activity Diagram “Nhận dạng phong cách” 122

Hình 52: Activity Diagram “Xem chi tiết về phong cách” 123

Hình 53: Activity Diagram “Nhận dạng hình dáng cơ thể” 124

Hình 54: Activity Diagram “Xem chi tiết về hình dáng cơ thể” 125

Hình 55: Activity Diagram “Tìm kiếm phân loại” 126

Hình 56: Activity Diagram “Xem các món đồ thuộc phân loại” 127

Hình 57: Activity Diagram “Tìm kiếm món đồ” 128

Hình 58: Activity Diagram “Lọc món đồ dựa trên đặc điểm” 129

Hình 59: Activity Diagram “Xem chi tiết về món đồ” 130

Hình 60: Activity Diagram “Xem danh sách các món đồ có trong tủ đồ” 131

Hình 61: Activity Diagram “Tải món đồ” 132

Hình 62: Activity Diagram “Xóa món đồ” 133

Hình 63: Activity Diagram “Xem danh sách các trang phục” 133

Hình 64: Activity Diagram “Tạo trang phục” 134

Hình 65: Activity Diagram “Xóa trang phục” 135

Hình 66: Activity Diagram “Xem gợi ý trang phục” 135

Hình 67: Activity Diagram “Thay đổi thông tin cá nhân” 136

Hình 68: Activity Diagram “Xem bài đăng trong cộng đồng” 137

Hình 69: Activity Diagram “Tạo bài đăng cá nhân” 138

Hình 70: Activity Diagram “Xem bài đăng cá nhân” 139

Hình 71: Activity Diagram “Xóa bài đăng cá nhân” 139

Hình 72: Activity Diagram “Chỉnh sửa bài đăng cá nhân” 140

Hình 73: Activity Diagram “Xem biểu đồ thống kê về món đồ” 141

Hình 74: Activity Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 141

Hình 75: Activity Diagram “Phê duyệt bài đăng” 142

Hình 77: Giao điện đăng ký 150

Hình 78: Giao diện đăng nhập 151

Hình 79: Giao diện quên mật khẩu 152

Hình 80: Giao diện đổi mật khẩu 153

Hình 81: Giao diện trang chủ 154

Hình 82: Giao diện về chi tiết màu sắc cá nhân 155

Hình 83: Giao diện xem bảng màu 156

Hình 84: Giao diện nhận dạng màu sắc cá nhân 157

Hình 85: Giao diện kết quả màu sắc cá nhân 158

Hình 86: Giao diện chi tiết phong cách cá nhân 159

Hình 87: Giao diện nhận dạng phong cách cá nhân 160

Hình 88: Giao diện chi tiết về hình dáng cơ thể 161

Hình 89: Giao diện nhận dạng hình dáng cơ thể 162

Hình 90: Giao diện kết quả hình dáng cơ thể 163

Hình 91: Giao diện phân loại 164

Hình 92: Giao diện tìm kiếm phân loại (có kết quả) 165

Hình 93: Giao diện tìm kiếm phân loại (không có kết quả) 166

Hình 94: Danh sách các món đồ thuộc phân loại 167

Hình 95: Chi tiết món đồ 168

Hình 96: Giao diện tìm kiếm món đồ (có kết quả) 169

Hình 97: Giao diện tìm kiếm món đồ (không có kết quả) 170

Hình 98: Giao diện lọc các món đồ dựa trên đặc điểm 171

Hình 99: Giao diện tủ đồ (danh sách món đồ) 172

Hình 100: Giao diện tủ đồ (danh sách trang phục) 173

Hình 101: Giao diện chi tiết trang phục 174

Hình 102: Giao diện xoá món đồ 175

Hình 103: Giao diện xoá trang phục 176

Hình 104: Giao diện tải món đồ (chọn hình ảnh) 177

Hình 105: Giao diện tải món đồ (chọn phân loại) 178

Hình 106: Giao diện tải món đồ (nhập tên món đồ) 179

Hình 107: Giao diện tạo trang phục 180

Hình 108: Giao diện xem gợi ý trang phục 181

Hình 109: Giao diện xem gợi ý trang phục (dựa trên tủ đồ) 182

Hình 110: Giao diện xem gợi ý trang phục (dựa trên hệ thống) 183

Hình 111: Giao diện xem thông tin cá nhân 184

Hình 112: Giao diện thay đổi thông tin cá nhân 185

Hình 113: Giao diện xem bài đăng trong cộng đồng 186

Hình 114: Giao diện tạo bài đăng cá nhân 187

Hình 115: Giao diện xem bài đăng cá nhân 188

Hình 116: Giao diện xóa bài đăng cá nhân 189

Hình 117: Giao diện chỉnh sửa bài đăng cá nhân 190

Hình 118: Giao diện xem biểu đồ thống kê 191

Hình 119: Giao diện phê duyệt bài đăng 192

Bảng 1: Danh sách câu hỏi xác định tông da 41

Bảng 2: Danh sách câu hỏi xác định độ tương phản sắc tố 41

Bảng 3: Bảng kết quả màu sắc cá nhân 42

Bảng 4: Công thức xác định hình dáng cơ thể 44

Bảng 5: Danh sách câu hỏi xác định phong cách thời trang 47

Bảng 6: Yêu cầu chức năng 49

Bảng 7: Mô tả Usecase “Đăng nhập” 57

Bảng 8: Mô tả Usecase “Đăng ký” 58

Bảng 9: Mô tả Usecase “Quên mật khẩu” 60

Bảng 10: Mô tả Usecase “Nhận dạng màu sắc cá nhân” 60

Bảng 11: Mô tả Usecase “Xem chi tiết về màu sắc cá nhân” 62

Bảng 12: Mô tả Usecase “Nhận dạng phong cách thời trang” 63

Bảng 13: Mô tả Usecase “Xem chi tiết về phong cách” 64

Bảng 14: Mô tả Usecase “Nhận dạng hình dáng cơ thể” 65

Bảng 15: Mô tả Usecase “Xem chi tiết về hình dáng cơ thể” 66

Bảng 16: Mô tả Usecase “Tìm kiếm phân loại” 68

Bảng 17: Mô tả Usecase “Xem các món đồ thuộc phân loại” 69

Bảng 18: Mô tả Usecase “Tìm kiếm món đồ” 70

Bảng 19: Mô tả Usecase “Lọc các món đồ dựa trên đặc điểm” 72

Bảng 20: Mô tả Usecase “Xem chi tiết về món đồ” 74

Bảng 21: Mô tả Usecase “Xem danh sách các món đồ có trong tủ đồ” 74

Bảng 22: Mô tả Usecase “Tải món đồ” 76

Bảng 23: Mô tả Usecase “Xóa món đồ” 77

Bảng 24: Mô tả Usecase “Xem danh sách các trang phục” 78

Bảng 25: Mô tả Usecase “Tạo trang phục” 79

Bảng 26: Mô tả Usecase “Xóa trang phục” 80

Bảng 27: Mô tả Usecase “Xem gợi ý trang phục” 81

Bảng 28: Mô tả Usecase “Thay đổi thông tin cá nhân” 82

Bảng 29: Mô tả Usecase “Xem bài đăng trong cộng đồng" 83

Bảng 30: Mô tả Usecase “Tạo bài đăng cá nhân" 85

Bảng 31: Mô tả Usecase “Xem bài đăng cá nhân" 86

Bảng 32: Mô tả Use Case “Xoá bài đăng cá nhân" 87

Bảng 33: Mô tả Usecase “Chỉnh sửa bài đăng cá nhân" 88

Bảng 34: Mô tả Usecase “Đăng nhập” 89

Bảng 35: Mô tả Usecase “Xem biểu đồ thống kê về các món đồ” 90

Bảng 36: Mô tả Usecase “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 91

Bảng 37: Mô tả Usecase “Phê duyệt bài đăng" 92

Bảng 38: Chi tiết bảng dữ liệu User 144

Bảng 39: Chi tiết bảng dữ liệu Token 145

Bảng 40: Chi tiết bảng dữ liệu Style Type 145

Bảng 41: Chi tiết Chi tiết bảng dữ liệu Seasonal Color 145

Bảng 42: Chi tiết bảng dữ liệu Body Shape 146

Bảng 43: Chi tiết bảng dữ liệu Undertone question 146

Bảng 44: Chi tiết bảng dữ liệu Contrast question 146

Bảng 45: Chi tiết bảng dữ liệu Style question 147

Bảng 46: Chi tiết bảng dữ liệu Item 147

Bảng 47: Chi tiết bảng dữ liệu User Item 148

Bảng 48: Chi tiết bảng dữ liệu Item Category 148

Bảng 49: Chi tiết bảng dữ liệu User Outfit 148

Bảng 50: Chi tiết bảng dữ liệu Outfit User Item 149

Bảng 51: Chi tiết bảng dữ liệu Reason 149

Bảng 52: Chi tiết bảng dữ liệu Post 149

Bảng 53: Mô tả giao điện đăng ký 150

Bảng 54: Mô tả giao diện đăng nhập 151

Bảng 55: Mô tả giao diện quên mật khẩu 152

Bảng 56: Mô tả giao diện đổi mật khẩu 153

Bảng 57: Mô tả giao diện trang chủ 154

Bảng 58: Mô tả giao diện chi tiết về màu sắc cá nhân 155

Bảng 59: Mô tả giao diện xem bảng màu 156

Bảng 60: Mô tả giao diện nhận dạng màu sắc cá nhân 157

Bảng 61: Mô tả giao diện kết quả màu sắc cá nhân 158

Bảng 62: Mô tả giao diện chi tiết phong cách cá nhân 159

Bảng 63: Mô tả giao diện nhận dạng phong cách cá nhân 160

Bảng 64: Mô tả giao diện chi tiết về hình dáng cơ thể 161

Bảng 65: Mô tả giao diện nhận dạng hình dáng cơ thể 162

Bảng 66: Mô tả giao diện kết quả hình dáng cơ thể 163

Bảng 67: Mô tả giao diện kết quả hình dáng cơ thể 164

Bảng 68: Mô tả giao diện tìm kiếm phân loại (có kết quả) 165

Bảng 69: Mô tả giao diện tìm kiếm phân loại (không kết quả) 166

Bảng 70: Mô tả giao diện danh sách các món đồ thuộc phân loại 167

Bảng 71: Mô tả giao diện chi tiết món đồ 168

Bảng 72: Mô tả giao diện tìm kiếm món đồ (có kết quả) 169

Bảng 73: Mô tả giao diện tìm kiếm món đồ (không kết quả) 170

Bảng 74: Mô tả giao diện lọc các món đồ dựa trên đặc điểm 171

Bảng 75: Mô tả giao diện tủ đồ (danh sách món đồ) 172

Bảng 76: Mô tả giao diện tủ đồ (danh sách món đồ) 173

Bảng 77: Mô tả giao diện chi tiết trang phục 174

Bảng 78: Mô tả giao diện xoá món đồ 175

Bảng 79: Mô tả giao diện xoá trang phục 176

Bảng 80: Mô tả giao diện tải món đồ (chọn hình ảnh) 177

Bảng 81: Mô tả giao diện tải món đồ (chọn phân loại) 178

Bảng 82: Mô tả giao diện tải món đồ (nhập tên món đồ) 179

Bảng 83: Mô tả giao diện tạo trang phục 180

Bảng 84: Mô tả giao diện xem gợi ý trang phục 181

Bảng 85: Mô tả giao diện xem gợi ý trang phục (dựa trên tủ đồ) 182

Bảng 86: Mô tả giao diện xem gợi ý trang phục (dựa trên hệ thống) 183

Bảng 87: Mô tả giao diện xem thông tin cá nhân 184

Bảng 88: Mô tả giao diện xem bài đăng trong cộng đồng 186

Bảng 89: Mô tả giao diện tạo bài đăng cá nhân 187

Bảng 90: Mô tả giao diện xem bài đăng cá nhân 188

Bảng 91: Mô tả giao diện xóa bài đăng cá nhân 189

Bảng 92: Mô tả giao diện chỉnh sửa bài đăng cá nhân 190

Bảng 93: Mô tả giao diện xem biểu đồ thống kê 191

Bảng 94: Mô tả giao diện phê duyệt bài đăng 192

Bảng 95: Lịch trình công việc 195

Bảng 97: Yêu cầu hệ điều hành 195

Bảng 98: Yêu cầu phần mềm 195

Bảng 99: Yêu cầu công cụ kiểm thử 196

1 LÝ DO CHỌN ĐỀ TÀI

Trong nhiều năm gần đây, lĩnh vực làm đẹp luôn luôn là một trong những ngành phát triển nhanh chóng và lợi nhuận cao Sự quan tâm của con người đối với việc chăm sóc bản thân và nâng cao ngoại hình ngày càng gia tăng Điều này tạo ra cơ hội lớn cho các ứng dụng di động cung cấp giải pháp trong lĩnh vực này Ứng dụng di động đã trở thành một phần không thể thiếu trong cuộc sống hàng ngày của chúng ta Việc sử dụng điện thoại thông minh để tìm kiếm thông tin, sản phẩm và dịch vụ là một phần tự nhiên của cuộc sống hiện đại Việc phát triển một ứng dụng di động về làm đẹp có thể tận dụng sự phổ biến này để đáp ứng nhu cầu của người tiêu dùng Ứng dụng di động có thể cung cấp một loạt các giải pháp về làm đẹp, bao gồm tư vấn về phong cách, mua sắm sản phẩm làm đẹp, hướng dẫn trang điểm, và nhiều tính năng khác Sự linh hoạt và tính tiện lợi của các ứng dụng di động có thể thu hút một lượng lớn người dùng và tiềm năng khách hàng Công nghệ ngày càng phát triển, cho phép việc tạo ra các ứng dụng di động có khả năng tùy chỉnh, tích hợp trí tuệ nhân tạo, thực tế ảo, và nhiều công nghệ khác để cung cấp trải nghiệm làm đẹp tốt hơn cho người dùng Sự kết hợp giữa công nghệ và làm đẹp có thể tạo ra những sản phẩm độc đáo và hấp dẫn

Thị trường làm đẹp luôn đòi hỏi sự đổi mới và cải tiến liên tục Với sự gia tăng của cơ hội kinh doanh trong lĩnh vực này, việc nghiên cứu và phát triển một ứng dụng di động My Stylist có thể đáp ứng nhu cầu của thị trường và cung cấp giải pháp hiệu quả Ứng dụng di động My Stylist hướng tới người dùng có nhu cầu chăm sóc và nâng cao vẻ đẹp cá nhân, đặc biệt là trong lĩnh vực thời trang, kiểu tóc, và trang điểm Với cuộc sống ngày càng bận rộn và áp lực, việc tìm kiếm, lựa chọn, và thử nghiệm những phong cách mới thường trở thành một thách thức đáng kể Nhiều người đã phải đối mặt với việc tốn thời gian và tiền bạc để tìm ra những trang phục, kiểu tóc, và trang điểm phù hợp với họ Ứng dụng My Stylist ra đời với mục tiêu quan trọng: giải quyết vấn đề này một cách đơn giản và hiệu quả Thay vì gian nan tìm hiểu về các xu hướng thời trang, phong cách, và phương pháp làm đẹp, người dùng có thể giải quyết vấn đề đó với một người

15 bạn đồng hành ảo – My Stylist Ứng dụng này sẽ phân tích các đặc điểm của cá nhân người dùng, bao gồm màu sắc cá nhân, hình dáng cơ thể, và phong cách riêng, từ đó đưa ra các gợi ý, giải pháp, và lựa chọn phù hợp nhất với họ Điều đặc biệt là My Stylist không phải là một công cụ quyết định cứng nhắc Thay vào đó, nó đóng vai trò của một người bạn đồng hành thông minh, hiểu rõ đặc điểm của người dùng Ứng dụng sẽ thúc đẩy sự sáng tạo và tự do trong việc tự thể hiện, không hề ràng buộc theo quy tắc cố định

Bên cạnh đó, ứng dụng My Stylist cũng giúp người dùng quản lý tủ đồ cá nhân một cách tiện lợi Bằng cách theo dõi các món đồ và sản phẩm làm đẹp mà họ đã sở hữu, người dùng có thể dễ dàng tạo ra những bộ trang phục và phong cách hoàn hảo mà họ có sẵn, từ đó tối ưu hóa giá trị của tủ đồ cá nhân

Trên hết, mục tiêu của ứng dụng My Stylist không chỉ đơn thuần là cung cấp các gợi ý và lựa chọn cho người dùng, mà còn là hỗ trợ họ hiểu rõ hơn về bản thân Điều này giúp người dùng thấy tự tin hơn trong việc thể hiện phong cách và sự cá nhân hóa của họ My Stylist không phải là một cỗ máy lạnh không tâm, mà là một người bạn thân thiết, đồng hành trên hành trình chăm sóc và tôn vinh vẻ đẹp cá nhân

2 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN Đóng góp kiến thức mới: Nghiên cứu về ứng dụng di động My Stylist trong lĩnh vực làm đẹp có thể mang lại những kiến thức mới về cách công nghệ di động có thể được áp dụng trong lĩnh vực làm đẹp Điều này có thể giúp mở rộng kiến thức về phát triển ứng dụng di động và sự kết hợp của chúng với ngành công nghiệp làm đẹp

Nghiên cứu thực nghiệm: Thông qua việc tạo ra một ứng dụng thực tế, đề tài này cung cấp cơ hội cho các thí nghiệm và nghiên cứu thực nghiệm về cách người dùng tương tác với ứng dụng và ảnh hưởng của nó đối với quy trình làm đẹp của họ

Phân tích thị trường và người dùng: Việc nghiên cứu về thị trường và người dùng trong lĩnh vực làm đẹp có thể cung cấp thông tin quý báu về thị trường tiềm năng, người tiêu dùng mục tiêu, và xu hướng tiêu dùng

Phát triển sản phẩm và dịch vụ: Đề tài này có thể dẫn đến việc phát triển một ứng dụng thực tế giúp người dùng tối ưu hóa trải nghiệm làm đẹp của họ, bao gồm việc tư

16 vấn, mua sắm sản phẩm, và nhiều tính năng khác Điều này có thể giúp nâng cao chất lượng cuộc sống của người dùng

Kinh doanh và tiềm năng lợi nhuận: Nếu ứng dụng My Stylist thành công, nó có thể tạo ra cơ hội kinh doanh và tiềm năng lợi nhuận lớn trong lĩnh vực làm đẹp và công nghệ di động

Tiện ích và tiết kiệm thời gian: Ứng dụng cung cấp tiện ích cho người dùng bằng cách giúp họ tiết kiệm thời gian và nỗ lực trong việc quản lý và nâng cao ngoại hình của họ

Tạo việc làm: Phát triển và quản lý một ứng dụng di động cần nguồn nhân lực, từ lập trình viên đến những người chăm sóc khách hàng Điều này có thể tạo ra cơ hội việc làm và phát triển nguồn nhân lực trong ngành công nghiệp công nghệ và làm đẹp

Phục vụ cho đồ án tốt nghiệp Công nghệ phần mềm Việc phân tích, thiết kế, và phát triển ứng dụng My Stylist là một phần quan trọng của công việc phát triển phần mềm Nghiên cứu này có thể giúp cải thiện kỹ thuật phát triển phần mềm, đặc biệt là trong ngữ cảnh của ứng dụng di động

Tối ưu hóa hiệu suất và tương tác người dùng: Công nghệ phần mềm đóng vai trò quan trọng trong việc tối ưu hóa hiệu suất của ứng dụng và cải thiện tương tác của người dùng Nghiên cứu này có thể liên quan đến việc tối ưu hóa mã nguồn, tối ưu hóa cơ sở dữ liệu, và thiết kế giao diện người dùng hiệu quả

Phân tích dữ liệu và thông tin: Trong quá trình nghiên cứu, có thể có sự sử dụng và phân tích dữ liệu liên quan đến tương tác người dùng và hành vi sử dụng ứng dụng Điều này có thể yêu cầu các kỹ thuật và công cụ phân tích dữ liệu, mà là một phần quan trọng của chuyên ngành công nghệ phần mềm

ƯU ĐIỂM

4 Đề nghị cho bảo vệ hay không?

Tp Hồ Chí Minh, ngày tháng năm 2024

(Ký & ghi rõ họ tên) ĐH SƯ PHẠM KỸ THUẬT TP.HCM

CỘNG HOÀ XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc Độc lập – Tự do – Hạnh Phúc

PHIẾU NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN

Họ và tên Sinh viên: Dư Mỹ Duyên MSSV: 20110201

Ngành: Công nghệ Thông tin

Tên đề tài: Xây dựng ứng dụng di động My Stylist cung cấp các giải pháp về lĩnh vực làm đẹp

Họ và tên Giáo viên phản biện: ThS Nguyễn Thủy An

1 Về nội dung đề tài & khối lượng thực hiện:

4 Đề nghị cho bảo vệ hay không?

Tp Hồ Chí Minh, ngày tháng năm 2024

(Ký & ghi rõ họ tên)

Lời đầu tiên, em xin gửi lời cảm ơn chân thành đến Khoa Công Nghệ Thông Tin – Trường Đại Học Sư Phạm Kỹ Thuật Thành Phố Hồ Chí Minh đã tạo điều kiện cho em được học tập và phát triển kiến thức vững chắc để thực hiện đề tài này

Bên cạnh đó, em xin gửi lời cảm ơn chân thành và sâu sắc nhất đến TS Mai Anh Thơ – giảng viên hướng dẫn đồ án tốt nghiệp Trong quá trình làm đồ án tốt nghiệp, em đã nhận được sự quan tâm giúp đỡ, hướng dẫn tận tình, tâm huyết của cô Em đã học được rất nhiều kiến thức về cách quản lý và triển khai đồ án một cách hiệu quả Đặc biệt, em rất cảm kích khi cô đã luôn sẵn sàng trả lời câu hỏi và giải đáp thắc mắc trong suốt quá trình làm đồ án tốt nghiệp Nhờ đó, em có thể hiểu rõ hơn về yêu cầu và xây dựng ứng dụng một cách hiệu quả

Một lần nữa, em xin chân thành cảm ơn cô vì những kiến thức và kinh nghiệm quý báu mà cô đã truyền đạt cho em trong suốt thời gian qua Em hy vọng được tiếp tục học hỏi và được cô hướng dẫn trong tương lai Lời cuối cùng, em xin kính chúc cô nhiều sức khỏe, thành công và hạnh phúc

Do chưa có nhiều kinh nghiệm làm đồ án cũng như những hạn chế về kiến thức, trong đồ án chắc chắn sẽ không tránh khỏi những thiếu sót Rất mong nhận được sự nhận xét, ý kiến đóng góp từ quý thầy cô để sản phẩm được hoàn thiện hơn

Trường ĐH Sư Phạm Kỹ Thuật TP.HCM

Khoa Công nghệ Thông tin ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP

Họ và Tên SV thực hiện: Dư Mỹ Duyên Mã Số SV: 20110201

Thời gian làm luận văn: Từ 19/03/2024 đến 19/05/2024

Chuyên ngành: Công nghệ phần mềm

Tên luận văn: Xây dựng ứng dụng di động My Stylist cung cấp các giải pháp về lĩnh vực làm đẹp

Giảng viên hướng dẫn: TS Mai Anh Thơ

Nhiệm vụ của luận văn:

- Tìm hiểu về các công nghệ: Spring Boot, Swagger, React Native, Postgresql, Figma, Firebase Storage, JSON Web Token

- Sử dụng Spring Boot để xây dựng Backend, viết các API trong hệ thống Kết hợp với Swagger để tạo tài liệu API

- Sử dụng Postgresql để lưu trữ dữ liệu cho người dùng

- Sử dụng JSON Web Token để xác thực, phân quyền

- Sử dụng Figma để thiết kế giao diện cho ứng dụng

- Sử dụng React Native để xây dựng Mobile

- Sử dụng Firebase Cloud Storage để lưu trữ hình ảnh trong ứng dụng Đề cương viết luận văn:

1.1 Tính cấp thiết của đề tài

1.2 Mục đích của đề tài

1.3 Cách tiếp cận và phương pháp nghiên cứu

1.4 Phân tích những công trình có liên quan 1.5 Kết quả dự kiến đạt được

1 CHƯƠNG 1: CƠ SỞ LÝ THUYẾT

1.1 Kiến trúc chung của hệ thống

2 CHƯƠNG 2: MÔ HÌNH HÓA YÊU CẦU

2.2 Mô hình hóa yêu cầu

3 CHƯƠNG 3: THIẾT KẾ PHẦN MỀM

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

4 CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ

STT Thời gian Công việc Ghi chú

- Thiết kế usecase và mô hình hóa yêu cầu

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

- Tìm hiểu về Spring Security và cơ chế xác thực bằng Json Web Token

3 31/03/2024 – 08/04/2024 - Tìm hiểu về React Native

- Thiết kế giao diện trên Figma

4 08/04/2024 – 15/05/2024 - Xây dựng các API dựa trên đặc tả yêu cầu

- Hiện thực các giao diện trên Figma bằng React Native

- Kết nối backend, mobile, cơ sở dữ liệu

5 08/04/2024 – 15/05/2024 - Kiểm thử chương trình, sửa lỗi

6 08/04/2024 – 19/05/2024 - Viết và hoàn thiện báo cáo

Người viết đề cương Ý kiến của giáo viên hướng dẫn

(ký và ghi rõ họ tên)

LỜI CẢM ƠN 1 ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP 2

1 LÝ DO CHỌN ĐỀ TÀI 14

2 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN 15

CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 18

1.1 KIẾN TRÚC CHUNG CỦA HỆ THỐNG 18

CHƯƠNG 2: MÔ HÌNH HÓA YÊU CẦU 48

2.2 MÔ HÌNH HÓA YÊU CẦU 52

CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 93

3.4 THIẾT KẾ CƠ SỞ DỮ LIỆU 143

CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 193

Hình 1: Kiến trúc chung của hệ thống 18

Hình 2: Luồng xử lý Token Based Authentication 19

Hình 3: Luồng xử lý yêu cầu Refresh Token khi Access Token hết hạn 20

Hình 4: Hình logo Spring Boot 25

Hình 5: Cấu trúc Json Web Token 29

Hình 7: Hình logo React Native 34

Hình 8: Hình kiến trúc của Zustand 36

Hình 10: Hình mô tả 4 nhóm màu 39

Hình 11: Lược đồ usecase về phía người dùng 52

Hình 12: Lược đồ usecase chức năng khám phá đặc điểm cá nhân 53

Hình 13: Lược đồ usecase chức năng tra cứu phân loại 54

Hình 14: Quản lý bài đăng 54

Hình 15: Lược đồ usecase chức năng quản lý tủ đồ 55

Hình 16: Lược đồ usecase về phía quản trị viên 55

Hình 17: Sequence Diagram “Đăng nhập” 93

Hình 18: Sequence Diagram “Đăng ký” 94

Hình 19: Sequence Diagram “Quên mật khẩu” 95

Hình 20: Sequence Diagram “Nhận dạng màu sắc cá nhân” 95

Hình 21: Sequence Diagram “Xem chi tiết về màu sắc cá nhân” 96

Hình 22: Sequence Diagram “Nhận dạng phong cách” 96

Hình 23: Sequence Diagram “Xem chi tiết về phong cách” 97

Hình 24: Sequence Diagram “Nhận dạng hình dáng cơ thể” 98

Hình 25: Sequence Diagram “Tìm kiếm phân loại” 99

Hình 26: Sequence Diagram “Xem các món đồ thuộc phân loại” 100

Hình 27: Sequence Diagram “Tìm kiếm món đồ” 101

Hình 28: Sequence Diagram “Lọc món đồ dựa trên đặc điểm” 101

Hình 29: Sequence Diagram “Xem chi tiết về món đồ” 102

Hình 30: Sequence Diagram “Xem danh sách các món đồ có trong tủ đồ” 103

Hình 31: Sequence Diagram “Tải món đồ” 104

Hình 32: Sequence Diagram “Xóa món đồ” 105

Hình 33: Sequence Diagram “Xem danh sách các trang phục” 105

Hình 34: Sequence Diagram “Xóa trang phục” 106

Hình 35: Sequence Diagram “Tạo trang phục” 107

Hình 36: Sequence Diagram “Xem gợi ý trang phục” 108

Hình 37: Sequence Diagram “Thay đổi thông tin cá nhân” 109

Hình 38: Sequence Diagram “Xem bài đăng trong cộng đồng” 110

Hình 39: Sequence Diagram “Tạo bài đăng cá nhân” 111

Hình 40: Sequence Diagram “Xem bài đăng cá nhân” 112

Hình 41: Sequence Diagram “Xóa bài đăng cá nhân” 113

Hình 42: Sequence Diagram “Chỉnh sửa bài đăng cá nhân” 114

Hình 43: Sequence Diagram “Xem biểu đồ thống kê về các món đồ” 114

Hình 44: Sequence Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 115

Hình 45: Sequence Diagram “Phê duyệt bài đăng” 116

Hình 46: Activity Diagram “Đăng nhập” 117

Hình 47: Activity Diagram “Đăng ký” 118

Hình 48: Activity Diagram “Quên mật khẩu” 119

Hình 49: Activity Diagram “Nhận dạng màu sắc cá nhân” 120

Hình 50: Activity Diagram “Xem chi tiết về màu sắc cá nhân” 121

Hình 51: Activity Diagram “Nhận dạng phong cách” 122

Hình 52: Activity Diagram “Xem chi tiết về phong cách” 123

Hình 53: Activity Diagram “Nhận dạng hình dáng cơ thể” 124

Hình 54: Activity Diagram “Xem chi tiết về hình dáng cơ thể” 125

Hình 55: Activity Diagram “Tìm kiếm phân loại” 126

Hình 56: Activity Diagram “Xem các món đồ thuộc phân loại” 127

Hình 57: Activity Diagram “Tìm kiếm món đồ” 128

Hình 58: Activity Diagram “Lọc món đồ dựa trên đặc điểm” 129

Hình 59: Activity Diagram “Xem chi tiết về món đồ” 130

Hình 60: Activity Diagram “Xem danh sách các món đồ có trong tủ đồ” 131

Hình 61: Activity Diagram “Tải món đồ” 132

Hình 62: Activity Diagram “Xóa món đồ” 133

Hình 63: Activity Diagram “Xem danh sách các trang phục” 133

Hình 64: Activity Diagram “Tạo trang phục” 134

Hình 65: Activity Diagram “Xóa trang phục” 135

Hình 66: Activity Diagram “Xem gợi ý trang phục” 135

Hình 67: Activity Diagram “Thay đổi thông tin cá nhân” 136

Hình 68: Activity Diagram “Xem bài đăng trong cộng đồng” 137

Hình 69: Activity Diagram “Tạo bài đăng cá nhân” 138

Hình 70: Activity Diagram “Xem bài đăng cá nhân” 139

Hình 71: Activity Diagram “Xóa bài đăng cá nhân” 139

Hình 72: Activity Diagram “Chỉnh sửa bài đăng cá nhân” 140

Hình 73: Activity Diagram “Xem biểu đồ thống kê về món đồ” 141

Hình 74: Activity Diagram “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 141

Hình 75: Activity Diagram “Phê duyệt bài đăng” 142

Hình 77: Giao điện đăng ký 150

Hình 78: Giao diện đăng nhập 151

Hình 79: Giao diện quên mật khẩu 152

Hình 80: Giao diện đổi mật khẩu 153

Hình 81: Giao diện trang chủ 154

Hình 82: Giao diện về chi tiết màu sắc cá nhân 155

Hình 83: Giao diện xem bảng màu 156

Hình 84: Giao diện nhận dạng màu sắc cá nhân 157

Hình 85: Giao diện kết quả màu sắc cá nhân 158

Hình 86: Giao diện chi tiết phong cách cá nhân 159

Hình 87: Giao diện nhận dạng phong cách cá nhân 160

Hình 88: Giao diện chi tiết về hình dáng cơ thể 161

Hình 89: Giao diện nhận dạng hình dáng cơ thể 162

Hình 90: Giao diện kết quả hình dáng cơ thể 163

Hình 91: Giao diện phân loại 164

Hình 92: Giao diện tìm kiếm phân loại (có kết quả) 165

Hình 93: Giao diện tìm kiếm phân loại (không có kết quả) 166

Hình 94: Danh sách các món đồ thuộc phân loại 167

Hình 95: Chi tiết món đồ 168

Hình 96: Giao diện tìm kiếm món đồ (có kết quả) 169

Hình 97: Giao diện tìm kiếm món đồ (không có kết quả) 170

Hình 98: Giao diện lọc các món đồ dựa trên đặc điểm 171

Hình 99: Giao diện tủ đồ (danh sách món đồ) 172

Hình 100: Giao diện tủ đồ (danh sách trang phục) 173

Hình 101: Giao diện chi tiết trang phục 174

Hình 102: Giao diện xoá món đồ 175

Hình 103: Giao diện xoá trang phục 176

Hình 104: Giao diện tải món đồ (chọn hình ảnh) 177

Hình 105: Giao diện tải món đồ (chọn phân loại) 178

Hình 106: Giao diện tải món đồ (nhập tên món đồ) 179

Hình 107: Giao diện tạo trang phục 180

Hình 108: Giao diện xem gợi ý trang phục 181

Hình 109: Giao diện xem gợi ý trang phục (dựa trên tủ đồ) 182

Hình 110: Giao diện xem gợi ý trang phục (dựa trên hệ thống) 183

Hình 111: Giao diện xem thông tin cá nhân 184

Hình 112: Giao diện thay đổi thông tin cá nhân 185

Hình 113: Giao diện xem bài đăng trong cộng đồng 186

Hình 114: Giao diện tạo bài đăng cá nhân 187

Hình 115: Giao diện xem bài đăng cá nhân 188

Hình 116: Giao diện xóa bài đăng cá nhân 189

Hình 117: Giao diện chỉnh sửa bài đăng cá nhân 190

Hình 118: Giao diện xem biểu đồ thống kê 191

Hình 119: Giao diện phê duyệt bài đăng 192

Bảng 1: Danh sách câu hỏi xác định tông da 41

Bảng 2: Danh sách câu hỏi xác định độ tương phản sắc tố 41

Bảng 3: Bảng kết quả màu sắc cá nhân 42

Bảng 4: Công thức xác định hình dáng cơ thể 44

Bảng 5: Danh sách câu hỏi xác định phong cách thời trang 47

Bảng 6: Yêu cầu chức năng 49

Bảng 7: Mô tả Usecase “Đăng nhập” 57

Bảng 8: Mô tả Usecase “Đăng ký” 58

Bảng 9: Mô tả Usecase “Quên mật khẩu” 60

Bảng 10: Mô tả Usecase “Nhận dạng màu sắc cá nhân” 60

Bảng 11: Mô tả Usecase “Xem chi tiết về màu sắc cá nhân” 62

Bảng 12: Mô tả Usecase “Nhận dạng phong cách thời trang” 63

Bảng 13: Mô tả Usecase “Xem chi tiết về phong cách” 64

Bảng 14: Mô tả Usecase “Nhận dạng hình dáng cơ thể” 65

Bảng 15: Mô tả Usecase “Xem chi tiết về hình dáng cơ thể” 66

Bảng 16: Mô tả Usecase “Tìm kiếm phân loại” 68

Bảng 17: Mô tả Usecase “Xem các món đồ thuộc phân loại” 69

Bảng 18: Mô tả Usecase “Tìm kiếm món đồ” 70

Bảng 19: Mô tả Usecase “Lọc các món đồ dựa trên đặc điểm” 72

Bảng 20: Mô tả Usecase “Xem chi tiết về món đồ” 74

Bảng 21: Mô tả Usecase “Xem danh sách các món đồ có trong tủ đồ” 74

Bảng 22: Mô tả Usecase “Tải món đồ” 76

Bảng 23: Mô tả Usecase “Xóa món đồ” 77

Bảng 24: Mô tả Usecase “Xem danh sách các trang phục” 78

Bảng 25: Mô tả Usecase “Tạo trang phục” 79

Bảng 26: Mô tả Usecase “Xóa trang phục” 80

Bảng 27: Mô tả Usecase “Xem gợi ý trang phục” 81

Bảng 28: Mô tả Usecase “Thay đổi thông tin cá nhân” 82

Bảng 29: Mô tả Usecase “Xem bài đăng trong cộng đồng" 83

Bảng 30: Mô tả Usecase “Tạo bài đăng cá nhân" 85

Bảng 31: Mô tả Usecase “Xem bài đăng cá nhân" 86

Bảng 32: Mô tả Use Case “Xoá bài đăng cá nhân" 87

Bảng 33: Mô tả Usecase “Chỉnh sửa bài đăng cá nhân" 88

Bảng 34: Mô tả Usecase “Đăng nhập” 89

Bảng 35: Mô tả Usecase “Xem biểu đồ thống kê về các món đồ” 90

Bảng 36: Mô tả Usecase “Xem biểu đồ thống kê về lý do người dùng sử dụng ứng dụng” 91

Bảng 37: Mô tả Usecase “Phê duyệt bài đăng" 92

Bảng 38: Chi tiết bảng dữ liệu User 144

Bảng 39: Chi tiết bảng dữ liệu Token 145

Bảng 40: Chi tiết bảng dữ liệu Style Type 145

Bảng 41: Chi tiết Chi tiết bảng dữ liệu Seasonal Color 145

Bảng 42: Chi tiết bảng dữ liệu Body Shape 146

Bảng 43: Chi tiết bảng dữ liệu Undertone question 146

Bảng 44: Chi tiết bảng dữ liệu Contrast question 146

Bảng 45: Chi tiết bảng dữ liệu Style question 147

Bảng 46: Chi tiết bảng dữ liệu Item 147

Bảng 47: Chi tiết bảng dữ liệu User Item 148

Bảng 48: Chi tiết bảng dữ liệu Item Category 148

Bảng 49: Chi tiết bảng dữ liệu User Outfit 148

Bảng 50: Chi tiết bảng dữ liệu Outfit User Item 149

Bảng 51: Chi tiết bảng dữ liệu Reason 149

Bảng 52: Chi tiết bảng dữ liệu Post 149

Bảng 53: Mô tả giao điện đăng ký 150

Bảng 54: Mô tả giao diện đăng nhập 151

Bảng 55: Mô tả giao diện quên mật khẩu 152

Bảng 56: Mô tả giao diện đổi mật khẩu 153

Bảng 57: Mô tả giao diện trang chủ 154

Bảng 58: Mô tả giao diện chi tiết về màu sắc cá nhân 155

Bảng 59: Mô tả giao diện xem bảng màu 156

Bảng 60: Mô tả giao diện nhận dạng màu sắc cá nhân 157

Bảng 61: Mô tả giao diện kết quả màu sắc cá nhân 158

Bảng 62: Mô tả giao diện chi tiết phong cách cá nhân 159

Bảng 63: Mô tả giao diện nhận dạng phong cách cá nhân 160

Bảng 64: Mô tả giao diện chi tiết về hình dáng cơ thể 161

Bảng 65: Mô tả giao diện nhận dạng hình dáng cơ thể 162

Bảng 66: Mô tả giao diện kết quả hình dáng cơ thể 163

Bảng 67: Mô tả giao diện kết quả hình dáng cơ thể 164

Bảng 68: Mô tả giao diện tìm kiếm phân loại (có kết quả) 165

Bảng 69: Mô tả giao diện tìm kiếm phân loại (không kết quả) 166

Bảng 70: Mô tả giao diện danh sách các món đồ thuộc phân loại 167

Bảng 71: Mô tả giao diện chi tiết món đồ 168

Bảng 72: Mô tả giao diện tìm kiếm món đồ (có kết quả) 169

Bảng 73: Mô tả giao diện tìm kiếm món đồ (không kết quả) 170

Bảng 74: Mô tả giao diện lọc các món đồ dựa trên đặc điểm 171

Bảng 75: Mô tả giao diện tủ đồ (danh sách món đồ) 172

Bảng 76: Mô tả giao diện tủ đồ (danh sách món đồ) 173

Bảng 77: Mô tả giao diện chi tiết trang phục 174

Bảng 78: Mô tả giao diện xoá món đồ 175

Bảng 79: Mô tả giao diện xoá trang phục 176

Bảng 80: Mô tả giao diện tải món đồ (chọn hình ảnh) 177

Bảng 81: Mô tả giao diện tải món đồ (chọn phân loại) 178

Bảng 82: Mô tả giao diện tải món đồ (nhập tên món đồ) 179

Bảng 83: Mô tả giao diện tạo trang phục 180

Bảng 84: Mô tả giao diện xem gợi ý trang phục 181

Bảng 85: Mô tả giao diện xem gợi ý trang phục (dựa trên tủ đồ) 182

Bảng 86: Mô tả giao diện xem gợi ý trang phục (dựa trên hệ thống) 183

Bảng 87: Mô tả giao diện xem thông tin cá nhân 184

Bảng 88: Mô tả giao diện xem bài đăng trong cộng đồng 186

Bảng 89: Mô tả giao diện tạo bài đăng cá nhân 187

Bảng 90: Mô tả giao diện xem bài đăng cá nhân 188

Bảng 91: Mô tả giao diện xóa bài đăng cá nhân 189

Bảng 92: Mô tả giao diện chỉnh sửa bài đăng cá nhân 190

Bảng 93: Mô tả giao diện xem biểu đồ thống kê 191

Bảng 94: Mô tả giao diện phê duyệt bài đăng 192

Bảng 95: Lịch trình công việc 195

Bảng 97: Yêu cầu hệ điều hành 195

Bảng 98: Yêu cầu phần mềm 195

Bảng 99: Yêu cầu công cụ kiểm thử 196

1 LÝ DO CHỌN ĐỀ TÀI

Trong nhiều năm gần đây, lĩnh vực làm đẹp luôn luôn là một trong những ngành phát triển nhanh chóng và lợi nhuận cao Sự quan tâm của con người đối với việc chăm sóc bản thân và nâng cao ngoại hình ngày càng gia tăng Điều này tạo ra cơ hội lớn cho các ứng dụng di động cung cấp giải pháp trong lĩnh vực này Ứng dụng di động đã trở thành một phần không thể thiếu trong cuộc sống hàng ngày của chúng ta Việc sử dụng điện thoại thông minh để tìm kiếm thông tin, sản phẩm và dịch vụ là một phần tự nhiên của cuộc sống hiện đại Việc phát triển một ứng dụng di động về làm đẹp có thể tận dụng sự phổ biến này để đáp ứng nhu cầu của người tiêu dùng Ứng dụng di động có thể cung cấp một loạt các giải pháp về làm đẹp, bao gồm tư vấn về phong cách, mua sắm sản phẩm làm đẹp, hướng dẫn trang điểm, và nhiều tính năng khác Sự linh hoạt và tính tiện lợi của các ứng dụng di động có thể thu hút một lượng lớn người dùng và tiềm năng khách hàng Công nghệ ngày càng phát triển, cho phép việc tạo ra các ứng dụng di động có khả năng tùy chỉnh, tích hợp trí tuệ nhân tạo, thực tế ảo, và nhiều công nghệ khác để cung cấp trải nghiệm làm đẹp tốt hơn cho người dùng Sự kết hợp giữa công nghệ và làm đẹp có thể tạo ra những sản phẩm độc đáo và hấp dẫn

Thị trường làm đẹp luôn đòi hỏi sự đổi mới và cải tiến liên tục Với sự gia tăng của cơ hội kinh doanh trong lĩnh vực này, việc nghiên cứu và phát triển một ứng dụng di động My Stylist có thể đáp ứng nhu cầu của thị trường và cung cấp giải pháp hiệu quả Ứng dụng di động My Stylist hướng tới người dùng có nhu cầu chăm sóc và nâng cao vẻ đẹp cá nhân, đặc biệt là trong lĩnh vực thời trang, kiểu tóc, và trang điểm Với cuộc sống ngày càng bận rộn và áp lực, việc tìm kiếm, lựa chọn, và thử nghiệm những phong cách mới thường trở thành một thách thức đáng kể Nhiều người đã phải đối mặt với việc tốn thời gian và tiền bạc để tìm ra những trang phục, kiểu tóc, và trang điểm phù hợp với họ Ứng dụng My Stylist ra đời với mục tiêu quan trọng: giải quyết vấn đề này một cách đơn giản và hiệu quả Thay vì gian nan tìm hiểu về các xu hướng thời trang, phong cách, và phương pháp làm đẹp, người dùng có thể giải quyết vấn đề đó với một người

15 bạn đồng hành ảo – My Stylist Ứng dụng này sẽ phân tích các đặc điểm của cá nhân người dùng, bao gồm màu sắc cá nhân, hình dáng cơ thể, và phong cách riêng, từ đó đưa ra các gợi ý, giải pháp, và lựa chọn phù hợp nhất với họ Điều đặc biệt là My Stylist không phải là một công cụ quyết định cứng nhắc Thay vào đó, nó đóng vai trò của một người bạn đồng hành thông minh, hiểu rõ đặc điểm của người dùng Ứng dụng sẽ thúc đẩy sự sáng tạo và tự do trong việc tự thể hiện, không hề ràng buộc theo quy tắc cố định

Bên cạnh đó, ứng dụng My Stylist cũng giúp người dùng quản lý tủ đồ cá nhân một cách tiện lợi Bằng cách theo dõi các món đồ và sản phẩm làm đẹp mà họ đã sở hữu, người dùng có thể dễ dàng tạo ra những bộ trang phục và phong cách hoàn hảo mà họ có sẵn, từ đó tối ưu hóa giá trị của tủ đồ cá nhân

Trên hết, mục tiêu của ứng dụng My Stylist không chỉ đơn thuần là cung cấp các gợi ý và lựa chọn cho người dùng, mà còn là hỗ trợ họ hiểu rõ hơn về bản thân Điều này giúp người dùng thấy tự tin hơn trong việc thể hiện phong cách và sự cá nhân hóa của họ My Stylist không phải là một cỗ máy lạnh không tâm, mà là một người bạn thân thiết, đồng hành trên hành trình chăm sóc và tôn vinh vẻ đẹp cá nhân

2 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN Đóng góp kiến thức mới: Nghiên cứu về ứng dụng di động My Stylist trong lĩnh vực làm đẹp có thể mang lại những kiến thức mới về cách công nghệ di động có thể được áp dụng trong lĩnh vực làm đẹp Điều này có thể giúp mở rộng kiến thức về phát triển ứng dụng di động và sự kết hợp của chúng với ngành công nghiệp làm đẹp

Nghiên cứu thực nghiệm: Thông qua việc tạo ra một ứng dụng thực tế, đề tài này cung cấp cơ hội cho các thí nghiệm và nghiên cứu thực nghiệm về cách người dùng tương tác với ứng dụng và ảnh hưởng của nó đối với quy trình làm đẹp của họ

Phân tích thị trường và người dùng: Việc nghiên cứu về thị trường và người dùng trong lĩnh vực làm đẹp có thể cung cấp thông tin quý báu về thị trường tiềm năng, người tiêu dùng mục tiêu, và xu hướng tiêu dùng

Phát triển sản phẩm và dịch vụ: Đề tài này có thể dẫn đến việc phát triển một ứng dụng thực tế giúp người dùng tối ưu hóa trải nghiệm làm đẹp của họ, bao gồm việc tư

16 vấn, mua sắm sản phẩm, và nhiều tính năng khác Điều này có thể giúp nâng cao chất lượng cuộc sống của người dùng

Kinh doanh và tiềm năng lợi nhuận: Nếu ứng dụng My Stylist thành công, nó có thể tạo ra cơ hội kinh doanh và tiềm năng lợi nhuận lớn trong lĩnh vực làm đẹp và công nghệ di động

Tiện ích và tiết kiệm thời gian: Ứng dụng cung cấp tiện ích cho người dùng bằng cách giúp họ tiết kiệm thời gian và nỗ lực trong việc quản lý và nâng cao ngoại hình của họ

Ngày đăng: 22/11/2024, 09:54

TÀI LIỆU CÙNG NGƯỜI DÙNG

  • Đang cập nhật ...

TÀI LIỆU LIÊN QUAN

w