đồ án 1 xây dựng ứng dụng giải trí luyện ngôn ngữ

10 TÓM TẮT ĐỒ ÁN Trong đồ án "Xây dựng ứng dụng giải trí luyện ngôn ngữ", em tập trung vào phát triển một ứng dụng di động với tên gọi là “AtoZ - Ứng dụng giải trí luyện ngôn ngữ”, với m

ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN

KHOA CÔNG NGHỆ PHẦN MỀM

ĐỒ ÁN 1

XÂY DỰNG ỨNG DỤNG GIẢI TRÍ LUYỆN NGÔN NGỮ

GV HƯỚNG DẪN: ThS Trần Thị Hồng Yến

SV THỰC HIỆN:

Nguyễn Quốc Khánh -21520982

TP HỒ CHÍ MINH, 2023

NHẬN XÉT CỦA GIẢNG VIÊN

Ths Trần Thị Hồng Yến

LỜI CẢM ƠN

Lời đầu tiên, em xin gửi lời tri ân sâu sắc đến Cô Trần Thị Hồng Yến vì đã đồng hành cùng em trong suốt chặng đường thực hiện môn Đồ án 1 Qua thời gian đó, em đã gặp không ít trở ngại, nhưng nhờ sự hướng dẫn tận tình của Cô mà em đã vượt qua được những khó khăn đó Sự nhiệt huyết và tận tâm của Cô Yến không chỉ là nguồn động viên lớn mà còn là nguồn động lực mạnh mẽ, giúp em vượt qua được những thách thức và hoàn thành được đồ án này

Em cũng xin được gửi lời cảm ơn chân thành đến Ban Giám Hiệu trường Đại Học Công Nghệ Thông Tin vì sự quan tâm và hỗ trợ liên tục của Trường Chính vì Trường đã tạo ra môi trường học tập tích cực và đầy đủ điều kiện cho chúng em phát triển, em mới được trang bị đầy đủ kiến thức, qua đó vận dụng tốt các kiến thức và kỹ năng đã được họp trong môn Nhập môn công nghệ phần mềm, cũng như kiến thức về lập trình và tổ chức cơ sở dữ liệu

Tuy trong quá trình nghiên cứu đề tài, em vẫn còn rất nhiều thiếu sót khi tìm hiểu, đánh giá, trình bày về đề tài, em rất mong nhận được sự quan tâm, góp ý của cô và Ban Giám Hiệu nhà trường để em có thể phát triển đề tài của mình hơn

Một lần nữa, em xin chân thành cảm ơn Cô và Ban Giám Hiệu Nhà trường

Trân trọng,

Nguyễn Quốc Khánh

1.3 Mục tiêu của đề tài 12

1.4 Phương pháp nghiên cứu 12

1.5 Đối tượng và phạm vi nghiên cứu 13

1.5.1 Đối tượng nghiên cứu 13

Chương 3 PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG 21

3.1 Sơ đồ use case 21

3.2 Sơ đồ lớp 30

Chương 4 CÀI ĐẶT VÀ TRIỂN KHAI HỆ THỐNG 32

4.1 Môi trường cài đặt 32

4.1.1 Phía server 32

4.1.2 Phía client 32

4.1.3 Môi trường phát triển 32

4.2 Thiết kế giao diện 33

7

DANH MỤC HÌNH ẢNH

Hình 2.1: Ngôn ngữ lập trình Dart 14

Hình 2.2: Framework Flutter 15

Hình 2.3: Môi trường NodeJS 16

Hình 2.4: Cơ sở dữ liệu MongoDB 17

Hình 2.5: Firebase 18

Hình 2.6: Công cụ kiểm thử Postman 19

Hình 3.1: Sơ đồ use case đăng nhập 21

Hình 3.2: Sơ đồ use case màn hình Journey 22

Hình 3.3: Sơ đồ use case màn hình Practice 22

Hình 3.4: Sơ đồ use case màn hình Leaderboard và Profile 23

8

