đồ án 1 xây dựng ứng dụng luyện toeic

Ngôn ngữ lập trình Javascript

Giới thiệu Javascript [1] 7 2.1.2 Cú pháp Javascript cơ bản 7 2.1.2.1 Cách đặt tên biến, hàm và khai báo biến 7 2.1.2.2 Toán tử trong Javascript 8 2.2 Ngôn ngữ HTML 8 2.2.1 Giới thiệu 8 2.2.2 Ưu điểm [2] 8 2.2.3 Nhược điểm .9 2.3

- JavaScript là một ngôn ngữ lập trình dành cho việc tạo và phát triển web Nó được nhúng vào trong file HTML giúp cho website trở nên sống động và đẹp hơn. JavaScript có thể cập nhật và thay đổi cả HTML và CSS

- JavaScript còn là một ngôn ngữ lập trình đa nền tảng, ngoài dành cho việc lập trình frontend trên nền tảng web ra thì nó còn được sử dụng cho việc lập trình và phát triển ứng dụng trên nền tảng mobile

2.1.2 Cú pháp Javascript cơ bản

2.1.2.1 Cách đặt tên biến, hàm và khai báo biến

- Trong Javascript, định danh (identifiers) được sử dụng để đặt tên biến, từ khóa, hàm và labels

Hình 2.1 Ví dụ về cách đặt tên biến, hàm trong JavaScript

- Javascript hỗ trợ 3 cách để khai báo một biến, đó là sử dụng các từ khóa sau:

• Const: được dùng để khai báo hằng số, giá trị của nó không thay đổi trong suốt chương trình

• var: biến được khai báo với từ khóa var sẽ được truy cập ở bất kể đâu trong chương trình

• let: từ khóa này giúp cho biến chỉ có thể được truy xuất bên trong phạm vi blok quanh nó (block được định nghĩa bởi dấu ngoặc nhọn {}).

Hình 2.2 Tất cả các toán tử được JavaScript hỗ trợ

HTML viết tắt cho Hypertext Markup Language, tạm dịch là ngôn ngữ đánh dấu siêu văn bản HTML được sử dụng để tạo và cấu trúc các thành phần trong trang web hoặc ứng dụng, phân chia các đoạn văn, heading, links, blockquotes,… HTML không phải là ngôn ngữ lập trình Điều này có nghĩa là nó không thể tạo ra các chức năng

"động" Hiểu một cách đơn giản hơn, HTML cũng tương tự như phần mềm Microsoft Word, nó chỉ có tác dụng bố cục và định dạng trang web Một tài liệu HTML được hình thành bởi các phần tử HTML (HTML Elements) được quy định bằng các cặp thẻ (tag và attributes) Các cặp thẻ này được bao bọc bởi dấu ngoặc < > và thường là sẽ được khai báo thành một cặp, bao gồm thẻ mở và thẻ đóng

- HTML là chuẩn mực Internet do tổ chức W3C (World Wide Web Consortium) duy trì

- Có mã nguồn mở, cho phép dữ liệu được công khai và miễn phí sử dụng

- Dễ dàng tìm hiểu và sử dụng nên HTML trở nên rất phổ biến, nhờ đó có được nguồn tài nguyên phong phú

Nhược điểm lớn nhất mà HTML còn tồn tại đó chính là chỉ có thể sử dụng ở những trang web tĩnh Đây là những trang web chỉ hiển thị thông tin mà không có sự tương tác của người dùng Chính vậy, khi xây dựng những tính năng động hoặc hướng đối tượng người dùng thì lập trình viên cần phải sử dụng Javascript hoặc ngôn ngữ backend khác của bên thứ 3 mới có thể thực hiện được

Giới thiệu [3]

React.js là một thư viện Javascript đang nổi lên trong những năm gần đây với xu hướng Single Page Application Trong khi những framework khác cố gắng hướng đến một mô hình MVC hoàn thiện thì React nổi bật với sự đơn giản và dễ dàng phối hợp với những thư viện Javascript khác React là một library cho phép nhúng code html trong code javascript nhờ vào JSX, có thể dễ dàng lồng các đoạn HTML vào trong JS.Việc tích hợp giữa javascript và HTML vào trong JSX làm cho các component dễ hiểu hơn.

Ưu điểm

- Hiệu suất cao: React được thiết kế để có hiệu suất tốt và sử dụng Virtual DOM để tối ưu hóa việc cập nhật giao diện người dùng

- Khả năng tái sử dụng cao: React cho phép tái sử dụng các thành phần (components) để giảm thiểu lượng mã lặp lại.

Nhược điểm [4]

- React tăng kích thước của ứng dụng mà người dùng tải xuống (~40Kb cho các gói React và React-dom)

- Sẽ có thêm chi phí về khả năng tính toán và bộ nhớ của thiết bị - Để bắt đầu học React JS, một lập trình viên không chỉ phải học thư viện mà còn phải làm quen với mô hình.

React native [5]

Giới thiệu

- React Native là một framework phát triển ứng dụng di động đa nền tảng, được phát triển bởi Facebook Nó cho phép các nhà phát triển sử dụng JavaScript và React để xây dựng các ứng dụng di động có khả năng chạy trên cả iOS và Android

- React Native sử dụng một ngôn ngữ và mô hình phát triển chung để xây dựng ứng dụng cho cả hai hệ điều hành, điều này giúp giảm bớt công sức và thời gian cần thiết để phát triển và duyệt ứng dụng trên nhiều nền tảng Điều này có nghĩa rằng bạn có thể chia sẻ nhiều mã nguồn giữa ứng dụng iOS và Android, đồng thời vẫn có khả năng tùy chỉnh và điều chỉnh từng phiên bản ứng dụng cho từng nền tảng một.

Ưu điểm

- Tiết kiệm thời gian và công sức: React Native cho phép các nhà phát triển viết mã một lần và chạy ứng dụng trên cả hai hệ điều hành, giúp tiết kiệm thời gian và công sức đáng kể

- Hiệu suất cao: React sử dụng cơ chế virtual DOM để cải thiện hiệu suất ứng dụng. Thay vì cập nhật toàn bộ DOM mỗi khi có sự thay đổi, React chỉ cập nhật các phần tử cần thiết, giúp giảm tải cho trình duyệt và làm cho ứng dụng chạy nhanh hơn

- Học dễ dàng: React sử dụng JSX (JavaScript XML) để định nghĩa giao diện người dùng, và nó có cú pháp rất giống với HTML Điều này làm cho việc học React tương đối dễ dàng cho những người đã có kinh nghiệm về HTML và JavaScript

