Prompt nguyên văn do tác giả đăng để xây dựng một arcade trình duyệt Three.js hoàn chỉnh, có thể chơi được, với các tài sản phần cứng GLB riêng biệt, chuyển cảnh 3D tương tác, ba trò chơi dùng băng game, điều khiển thích ứng và hành vi dự phòng hỗ trợ khả năng tiếp cận.
Mô tả khởi đầu dựa trên dự án công khai của tác giả, không phải câu lệnh gốc được chép nguyên văn. Kết quả của bạn có thể khác.
Ghi chú của tác giả
Xây dựng một arcade trình duyệt hoàn chỉnh, có thể chơi được, mang tên “Playroom”, với thẩm mỹ phần cứng hoài cổ cuối thập niên 1980 và giao diện biên tập đương đại, tiết chế.
arcade 3DThree.jsgame trình duyệttài sản GLBcảnh 3D tương tácSnakeBreakoutBlocks
Câu lệnh
Xây dựng một arcade trình duyệt hoàn chỉnh, có thể chơi được, mang tên “Playroom”, với thẩm mỹ phần cứng hoài cổ cuối thập niên 1980 và giao diện biên tập đương đại, tiết chế. Dùng Three.js để kết xuất và tải các tài sản GLB riêng biệt cho màn hình CRT, máy console, tay cầm và băng game. Tạo một trải nghiệm hoạt động đầy đủ, không phải bản mô phỏng tĩnh.
Định hướng nghệ thuật: sử dụng nền trắng ngà ấm, nhựa màu ngà hơi cũ, các chi tiết màu than, xanh sage dịu, đất nung trầm và xanh lam phai. Kết hợp tiêu đề bằng Space Grotesk với nhãn nhỏ bằng DM Mono. Thêm các đường phân cách mảnh, khoảng trắng rộng rãi, chú thích kỹ thuật tinh tế và điều hướng gọn. Tránh phong cách cyberpunk neon, các thẻ bảng điều khiển bóng loáng và lạm dụng chuyển màu.
Trang chủ nên giống một bức ảnh chụp sản phẩm được sắp đặt cẩn thận. Đặt màn hình CRT nổi bật về phía bên phải, máy console về phía bên trái, một băng game dựng đứng được gắn chắc chắn trên máy console và tay cầm ở phía trước. Nối các thiết bị bằng những sợi cáp cong, kết nối đúng với các cổng thực tế của chúng. Sử dụng ánh sáng định hướng mềm, bóng tiếp xúc thuyết phục, các cạnh bo tròn và vật liệu nhựa hơi nhám. Ngăn các vật thể giao cắt nhau.
Tạo cho trang chủ chuyển động quỹ đạo chậm, mang tính điện ảnh, từ bên này sang bên kia. Cho phép người dùng kéo để xoay góc nhìn, sau đó chuyển mượt về chuyển động tự động. Thêm các xung dữ liệu tiết chế, di chuyển chậm quanh một số chi tiết phần cứng được chọn. CRT phải hiển thị một cảnh chờ pixel art lặp lại, có linh vật nhỏ, hiệu ứng scanline tinh tế và kiểu chữ “PLAYER ONE”. Sử dụng chính xác logo chữ T màu vàng và chữ V màu trắng được cung cấp trên khuôn mặt các linh vật.
Một nút “POWER ON” nổi bật hoặc thao tác nhấp vào cảnh máy console phải bắt đầu một chuỗi chuyển cảnh liên tục. Đưa camera tiến dần về phía màn hình CRT, tạo một luồng dữ liệu động và từ từ mở rộng cảnh để phủ kín toàn bộ khung nhìn. Luôn phủ kín các cạnh trên và dưới trong suốt quá trình. Hiển thị bộ sưu tập băng game qua một chuyển cảnh mượt từ tối sang sáng, không dùng lớp phủ đột ngột xuất hiện hay cú nhảy camera gấp.
Bộ sưu tập gồm ba băng game dựng đứng, khác biệt rõ ràng: Snake màu sage, Breakout màu đất nung và Blocks màu xanh lam. Mỗi băng có kiểu chữ bìa sắc nét cùng một linh vật nhỏ hoạt ảnh ngồi phía trên. Dùng chuyển động nhấp nhô tinh tế, hiệu ứng nâng khi rê chuột và độ nghiêng nhẹ nhàng. Hỗ trợ cả thao tác nhấp vào băng game 3D lẫn các nút văn bản dễ tiếp cận bên dưới.
Mỗi lựa chọn sẽ mở một giao diện trò chơi có thể chơi được. Snake có chuỗi thức ăn và trái cây thưởng theo thời gian. Breakout có nhiều bố cục gạch cùng vật phẩm tăng sức mạnh cho thanh đỡ hoặc chế độ nhiều bóng. Blocks có phần xem trước khối tiếp theo, bóng mờ vị trí hạ xuống và tính điểm khi xóa hàng. Cung cấp hướng dẫn rõ ràng, điểm số, chức năng tạm dừng, khởi động lại và điều hướng quay về. Hỗ trợ điều khiển bằng bàn phím và các nút cảm ứng, đồng thời lưu điểm cao nhất trên thiết bị.
Giữ nội dung màn hình và nhãn băng game dưới dạng các kết cấu runtime riêng biệt để văn bản luôn sắc nét. Bảo toàn tên các bộ phận mô hình để phục vụ tương tác và hoạt ảnh linh vật. Bổ sung phản hồi khi tải, phương án dự phòng có thể sử dụng nếu tài sản 3D không tải được, bố cục thích ứng, trạng thái focus bàn phím hiển thị rõ ràng và hỗ trợ giảm chuyển động. Tổ chức dự án gọn gàng, kiểm tra cả ba trò chơi và các chuyển cảnh, đồng thời chuẩn bị sẵn để triển khai trên GitHub và Vercel.
Cách dùng câu lệnh này
01
Bắt đầu với công cụ phù hợp
Mở trợ lý lập trình hoặc công cụ 3D bạn yêu thích. Bắt đầu với mô hình được nêu trong ví dụ và xem hướng dẫn thiết lập trong các dự án liên kết.
02
Chọn một yếu tố để thay đổi
Đổi chủ thể, phong cách mỹ thuật hoặc bối cảnh. Mô tả rõ máy quay và cách tương tác. Làm một phiên bản nhỏ trước, rồi cải thiện từng chi tiết.
03
Thêm mô hình riêng vào khung cảnh
Để có nhân vật hay đạo cụ riêng, hãy tạo mô hình 3D từ mô tả ngắn về đồ vật hoặc ảnh tham khảo, rồi đưa vào dự án.
Các bản xem trước thuộc về từng tác giả tương ứng. Kiểm tra nguồn gốc và giấy phép dự án trước khi tái sử dụng mã hoặc tài nguyên.