Hình 4.19: Màn hình game Connect string 42

Hình 4.20: Màn hình kết quả game Connect string 42

Hình 4.21-22: Màn hình đáp án của game Connect string 43

Hình 4.23: Màn hình game Fill answer 44

Hình 4.24: Màn hình game Reorder sentence 45

Hình 4.25-26: Màn hình game Word categorize 46

Hình 4.27: Màn hình kết quả 47

Hình 4.28-29: Màn hình Reading Test 48

Hình 4.30: Màn hình bảng xếp hạng 49

Hình 4.31: Màn hình hồ sơ người dùng 50

Hình 4.32: Màn hình chỉnh sửa hồ sơ người dùng 50

Hình 4.33: Màn hình đổi giao diện người dùng 51

Hình 4.34: Màn hình xác nhận chỉnh sửa hồ sơ người dùng 51

Hình 4.35-36: Màn hình biểu đồ thống kê điểm của người dùng 52

Hình 4.37-38: Màn hình practice screen của Administrator 53

Hình 4.39: Màn hình danh sách các câu hỏi reading 54

Hình 4.40: Màn hình tạo mới bài reading 54

Hình 4.41-42: Màn hình mẫu câu hỏi Reading 55

9

DANH MỤC BẢNG

Bảng 3.1: Bảng dach sách các actor 23

Bảng 3.2: Bảng mô tả use case 23

Bảng 3.3: Bảng đặc tả use case đăng ký 24

Bảng 3.4: Bảng đặc tả use case đăng nhập 25

Bảng 3.5: Bảng đặc tả use case màn hình set up 25

Bảng 3.6: Bảng đặc tả use case màn hình Journey 26

Bảng 3.7: Bảng đặc tả use case màn hình pratice 27

Bảng 3.8: Bảng đặc tả use case màn hình Leaderboard 27

Bảng 3.9: Bảng đặc tả use case màn hình User Profile 28

Bảng 3.10: Bảng đặc tả use case màn hình admin 28

Bảng 3.11: Bảng mô tả các trường dữ liệu 30

10

TÓM TẮT ĐỒ ÁN

Trong đồ án "Xây dựng ứng dụng giải trí luyện ngôn ngữ", em tập trung vào phát triển một ứng dụng di động với tên gọi là “AtoZ - Ứng dụng giải trí luyện ngôn ngữ”, với mục đích cung cấp trải nghiệm học tập ngôn ngữ đa dạng và thú vị cho người dùng Ứng dụng này bao gồm các chức năng chính như bài kiểm tra từ vựng, trò chơi giáo dục, và thống kê tiến độ học tập Sử dụng các công nghệ lập trình phù hợp và cơ sở dữ liệu, đồ án nhằm tạo ra một môi trường học tập linh hoạt, tích cực, và đồng thời đảm bảo tính hấp dẫn và giải trí cho người sử dụng Mục tiêu cuối cùng là đạt được phản hồi tích cực từ người dùng và tạo ra một ứng dụng hữu ích trong lĩnh vực giáo dục và giải trí luyện ngôn ngữ

Nội dung đồ án được trình bày trong 5 chương, như sau:

• Chương 01 – Mở đầu: Giới thiệu sơ lược về đề tài đã chọn, lý do chọn đề tài này, mục tiêu, phương pháp nghiên cứu, đối tượng và phạm vi nghiên cứu • Chương 02 – Kiến thức và công nghệ nền tảng: Giới thiệu về các công nghệ

được sử dụng, cách thức hoạt động, ưu điểm của các công nghệ đó

• Chương 03 – Xây dựng ứng dụng: Mô tả các sơ đồ đặc tả Use Case, quy trình sử dụng, trình tự hệ thống, thiết kế dữ liệu

• Chương 04 – Cài đặt và triển khai hệ thống: Mô tả môi trường cài đặt và thiết kế giao diện người dùng

• Chương 05 – Tổng kết: Trình bày ngắn gọn kết quả đạt được trong quá trình thực hiện đồ án, các hạn chế và định hướng phát triển trong tương lai