- Cộng đồng phát triển lớn: React Native có một cộng đồng phát triển lớn và tích cực, giúp các nhà phát triển dễ dàng tìm kiếm sự hỗ trợ và chia sẻ kiến thức.

Nhược điểm

- Hỗ trợ nền tảng hạn chế: React chỉ hỗ trợ hai nền tảng phổ biến nhất là iOS và Android thông qua React Native Điều này có nghĩa rằng nếu bạn muốn phát triển ứng dụng cho các nền tảng khác bạn sẽ phải tìm kiếm các giải pháp khác

- Hiệu suất không bằng ứng dụng native thuần: Mặc dù React Native đã cải thiện hiệu suất so với việc sử dụng các framework cross-platform truyền thống, nhưng ứng dụng viết bằng ngôn ngữ và công nghệ native thường có hiệu suất tốt hơn.

Node.js

Giới thiệu [6]

- NodeJS là một nền tảng được xây dựng trên V8 JavaScript Engine – trình thông dịch thực thi mã JavaScript, giúp xây dựng các ứng dụng web một cách đơn giản và dễ dàng mở rộng

- Phần Core bên dưới của NodeJS được viết hầu hết bằng C++ nên cho tốc độ xử lý và hiệu năng khá cao

- NodeJS tạo ra được các ứng dụng có tốc độ xử lý nhanh, realtime thời gian thực.

Ưu điểm

- Hướng tới việc xử lý các yêu cầu không đồng bộ, cho phép xử lý nhiều yêu cầu đồng thời

- Cho phép chia sẻ code giữa phía client và server, tiết kiệm thời gian và tăng tốc độ phát triển

- Sử dụng NPM (Node Package Manager) và các module Node để quản lý và chia sẻ code dễ dàng

Nhược điểm

- Không có khả năng mở rộng, vì vậy không thể tận dụng lợi thế mô hình đa lõi trong các phần cứng cấp server hiện nay

- Khó thao tác với cơ sử dữ liệu quan hệ.

Express.js

Giới thiệu [7]

- Express.js là một Framework nhỏ, nhưng linh hoạt được xây dựng trên nền tảng củaNode.js Nó cung cấp các tính năng mạnh mẽ để phát triển web hoặc mobile

Ưu điểm

- Đơn giản và dễ sử dụng: Express.js có cú pháp đơn giản và dễ hiểu, giúp lập trình viên dễ dàng nắm bắt và triển khai các tính năng

- Linh hoạt: Express.js không áp đặt một cấu trúc cụ thể, cho phép lập trình viên tự do tùy chỉnh và xây dựng ứng dụng theo ý muốn

- Hỗ trợ middleware: ExpressJS cung cấp hệ thống middleware mạnh mẽ, cho phép thực hiện các chức năng như xác thực, ghi log, nén dữ liệu và xử lý lỗi một cách linh hoạt và dễ dàng.

Nhược điểm

- Thiếu cấu trúc: Do Express.js không áp đặt một cấu trúc nghiêm ngặt, việc tổ chức dự án và quản lý mã nguồn có thể trở nên khó khăn, đặc biệt khi ứng dụng phát triển lớn và phức tạp.

Firebase

Giới thiệu

- Firebase là nền tảng được phát triển bởi Google cho việc tạo ra các ứng dụng di động và web.

- Thực chất firebase là dịch vụ bao gồm các chức năng lưu trữ thời gian thực, xác thực tài khoản, kho data dung lượng lớn, và một số chức năng khác.

Ưu điểm

- Tạo tài khoản và sử dụng dễ dàng

- Tốc độ phát triển nhanh

- Có nhiều dịch vụ trong một nền tảng

- Tập trung vào phát triển giao diện người dùng Cộng đồng hỗ trợ phát triển tích cực, với nhiều nguồn tài liệu và thư viện cho Node.js

- Cho phép stream các file có kích thước lớn mà không gây ra các vấn đề về bộ nhớ.

Nhược điểm

- Không phải mã nguồn mở

- Chỉ hoạt động trên cơ sở dữ liệu NoSQL

- Không phải tất cả các dịch vụ trên Firebase đều miễn phí.

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

- Bài kiểm tra mô phỏng TOEIC

• Cung cấp bài kiểm tra mô phỏng TOEIC theo định dạng và thời gian thực tế của kỳ thi

- Học từ vựng TOEIC qua các card từ vựng theo từng chủ đề

• Bài nghe TOEIC: Cung cấp bài nghe và câu hỏi tương ứng, cho phép người dùng luyện tập kỹ năng nghe

• Phân tích câu hỏi nghe: Đưa ra phân tích, dịch nghĩa và các gợi ý giúp người dùng hiểu rõ hơn về nội dung của bài nghe

• Bài đọc TOEIC: Cung cấp các câu hỏi ngữ pháp, đoạn văn và câu hỏi tương ứng để người dùng luyện tập kỹ năng đọc

• Từ vựng và ngữ pháp: Cung cấp các bài học về từ vựng và ngữ pháp liên quan đến đoạn văn

• Bài nói TOEIC: Cung cấp các bài tập nói và câu hỏi tương ứng để người dùng luyện tập kỹ năng đọc

• Phân tích câu hỏi và ghi âm: Ứng dụng cung cấp phân tích và gợi ý lời giải cho câu hỏi, người dùng có thể ghi âm câu trả lời và so sánh với câu trả lời được gợi ý

• Người dùng có thể chia sẻ bài nói của mình lên diễn đàn và nhờ người dùng khác đánh giá và sửa chữa

• Bài viết TOEIC: Cung cấp các chủ đề hoặc câu hỏi để người dùng viết bài • Phân tích câu hỏi: Đưa ra phân tích và gợi ý lời giải

• Người dùng có thể chia sẻ bài viết của mình lên diễn đàn và nhờ người dùng khác đánh giá và sửa chữa

• Lưu trữ từ vựng, câu hỏi, bài thi vào kho lưu trữ của người dùng -

• Cung cấp báo cáo về tiến trình học tập của người dùng, bao gồm điểm số, thời gian dành cho mỗi kỹ năng, và các khả năng cần cải thiện

- Kiểm tra và đánh giá

• Cung cấp các bài kiểm tra thực tế sát với đề thi TOEIC hàng tháng để đánh giá kỹ năng tổng thể và sự tiến bộ của người dùng

• Cho phép người dùng chia sẻ tài liệu, kết quả, hỏi đáp, và kết nối với cộng đồng học TOEIC

