CƠ SỞ LÝ THUYẾT
Flutter
1.1 Tổng quan và lịch sử
Flutter là bộ công cụ phát triển phần mềm mã nguồn mở do Google phát triển, cho phép tạo ra ứng dụng đa nền tảng cho Android, iOS, Linux, Windows, MacOS và web từ một mã nguồn duy nhất.
Flutter, được giới thiệu lần đầu vào năm 2015 và chính thức ra mắt phiên bản ổn định vào tháng 5 năm 2017, đã nhanh chóng phát triển mạnh mẽ và trở thành đối thủ cạnh tranh đáng gờm với các công cụ lập trình đa nền tảng khác như React Native của Facebook và Xamarin của Microsoft Hiện nay, Flutter là một trong những công cụ lập trình đa nền tảng phổ biến nhất, với nhiều ứng dụng nổi tiếng được phát triển bằng công nghệ này.
Flutter gồm có hai tầng chính là Engine và Framework:
Tầng engine bao gồm một thư viện đồ họa hỗ trợ việc render giao diện người dùng và máy ảo Dart, tạo ra môi trường thực thi và biên dịch mã nguồn Dart Đây cũng là nơi thực hiện kết nối với hệ thống.
Tầng framework, được viết bằng mã Dart, cung cấp các lớp, chức năng và tiện ích (widget) thiết yếu cho việc phát triển ứng dụng Flutter Đây là tầng chính mà lập trình viên sử dụng để thực hiện lập trình ứng dụng.
1.3 Một số đặc điểm nổi bật
Tính năng Hot Reload cho phép phát triển nhanh chóng với thời gian phản hồi chỉ trong milliseconds, giúp hiển thị giao diện ngay lập tức Bạn có thể sử dụng các widget tùy chỉnh để xây dựng giao diện chỉ trong vài phút Hơn nữa, Hot Reload hỗ trợ việc thêm tính năng và sửa lỗi một cách tiết kiệm thời gian mà không cần phải sử dụng máy ảo, Android hay iOS.
Flutter offers a highly expressive and flexible user interface, allowing developers to create stunning designs in both Material Design and Cupertino styles It provides a wide range of components and supports various motion APIs, ensuring smooth scrolling and an engaging user experience.
Flutter widgets leverage platform-specific differences, such as scrolling, navigation, icons, and fonts, to deliver optimal performance on both iOS and Android.
1.4 Ưu và nhược điểm Ưu điểm:
Flutter là một bộ SDK mã nguồn mở hoàn toàn miễn phí, cho phép cộng đồng lập trình viên cùng nhau tham gia phát triển và cải tiến nền tảng này.
Flutter cung cấp một bộ sưu tập tiện ích phong phú và đa dạng, giúp lập trình viên giảm thiểu sự phụ thuộc vào thư viện bên thứ ba.
Hỗ trợ hot reload là tính năng cho phép thay đổi nội dung trực tiếp trên ứng dụng mà không cần phải xây dựng lại toàn bộ, giúp tiết kiệm thời gian cho lập trình viên và làm cho quá trình phát triển ứng dụng trở nên dễ dàng hơn Tuy nhiên, tính năng này cũng có một số nhược điểm cần lưu ý.
- Còn nhiều hạn chế khi phát triển các ứng dụng có các chức năng cần can thiệp sâu vào phần cứng của thiết bị
Kích thước ứng dụng Flutter lớn do hỗ trợ đa nền tảng, dẫn đến số lượng file và mã nguồn tăng lên Tuy nhiên, Google đã cam kết sẽ cải thiện vấn đề này trong tương lai.
Công nghệ Flutter vẫn còn mới và thiếu nhiều thư viện hỗ trợ, nhưng cộng đồng lập trình viên đang ngày càng mở rộng Sự phát triển này hứa hẹn sẽ mang đến nhiều thư viện hỗ trợ chất lượng cho Flutter trong tương lai.
Ngôn ngữ lập trình Dart
Flutter là một framework phát triển ứng dụng được xây dựng trên ngôn ngữ lập trình Dart, ra đời vào năm 2011 và được phát triển bởi Google Dart cho phép xây dựng ứng dụng cho nhiều nền tảng như web, server, máy tính để bàn và thiết bị di động.
- Dart là ngôn ngữ lập trình đa mục đích ban đầu được phát triển bởi Google và sau đó được Ecma (ECMA-408) phê chuẩn làm tiêu chuẩn
- Dart là một ngôn ngữ hướng đối tượng, được xác định theo lớp, với cơ chế garbage-collected, sử dụng cú pháp kiểu C để dịch mã tùy ý sang JavaScript
Nó hỗ trợ interface, mixin, abstract, generic, static typing và type safe
2.2 Tại sao Flutter chọn Dart?
Dart mang lại năng suất cao với cú pháp rõ ràng và súc tích, cùng với công cụ đơn giản nhưng mạnh mẽ Tính năng type-safe giúp phát hiện sớm các lỗi tinh vi, trong khi hệ sinh thái phong phú với hàng ngàn package và các thư viện cốt lõi hỗ trợ lập trình viên hiệu quả.
Dart tối ưu hóa quá trình biên dịch trước thời hạn, giúp đạt được hiệu suất cao và thời gian khởi động nhanh chóng trên cả thiết bị di động và web.
Dart có khả năng biên dịch thành mã ARM và x86, cho phép các ứng dụng di động chạy mượt mà trên iOS, Android và nhiều nền tảng khác Đối với các ứng dụng web, Dart chuyển đổi mã sang JavaScript để đảm bảo tính tương thích và hiệu suất cao.
Dart là ngôn ngữ lập trình dễ học và sử dụng, đặc biệt thân thuộc với nhiều nhà phát triển nhờ cú pháp rõ ràng và định hướng đối tượng dễ hiểu Nếu bạn đã quen thuộc với C++, C# hoặc Java, bạn có thể nhanh chóng làm chủ Dart chỉ trong vài ngày.
Hệ quản trị cơ sở dữ liệu Firebase
Firebase là nền tảng phát triển ứng dụng di động và web dựa trên đám mây do Google cung cấp, mang đến các dịch vụ và công cụ mạnh mẽ giúp phát triển ứng dụng nhanh chóng và hiệu quả Với Firebase, nhà phát triển có thể tập trung vào việc xây dựng chức năng và trải nghiệm người dùng mà không phải lo lắng về quản lý cơ sở hạ tầng phức tạp Nền tảng này cung cấp nhiều dịch vụ hữu ích để phát triển và quản lý ứng dụng, bao gồm các dịch vụ chính mà người dùng có thể tận dụng.
Firebase Realtime Database là một cơ sở dữ liệu thời gian thực dựa trên JSON, cho phép tự động lưu trữ và đồng bộ dữ liệu trên các thiết bị người dùng Nó cung cấp khả năng truy vấn dữ liệu và đồng bộ hóa trực tiếp, giúp người dùng và thiết bị có thể chia sẻ thông tin một cách tức thì.
Firebase Authentication là dịch vụ quản lý xác thực người dùng, cho phép đăng nhập và đăng ký qua nhiều phương thức như email, số điện thoại, và tài khoản từ Google, Facebook, Twitter Dịch vụ này cũng cung cấp các tính năng bảo mật quan trọng như xác minh email, phục hồi mật khẩu và xác thực hai bước.
Firebase Cloud Firestore là một cơ sở dữ liệu tài liệu linh hoạt và mở rộng, được lưu trữ trên đám mây Nó cho phép người dùng lưu trữ và truy xuất dữ liệu theo cấu trúc tài liệu, đồng thời hỗ trợ các tính năng truy vấn mạnh mẽ để tìm kiếm, sắp xếp và lọc dữ liệu hiệu quả.
Firebase Storage là dịch vụ lưu trữ đám mây của Firebase, cho phép người dùng lưu trữ và quản lý tệp tin như hình ảnh, video và các loại tệp khác Dịch vụ này mang lại khả năng tải lên và tải xuống dữ liệu một cách hiệu quả và đáng tin cậy.
Firebase Cloud Messaging là dịch vụ gửi thông báo đẩy đến thiết bị di động, cho phép truyền tải thông điệp trực tiếp tới ứng dụng trên các nền tảng Android, iOS và web Dịch vụ này giúp tăng cường tương tác với người dùng, đồng thời thông báo tin tức, cập nhật và sự kiện quan trọng một cách hiệu quả.
Firebase Hosting là dịch vụ lưu trữ và phân phối ứng dụng web tĩnh trên hạ tầng đám mây của Firebase, cho phép triển khai nhanh chóng và cung cấp ứng dụng cho người dùng toàn cầu Dịch vụ này đi kèm với SSL miễn phí và CDN tích hợp, giúp tối ưu hóa hiệu suất và bảo mật cho các trang web.
Firebase cung cấp nhiều dịch vụ hữu ích như Firebase Analytics để phân tích ứng dụng, Firebase Performance Monitoring để theo dõi hiệu suất, Firebase Remote Config cho quản lý cấu hình từ xa, và Firebase Test Lab để kiểm thử ứng dụng di động Tất cả các dịch vụ này được tích hợp chặt chẽ, tạo nên một nền tảng toàn diện cho việc xây dựng và quản lý ứng dụng di động và web.
Firebase mang đến nhiều ưu điểm hấp dẫn cho việc phát triển ứng dụng Dưới đây là một số ưu điểm quan trọng của Firebase:
Firebase mang đến một giao diện trực quan và dễ sử dụng, giúp các nhà phát triển dễ dàng tạo ra và quản lý các dịch vụ cho ứng dụng của họ.
Firebase cung cấp nhiều công cụ phát triển như lưu trữ cơ sở dữ liệu, xác thực người dùng, thông báo đẩy và phân tích, giúp giảm thời gian phát triển và tăng tốc độ triển khai ứng dụng một cách nhanh chóng.
Firebase dễ dàng tích hợp với nhiều nền tảng phát triển và ngôn ngữ lập trình như Android, iOS, web và Node.js, giúp các nhà phát triển linh hoạt lựa chọn công nghệ và ngôn ngữ phù hợp cho dự án của họ.
Firebase mang lại độ tin cậy cao nhờ vào hạ tầng đám mây của Google, cho phép mở rộng linh hoạt và ổn định Điều này đảm bảo rằng ứng dụng của bạn có khả năng xử lý lưu lượng lớn người dùng một cách hiệu quả và ổn định.
Mặc dù Firebase có nhiều ưu điểm, nhưng cũng tồn tại một số nhược điểm cần xem xét:
Firebase cung cấp gói miễn phí với giới hạn về lưu trữ, băng thông và tài nguyên khác Tuy nhiên, đối với các ứng dụng lớn, gói miễn phí có thể không đủ và bạn sẽ cần nâng cấp lên gói trả phí để đáp ứng nhu cầu sử dụng.
Firebase cung cấp các dịch vụ tiêu chuẩn với nhiều tính năng sẵn có, nhưng khả năng tùy chỉnh và thay đổi các tính năng có thể bị hạn chế Điều này có thể gây khó khăn cho các ứng dụng cần sự tùy biến cao hoặc yêu cầu tích hợp với các hệ thống hiện có.
Một số tính năng của Firebase phụ thuộc vào dịch vụ bên thứ ba như Google Cloud Platform và Google Analytics, điều này có thể tạo ra sự ràng buộc với các nhà cung cấp khác Khi có sự thay đổi từ phía nhà cung cấp, ứng dụng của bạn có thể bị ảnh hưởng.
Xây dựng hệ thống
Tổng quan về hệ thống
- Ngôn ngữ lập trình: Dart
- IDE: Visual Studio Code và Android Studio
- Kiến trúc ứng dụng: Bloc
1.2 Kiến trúc hệ thống: Mô hình Client – Sever
Client là ứng dụng di động mà người dùng sử dụng để tương tác với hệ thống Nó gửi yêu cầu đến server và nhận phản hồi từ server.
Máy chủ, đại diện cho Firebase, chứa dữ liệu của ứng dụng và chịu trách nhiệm nhận, xử lý các yêu cầu từ Client liên quan đến việc đọc, ghi và xác thực dữ liệu, sau đó trả về kết quả tương ứng.
1.3 Kiến trúc ứng dụng: Bloc
Bloc (Business Logic Component) là mô hình quản lý trạng thái và luồng dữ liệu trong Flutter, giúp tách biệt logic kinh doanh với giao diện người dùng Mô hình này tạo cấu trúc rõ ràng và dễ quản lý, xử lý sự kiện và cập nhật trạng thái tương ứng, đồng thời điều chỉnh giao diện người dùng theo trạng thái mới.
Sử dụng thư viện bloc cho phép chúng ta tách ứng dụng thành ba lớp:
Lớp dữ liệu bao gồm hai thành phần chính: Repository và Data Provider Repository hoạt động như một lớp trung gian giữa lớp dữ liệu và lớp logic kinh doanh, cung cấp giao diện dễ sử dụng cho việc tương tác với dữ liệu Nó chịu trách nhiệm truy xuất, lưu trữ và quản lý dữ liệu từ nhiều nguồn khác nhau Trong khi đó, Data Provider là lớp chuyên trách việc lấy dữ liệu từ các nguồn bên ngoài như API hoặc cơ sở dữ liệu, giao tiếp với Repository để thực hiện việc lưu trữ và truy xuất dữ liệu.
Bloc (Business Logic Component) là thành phần cốt lõi của lớp logic kinh doanh, chịu trách nhiệm nhận sự kiện từ lớp giao diện người dùng và xử lý chúng để cập nhật trạng thái tương ứng Bloc tích hợp các quy tắc và logic kinh doanh của ứng dụng, đảm bảo hoạt động hiệu quả và nhất quán.
Lớp giao diện người dùng (UI) đảm nhiệm việc hiển thị giao diện và xử lý các tương tác từ người dùng Nó phản ánh trạng thái hiện tại do Bloc cung cấp và gửi các sự kiện đến Bloc dựa trên hành động của người dùng.
Mô hình Use-case
STT Tên use-case Giải thích/Mô tả
1 Đăng nhập Người dùng đăng nhập vào ứng dụng
2 Đăng nhập với Google Người dùng sử dụng tài khoản Google để đăng nhập vào ứng dụng
3 Đăng nhập với Facebook Người dùng sử dụng tài khoản Facebook để đăng nhập vào ứng dụng
4 Đăng ký Người dùng tạo tài khoản mới bằng email và mật khẩu
5 Quên mật khẩu Lấy lại mật khẩu cho tài khoản đã đăng ký
6 Xem danh mục sản phẩm Xem các sản phẩm được hiển thị theo từng danh mục hoặc thể loại
7 Sắp xếp sản phẩm Hiển thị danh sách sản phẩm theo thứ tự nhất định
8 Tìm kiếm sản phẩm Tìm kiếm sản phẩm thông qua tên tác phẩm/tác giả
9 Xem sản phẩm Hiển thị các thông tin chi tiết liên quan đến sản phẩm
10 Yêu thích/Bỏ thích sản phẩm
Thêm sản phẩm vào danh sách yêu thích của tài khoản hoặc xóa khỏi danh sách nếu đã yêu thích
11 Thêm vào giỏ hàng Thêm sản phẩm vào giỏ hàng của tài khoản
12 Mua ngay Lập tức tạo một đơn hàng cho sản phẩm
13 Xem đánh giá sản phẩm Hiển thị các đánh giá từ người mua trước đó về sản phẩm
14 Lọc đánh giá Lọc đánh giá theo số sao
15 Quản lý tài khoản Người dùng có thể thay đổi hoặc theo dõi một số thông tin liên quan đến tài khoản
16 Thay đổi thông tin tài khoản
Người dùng có thể thay đổi các thông tin như: Tên, ảnh đại diện, số điện thoại, ngày sinh,…
17 Thay đổi mật khẩu Người dùng thay một mật khẩu mới cho tài khoản
(Chỉ áp dụng cho tài khoản đăng ký qua ứng dụng)
18 Xem danh sách sản phẩm yêu thích
Hiển thị danh sách sản phẩm đã thích của tài khoản Người dùng có thể xóa hoặc thêm vào giỏ hàng
19 Xem lịch sử mua hàng Hiển thị danh sách đơn hàng đã hoàn thành
20 Thêm địa chỉ Hiển thị danh sách địa chỉ dùng để nhận hàng của người dùng Có thể thêm, thay đổi hoặc xóa địa chỉ
21 Giỏ hàng Xem danh sách các sản phẩm và số lượng sản phẩm trong giỏ hàng
22 Xóa sản phẩm khỏi giỏ hàng
Xóa sản phẩm khỏi giỏ hàng
23 Thanh toán Người dùng thanh toán đơn hàng của mình Theo các sản phẩm và số lượng đã chọn trong giỏ hàng
24 Đổi phương thức thanh toán
Người dùng có thể đổi phương thức thanh toán
25 Đổi phương thức vận chuyển
Người dùng có thể đổi phương thức vận chuyển
26 Theo dõi đơn hàng Người dùng có thể theo dõi đơn hàng của mình theo từng trạng thái khác nhau
27 Hủy đơn hàng Người dùng hủy đơn hàng, đơn hàng chuyển sang trạng thái đã hủy
28 Xác nhận nhận hàng Người dùng xác nhận đã nhận được hàng, đơn hàng thành công và có thể đánh giá sản phẩm
29 Xem chi tiết đơn hàng Hiển thị thông tin chi tiết về đơn hàng
30 Đánh giá sản phẩm Người dùng đánh giá các sản phẩm mình đã mua
31 Thông báo Hiển thị thông báo của tài khoản
32 Lọc thông báo Lọc và hiển thị thông báo theo tiêu chí nhất định
33 Đánh dấu đã đọc Đánh dấu tất cả thông báo là đã đọc
2.3.1 Đăng nhập với email và mật khẩu
Tên use-case Đăng nhập với email và mật khẩu
Mô tả tóm tắt Người dùng sử dụng email và mật khẩu đã đăng ký trong ứng dụng để truy cập vào ứng dụng
Người thực hiện Người dùng
Sự kiện kích hoạt Khi khởi động ứng dụng Điều kiện tiên quyết Email và mật khẩu phải hợp lệ
Thiết bị người dùng phải được kết nối internet Điều kiện kết quả Người dùng đăng nhập thành công và ứng dụng điều hướng đến màn hình trang chủ
Kịch bản chính 1 Người dùng khởi động ứng dụng
2 Người dùng nhập email, mật khẩu và bấm nút Đăng nhập
3 Hệ thống thực hiện xác thực tài khoản thành công và điều hướng đến màn hình Trang chủ
Kịch bản thay thế - Hệ thống xác thực tài khoản không thành công
- Người dùng nhập sai tài khoản, mật khẩu
+ Thông báo cho người dùng, đăng nhập thất bại
2.3.2 Đăng nhập với tài khoản Google
Tên use-case Đăng nhập với Google
Mô tả tóm tắt Người dùng sử dụng tài khoản Google để đăng nhập vào ứng dụng
Người thực hiện Người dùng
Sự kiện kích hoạt Người dùng bấm vào nút Google Điều kiện tiên quyết Tài khoản Google phải hợp lệ
Thiết bị người dùng phải được kết nối internet Điều kiện kết quả Người dùng đăng nhập thành công và ứng dụng điều hướng đến màn hình trang chủ
Kịch bản chính 1 Người dùng bấm vào nút Google trên màn hình Đăng nhập
2 Người dùng chọn hoặc nhập thông tin tài khoản Google
3 Hệ thống thực hiện xác thực tài khoản thành công và ứng dụng chuyển hướng đến màn hình Trang chủ
Kịch bản thay thế - Hệ thống xác thực tài khoản không thành công
- Người dùng nhập sai thông tin tài khoản Google + Thông báo cho người dùng, đăng nhập thất bại
2.3.3 Đăng nhập với tài khoản Facebook
Tên use-case Đăng nhập với Facebook
Mô tả tóm tắt Người dùng sử dụng tài khoản Facebook để đăng nhập vào ứng dụng
Người thực hiện Người dùng
Sự kiện kích hoạt xảy ra khi người dùng nhấn nút Facebook, yêu cầu thiết bị phải có kết nối internet Kết quả của quá trình này là người dùng đăng nhập thành công và ứng dụng sẽ chuyển hướng đến màn hình trang chủ.
Kịch bản chính 1 Người dùng bấm vào nút Facebook trên màn hình Đăng nhập
2 Người dùng chọn hoặc nhập thông tin tài khoản Facebook
3 Hệ thống thực hiện xác thực tài khoản thành công và ứng dụng chuyển hướng đến màn hình Trang chủ
Kịch bản thay thế - Hệ thống xác thực tài khoản không thành công
- Người dùng nhập sai thông tin tài khoản Facebook + Thông báo cho người dùng, đăng nhập thất bại
Tên use-case Đăng ký
Mô tả tóm tắt Người dùng tạo tài khoản mới bằng email và mật khẩu để truy cập vào hệ thống
Người thực hiện Người dùng
Sự kiện kích hoạt Người dùng bấm vào nút Đăng ký ngay Điều kiện tiên quyết Email và mật khẩu phải hợp lệ
Để sử dụng dịch vụ, thiết bị của người dùng cần phải được kết nối internet Sau khi người dùng tạo tài khoản mới thành công, hệ thống sẽ tự động chuyển hướng đến màn hình trang chủ.
Kịch bản chính 1 Người điển thông tin tài khoản mới cần tạo sau đó bấm nút Đăng ký
2 Hệ thống kiểm tra và xác thực tính hợp lệ của tài khoản thành công
3 Ứng dụng chuyển hướng đến màn hình Trang chủ
Kịch bản thay thế - Người dùng nhập thiếu thông tin, hoặc nhập sai mật khẩu xác nhận
- Hệ thống kiểm tra và xác thực tài khoản thất bại
- Email đã được sử dụng hoặc mật khẩu quá yếu + Thông báo cho người dùng, đăng ký thất bại
Tên use-case Quên mật khẩu
Mô tả tóm tắt Người dùng cần lấy lại mật khẩu cho tài khoản đăng ký trong ứng dụng (tài khoản sử dụng email và mật khẩu)
Người thực hiện Người dùng
Sự kiện kích hoạt Người dùng bấm vào nút Quên mật khẩu Điều kiện tiên quyết Thiết bị của người dùng phải được kết nối internet
21 Điều kiện kết quả Ứng dụng thông báo thành công và hệ thống gửi mail khôi phục mật khẩu đến email của người dùng
Kịch bản chính 1 Người dùng nhập email của tài khoản cần khôi phục mật khẩu và bấm nút Khôi phục mật khẩu
2 Hệ thống kiểm tra thông tin thành công và gửi mail đến email của người dùng
Kịch bản thay thế - Email bỏ trống hoặc không hợp lệ
- Emai người dùng cung cấp không tồn tại hoặc bị khóa bởi hệ thống
+ Thông báo cho người dùng, dừng hành động
2.3.6 Xem danh mục sản phẩm
Tên use-case Xem danh mục sản phẩm
Mô tả tóm tắt Hiển thị danh sách sản phẩm theo từng danh mục cụ thể
Người thực hiện Hệ thống
Sự kiện kích hoạt Người dùng bấm vào danh sách danh mục sản phẩm Điều kiện tiên quyết Thiết bị người dùng phải được kết nối internet
Người dùng phải đăng nhập trước đó Điều kiện kết quả Ứng dụng chuyển hướng đến trang danh mục sản phẩm theo danh mục tương ứng
Kịch bản chính 1 Người dùng bấm chọn danh mục bất kỳ trong danh sách danh mục sản phẩm được hiển thị
2 Ứng dụng chuyển hướng đến trang danh mục sản phẩm tương ứng và hiển thị danh sách sản phẩm của danh mục đó
Kịch bản thay thế Không
Tên use-case Sắp xếp sản phẩm
Mô tả tóm tắt Hiển thị danh sách sản phẩm một cách có thứ tự theo một tiêu chí nhất định
Người thực hiện Người dùng
Người dùng có thể kích hoạt sự kiện bằng cách nhấn vào nút dropdown và lựa chọn tiêu chí sắp xếp phù hợp Tuy nhiên, điều kiện tiên quyết là thiết bị của người dùng cần phải được kết nối internet.
Người dùng phải đăng nhập trước đó Điều kiện kết quả Ứng dụng hiển thị danh sách sản phẩm theo thứ tự và tiêu chí mà người dùng chọn
Kịch bản chính 1 Người dùng bấm chọn hình thức sắp xếp
2 Ứng dụng hiển thị lại danh sách sản phẩm theo thứ tự và tiêu chí người dùng đã chọn
Kịch bản thay thế Không
Tên use-case Tìm kiếm sản phẩm
Mô tả tóm tắt Người dùng tìm kiếm sản phẩm theo tên của sản phẩm hoặc tác giả
Người thực hiện Người dùng
Sự kiện kích hoạt Người dùng bấm vào thanh tim kiếm Điều kiện tiên quyết Thiết bị người dùng phải được kết nối internet
Người dùng phải đăng nhập trước đó
Nội dung tìm kiếm phải đầy đủ để hiển thị kết quả chính xác Ứng dụng sẽ cung cấp danh sách sản phẩm phù hợp với yêu cầu tìm kiếm của người dùng.
Kịch bản chính 1 Người dùng nhập từ khóa vào thanh tìm kiếm và bấm nút Tìm Hoặc chọn trong danh sách các từ khóa được tìm kiếm trước đây
2 Ứng dụng hiển thị danh sách các sản phẩm phù hợp với từ khóa
Kịch bản thay thế Không
Tên use-case Xem thông tin sản phẩm
Mô tả tóm tắt Người dùng xem thông tin chi tiết của sản phẩm
Người thực hiện Người dùng
Sự kiện kích hoạt Người dùng bấm vào sản phẩm Điều kiện tiên quyết Thiết bị người dùng phải được kết nối internet
Người dùng cần đăng nhập trước để truy cập Sau khi đáp ứng điều kiện, ứng dụng sẽ chuyển hướng đến màn hình chi tiết sản phẩm, hiển thị thông tin tương ứng về sản phẩm đó.
Kịch bản chính 1 Người dùng bấm chọn vào sản phẩm muốn xem
2 Ứng dụng chuyển hướng đến màn hình Chi tiết sản phẩm
Kịch bản thay thế Không
2.3.10 Yêu thích/Bỏ thích sản phẩm
Tên use-case Yêu thích/Bỏ thích sản phẩm
Mô tả tóm tắt Người dùng thêm sản phẩm vào danh sách yêu thích hoặc bỏ thích sản phẩm
Người thực hiện Người dùng
Người dùng có thể kích hoạt sự kiện bằng cách nhấn vào biểu tượng trái tim ở góc trên bên phải của màn hình chi tiết sản phẩm, với điều kiện thiết bị của họ phải được kết nối internet.
Người dùng phải đăng nhập trước đó
24 Điều kiện kết quả Sản phẩm được thêm vào danh sách yêu thích (nếu chưa có) hoặc loại bỏ khỏi danh sách (nếu đã có)
Kịch bản chính 1 Người dùng bấm vào Icon button yêu thích
2 Hệ thống thực hiện kiểm tra và thêm/xóa sản phẩm khỏi danh sách yêu thích của người dùng
Kịch bản thay thế Không
Tên use-case Thêm vào giỏ hàng
Mô tả tóm tắt Người dùng thêm sản phẩm vào giỏ hàng
Người thực hiện Người dùng
Sự kiện kích hoạt diễn ra khi người dùng nhấn vào nút "Thêm vào giỏ hàng" trên màn hình chi tiết sản phẩm, với điều kiện thiết bị của người dùng phải được kết nối internet.
Người dùng phải đăng nhập trước đó Điều kiện kết quả Sản phẩm được thêm vào giỏ hàng của người dùng
Kịch bản chính 1 Người dùng bấm vào nút Thêm vào giỏ hàng trong màn hình Chi tiết sản phẩm
2 Hệ thống thêm sản phẩm vào giỏ hàng của người dùng với số lượng ban đầu là 1
Kịch bản thay thế Không
Tên use-case Mua ngay
Mô tả tóm tắt Người dùng chọn mua ngay một sản phẩm từ trang Chi tiết sản phẩm
Người thực hiện Người dùng
Người dùng sẽ kích hoạt sự kiện khi nhấn nút "Đặt mua ngay" trên màn hình Chi tiết sản phẩm, với điều kiện thiết bị của họ phải được kết nối internet.
Người dùng phải đăng nhập trước đó Điều kiện kết quả Ứng dụng chuyển hướng đến màn hình Thanh toán
Kịch bản chính 1 Người dùng bấm vào nút Đặt mua ngay trong màn hình Chi tiết sản phẩm
2 Ứng dụng chuyển hướng đến màn hình Thanh toán với sản phẩm tương ứng và số lượng là 1
Kịch bản thay thế Không
2.3.13 Xem đánh giá sản phẩm
Tên use-case Xem đánh giá sản phẩm
Mô tả tóm tắt Người dùng có thể xem những đánh giá từ người mua trước đó về sản phẩm
Người thực hiện Người dùng,
Người dùng có thể kích hoạt sự kiện bằng cách nhấn vào nút "Xem thêm" trong phần Đánh giá từ khách hàng trên màn hình Chi tiết sản phẩm, với điều kiện thiết bị phải được kết nối internet.
Người dùng phải đăng nhập trước đó Điều kiện kết quả Ứng dụng chuyển hướng đến màn hình Đánh giá
Kịch bản chính 1 Người dùng bấm vào nút Xem thêm
2 Ứng dụng chuyển hướng đến màn hình đánh giá và hiển thị tất cả đánh giá của người mua trước đó về sản phẩm tương ứng
Kịch bản thay thế Không
Tên use-case Lọc đánh giá
Mô tả tóm tắt Người dùng có thể lọc những đánh giá tùy theo những tiêu chí mong muốn
Người thực hiện Người dùng
Sự kiện kích hoạt Người dùng chọn tiêu chí muốn lọc Điều kiện tiên quyết Thiết bị người dùng phải được kết nối internet
Người dùng phải đăng nhập trước đó Điều kiện kết quả Ứng dụng hiển thị những đánh giá phù hợp với tiêu chí được người dùng lựa chọn
Kịch bản chính 1 Người dùng bấm vào nút lọc, danh sách các tiêu chí được hiển thị ra
2 Người dùng chọn tiêu chí mong muốn
3 Ứng dụng hiển thị lại danh sách đánh giá phù hợp với tiêu chí của người dùng
Kịch bản thay thế Không
Tên use-case Quản lý tài khoản
Người dùng có thể truy cập thông tin cơ bản về tài khoản của mình và dễ dàng điều hướng đến các chức năng khác liên quan đến tài khoản.
Người thực hiện Người dùng
Sự kiện kích hoạt Người dùng bấm vào nút Tài khoản bên dưới bottom navigation bar Điều kiện tiên quyết Thiết bị người dùng phải được kết nối internet
Người dùng phải đăng nhập trước đó Điều kiện kết quả Ứng dụng chuyển đến màn hình Quản lý tài khoản
Kịch bản chính 1 Người dùng bấm vào nút Tài khoản bên dưới bottom navigation bar
2 Ứng dụng chuyển sang màn hình Quản lý tài khoản
Kịch bản thay thế Không
2.3.16 Thay đổi thông tin tài khoản
Tên use-case Thay đổi thông tin tài khoản
Mô tả tóm tắt Người dùng thay đổi các thông tin cơ bản của tài khoản như: ảnh đại diện, tên, số điện thoại, ngày sinh, giới tính
Người thực hiện Người dùng
Để kích hoạt sự kiện, người dùng cần nhấn vào biểu tượng Chỉnh sửa ở góc phải trên hoặc vào ảnh đại diện trong màn hình Quản lý tài khoản Lưu ý rằng thiết bị của người dùng phải được kết nối với internet.
Người dùng cần đăng nhập để cập nhật thông tin cá nhân Sau khi thông tin được cập nhật thành công, ứng dụng sẽ trở về màn hình Quản lý tài khoản với thông tin mới nhất của người dùng.
Kịch bản chính 1 Người dùng điền thông tin mới của tài khoản và bấm nút Cập nhật
2 Hệ thống cập nhật những thay đổi của người dùng và gửi kết quả về Ứng dụng Ứng dụng trở về màn hình quản lý tài khoản và hiển thị thông tin mới
Kịch bản thay thế - Hệ thống cập nhật không thành công
- Thông tin người dùng không hợp lệ
+ Báo lỗi, yêu cầu người dùng nhập đúng chuẩn
Tên use-case Thay đổi mật khẩu
Mô tả tóm tắt Người dùng cập nhật mật khẩu mới cho tài khoản của mình
Người thực hiện Người dùng
Sự kiện kích hoạt Người dùng bấm vào nút Thay đổi mật khẩu ở màn hình
Quản lý tài khoản Điều kiện tiên quyết Thiết bị người dùng phải được kết nối internet
Người dùng phải đăng nhập trước đó
Người dùng có thể đăng nhập bằng email và mật khẩu Hệ thống sẽ cập nhật mật khẩu mới của người dùng thành công và đưa ứng dụng trở về màn hình Quản lý tài khoản.
Kịch bản chính 1 Người dùng nhập mật khẩu mới và xác nhận mật khẩu Sau đó bấm nút Xác nhận
2 Hệ thống xác thực thông tin và cập nhật mật khẩu mới thành công Ứng dụng trở về màn hình Quản lý tài khoản
Kịch bản thay thế - Người dùng nhập sai mật khẩu xác nhận
+ Yêu cầu người dùng xác nhận đúng mật khẩu
- Tài khoản của người dùng đã đăng nhập quá lâu + Yêu cầu người dùng đăng nhập lại để thực hiện thao tác
- Mật khẩu mới quá yếu
+ Yêu cầu người dùng sử dụng mật khẩu mạnh hơn
2.3.18 Xem danh sách sản phẩm yêu thích
Tên use-case Xem danh sách sản phẩm yêu thích
Mô tả tóm tắt Người dùng có thể xem danh sách sản phẩm yêu thích của mình
Người thực hiện Người dùng
Sự kiện kích hoạt Người dùng bấm nút Đã thích ở màn hình Quản lý tài khoản Điều kiện tiên quyết Thiết bị người dùng phải được kết nối internet
Người dùng phải đăng nhập trước đó Điều kiện kết quả Ứng dụng chuyển hướng đến màn hình Yêu thích
Kịch bản chính 1 Người dùng bấm nút Đã thích
2 Ứng dụng chuyển hướng đến màn hình Yêu thích và hiển thị danh sách sản phẩm đã thích
Kịch bản thay thế Không
2.3.19 Xem lịch sử mua hàng
Tên use-case Xem lịch sử mua hàng
Mô tả tóm tắt Người dùng có thể xem được những đơn hàng trong quá khứ đã đặt hàng và giao hàng thành công
Người thực hiện Người dùng
Để kích hoạt sự kiện, người dùng cần bấm nút "Lịch sử mua hàng" trên màn hình Quản lý tài khoản, với điều kiện thiết bị của họ phải được kết nối internet.
Người dùng phải đăng nhập trước đó Điều kiện kết quả Ứng dụng chuyển hướng đến màn hình Đơn hàng của bạn ở tab Đã nhận hàng
Kịch bản chính 1 Người dùng bấm nút Lịch sử mua hàng
2 Ứng dụng chuyển hướng đến màn hình Đơn hàng của bạn và hiển thị danh sách những đơn hàng đã hoàn thành
Kịch bản thay thế Không
Tên use-case Thêm địa chỉ
Mô tả tóm tắt Người dùng thêm địa chỉ giao hàng cho tài khoản
Người thực hiện Người dùng
Mô tả các màn hình
STT Biến cố Xử lý
1 Chọn Quên mật khẩu Chuyển đến màn hình Quên mật khẩu
2 Chọn Đăng nhập Thực hiện xác thực tài khoản và chuyển hướng đến màn hình chính
3 Chọn Đăng ký ngay Chuyển đến màn hình Đăng ký
4 Chọn đăng nhập bằng Google Thực hiện đăng nhập bằng tài khoản
5 Chọn đăng nhập bằng Facebook Thực hiện đăng nhập bằng tài khoản
STT Biến cố Xử lý
1 Chọn Đăng nhập Chuyển đến màn hình Đăng nhập
2 Chọn Đăng ký Thực hiện xác thực thông tin và đăng ký tài khoản mới, sau đó chuyển đến màn hình chính
3 Chọn đăng nhập bằng Google Thực hiện đăng nhập bằng tài khoản
Thực hiện đăng nhập bằng tài khoản Facebook
3.3 Màn hình quên mật khẩu
STT Biến cố Xử lý
1 Bấm icon button Back Trở về màn hình Đăng nhập
2 Chọn Khôi phục mật khẩu Thực hiện xác thực thông tin và gửi mail khôi phục đến email người dùng
STT Biến cố Xử lý
1 Chọn tìm kiếm sản phẩm Chuyển đến màn hình Tìm kiếm
2 Chọn danh mục sản phẩm Chuyển đến màn hình Danh mục sản phẩm
3 Chọn sản phẩm Chuyển đến màn hình Thông tin sản phẩm
4 Chọn thông báo Chuyển sang màn hình Thông báo
5 Chọn giỏ hàng Chuyển sang màn hình Giỏ hàng
6 Chọn tài khoản Chuyển đến màn hình Quản lý tài khoản
STT Biến cố Xử lý
1 Chọn Tất cả Lọc và hiển thị tất cả thông báo
2 Chọn Chưa đọc Lọc và hiển thị thông báo chưa đọc
3 Chọn Đã đọc Lọc và hiển thị thông báo đã đọc
4 Chọn Đọc hết Đánh dấu tất cả thông báo là đã đọc
STT Biến cố Xử lý
1 Chọn tất cả Đánh dấu tất cả sản phẩm là đã chọn để thanh toán
2 Xem sản phẩm Chuyển đến màn hình thông tin sản phẩm
3 Tick chọn sản phẩm Đánh dấu sản phẩm là đã chọn để thanh toán
4 Tăng/Giảm số lượng sản phẩm Điều chỉnh số lượng sản phẩm trong giỏ hàng
5 Xóa sản phẩm Xóa bỏ sản phẩm khỏi giỏ hàng
6 Thanh toán Tiến hành thanh toán những sản phẩm được chọn
3.7 Màn hình quản lý tài khoản
STT Biến cố Xử lý
1 Thay đổi thông tin Chuyển đến màn hình Chỉnh sửa thông tin
2 Xem đơn hàng của tôi Chuyển đến màn hình Đơn hàng của bạn
3 Chọn Chưa đánh giá Chuyển đến màn hình Đánh giá sản phẩm
4 Chọn Đã thích Chuyển đến màn hình Yêu thích
5 Chọn Lịch sử mua hàng Chuyển đến màn hình Đơn hàng của bạn
6 Chọn Địa chỉ giao hàng Chuyển đến màn hình Thay đổi địa chỉ
7 Chọn Thay đổi mật khẩu Chuyển đến màn hình Thay đổi mật khẩu
8 Chọn Đăng xuất Tiến hành đăng xuất tài khoản khỏi ứng dụng
STT Biến cố Xử lý
1 Chọn từ khóa từ danh sách đề xuất
Tiến hành tìm kiếm sản phẩm theo từ khóa đề xuất được chọn
2 Nhập từ khóa và bấm Tìm kiếm Tiến hành tìm kiếm sản phẩm theo từ khóa mới
3 Chọn icon button Back Trở về màn hình Trang chủ
3.9 Màn hình kết quả tìm kiếm
STT Biến cố Xử lý
1 Sắp xếp sản phẩm Tiến hành sắp xếp lại kết quả theo tiêu chí nhất định
2 Chọn sản phẩm Chuyển đến màn hình Thông tin sản phẩm
3 Chọn icon button Back Trở về màn hình Tìm kiếm
3.10 Màn hình danh mục sản phẩm
STT Biến cố Xử lý
1 Tìm kiếm sản phẩm Chuyển đến màn hình Tìm kiếm sản phẩm
2 Chọn danh mục Chuyển sang danh mục sản phẩm khác
3 Sắp xếp sản phẩm Tiến hành sắp xếp sản phẩm theo tiêu chí được chọn
4 Chọn sản phẩm Chuyển đến màn hình Thông tin sản phẩm
5 Chọn icon button Back Trở về màn hình Trang chủ
3.11 Màn hình thông tin sản phẩm
STT Biến cố Xử lý
1 Chọn icon button Yêu thích Thêm sản phẩm vào danh sách yêu thích
(hoặc xóa khỏi danh sách nếu đang có) của tài khoản
2 Chọn Xem thêm/Ẩn bớt Hiển thị đầy đủ/thu gọn mô tả sản phẩm
3 Chọn Xem thêm đánh giá Chuyển đến màn hình tất cả đánh giá
4 Chọn Thêm vào giỏ hàng Tiến hành thêm sản phẩm vào giỏ hàng
5 Chọn Đặt mua ngay Chuyển đến màn hình Thanh toán đơn hàng
3.12 Màn hình thanh toán đơn hàng
STT Biến cố Xử lý
1 Thay đổi địa chỉ giao hàng Chuyển đến màn hình Thay đổi địa chỉ
2 Thay đổi phương thức vận chuyển
Chuyển đến màn hình Chọn phương thức vận chuyển
3 Thay đổi phương thức thanh toán
Chuyển đến màn hình Chọn phương thức thanh toán
4 Chọn Đặt hàng Tiến hành xử lý và tạo đơn hàng
3.13 Màn hình đơn hàng của bạn
STT Biến cố Xử lý
1 Chọn xem các trạng thái khác Chuyển san màn hình chứa đơn hàng của các trạng thái khác
2 Chọn đơn hàng Chuyển đến màn hình Chi tiết đơn hàng
3 Chọn icon button Back Trở về màn hình Quản lý tài khoản
3.14 Màn hình đánh giá sản phẩm
STT Biến cố Xử lý
1 Chọn số sao đánh giá Tô đậm số sao tương ứng
2 Nhập đánh giá Hiển thị nội dung đã nhập
3 Chọn Hoàn tất Lưu đánh giá cho sản phẩm
4 Hủy Ẩn bottom sheet đánh giá sản phẩm
3.15 Màn hình chỉnh sửa thông tin
STT Biến cố Xử lý
1 Chọn thay đổi ảnh Thay đổi ảnh đại diện của người dùng
2 Nhập tên mới Hiển thị tên mới
3 Nhập số điện thoại Hiện thị số điện thoại mới
4 Chọn giới tính Hiển thị giới tính đã chọn
5 Chọn ngày sinh Hiển thị ngày sinh đã chọn
6 Chọn Cập nhật Cập nhật thông tin mới lên hệ thống
7 Chọn icon button Back Trở lại màn hình Quản lý tài khoản
STT Biến cố Xử lý
1 Chọn sản phẩm Chuyển đến màn hình thông tin sản phẩm
2 Chọn Đặt mua ngay Thêm sản phẩm vào giỏ hàng
3 Chọn Xóa sản phẩm Bỏ yêu thích sản phẩm
4 Chọn icon button Back Trở về màn hình Quản lý tài khoản
3.17 Màn hình thay đổi địa chỉ
STT Biến cố Xử lý
1 Chọn làm địa chỉ mặc định Cập nhật địa chỉ mặc định mới trên hệ thống
2 Xóa địa chỉ Xóa địa chỉ khỏi danh sách địa chỉ
3 Chọn icon button Back Trở về màn hình trước đó
4 Thêm địa chỉ mới Chuyển đến màn hình Địa chỉ mới
5 Nhập thông tin Hiển thị các thông tin mới của địa chỉ
6 Chọn hoàn tất Thêm địa chỉ mới vào danh sách địa chỉ
3.18 Màn hình thay đổi mật khẩu
STT Biến cố Xử lý
1 Nhập mật khẩu mới Hiển thị mật khẩu mới
2 Nhập mật khẩu xác nhận Hiển thị mật khẩu xác nhận
3 Chọn Ẩn/Hiện mật khẩu Hiển thị mật khẩu dưới dạng Ẩn (ký tự *) hoặc Hiện
4 Chọn Xác nhận Thực hiện xác thực mật khẩu và cập nhật mật khẩu cho tài khoản
5 Chọn icon button Back Trở về màn hình Quản lý tài khoản
3.19 Màn hình chọn phương thức vận chuyển
STT Biến cố Xử lý
1 Chọn phương thức vận chuyển Hiển thị lại phương thức vận chuyển được chọn
2 Chọn Xác nhận Trở về màn hình Thanh toán và cập nhật lại phương thức vận chuyển cho đơn hàng
3 Chọn icon button Back Trở về màn hình Thanh toán
3.20 Màn hình chọn phương thức thanh toán
STT Biến cố Xử lý
1 Chọn phương thức thanh toán Cập nhật lại phương thức thanh toán được chọn
2 Chọn Xác nhận Trở về màn hình Thanh toán và cập nhật lại phương thức thanh toán
3 Chọn icon button Back Trở về màn hình Thanh toán