11

Chương 1 MỞ ĐẦU

1.1 Giới thiệu về đề tài

Trong bối cảnh thế giới ngày càng hội nhập, việc biết nhiều ngôn ngữ là điều

nên bắt đầu ngay từ khi ta còn trẻ, vì khi đó chúng ta sẽ tiếp thu kiến thức mới nhanh hơn so với khi chúng ta già đi Tuy nhiên, không phải người trẻ nào cũng có điều kiện để đầu tư cho bản thân học thêm ngôn ngữ mới, và cũng không đủ kiên nhẫn để theo học ngôn ngữ đó tới cùng, nên dễ xảy ra tâm trạng chán nản, từ bỏ

Với thực trạng trên, việc phát triển một công cụ để hỗ trợ cho các bạn trẻ có thể dễ dàng tiếp cận với việc học ngôn ngữ là rất cần thiết Nó không chỉ giúp cho các bạn có những bài học bổ ích, mà còn giúp tiết kiếm thời gian, công sức mà quan trọng nhất là tiền bạc – thứ mà phần lớn những người trẻ như học sinh, sinh viên không có – để đi học ngôn ngữ ở các trung tâm

Chính vì thế, em quyết định đăng ký đề tài “Xây dựng ứng dụng giải trí học ngôn ngữ” để giúp cho các bạn học sinh, sinh viên hay thậm chí là người lớn có thể tự học

bất kỳ ngôn ngữ nào mà không cần phải ra trung tâm hoặc mua sách về học Ứng dụng này không chỉ tạo ra với mục đích học tập mà còn là để giải trí bằng nhiều trò chơi khác nhau, giúp cho người dùng có thể vừa học vừa chơi sau những giờ học tập và làm việc căng thẳng Em tin rằng ứng dụng Giải trí luyện ngôn ngữ AtoZ sẽ là công cụ hữu ích cũng như là người bạn đồng hành tốt nhất cho mọi người.

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

Lý do mà em chọn đề tài này là vì:

12

- Tầm quan trọng của học ngôn ngữ: Việc học ngôn ngữ không chỉ là một kỹ

năng hữu ích mà còn là một cánh cửa mở ra nhiều cơ hội trong cuộc sống nói riêng và trong sự nghiệp nói chung

- Cơ hội tiếp cận thị trường lớn: Ứng dụng AtoZ có khả năng tiếp cận đến đa

dạng đối tượng người dùng không chỉ vì AtoZ có giao diện ưa nhìn, bắt mắt mà còn mang đến cho người dùng những game giải trí giải tỏa căng thẳng Việc kết hợp giải trí và học tập là một cách mạnh mẽ để khích lệ người học, tạo động lực và giữ cho họ cam kết với quá trình học

- Học tập và nghiên cứu ngôn ngữ mới: Em chọn đề tài này là để cho bản thân

cơ hội nghiên cứu và xây dựng, phát triển một ứng dụng trên nền tảng di động, sử dụng công nghệ Flutter

1.3 Mục tiêu của đề tài

Mục tiêu của đề tài này là xây dựng phần mềm ứng dụng giải trí luyện ngôn ngữ để giúp cho những người có nhu cầu (nhất là các bạn học sinh, sinh viên) có thể dễ dàng tự học ngôn ngữ, cũng như là giải tỏa căng thẳng sau những giờ học và làm việc mệt mỏi

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

- Trải nghiệm và quan sát các ứng dụng luyện ngôn ngữ hiện có trên thị trường như “Duolingo”, “Memrise”, “Cake”,… Từ đó, đề ra các yêu cầu chức năng và phi chức năng

- Phân tích ưu và nhược điểm của các ứng dụng nêu trên, từ đó rút kinh nghiệm và áp dụng để phát triển đề tài

- Khảo sát ý kiến của các bạn sinh viên cùng tuổi và các bạn học sinh về giao diện và nhu cầu chức năng mong muốn của từng đối tượng