• Cung cấp hệ thống động lực học bằng cách thiết lập mục tiêu, cung cấp cấp bậc cho người dùng, gửi thông báo nhắc nhở cho người dùng

• Quản lý thông tin tài khoản người dùng

• Xác định và quản lý các quyền truy cập của người dùng, bao gồm cấp bậc và vai trò

• Thêm, sửa, xóa tài liệu

- Quản lý danh mục và chủ đề

• Thêm, sửa, xóa danh mục và chủ đề cho các tài liệu để giúp người dùng dễ dàng tìm kiếm và truy cập

• Đăng những thông báo quan trọng hoặc có quyền xóa những bài viết có nội dung không liên quan, không lành mạnh

- Một số chức năng khác:

• Đưa ra bài test nhỏ để kiểm tra đầu vào của người dùng, từ đó xác định cấp bậc và gợi ý lộ trình học phù hợp

• Tích hợp game vui để ôn tập dễ dàng hơn

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

- Tính bảo mật: Phải đảm bảo an toàn thông tin dữ liệu của người dùng, ngăn chặn các cuộc tấn công từ bên ngoài, giảm thiểu tối đa rủi ro, rò rỉ thông tin tài khoản người dùng

- Tính tiện dụng: Phần mềm thân thiện với người dùng, dễ sử dụng -

Tính hiệu quả: Đảm bảo tốc độ xử lý ổn định, nhanh chóng

- Tính tương thích: Ứng dụng có thể chạy ổn định.

Thiết kế hệ thống

Sơ đồ usecase

Hình 3.1 Sơ đồ usecase cho người dùng chưa đăng nhập

Hình 3.2 Sơ đồ usecase cho người dùng đã đăng nhập

Hình 3.3 Sơ đồ usecase cho admin

Danh sách usecase

STT Tên Use-case Actor Mô tả

1 Đăng nhập Người dùng chưa đăng nhập Đăng nhập bằng tài khoản đã đăng ký.

2 Đăng ký Người dùng chưa đăng nhập

Tạo tài khoản mới để sử dụng App.

3 Quên mật khẩu Người dùng Người sử dụng App quên mật khẩu tài

19 chưa đăng nhập khoản và cần cấp lại mật khẩu mới.

4 Luyện tập kỹ năng nghe

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

Người dùng chọn 1 trong 4 phần để luyện nghe, chọn số câu cần luyện.

5 Luyện tập kỹ năng đọc

Người dùng chọn 1 trong 3 phần để luyện đọc, chọn số câu cần luyện.

6 Luyện tập kỹ năng nói

Người dùng chọn 1 trong 6 phần để luyện nói, chọn số câu cần luyện.

7 Luyện tập kỹ năng viết

Người dùng chọn 1 trong 3 phần để luyện viết, chọn số câu cần luyện.

8 Luyện thi Người dùng đã đăng nhập

Người dùng chọn đề thi và tiến hành thi

9 Xem lịch sử luyện tập, thi

Người dùng xem lịch sử luyện tập, thi

10 Xem từ vựng, câu hỏi đã lưu

Người dùng xem lại những từ vựng, câu hỏi đã lưu

11 Học từ vựng qua card

Người dùng học từ vựng theo chủ đề

12 Học từ vựng qua game

Người dùng học từ vựng qua các game

13 Xem bài viết trên diễn đàn

Người dùng xem các bài viết hiện có trên diễn đàn

14 Xem hồ sơ cá nhân

Người dùng xem trang cá nhân của mình hoặc người khác

15 Lọc bài viết Người dùng đã Người dùng lọc bài viết theo các

Người dùng tìm kiếm bài viết

17 Chọn lộ trình Người dùng đã đăng nhập

Người dùng chọn mục tiêu điếm và số ngày luyện tập mong muốn và hợp lệ

18 Xem lộ trình Người dùng đã đăng nhập

Người dùng xem lộ trình mà hệ thống đã thiết lập theo nhu cầu của mình

19 Chia sẻ câu hỏi Người dùng đã đăng nhập

Người dùng chia sẻ bài nói hoặc bài viết của mình qua diễn đàn

20 Lưu từ vựng Người dùng đã đăng nhập

Người dùng lưu lại từ vựng

Người dùng chọn từ vựng cần nhắc nhở hàng ngày

22 Đăng bài viết Người dùng đã đăng nhập

Người dùng đăng bài viết lên diễn đàn

23 Tạo đề thi Admin Admin thêm đề thi cho ứng dụng

24 Thêm câu hỏi Admin Admin thêm câu hỏi cho ứng dụng

25 Thêm từ vựng Admin Admin thêm từ vựng cho chủ đề từ vựng

Đặc tả usecase

Mục đích Đăng nhập bằng tài khoản đã đăng ký

Người dùng Người dùng chưa đăng nhập Điều kiện kích hoạt Người dùng ấn nút đăng nhập hoặc đăng nhập với

Trạng thái hệ thống trước khi bắt đầu Usecase

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

Trạng thái hệ thống sau khi thực hiện Usecase

Người dùng đăng nhập ứng dụng thành công

Luồng sự kiện chính 1 Người dùng truy cập vào ứng dụng

2 Người dùng nhập Email, mật khẩu và chọn lệnh đăng nhập

3 Hệ thống xác thực thông tin đăng nhập thành công và cho phép người dùng truy cập ứng dụng.

Luồng sự kiện phụ - Người dùng muốn đăng nhập bằng

Google 2a) Người dùng chọn đăng nhập với Google

3a) Người dùng lựa chọn tài khoản liên kết với Google và bắt đầu thực hiện xác thực

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

Mục đích Tạo tài khoản mới để sử dụng App

Người dùng Người dùng chưa đăng nhập Điều kiện kích hoạt Người dùng vào trang “Đăng ký tài khoản” và nhấn nút đăng ký.

Người dùng chưa có tài khoản.

- Người dùng đăng ký tài khoản mới thành công -

Hệ thống lưu thông tin tài khoản mới vào dữ liệu.

2 Người dùng chọn lệnh đăng ký tài khoản

3 Người dùng nhập Email, tên hiển thị, mật khẩu, xác nhận mật khẩu và chọn lệnh đăng ký.

Luồng sự kiện phụ Không

Các yêu cầu đặc biệt Email phải là Email hợp lệ, mật khẩu phải có tối thiểu ít nhất 6 ký tự.

Bảng 3.4 Usecase quên mật khẩu

Tên Usecase Quên mật khẩu

Mục đích Cấp lại mật khẩu mới cho người dùng.

