3.3. Thiết kế các thành phần trong ứng dụng

3.3.1. Trang chủ

Header

Body

Fooder

3.3.2. Học toán

a. Header Ở vị trí đầu trang, chữ màu đỏ và 1 ô click vào để về Trang chủ

b. Hệ thống ảnh để học qua ảnh : Gồm có các ảnh xếp theo chiều ngang với kích thước bằng nhau. Khi click vào ảnh sẽ phóng to toàn màn hình để người dùng dễ nhìn.

c. Thanh chọn Video: Video được chia làm 2 nhóm: Các phép toán cơ bản và cách tính nhanh Vedic xếp thành 2 cột.Mỗi cột có các bài học xếp dọc.

d. Phần góp ý và fanpage, nút like: Nằm ở gần cuối màn hình với Fanpage bên trái và Nút like, share và phần bình luận bên phải

e. Fooder Nằm ở cuối màn hình bao gồm thông tin nhóm phát triển phần mềm, Trang giới thiệu và Hướng dẫn sử dụng Website

3.3.3. Trò chơi

a. Nút chọn độ khó Nằm ở giữa màn hình chondokho.html Gồm có 3 nút tương ứng với 3 mức độ Dễ, Trung bình, Khó

b. Nút chọn màn chơi : Nằm ở giữa màn hình De.html, Trungbinh.html, Kho.html Gồm có 5 nút tương ứng với 5 màn chơi

c. Thanh kết quả: Ở vị trí đầu trang chơi trò chơi Gồm có nút trở về Trang chủ, số thứ tự câu hỏi đang hiển thị, số câu đúng và số câu sai.

d. Hiển thị câu hỏi và đáp án: Câu hỏi có 2 dạng Hình ảnh và kí tự số với các đáp án có ô checkbox để chọn đáp án đúng

Dạng Hình ảnh

Dạng Kí tự

d. Nút điều hướng: Trả lời xong câu hỏi sẽ có thông báo trả lời đúng hoặc sai, sau đó click vào nút Câu tiếp để chuyển sang câu hỏi mới. Trả lời xong 5 câu hỏi hiện thông báo Qua màn hoặc phải Chơi lại.

e. Phần góp ý và fanpage, nút like: Nằm ở gần cuối màn hình với Fanpage bên trái và Nút like, share và phần bình luận bên phải

f. Fooder Nằm ở cuối màn hình bao gồm thông tin nhóm phát triển phần mềm, Trang giới thiệu và Hướng dẫn sử dụng Website