- Nghiên cứu tài liệu các công nghệ liên quan, cập nhật phiên bản mới và ứng dụng chúng

- Hoàn thiện sản phẩm

1.5.2 Phạm vi nghiên cứu

- Ứng dụng sẽ bao gồm một màn hình chứa các màn chơi, qua đó người dùng sẽ được chọn vòng bất kỳ mà mình muốn chơi Ngoài ra sẽ có một màn hình khác giúp cho người sử dụng luyện hai kỹ năng đọc và viết, màn hình theo dõi xếp hạng của người dùng và màn hình hồ sơ cá nhân của người dùng

- Đề tài này sẽ tập trung vào phát triển tính năng cụ thể của người dùng, bao gồm nhiều loại trò chơi đa dạng, tính năng gợi ý bài học phù hợp vào trình độ mà người dùng đã chọn, thuật toán tự động nâng cấp trình độ người dùng sau khi đã hoàn thành đủ số màn chơi tương ứng, và một biểu đồ phân tích quá trình học của người dùng

- Nghiên cứu các công nghệ và framework được sử dụng trong việc phát triển ứng dụng như Flutter và Dart, môi trường xây dựng backend server như NodeJS, hệ quản trị cơ sở dữ liệu MongoDB, công cụ kiểm thử API Postman, và các dịch vụ khác như Firebase, Github, Figma,…

- Áp dụng các thư viện khác của Flutter để xây dựng và hoàn thiện giao diện người dùng đẹp, dễ sử dụng, bắt mắt cho người dùng

14

Chương 2 TỔNG QUAN VỀ CÔNG NGHỆ SỬ DỤNG 2.1 Dart

Hình 2.1: Ngôn ngữ lập trình Dart

Khái niệm: Dart, là một ngôn ngữ lập trình đa mục đích mã nguồn mở, đã được đặt nền móng bởi Google Đây là một khía cạnh của ngôn ngữ lập trình hướng đối tượng, đặc trưng bởi cú pháp kiểu C Tinh thần lập trình hướng đối tượng thể hiện qua việc hỗ trợ giao diện và lớp, mở ra khả năng sáng tạo không giới hạn khi đặt lên bàn cân với những ngôn ngữ khác Sự đa dạng của Dart thể hiện thông qua khả năng phát triển ứng dụng web, di động, máy chủ và máy tính để bàn

Ưu điểm nổi bật:

• Là ngôn ngữ mở rộng, linh hoạt, tạo điều kiện tích cực cho việc biên dịch trở nên nhanh chóng hơn

• Có tính ổn định tốt, được sử dụng để xây dựng các ứng dụng về thời gian thực với hiệu suất cao

• Hỗ trợ cả biên dịch Vừa đúng lúc (JIT) và biên dịch Trước thời hạn (AOT) • Có thể thích ứng nhanh chóng với các quy trình công việc có sự thay đổi

15

2.2 Flutter

Hình 2.2: Framework Flutter

Khái niệm: Flutter là một framework phát triển ứng dụng di động open-source được phát triển bởi Google Nó cho phép lập trình viên xây dựng ứng dụng di động chất lượng cao từ một mã nguồn duy nhất và triển khai chúng trên nhiều nền tảng khác nhau như Android, iOS, web và desktop

Đặc điểm nổi bật:

• Ngôn ngữ lập trình Dart: Flutter sử dụng Dart, một ngôn ngữ lập trình được phát triển bởi Google, cho cả lớp logic ứng dụng và giao diện người dùng • Widget-based UI: Flutter sử dụng mô hình lập trình dựa trên widget, là các

thành phần xây dựng giao diện người dùng Các widget có thể được kết hợp để tạo thành giao diện người dùng phức tạp

• Đa nền tảng: Với Flutter, bạn có thể xây dựng một ứng dụng và triển khai nó trên nhiều nền tảng khác nhau mà không cần viết lại mã nguồn nhiều lần Điều này giúp giảm chi phí phát triển và duy trì ứng dụng