Người dùng Người dùng chưa đăng nhập Điều kiện kích hoạt Người dùng nhấn vào nút quên mật khẩu ở trang “Quên mật khẩu”.

23 Trạng thái hệ thống trước khi bắt đầu Usecase

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

- Người dùng đổi mật khẩu cho tài khoản thành công.

- Hệ thống lưu thông tin mật khẩu mới vào dữ liệu.

2 Người dùng chọn lệnh quên mật khẩu

3 Người dùng nhập Email tài khoản và chọn lệnh gửi

4 Hệ thống kiểm tra tính hợp lệ của Email, đảm bảo Email này đã được đăng ký tài khoản trước đó, sau đó hệ thống tiến hành gửi tới Email đó tới địa chỉ đã được đăng ký

5 Người dùng bấm vào đường dẫn trong Email và dẫn đến trang Web thay đổi mật khẩu

6 Người dùng thay đổi mật khẩu

7 Trang Web thông báo thay đổi mật khẩu thành công.

Mở rộng - Hệ thống xác thực thông tin Email không thành công và hiển thị thông báo + TH1: Người dùng nhập lại thông tin Use Case quay lại bước 3

+ TH2: Người dùng chọn lệnh quay lại Use Case quay lại bước 2

3.2.3.4 Usecase luyện tập kỹ năng nghe

Bảng 3.5 Usecase luyện tập kỹ năng nghe

Tên Usecase Luyện tập kỹ năng nghe

Mục đích Rèn luyện khả năng nghe

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng nhấn nút Begin

- Người dùng đã đăng nhập

- Hệ thống lấy dữ liệu câu hỏi

- Hệ thống chuyển sang màn hình câu hỏi và phát audio

- Hệ thống hiện trang kết thúc luyện tập với điểm số đạt được

2 Người dùng truy cập trang Home

3 Người dùng chọn mục Listening

4 Người dùng chọn 1 trong 4 part để luyện nghe 5 Người dùng chọn số câu cần luyện tập và nhấn Begin 6. Sau khi luyện tập xong, người dùng nhấn Submit

Luồng sự kiện phụ - Người dùng nhấn nút có icon thể hiện quay lại trang trước thì hệ thống sẽ hủy kết quả luyện tập hiện tại.

3.2.3.5 Usecase luyện tập kỹ năng đọc

Bảng 3.6 Usecase luyện tập kỹ năng đọc

Tên Usecase Luyện tập kỹ năng đọc

Mục đích Rèn luyện khả năng đọc

- Hệ thống chuyển sang màn hình câu hỏi

3 Người dùng chọn mục Reading

4 Người dùng chọn 1 trong 3 part để luyện đọc 5 Người dùng chọn số câu cần luyện tập và nhấn Begin 6. Sau khi luyện tập xong, người dùng nhấn Submit

3.2.3.6 Usecase luyện tập kỹ năng nói

Bảng 3.7 Usecase luyện tập kỹ năng nói

Tên Usecase Luyện tập kỹ năng nói

Mục đích Rèn luyện khả năng nói

3 Người dùng chọn mục Speaking

4 Người dùng chọn 1 trong 5 part để luyện nói 5 Người dùng chọn số câu cần luyện tập và nhấn Begin 6. Sau khi luyện tập xong, người dùng nhấn Submit

3.2.3.7 Usecase luyện tập kỹ năng viết

Bảng 3.8 Usecase luyện tập kỹ năng viết

Tên Usecase Luyện tập kỹ năng viết

Mục đích Rèn luyện khả năng viết

3 Người dùng chọn mục Writting

4 Người dùng chọn 1 trong 3 part để luyện viết

5 Người dùng chọn số câu cần luyện tập và nhấn Begin

6 Sau khi luyện tập xong, người dùng nhấn Submit

Mục đích Cung cấp đề thi thực tế cho người dùng

- Hệ thống lấy dữ liệu đề thi

- Hệ thống chuyển sang màn hình câu hỏi.

2 Người dùng truy cập trang Test

3 Người dùng chọn đề thi và nhấn Begin

4 Sau khi thi xong, người dùng nhấn Submit

Luồng sự kiện phụ - Người dùng nhấn nút có icon thể hiện quay lại trang trước thì hệ thống sẽ hủy kết quả thi hiện tại.

Bảng 3.10 Usecase xem lịch sử

Tên Usecase Xem lịch sử luyện tập

Mục đích Xem lại hành trình luyện tập

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng đang ở trang Home, nhấn tab Practice

- Hệ thống lấy dữ liệu lịch sử luyện tập/ bài thi của người dùng

- Hệ thống hiển thị danh sách các bài luyện tập/ bài thi mà người dùng đã nộp.

3.Người dùng nhấn tab Practice/Test ở mục History để xem lịch sử

4 Người dùng xem trực tiếp ở Home hoặc nhấn See more.

Các yêu cầu đặc biệt Người dùng đã luyện tập và nộp bài

3.2.3.10 Usecase xem từ vựng, câu hỏi đã lưu

Bảng 3.11 Usecase xem từ vựng, câu hỏi đã lưu

Tên Usecase Xem từ vựng đã lưu

Mục đích Xem lại những từ vựng đã lưu

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng đang ở trang Home, nhấn phần Vocab ở mục Storage

- Hệ thống hiện số lượng từ vựng người dùng đã lưu

- Hệ thống lấy dữ liệu những từ vựng mà người dùng đã lưu.

- Hệ thống cung cấp danh sách các từ vựng mà người dùng đã lưu.

3 Người dùng nhấn phần Vocab/Question ở mục Storage

4 Người dùng xem từ vựng đã lưu ở trang Saved Vocab/Question

Các yêu cầu đặc biệt Người dùng đã lưu ít nhất 1 từ vựng

3.2.3.11 Usecase học từ vựng qua card

Bảng 3.12 Usecase học từ vựng qua card

Tên Usecase Học từ vựng qua card

Mục đích Cung cấp các từ vựng theo chủ đề

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng đang ở trang Vocabulary và nhấn vào một chủ đề nào đó.

- Hệ thống đang hiện trang Vocabulary

- Hệ thống cung cấp danh sách các chủ đề từ vựng.

- Hệ thống lấy dữ liệu và cung cấp danh sách các từ vựng theo chủ đề mà người dùng đã chọn ở trang có tiêu đề là tên chủ đề từ vựng.

2 Người dùng truy cập trang Vocabulary

3 Người dùng chọn chủ đề để học

4 Người dùng học từ vựng qua các card.

3.2.3.12 Usecase học từ vựng qua game

