TTC Việt Nam
Page Header Background

Hướng dẫn chi tiết cách tự tạo trò chơi kéo thả Đoàn tàu tri thức

Trang chủ»Hướng dẫn chi tiết cách tự tạo trò chơi kéo thả Đoàn tàu tri thức
Hướng dẫn chi tiết cách tự tạo trò chơi kéo thả Đoàn tàu tri thức

Việc biến những câu hỏi ôn tập khô khan thành trò chơi tương tác sẽ giúp học sinh hứng thú hơn trong quá trình học tập. Thay vì chỉ trả lời từng câu hỏi theo cách truyền thống, giáo viên có thể tạo ra một hoạt động kéo thả sinh động để học sinh vừa chơi vừa ghi nhớ kiến thức. Với sự hỗ trợ của ChatGPT, bạn không cần biết lập trình vẫn có thể tạo được một trò chơi HTML hoàn chỉnh chỉ từ một câu lệnh.

Trong bài viết này, bạn sẽ có được câu lệnh tạo game Đoàn tàu tri thức tương tác với chủ đề đoàn tàu học tập. Nhiệm vụ của người chơi là kéo các toa tàu vào đúng vị trí trên đường ray theo trình tự câu hỏi và đáp án. Mỗi toa tàu đều chứa đáp án của câu hỏi trước và đồng thời đưa ra câu hỏi tiếp theo, giúp học sinh luyện tập theo hình thức nối chuỗi kiến thức rất trực quan và dễ hiểu.

Cách tạo trò chơi kéo thả Đoàn tàu tri thức

Bước 1:

Bạn truy cập vào Gemini sau đó chuyển sang chế độ Canvas để tiến hành tạo trò chơi. Sau đó chúng ta copy prompt tạo trò chơi kéo thả Đoàn tàu tri thức vào giao diện. 

Câu lệnh tạo game đoàn tàu tri thức

Hãy tạo một trò chơi HTML tương tác tên: ĐOÀN TÀU TRI THỨC.

Yêu cầu:

- Tạo file HTML chạy offline, gồm HTML + CSS + JavaScript trong một file.

- Giao diện hoạt hình 2D, màu sắc tươi sáng, phù hợp học sinh tiểu học.

- Chủ đề: đoàn tàu học tập.

- Có đầu tàu, đường ray, các toa tàu, kho toa kéo thả.

- Học sinh kéo toa từ kho phía dưới lên đường ray để nối đúng thứ tự.

Cơ chế chơi:

- Toa đầu tiên là câu hỏi mở đầu.

- Mỗi toa có 2 phần:

 + Bên trái: ĐÁP ÁN cho câu hỏi ở toa trước.

 + Bên phải: CÂU HỎI tiếp theo.

- Nếu kéo đúng toa:
 
 + Toa gắn vào đường ray.
 + Có âm thanh đúng.
 + Có hiệu ứng bật nhẹ.

- Nếu kéo sai toa:
 + Toa quay lại kho.
    + Có hiệu ứng rung.
    + Có âm thanh sai.
- Khi hoàn thành:
   + Có pháo giấy.
   + Hiện thông báo chúc mừng.
  + Đoàn tàu chạy từ trái sang phải qua màn hình.

Bố cục:

- Phần trên: tiêu đề ĐOÀN TÀU TRI THỨC.

- Bên phải có nút:
 + Làm lại
 + Kiểm tra
 + Trộn toa
- Khu vực giữa:
 + Đầu tàu bên trái.
 + Các ô trống để thả toa.
 + Có thanh cuộn ngang để xem toa cuối.

Khu vực dưới: kho toa kéo thả với thanh cuộn ngang.