• Expressive and Flexible UI: Có rất nhiều các thành phần để xây dựng giao diện của Flutter vô cùng đẹp mắt theo phong cách Material Design và Cupertino, hỗ trợ nhiều các APIs chuyển động, smooth scrolling

16

• Fast Development: Tíng năng Hot Reload hoạt động trong milliseconds để hiện thị giao diện tới bạn Sử dụng tập hợp các widget có thể customizable để xây dựng giao diện trong vài phút Ngoài ra Hot Reload còn giúp bạn thêm các tính năng, fix bug tiết kiệm thời gian hơn mà không cần phải thông qua máy ảo, máy android hoặc iOS

2.3 Node JS

Hình 2.3: Môi trường NodeJS

Khái niệm: Node.js là một môi trường chạy mã nguồn mở dựa trên JavaScript, được xây dựng trên V8, động cơ JavaScript của Google Chrome Nó cho phép phát triển các ứng dụng mạng nhanh chóng và mở rộng quy mô dễ dàng Node.js được phát triển bởi Ryan Dahl vào năm 2009 và đã trở thành một công cụ phổ biến trong việc phát triển phần mềm, đặc biệt là về phía server-side trong các ứng dụng web

Ưu điểm nổi bật:

• Node.js sử dụng mô hình I/O không chặn (non-blocking I/O), giúp xử lý nhiều kết nối cùng lúc một cách hiệu quả Điều này làm cho Node.js rất phù hợp cho việc xây dựng các ứng dụng mạng có hiệu suất cao, như chơi game trực tuyến, chat, hoặc các ứng dụng cần xử lý một lượng lớn dữ liệu thời gian thực

17

• Node.js mở rộng khả năng của JavaScript từ client-side đến server-side, giúp các nhà phát triển có thể sử dụng một ngôn ngữ duy nhất cho cả frontend và backend, đơn giản hóa quá trình phát triển

• Với cộng đồng lập trình viên lớn và sôi động, Node.js có một hệ sinh thái thư viện mạnh mẽ, được quản lý thông qua npm (Node Package Manager), giúp dễ dàng tìm và sử dụng hàng ngàn module và công cụ

2.4 Mongo DB

Hình 2.4: Cơ sở dữ liệu MongoDB

Khái niệm: MongoDB là một hệ thống quản lý cơ sở dữ liệu NoSQL mã nguồn mở, sử dụng mô hình dữ liệu dạng tài liệu (document-oriented) Được ra mắt vào năm 2009, MongoDB được thiết kế để cung cấp một cách lưu trữ dữ liệu linh hoạt, mở rộng quy mô dễ dàng, và dễ dàng tích hợp với ứng dụng hiện đại Nó lưu trữ dữ liệu dưới dạng tài liệu BSON (một định dạng giống JSON), giúp nó trở thành một lựa chọn phổ biến cho các ứng dụng web và mobile

Ưu điểm nổi bật:

• MongoDB không yêu cầu một cấu trúc dữ liệu cố định, cho phép lưu trữ tài liệu có cấu trúc đa dạng Điều này giúp dễ dàng thích nghi với thay đổi yêu cầu và dữ liệu

18

• MongoDB cung cấp hiệu suất truy vấn cao, đặc biệt là với các hoạt động đọc và ghi dữ liệu Các chỉ mục được hỗ trợ tốt giúp tăng cường hiệu suất truy vấn • Hỗ trợ mở rộng quy mô theo chiều ngang thông qua sharding, cho phép quản

lý hiệu quả lượng lớn dữ liệu và giao dịch

2.5 Firebase

Hình 2.5: Firebase

Khái niệm: Firebase là một nền tảng của Google cung cấp nhiều dịch vụ và công cụ để phát triển và quản lý ứng dụng di động và web Firebase được thiết kế để giảm bớt gánh nặng cho các nhà phát triển bằng cách cung cấp các tính năng quản lý cơ sở dữ liệu, xác thực người dùng, lưu trữ tệp, và nhiều tính năng khác