Bảng 3.13 Usecase học từ vựng qua game

Tên Usecase Học từ vựng qua game

Mục đích Cung cấp game đơn giản để ôn từ vựng thú vị hơn

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng đang ở trang game và nhấn chọn một game

- Hệ thống đang hiện trang Game

- Hệ thống thực hiện thuật toán để tạo game.

- Hệ thống hiện trang kết thúc game với điểm số đạt được.

Luồng sự kiện chính 1 Người dùng chọn chủ đề từ vựng để học ở trang

2 Người dùng nhấn nút game

3 Người dùng chọn một tựa game nào đó để tiến hành luyện tập

3.2.3.13 Usecase xem bài viết trên diễn đàn

Bảng 3.14 Usecase xem bài viết trên diễn đàn

Tên Usecase Xem bài viết trên diễn đàn

Mục đích Bổ sung kiến thức qua việc xem các bài viết bổ ích

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng đang ở trang Forum.

- Người dùng đã đăng nhập.

- Hệ thống lấy dữ liệu những bài viết hiện có

- Hệ thống cập nhật danh sách những bài viết hiện có

2 Người dùng truy cập trang Forum

3.2.3.14 Usecase xem hồ sơ cá nhân

Bảng 3.15 Usecase xem hồ sơ cá nhân

Tên Usecase Xem hồ sơ cá nhân

Mục đích Tìm hiểu thêm về người dùng

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng nhấn vào ảnh đại diện trên diễn đàn.

- Hệ thống lấy dữ liệu người dùng.

- Hệ thống hiện trang cá nhân với các thông tin liên quan đến người dùng.

2 Người dùng truy cập trang Forum

3 Người dùng nhấn vào ảnh đại diện để truy cập trang cá nhân.

Bảng 3.16 Usecase lọc bài viết

Tên Usecase Lọc bài viết

Mục đích Người dùng lọc bài viết theo các hashtag

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng nhấn nút “Ok” trong trang Filter ở diễn đàn

- Người dùng đã đăng nhập thành công

- Người dùng đang ở trong trang “Bài viết”

Hệ thống hiển thị danh sách bài viết theo những hashtag được chọn

Luồng sự kiện chính 1 Người dùng truy cập trang Forum

2 Người dùng nhấn icon “Lọc” sẽ hiển thị list hashtag

3 Người dùng nhấn các hashtag và nhấn “Ok”

Luồng sự kiện phụ Người dùng nhấn nút “Cancel”

3.2.3.16 Usecase tìm kiếm bài viết

Bảng 3.17 Usecase tìm kiếm bài viết

Tên Usecase Tìm kiếm bài viết

Mục đích Người dùng tìm kiếm bài viết

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng nhấn icon “Tìm kiếm” trong trang Search

- Người dùng đang ở trong trang Search

- Hệ thống lấy dữ liệu và hiển thị danh sách bài viết dựa trên nội dung người dùng tìm kiếm

Luồng sự kiện chính 1 Người dùng truy cập Forum

2 Người dùng nhấn icon “Tìm kiếm”, app tự động chuyển sang trang Search

3 Người dùng nhập nội dung muốn tìm kiếm sau đó nhấn icon ”tìm kiếm” ở trang Search

Luồng sự kiện phụ 3.a Người dùng nhấn icon “back” sẽ quay lại trang

Bảng 3.18 Usecase chọn lộ trình

Tên Usecase Chọn lộ trình

36 Mục đích Thiết lập lộ trình học Toeic cho người dùng.

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng chọn nút Ok sau trong màn hình chọn số ngày luyện tập.

- Người dùng đang ở trong trang Route và hiện màn hình chọn mục tiêu điểm thi.

- Hệ thống thiết lập lộ trình học cho người dùng - Hệ thống hiện màn hình học tập theo lộ trình.

Luồng sự kiện chính 1 Người dùng truy cập trang Route

2 Người dùng chọn mục tiêu điểm sau đó nhấn

3 Người dùng thực hiện bài thi nhỏ kiểm tra trình độ hiện tại

4 Người dùng chọn số ngày cần luyện tập để hệ thống thiết lập lộ trình.

Luồng sự kiện phụ 4.a Hệ thống đưa ra thông báo lộ trình người dùng chọn không phù hợp với trình độ hiện tại nếu kết quả test thấp nhưng số ngày bạn chọn để luyện tập rất ngắn.

Mở rộng - Hệ thống sẽ kiểm tra số ngày mà người dùng chọn có phù hợp hay không dựa trên kết quả test vừa thực hiện. Các yêu cầu đặc biệt Không

Bảng 3.19 Usecase xem lộ trình

Tên Usecase Xem lộ trình

Mục đích Người dùng xem được lộ trình học của mình.

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng chọn icon “route” trong màn hình luyện tập của trang Route.

- Người dùng đang ở trong màn hình luyện tập của trang Route

- Hệ thống hiện màn hình Plan của trang Route.

Luồng sự kiện chính 1 Người dùng truy cập trang Route

2 Người dùng chọn icon “route”

3 Hệ thống hiện ra màn hình Plan.

Các yêu cầu đặc biệt - Người dùng đã chọn lộ trình học thành công.

3.2.3.19 Usecase chia sẻ câu hỏi

Bảng 3.20 Usecase chia sẻ câu hỏi.

Tên Usecase Chia sẻ câu hỏi

Mục đích Xem nhận xét từ người dùng khác

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng nhấn icon “share” trong màn hình câu hỏi

- Hệ thống hiện màn hình của một câu hỏi bất kỳ

- Hệ thống hiển thị màn hình “Create a post” với nội dung là câu hỏi trong hệ thống được chia sẻ và đáp án mà người dùng đã trả lời.

Luồng sự kiện chính 1 Người dùng chọn 1 lịch sử luyện tập bất kỳ

2 Người dùng nhấn nút Review sau đó chọn một câu hỏi cần chia sẻ

Các yêu cầu đặc biệt Chỉ chia sẻ được những câu hỏi trong phần nói và viết.

Bảng 3.21 Usecase lưu từ vựng

Tên Usecase Lưu từ vựng

Mục đích Lưu những từ vựng khó nhớ

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng nhấn icon “star” trong card từ vựng

- Hệ thống hiện danh sách các card từ vựng và icon thể

39 hiện từ vựng đã được lưu là sao vàng, ngược lại là sao trắng.

- Icon của từ vựng được lưu sẽ chuyển sang màu vàng -

Hệ thống lưu id của từ vựng vào tài khoản người dùng

