Đánh lái có chủ đích
Nhấp phanh tay để mở drift, ôm cua rồi trả lái để lấy lại độ bám. Giữ phanh tay sẽ giảm tốc đến khi dừng.
Dự án của tôi / Game
Apex Circuit
Một đường đua 3D nhỏ, một chiếc xe đỏ và ba đối thủ. Chọn thời điểm drift, vượt qua cầu và tranh vị trí đầu tiên trong ba vòng đua — ngay trên trình duyệt, bằng bàn phím hoặc điện thoại.
- Vai trò
- Thiết kế đường đua · Lập trình gameplay và AI đối thủ · Giao diện và âm thanh
- Thời gian
- Tháng 10, 2026
- vòng đua
- 03
- tay đua
- 04
- đường đua có cầu vượt
- 01
TRẢI NGHIỆM
Ba vòng. Một vạch đích.
Giữ ga trên đoạn thẳng, chọn thời điểm drift ở góc cua và tìm khoảng trống để vượt ba đối thủ.
Đường đua nhiều cao độ
Cua gắt, đoạn nối và cầu vượt tạo nhịp đua khác nhau. Camera theo xe, minimap và checkpoint giúp bạn theo đúng tuyến.
Một chiến thắng trọn vẹn
Tiếng động cơ theo ga, tiếng lốp khi drift. Về nhất nhận cúp, nhạc chiến thắng và pháo hoa low-poly.
Cách chơi
Trên máy tính
- ↑ / ↓
- Ga · phanh / lùi
- ← / →
- Đánh lái
- Space
- Nhấp rồi ôm cua: drift · Giữ: phanh tay
- R / Esc
- Về checkpoint · Tạm dừng
Trên điện thoại
- Xoay ngang màn hình trước khi bắt đầu.
- Giữ Ga bên phải, bấm Trái / Phải bên trái để lái.
- Nhấp Drift khi ôm cua; giữ nút để phanh tay. Có thể giữ nhiều nút cùng lúc.
Bật/tắt âm thanh trong màn bắt đầu, menu tạm dừng hoặc kết quả. Game chạy trên trình duyệt hỗ trợ WebGL.
Công nghệ làm nên sản phẩm
Ngôn ngữ và công nghệ sử dụng
TypeScript
Next.js
React Three Fiber- Three.js
Web Audio API
Câu chuyện sản phẩm
Apex Circuit
01 — 04Bài toán
Một dự án trong portfolio nên cho người xem cơ hội trải nghiệm điều mình vừa đọc. Apex Circuit bắt đầu từ ý tưởng biến bộ mô hình 3D Racing Kit của Kenney thành một cuộc đua ngắn: dễ vào chơi, có đối thủ và đủ góc cua để người chơi tìm được nhịp lái của mình. Thử thách là ghép đường đua có cầu vượt thành một tuyến liền mạch, giữ camera nhìn rõ xe và làm cho thao tác lái, drift có cùng ý nghĩa trên bàn phím lẫn màn hình cảm ứng.
Phần tôi phụ trách
Tôi thiết kế tuyến đường và bố trí khu pit, khán đài, cây, đèn, biển hiệu theo phong cách của Racing Kit. Phần đường, lề và rào chắn được dựng liên tục để nối khít qua các khúc cua và dốc. Tôi lập trình điều khiển arcade, đối thủ máy, checkpoint và tính vòng; camera theo xe có xử lý vật cản; HUD, minimap và giao diện cảm ứng. Trải nghiệm hoàn chỉnh có tạm dừng, đặt lại xe, đua lại, âm thanh động cơ/drift và phần thưởng chiến thắng với pháo hoa low-poly. Mô hình xe và cảnh quan thuộc Kenney Racing Kit, sử dụng theo giấy phép CC0. Phần đóng góp của tôi là xây dựng game và tích hợp vào portfolio, không phải tự tạo các mô hình này.
Cách giải quyết
Xe chạy theo bước mô phỏng cố định. Hướng thân xe và hướng chuyển động được tách riêng để tạo trượt ngang: nhấp Space hoặc Drift rồi ôm cua sẽ mở drift; giữ phanh tay làm xe giảm tốc, trả lái giúp lấy lại độ bám. Ba đối thủ nhìn trước theo đường chạy, điều chỉnh tốc độ trước cua và đi qua cùng hệ checkpoint. Mặt đường và rào dùng chung tuyến cao độ; checkpoint có thứ tự giúp phân biệt hai tầng giao cắt. Camera bám theo chuyển động và rút khoảng cách khi gặp công trình che xe. Trên điện thoại, game yêu cầu xoay ngang, nhận nhiều ngón tay độc lập và bố trí thông số tách khỏi các nút lái. Âm thanh chỉ khởi động sau thao tác chơi. Cảnh 3D chỉ được tải tại trang chơi riêng, nên trang giới thiệu chỉ tải nội dung và ảnh.
Kết quả & bài học
Bản chơi hiện tại có một đường đua, bốn xe và ba vòng; hỗ trợ máy tính và điện thoại ngang, hai ngôn ngữ Việt/Anh, camera theo xe/toàn cảnh, tạm dừng và chơi lại. Về nhất có cúp, nhạc chiến thắng riêng và pháo hoa low-poly; người chơi có thể bật/tắt âm thanh. Các kiểm tra tự động bao phủ luật đua, drift/phanh tay, camera, thao tác cảm ứng nhiều ngón, luồng thắng/thua và bố cục màn hình nhỏ. Đây là dự án cá nhân chơi với máy; chưa có đua online hoặc bảng xếp hạng. Kết quả kiểm tra trên trình duyệt giả lập không thay thế đánh giá hiệu năng và âm thanh trên từng điện thoại thực tế.
04 hình ảnh