Dữ liệu để giáo viên điền bao gồm: 
* Câu hỏi mở đầu: "Ai là vị vua đầu tiên lập ra nước ta?"
* Các toa tàu (ID, Đáp án, Câu hỏi tiếp theo):
- ID 1: Đáp án "Vua Hùng", Câu hỏi "Theo truyền thuyết, ai là người đã sáng tạo ra bánh chưng và bánh giầy?"
- ID 2: Đáp án "Lang Liêu", Câu hỏi "Cậu bé lên ba tuổi bỗng lớn nhanh như thổi để đánh giặc Ân tên là gì?"
- ID 3: Đáp án "Thánh Gióng", Câu hỏi "Hai nữ anh hùng đầu tiên cưỡi voi đánh giặc là ai?"
- ID 4: Đáp án "Hai Bà Trưng", Câu hỏi "Ai đã cắm cọc gỗ trên sông Bạch Đằng để đánh tan quân Nam Hán?"
- ID 5: Đáp án "GIÁO VIÊN ĐIỀN ĐÁP ÁN", Câu hỏi "GIÁO VIÊN ĐIỀN CÂU HỎI TIẾP THEO"
- ID 6: Đáp án "Ngô Quyền", Câu hỏi "Hoàn thành!" (Label: Kết thúc)

Yêu cầu kỹ thuật: 
- Cho phép kéo thả chuột, trộn ngẫu nhiên các toa trong kho, toa biến mất khi thả đúng.
- Tự động cuộn đến ô trống tiếp theo, đảm bảo toa cuối kéo thả được.
- Giao diện responsive, font chữ to, không đè chữ, không dùng thư viện ngoài, chạy offline, code trong một file duy nhất.

Yêu cầu thẩm mỹ: 
- Màu sắc chủ đạo: xanh da trời, vàng, đỏ, xanh lá. Toa tàu bo góc có bánh xe. Đáp án nền vàng, câu hỏi nền trắng, ô trống viền nét đứt. Có hiệu ứng vui nhộn.

Bước 2:

Chờ một lúc và bạn sẽ nhìn thấy trò chơi Đoàn tàu tri thức ở bên cạnh. Hãy chơi thử game và nếu có vấn đề hoặc bạn cần thay đổi phần nào thì nhập yêu cầu chỉnh sửa lại ở khung bên trái.  Cuối cùng bạn nhấn vào biểu tượng download để tiến hành tải file html mã của game xuống máy tính.

Tải mã game html

Khi cần chạy game bạn chỉ cần nhấn vào file html để chạy trên bất cứ trình duyệt nào đều được. 

File chạy game Đoàn tàu tri thức

Dưới đây là giao diện game Đoàn tàu tri thức. Học sinh sẽ đọc câu hỏi và tiến hành kéo thả tạo câu trả lời đúng để hoàn thành đoàn tàu.

Giao diện trò chơi Đoàn tàu tri thức

Góc nhìn chuyên gia từ TTC Việt Nam

Từ góc độ kỹ thuật viễn thông và giải pháp số tại TTC Việt Nam, việc ứng dụng các trò chơi HTML5 offline như "Đoàn tàu tri thức" là một giải pháp giáo dục thông minh trong môi trường học đường. Việc tận dụng AI để tạo ra các công cụ tương tác không chỉ giúp tối ưu hóa tài nguyên phần mềm mà còn đảm bảo tính ổn định, vì trò chơi không phụ thuộc vào kết nối Internet khi trình chiếu. Với các đơn vị giáo dục, việc tự chủ nội dung và công cụ kỹ thuật số sẽ góp phần nâng cao chất lượng giảng dạy, tạo môi trường học tập hiện đại và trực quan hơn.

Để được tư vấn về hạ tầng mạng, giải pháp viễn thông ổn định phục vụ cho chuyển đổi số trong giáo dục và doanh nghiệp, hãy liên hệ ngay với TTC Việt Nam (ttcvn.net) để nhận hỗ trợ chuyên sâu nhất.

NỘI DUNG

  • Đang tải Mục lục...

ĐĂNG KÝ TRẢI NGHIỆM
DỊCH VỤ

HƠN 5.000+ DOANH NGHIỆP ĐÃ VÀ ĐANG ĐỒNG HÀNH CÙNG TTC VIỆT NAM ĐỂ XÂY DỰNG HỆ THỐNG

NHẬN TƯ VẤN MIỄN PHÍ