Ưu điểm nổi bật:

• Cơ sở Dữ liệu Firestore và Realtime: Firebase cung cấp cơ sở dữ liệu Firestore, một cơ sở dữ liệu NoSQL dựa trên tài liệu, và Realtime Database, một cơ sở dữ liệu JSON thời gian thực Cả hai đều giúp lưu trữ và đồng bộ dữ liệu giữa các ứng dụng di động và web

19

• Xác thực người dùng : Firebase cung cấp dịch vụ xác thực người dùng, giúp quản lý đăng ký, đăng nhập và xác thực người dùng thông qua nhiều phương tiện đăng nhập như email, Google, Facebook, Twitter, và nhiều hơn nữa • Lưu Trữ Tệp: Dịch vụ lưu trữ của Firebase cho phép bạn lưu trữ và quản lý

tệp như hình ảnh, video, và tệp tin khác trên đám mây

• Cloud Functions: Firebase Cloud Functions cho phép bạn triển khai mã nguồn và chạy các chức năng (functions) trên đám mây một cách tự động khi có sự kiện kích hoạt, chẳng hạn như khi có sự thay đổi trong cơ sở dữ liệu

• Hosting và CDN: Firebase Hosting cung cấp một nền tảng để triển khai và chạy ứng dụng web của bạn trên các máy chủ toàn cầu với hỗ trợ CDN, giúp tối ưu hóa hiệu suất của ứng dụng

2.6 Postman

Hình 2.6: Công cụ kiểm thử Postman

Khái niệm: Postman hiện là một trong những công cụ phổ biến nhất được sử dụng trong kiểm thử API Nó bắt đầu vào năm 2012 như một dự án phụ của Abhinav Asthana để đơn giản hóa quy trình làm việc API trong kiểm thử và phát triển API là viết tắt của giao diện lập trình ứng dụng cho phép các ứng dụng phần mềm giao tiếp với nhau thông qua các lệnh gọi API

Ưu điểm nổi bật:

20

• Khả năng truy cập: Để sử dụng Postman, người ta chỉ cần đăng nhập vào tài khoản của chính họ để dễ dàng truy cập các tệp mọi lúc, mọi nơi miễn là ứng dụng Postman được cài đặt trên máy tính

• Sử dụng Collection: Postman cho phép người dùng tạo collection cho các lệnh gọi API của họ Mỗi collection có thể tạo các thư mục con và nhiều yêu cầu Điều này giúp tổ chức lại các bộ kiểm thử của bạn

• Cộng tác: Collection và môi trường có thể được nhập hoặc xuất để dễ dàng chia sẻ tệp Một liên kết trực tiếp cũng có thể được sử dụng để chia sẻ collection

• Tích hợp nhiều phương thức HTTP: Postman hỗ trợ nhiều phương thức HTTP như GET, POST, PUT, DELETE, và nhiều phương thức khác, giúp người dùng kiểm thử và thực hiện các yêu cầu API đa dạng

• Quản lý biến môi trường: Người dùng có thể định nghĩa và quản lý các biến môi trường, giúp tái sử dụng giá trị và giảm thiểu lỗi khi thực hiện các yêu cầu API khác nhau

• Kiểm thử tự động: Postman cung cấp khả năng kiểm thử tự động cho các API, giúp tiết kiệm thời gian và tăng tính ổn định của ứng dụng

• Dễ dàng mở rộng: Postman có thể mở rộng thông qua các add-on và tích hợp với nhiều dịch vụ khác nhau, giúp nó trở thành một công cụ linh hoạt cho quản lý API

21

Chương 3 PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG 3.1 Sơ đồ use case

3.1.1 Sơ đồ use case đăng nhập

Hình 3.1: Sơ đồ use case đăng nhập

22

3.1.2 Sơ đồ use case màn hình “journey”

Hình 3.2: Sơ đồ use case màn hình Journey

3.1.3 Sơ đồ use case màn hình “practice”