Luồng sự kiện chính 1 Người dùng truy cập trang Vocabulary và danh sách các card từ vựng

2 Người dùng nhấn icon “star” trong card từ vựng muốn lưu.

Các yêu cầu đặc biệt - Người dùng chưa lưu từ vựng đó.

3.2.3.21 Usecase nhắc nhở từ vựng

Bảng 3.22 Usecase nhắc nhở từ vựng

Tên Usecase Nhắc nhở từ vựng

Mục đích Nhắc nhở những từ vựng khó nhớ hằng ngày

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng nhấn icon “clock” trong card từ vựng

- Hệ thống hiện danh sách các card từ vựng và icon thể hiện từ vựng đã được thiết lập để nhắc nhở là màu xanh, ngược lại là màu trắng.

- Icon của từ vựng được thiết lập để nhắc nhở là sẽ chuyển sang màu xanh

- Hệ thống lưu id của từ vựng vào tài khoản người dùng

Luồng sự kiện chính 1 Người dùng truy cập trang Vocabulary và danh sách các card từ vựng

2 Người dùng nhấn icon “clock” trong card từ vựng muốn hệ thống nhắc nhở.

Các yêu cầu đặc biệt -Người dùng chưa chọn từ vựng đó để hệ thống nhắc nhở.

Bảng 3.23 Usecase đăng bài viết

Tên Usecase Đăng bài viết

Mục đích Người dùng đăng các bài viết

Người dùng Người dùng đã đăng nhập Điều kiện kích hoạt Người dùng nhấn nút “Share something helpful for other Toeic learner…” trong trang Forum

- Người dùng đang ở trong trang “Create a new post”.

- Người dùng đăng bài thành công

- Hệ thống lưu thông tin bài viết vào dữ liệu.

Luồng sự kiện chính 1 Người dùng truy cập Forum

2 Người dùng nhấn nút “Share something helpful for

3 Người dùng nhập thông tin và ấn nút

“Post” 4 Hệ thống thông tin “Post successfully”

Luồng sự kiện phụ - Bỏ trống thông tin

+ Hệ thống thông báo lỗi

+ Quay lại bước 3 của luồng sự kiện chính.

Các yêu cầu đặc biệt Phải nhập đầy đủ thông tin: topic,content,hashtag hoặc topic, (image,video,pdf), hashtag.

Bảng 3.24 Usecase tạo đề thi

Tên Usecase Tạo đề thi

Mục đích Admin thêm đề thi cho ứng dụng.

Người dùng Admin. Điều kiện kích hoạt Người dùng nhấn nút “Add Test” trong trang “Test” của website

Hệ thống lưu đề thi vào cơ sở dữ liệu

Luồng sự kiện chính 1 Người dùng chọn tab “Test”

2 Người dùng nhấn nút “Add Test”, hệ thống hiện trang Add.

3 Người dùng nhập tên đề thi và các câu hỏi cho đề thi.

4 Người dùng nhấn nút “Create” để lưu đề thi 5 Hệ thống kiểm tra điều kiện.

Luồng sự kiện phụ 5.a Hệ thống kiểm tra dữ liệu hợp lệ thì lưu đề thi vào cơ sở dữ liệu

5.b Nếu không hợp lệ thì hiện thông báo dữ liệu nào nhập không hợp lệ.

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

Bảng 3.25 Usecase thêm câu hỏi

Tên Usecase Thêm câu hỏi

Mục đích Admin thêm câu hỏi cho ứng dụng.

Người dùng Admin. Điều kiện kích hoạt Người dùng nhấn nút “Add Question” trong trang

Hệ thống lưu câu hỏi vào cơ sở dữ liệu

Luồng sự kiện chính 1 Người dùng chọn tab “Question”

2 Người dùng chọn kỹ năng (nghe, nói, đọc, viết) và part để thêm câu hỏi.

2 Người dùng nhấn nút “Add Question”, hệ thống hiện trang QuestionPage

3 Người dùng nhập nội dung câu hỏi vào form nhập liệu

4 Người dùng nhấn nút “Submit” để lưu câu hỏi 5 Hệ thống kiểm tra điều kiện.

Luồng sự kiện phụ 5.a Hệ thống kiểm tra dữ liệu hợp lệ thì lưu câu hỏi vào cơ sở dữ liệu

Bảng 3.26 Usecase thêm từ vựng

Tên Usecase Thêm từ vựng

Mục đích Admin thêm từ vựng cho một chủ đề.

Người dùng Admin. Điều kiện kích hoạt Người dùng nhấn nút “Add Vocabulary” trong trang

Hệ thống hiện trang VocabPage.

Hệ thống lưu từ vựng vào cơ sở dữ liệu

44 Luồng sự kiện chính 1 Người dùng chọn tab “Vocab”

2 Người dùng nhấn icon “eye” của một chủ đề từ vựng

3 Hệ thống hiện trang VocabPage

4 Người dùng nhấn nút “Add Vocabulary”

5 Hệ thống hiện form nhập liệu cho từ vựng 6 Người dùng nhập thông tin cho từ vựng

7 Người dùng nhấn nút “Submit” để lưu từ vựng 8 Hệ thống kiểm tra điều kiện.

Luồng sự kiện phụ 8.a Hệ thống kiểm tra dữ liệu hợp lệ thì lưu từ vựng vào cơ sở dữ liệu

Thiết kế dữ liệu

Danh sách các bảng dữ liệu

Bảng 3.27 Danh sách các bảng dữ liệu

STT Tên bảng Sự miêu tả

1 ListenPart1 Lưu trữ các câu hỏi trong phần 1 của kỹ năng nghe

5 ReadPart1 Lưu trữ các câu hỏi trong phần 1 của kỹ năng đọc

8 SpeakPart1 Lưu trữ các câu hỏi trong phần 1 của kỹ năng nói

13 WritePart1 Lưu trữ các câu hỏi trong phần 1 của kỹ năng viết

16 Test Lưu trữ các bài kiểm tra

17 PracticeHistory Lưu trữ các lịch sử luyện tập của người dùng

18 TestHistory Lưu trữ các lịch sử là bài thi của người dùng

19 VocabLesson Lưu trữ các chủ đề từ vựng

20 Vocabulary Lưu trữ từ vựng

21 Comments Lưu trữ bình luận của người dùng về các bài viết

22 PracticePlan Lưu trữ lộ trình học tập cho người dùng

23 Posts Lưu trữ các bài viết

24 Notification Lưu trữ thông báo

25 Users Lưu trữ thông tin cá nhân của người dùng