Hình 3.3: Sơ đồ use case màn hình Practice

23

3.1.4 Sơ đồ use case màn hình “leaderboard” và “profile”

Hình 3.4: Sơ đồ use case màn hình Leaderboard và Profile

3.1.5 Danh sách các Actors

Bảng 3.1: Bảng dach sách các actor

dụng (đã đăng ký hoặc chưa đăng ký tài khoản) có quyền truy cập vào tài nguyên dùng chung và những tài khoản đã đăng ký có thể sử dụng tài nguyên tốt hơn Người quản lý (admin) Là người nắm quyền toàn bộ hoạt động

trên ứng dụng và quản lý các tài nguyên

24

3.1.6 Mô tả Use case

Bảng 3.2: Bảng mô tả use case

Vai trò ID Tên Use case Mô tả Use case

User UC01 Sign up Use case Người dùng có thể điền email và password để đăng ký mới một tài khoản

UC02 Sign in Use case Người dùng có thể điền email và password để đăng nhập một tài khoản đã được đăng ký trước

UC03 Set up Use case Người dùng chọn ngôn ngữ và mức độ khó mà mình muốn học, sau đó một bài test ngắn sẽ được thực hiện để kiểm tra trình độ của người dùng

Use case

Người dùng chọn màn (stage) của mình và tiến hành trả lời các câu hỏi đề qua màn Sau khi trả lời xong, câu hỏi sẽ lưu lại và người dùng sẽ được đi tới những câu hỏi tiếp theo

UC05 Practice Screen Use case

Người dùng có thể từ Practice Screen và navigate tới những Screen: Reading, Writing, Listening, Speaking

Screen Use case

Người dùng có thể xem thứ hạng hiện tại của mình và thứ hạng của những người chơi khác Người dùng có thể bấm vào một người chơi bất kỳ để xem thông tin cá nhân (có thể xem

25

được) của người dùng đó

UC07 Profile Screen Người dùng có thể xem và chỉnh sửa hồ sơ của mình, xem biểu đồ thống kê về thời gian học tập vừa qua của mình và đăng xuất

Question

Người dùng admin có thể xem các câu hỏi đã được lưu trong cơ sở dữ liệu, sửa chữa hoặc xóa nó

Question

Ngưởi dùng admin có thể tạo mới câu hỏi cho bộ câu hỏi trong Reading và Writing thêm đa dạng

3.1.7 Đặc tả Use case

3.1.7.1 Sign up Use case

Bảng 3.3: Bảng đặc tả use case đăng ký

Use case’s name Sign up Use case

Pre-condition Người dùng phải Navigate tới trang Sign up

Basic flow 1 Người dùng truy cập vào ứng dụng giải trí luyện ngôn ngữ AtoZ

2 Người dùng được redirect tới trang Sign In

3 Người dùng bấm vào mục “Does not have an account? Create a new account now”

4 Người dùng sẽ được redirect tới trang Sign Up 5 Người dùng điền hết tất cả thông tin

6 Bấm vào nút “Sign Up”

Alternative flow Người dùng bấm vào nút “Sign in with Google” để đăng ký và đăng nhập bằng tài khoản google của mình

26

Post-condition Hệ thống sẵn sàng cho hoạt động tiếp theo

3.1.7.2 Sign in Use case

Bảng 3.4: Bảng đặc tả use case đăng nhập

Use case’s name Sign in Use case

Pre-condition Người dùng mở ứng dụng AtoZ

Basic flow 1 Người dùng truy cập vào ứng dụng giải trí luyện ngôn ngữ AtoZ

2 Người dùng được redirect tới trang Sign In 3 Người dùng điền hết tất cả thông tin

4 Bấm vào nút “Sign In”

5 Nếu email và password mà người dùng nhập khớp với một tài khoản đã tồn tại, người dùng sẽ được di chuyển tới bàn hình home của ứng dụng, nếu không sẽ báo lỗi “The email or password you’ve just entered is

incorrect” Alternative flow Không

Post-condition Hệ thống sẵn sàng cho hoạt động tiếp theo Extend point Không

3.1.7.3 Set up Use case

Bảng 3.5: Bảng đặc tả use case màn hình set up

Use case’s name Set up Use case

Pre-condition Người dùng phải được xác thực tài khoản từ trước

3 Người dùng bấm vào nút “Finalize” để kết thúc quá trình set up của mình

Alternative flow Không

Post-condition Hệ thống sẵn sàng cho hoạt động tiếp theo

3.1.7.4 Journey Mode Use case

Bảng 3.6: Bảng đặc tả use case màn hình Journey

Use case’s name Journey Mode Use case

Pre-condition Người dùng phải được xác thực tài khoản từ trước

Basic flow 1 Người dùng navigate tới trang Journey Screen 2 Người dùng select vòng (stage) mà mình muốn chơi 3 Người dùng bấm vào vòng đó sẽ được đưa tới level

tương ứng và tiến hành chơi

4 Sau khi đã chơi xong hệ thống sẽ chấm điểm dựa trên số câu trả lời đúng của người dùng và đưa người dùng đến màn chơi tiếp theo

Alternative flow Không

Post-condition Hệ thống sẵn sàng cho hoạt động tiếp theo

28

3.1.7.5 Practice Mode Use case

Bảng 3.7: Bảng đặc tả use case màn hình pratice

Use case’s name Practice mode Use case

Pre-condition Người dùng phải được xác thực tài khoản từ trước

Basic flow 1 Người dùng navigate tới trang Practice Screen 2 Người dùng chọn kỹ năng mà mình muốn rèn luyện 3 Người dùng bấm vào nút “Start” để tiến hành trả lời các

bộ câu hỏi dành riêng cho các kỹ nẵng đó Alternative flow Không

Post-condition Hệ thống sẵn sàng cho hoạt động tiếp theo

3.1.7.6 Leaderboard Use case

Bảng 3.8: Bảng đặc tả use case màn hình Leaderboard

Use case’s name Leaderboard screen Use case

Pre-condition Người dùng phải được xác thực tài khoản từ trước

Basic flow 1 Người dùng navigate tới trang Leaderboard screen 2 Người dùng có thể xem thứ hạng hiện tại của mình và

của những người chơi khác

3 Người dùng có thể bấm vào một người chơi bất kỳ để xem thông tin chi tiết về người chơi đó

Alternative flow Không

Post-condition Hệ thống sẵn sàng cho hoạt động tiếp theo

29

3.1.7.7 Profile Use case

Bảng 3.9: Bảng đặc tả use case màn hình User Profile

Use case’s name Profile Use case

Pre-condition Người dùng phải được xác thực tài khoản từ trước

Basic flow 1 Người dùng navigate tới trang Profile Screen

2 Người dùng có thể xem thông tin cá nhân của mình, biểu đồ thống kê quá trình học tập của mình

3 Người dùng có thể bấm vào icon button hình “cây bút” để navigate tới trang Edit user profile

4 Người dùng có thể xem lại và sửa chữa thông tin cá nhân của mình ở màn hình này, sau khi sửa chữa thì bấm “Confirm” để hoàn tất

Alternative flow Không

Post-condition Hệ thống sẵn sàng cho hoạt động tiếp theo

3.1.7.8 Admin Use case

Bảng 3.10: Bảng đặc tả use case màn hình admin

Use case’s name Admin Use case

Pre-condition Người dùng phải được xác thực là “admin”

Basic flow 1 Người dùng truy cập đến tên miền của backend website của app

30

2 Người dùng có thể xem danh sách các bộ câu hỏi đã được lưu, hoặc tạo mới một câu hỏi để thêm vào trong bộ câu hỏi của ứng dụng

Alternative flow Không

Post-condition Hệ thống sẵn sàng cho hoạt động tiếp theo

3.2 Sơ đồ lớp

Hình 3.5: Sơ đồ lớp của ứng dụng