Mô tả chi tiết bảng dữ liệu

Bảng 3.28 Bảng dữ liệu ListenPart1

STT Tên trường Kiểu dữ liệu Mô tả

1 Answer array Chứa câu trả lời cho câu hỏi

2 Audio string Chứa link audio

3 Explain map Chứa kịch bản, lời dịch và mẹo trả lời cho câu hỏi

4 Image string Chứa liên kết của hình ảnh

5 Order number Chứa số thứ tự của câu hỏi

2 Audio string Chứa âm thanh liên kết

1 Correct array Chứa câu trả lời cho câu hỏi

4 Question array Chứa các câu hỏi trắc nghiệm

5 Order number Chứa số câu hỏi

Bảng 3.32 Bảng dữ liệu ReadPart1

3 Question string Chứa một câu hỏi

3 Question string Chứa các câu hỏi trắc nghiệm

5 Paragraph string Chứa đoạn văn

Bảng 3.35 Bảng dữ liệu SpeakPart1

1 Question string Chứa liên kết của hình ảnh

2 Explain map Chứa câu trả lời mẫu, lời dịch và mẹo trả lời cho câu hỏi

3 Order number Chứa số thứ tự câu hỏi

1 Picture string Chứa liên kết của hình ảnh

2 Explain map Chứa câu trả lời mẫu và mẹo cho câu hỏi

1 Context string Chứa ngữ cảnh cho câu hỏi

4 Question array Chứa các câu hỏi nhỏ

1 AvailableInfo string Chứa hình ảnh mô tả cho ngữ cảnh cho câu hỏi

4 Question array Chứa các câu hỏi nhỏ

1 Explain map Chứa câu trả lời mẫu và mẹo cho câu

Chứa số thứ tự câu hỏi

3 Question array Chứa một câu hỏi

Bảng 3.40 Bảng dữ liệu WritePart1

1 Explain map Chứa câu trả lời mẫu và mẹo cho

3 Picture string Chứa hình ảnh mô tả ngữ cảnh cho

Chứa các từ ngữ gợi ý cho câu trả

Bảng 3.41 Bảng dữ liệu WritePart2

1 Direction string Chứa yêu cầu cho câu hỏi

4 Question string Chứa ngữ cảnh cho câu hỏi

Bảng 3.42.Bảng dữ liệu WritePart3

3 Question string Chứa câu hỏi

Bảng 3.43 Bảng dữ liệu Test

1 Name string Chứa tên bài thi

2 Part1 array Chứa các câu hỏi của phần 1

9 Time string Chứa thời gian thi

Bảng 3.44.Bảng dữ liệu PracticeHistory

1 Part string Tên để xác định phần nào của kỹ năng nào

2 PartName string Chứa tên của phần mà người dùng thực hành

3 Quantity number Chứa số lượng câu hỏi mà người dùng đã thực hành

4 History array Chứa câu trả lời mặc định, câu trả lời của người dùng và id câu hỏi

5 DetailQty number Chứa số lượng câu hỏi trắc nghiệm

Bảng 3.45 Bảng dữ liệu TestHistory

1 CompletionTime string Chứa thời gian người dùng làm bài

Chứa số lượng câu trả lời đúng

3 Corrects array Chứa số lượng câu trả lời đúng cho

Chứa ngày và giờ người dùng gửi

5 History array bài kiểm tra

Chứa câu trả lời mặc định, câu trả

6 Incorrect number lời của người dùng

Chứa số lượng câu trả lời sai

7 Quantity number Chứa số lượng câu hỏi trong kỳ thi

8 Questions array Chứa các câu hỏi trong bài kiểm

10 Unanswer number Chứa số lượng câu hỏi mà người

11 UserId string dùng chưa trả lời

Chứa id của người dùng

Bảng 3.46 Bảng dữ liệu VocabLesson

1 Image string Chứa liên kết của hình ảnh, được sử

2 Topic string dụng để minh họa chủ đề

3 VocabQuantity string Chứa số lượng từ vựng trong chủ đề

Bảng 3.47 Bảng dữ liệu Vocabulary

1 Vocab string Chứa từ vựng

2 Example string Chứa một ví dụ về từ vựng

3 ListenFile string Chứa âm thanh liên kết của từ vựng

4 Spelling string Chứa cách phát âm từ vựng

5 TopicId string Chứa Id của chủ đề

6 Translate string Chứa dịch nghĩa của từ vựng

7 Type string Chứa loại từ vựng

Bảng 3.48 Bảng dữ liệu Comment

1 commentId string Chứa Id của bình luận

2 replies array Chứa Id của các phản hồi bình luận

3 text string Chứa nội dung của bình luận

4 time string Chứa thời gian mà người dùng bình

Chứa id của người đã đăng bình luận

Bảng 3.49 Bảng dữ liệu PracticePlan

1 CurrentLevel number Chứa cấp độ người dùng hiện tại

2 CurrentPhase map Chứa ngày và giai đoạn mà người

3 PracticeDays number dùng hiện đang thực hành

Chứa số ngày cần thiết để hoàn

4 PracticePhases array thành lộ trình luyện tập

Chứa thông tin về các giai đoạn

Số lượng câu hỏi để thực hành trong một ngày

6 TargetLevel number Chứa mục tiêu của người dùng

7 userId string Chứa id của người dùng

Bảng 3.50 Bảng dữ liệu Posts

1 userName string Chứa tên của người đã đăng bài viết

2 userImg string Chứa hình ảnh của người đã đăng bài

Chứa Id của người đã đăng bài viết

4 topic string Chứa chủ đề của bài đăng

5 Text string Chứa nội dung của bài đăng

6 postTime map Chứa thời gian người dùng lên bài

Chứa hình ảnh, video, pdf, hoặc câu

8 postId string hỏi của bài đăng

Chứa ID của bài đăng

9 likes array Chứa id của người dùng đã thích bài

Chứa id của người dùng đã nhận xét

Chứa hashtag của bài đăng

Bảng 3.51 Bảng dữ liệu Notification

1 Id string Chứa Id của thông báo

2 PostownerId string Chứa Id của người dùng nhận được

Chứa dấu hiệu cho biết người dùng

4 classify string đã đọc thông báo hay chưa

Phân loại thông báo dưới dạng nhận xét hoặc lượt thích

5 guestId string Chứa Id của người dùng gửi thông

Chứa Id của bài đăng mà người dùng

7 text string thích hoặc bình luận

Chứa nội dung thông báo

8 time string Chứa thời gian gửi thông báo

Bảng 3.52 Bảng dữ liệu Users

1 HistoryPractice array Chứa id của PracticeHistory

2 MaxQuestion map Chứa số lượng câu hỏi đã hoàn

3 SavedPost array thành cho mỗi phần

Chứa id của các bài đăng đã lưu

4 SavedQuestion array Chứa id của các câu hỏi đã lưu

5 about string Chứa thôn tin giới thiệu bản than

6 age string của người dùng

Chứa tuổi của người dùng

7 currentScore string Chứa điểm Toeic hiện tại

9 expectedExamDate string Chứa ngày dự kiến làm bài kiểm

Chứa id của người dùng

11 name string Chứa tên người dùng

12 targetScore string Chứa mục tiêu điểm

13 token string Chứa mã thông báo của người

15 VocabAlarms array Chứa id của từ vựng mà người

16 VocabIds array dùng muốn hệ thống nhắc nhở

Chứa id của từ vựng mà người dùng đã lưu

Chương 4 XÂY DỰNG GIAO DIỆN 4.1 Danh sách các màn hình

Bảng 4.1 Danh sách các màn hình

STT Màn hình Miêu tả

1 Đăng nhập Cho phép người dùng đăng nhập vào ứng dụng

2 Đăng ký Cho phép người dùng đăng ký tài khoản

3 Trang chủ Hiển thị các mục như thực hành, kỳ thi, lịch sử, lưu trữ

4 Chuẩn bị Cho phép người dùng lựa chọn số lượng câu cần luyện tập

5 Hoàn thành Cho phép người dùng tiếp tục luyện tập hoặc xem câu trả lời

6 Câu hỏi Hiển thị câu hỏi

7 Kết quả Hiển thị danh sách các câu hỏi, cho phép người dùng xem câu trả lời

8 Xem lại Cho phép người dùng xem câu trả lời và giải thích cho các câu hỏi

9 Lịch sử Cho phép người dùng xem lịch sử luyện tập

10 Từ vựng Hiển thị danh sách các từ vựng

11 Trò chơi Cho phép người dùng lựa chọn trò chơi để luyện từ vựng

12 Chủ đề từ vựng Trình bày danh sách các chủ đề từ vựng

13 Lộ trình Trình bày tổng quan nội dung lộ trình luyện tập của người dùng

14 Kế hoạch Trình bày nội dung ngày thực hành hiện tại

15 Chọn lộ trình Cho phép người dùng chọn mục tiêu mới

16 Diễn đàn Hiển thị diễn đàn

17 Tạo bài viết Cho phép người dùng tạo bài viết mới

18 Hồ sơ Trình bày thông tin người dùng

19 Phân tích Đưa ra phân tích, đánh giá dựa trên kết quả thi và luyện tập

20 Quản lý câu hỏi Cho phép admin quản lý các câu hỏi (thêm, xem, xóa, sửa)

21 Tạo đề thi Cho phép admin thêm đề thi

22 Quản lý chủ đề từ vựng

Cho phép admin quản lý các chủ đề từ vựng (thêm, xem, xóa)

23 Quản lý từ vựng trong chủ đề

Cho phép admin quản lý từ vựng (thêm, xem, xóa, sửa)

Cho phép admin quản lý người dùng

Màn hình đăng nhập

Hình 4.1 Màn hình đăng nhập Bảng 4.2 Bảng mô tả giao diện đăng nhập

STT Yếu tố Chức năng

2 TextInput Password Nhập mật khẩu

3 Button Sign in Đăng nhập vào ứng dụng

4 Text Forgot Password Mở màn hình "Quên mật khẩu"

5 Button Sign in with Google Đăng nhập bằng google

6 Text “Create here” Mở màn hình "Đăng ký"

Màn hình đăng ký

Hình 4.2 Màn hình đăng ký

Bảng 4.3 Bảng mô tả giao diện đăng ký

2 TextInput Username Nhập tên người dùng

3 TextInput Password Nhập mật khẩu

4 TextInput Confirm Password Nhập lại mật khẩu

5 Button Sign up Đăng ký tài khoản

6 Text Have an account? Sign in

Quay lại màn hình đăng nhập

8 Button Sign in with Google Đăng nhập bằng google

Màn hình trang chủ

Hình 4.3 Màn hình trang chủ Bảng 4.4 Bảng mô tả giao diện trang chủ

1 Button Listening Mở màn hình kỹ năng nghe

2 Button Reading Mở màn hình kỹ năng đọc

3 Button Speaking Mở màn hình kỹ năng nói

4 Button Writing Mở màn hình kỹ năng viết

5 Button Begin Mở màn hình để làm bài kiểm tra

6 Button See more Mở màn hình "Bài thi" để xem thêm

7 Button Practice Hiển thị lịch sử thực hành

8 Button Test Hiển thị lịch sử thi

9 Button See more Mở màn hình "Lịch sử" để xem thêm

10 Button review Mở màn hình từ vựng đã lưu hoặc màn hình câu hỏi đã lưu

11 Icon button “ba dấu gạch”

Mở thanh menu điều hướng bên trái

Màn hình chuẩn bị

Hình 4.4 Màn hình chuẩn bị

Bảng 4.5 Bảng mô tả giao diện chuẩn bị

1 Icon button “Back” Quay lại màn hình trước đó

2 Combobox Chọn số lượng câu hỏi để luyện tập

3 Button Begin Mở màn hình "Câu hỏi"

Màn hình hoàn thành

Hình 4.5 Màn hình hoàn thành Bảng 4.6 Bảng mô tả giao diện hoàn thành

2 Button Show answer Mở màn hình "Kết quả"

3 Button Continue Mở màn hình "Chuẩn bị"

Màn hình câu hỏi

Hình 4.6.Màn hình câu hỏi

Bảng 4.7 Bảng mô tả giao diện câu hỏi

2 Button submit Mở màn hình "Hoàn thành"

3 Icon button “play” Phát âm thanh

4 Icon button “backward” Tua âm thanh lùi lại 5 giây

5 Icon button “forward” Tua âm thanh tiến tới 5 giây

6 Icon button “heart” Lưu câu hỏi

7 Các button A, B, C, D Chọn đáp án

Màn hình kết quả

Hình 4.7 Màn hình kết quả

Bảng 4.8 Bảng mô tả giao diện kết quả

2 Button question 1,2… Mở màn hình "Câu hỏi" để xem lại

Màn hình xem lại

Hình 4.8 Màn hình xem lại Bảng 4.9 Bảng mô tả giao diện xem lại

Định dạng
Số trang	71
Dung lượng	0,92 MB