GPT 6 Astra for Computer Use

Tạo một trang web HTML tương tác hoàn chỉnh, chỉ gồm một tệp duy nhất, có tiêu đề “Phòng thí nghiệm sự cố in typo lúc nửa đêm”. Chỉ xuất tài liệu HTML hoàn chỉnh, với toàn bộ CSS và JavaScript được viết inline. Trang phải mở và hoạt động trực tiếp trong trình duyệt hiện đại mà không cần dependency bên ngoài, CDN, thư viện, font, liên kết hình ảnh, tệp SVG hay tài nguyên nào khác. Đây là một trang web responsive, không phải hình ảnh hoặc bố cục canvas cố định 16:9; trang phải thích ứng linh hoạt với màn hình desktop, tablet và mobile. Xây dựng một trình mô phỏng in typo giàu tính vật thể, trong đó người dùng sắp chữ bằng cách kéo từng khối chữ chì lên tờ giấy trung tâm, xoay và định vị lại chúng, sau đó điều chỉnh lượng mực, áp lực máy in và độ ẩm giấy trước khi kéo cần gạt cơ khí lớn để ép in. Kết quả in phải phản hồi theo quy luật với các tham số đó: thừa mực gây lem và làm tắc các khoảng rỗng, ít mực tạo ra mép khô và đứt đoạn, áp lực làm thay đổi độ lõm và biến dạng, độ ẩm làm tăng hiện tượng tua mực và hư hại sợi giấy, vị trí chữ không hoàn hảo tạo ra hiện tượng lệch đăng ký, còn các lần ép lặp lại tạo bóng lệch và ảnh ma. Cho phép nhiều lượt in màu chỉ bằng đỏ vermilion, xanh ultramarine và vàng acid, với hiệu ứng chồng màu chân thực, thứ tự lớp hiển thị rõ ràng, khả năng bật/tắt từng lớp, undo/redo theo từng bước và khả năng nhấc góc giấy để lộ dần bản in bên dưới. Cố định cao trào hình ảnh chính vào khoảnh khắc con lăn máy in vừa nâng lên và bản in hoàn thiện sắp được hé lộ. Tờ giấy trung tâm phải tạo cảm giác như một sân khấu kịch. Sắp xếp các khối chữ, con lăn mực, nhíp, chốt căn chỉnh, giấy vụn, đồng hồ đo và các nút điều khiển thành một vòng bất đối xứng xung quanh. Dùng nền giấy xương trắng ngà và xám chì, được chiếu sáng bởi đèn làm việc trắng ấm từ góc trên bên trái. Thể hiện mọi thứ bằng CSS, phần tử HTML, Canvas và texture tạo theo thủ tục, theo phong cách in lưới vật lý thô ráp và collage thủ công: mép giấy rách, hạt giấy dạng sợi, sắc tố không đều, đốm halftone, kim loại trầy xước, vệt mực, mảnh băng keo, phối cảnh nhẹ, đăng ký màu không hoàn hảo và bóng đổ nhiều lớp. Tránh gradient bóng bẩy, phong cách SaaS vô trùng, thẻ giao diện chung chung, màu cyberpunk neon, hình ảnh photorealistic, emoji, minh họa stock và hình học vector sạch tuyệt đối. Bao gồm một kho chữ movable type phong phú với chữ cái, dấu câu, chữ số và nhiều khối trang trí. Người dùng phải có thể kéo các khối từ kho vào khu vực sắp chữ, chọn nhiều khối, xoay chúng bằng tay nắm hoặc phím tắt, dịch chuyển bằng các phím mũi tên, xóa hoặc nhân bản chúng, đồng thời chỉnh sửa nội dung văn bản mà không làm mất diện mạo của khối vật lý. Thêm các đường căn chỉnh có thể bật/tắt, nhưng vẫn giữ lại những sai lệch thủ công nhỏ. Cung cấp trạng thái hover, active, selected, disabled và focus rõ ràng. Hỗ trợ tương tác bằng chuột, bút cảm ứng và touch, bộ điều khiển bàn phím hợp lý, nhãn accessibility và chỉ báo focus dễ nhận biết. Tạo ba bộ điều khiển giàu tính vật thể cho lượng mực, áp lực và độ ẩm; giá trị của chúng phải cập nhật bản xem trước giấy, mô phỏng texture, đồng hồ đo, nhãn cảnh báo và hành vi máy móc xung quanh theo thời gian thực. Hệ thống phải bộc lộ các trạng thái sự cố thú vị ở những tổ hợp cực đoan, chẳng hạn như vệt mực nở dữ dội, chữ bị in đôi, chữ bị trượt, vết nứt sợi giấy tua tủa, tiếng rung con lăn và dấu căn chỉnh bắn tung tóe, nhưng vẫn giữ bố cục dễ đọc. Thêm nhật ký thử nghiệm gọn gàng để ghi lại từng lần ép in cùng các tham số. Người dùng phải có thể chọn màu của lượt in, kéo cần gạt qua một cung chuyển động thuyết phục, theo dõi một chu kỳ ép in ngắn nhưng chi tiết, rồi bóc góc giấy. Hoạt ảnh phải bao gồm lực cản của cần gạt, rung máy, chuyển động con lăn, lực nén giấy, bụi lơ lửng, đèn hơi chập chờn và khoảng ngừng hồi hộp trước khi hé lộ. Tôn trọng prefers-reduced-motion. Làm cho undo và redo thực sự hoạt động với việc đặt khối, xoay, thay đổi tham số, in, các lượt màu và thao tác hé lộ. Bao gồm các nút Đặt lại, Sự cố ngẫu nhiên, Châm thêm mực, Thêm lượt in, Undo và Redo, cùng một gợi ý onboarding ngắn gọn sẽ biến mất sau khi tương tác. Khởi tạo trang bằng một poster đang được sắp dở đầy cuốn hút để khung nhìn đầu tiên giàu chi tiết, nhưng vẫn cho phép chỉnh sửa mọi thành phần quan trọng. Thêm phản hồi hình ảnh tinh tế gợi liên tưởng đến âm thanh mà không dùng tài nguyên âm thanh. Khi phù hợp, hãy tạo texture theo thủ tục một cách xác định để undo khôi phục đúng diện mạo trước đó. Trải nghiệm phải mang cảm giác nghi lễ, thủ công, căng thẳng và tinh nghịch khó kiểm soát thay vì chỉ mang tính trang trí. Ưu tiên các chi tiết tương tác trau chuốt, sự liên kết tham số thuyết phục, các dấu tích in tạo theo thủ tục nhiều lớp, nhịp hoạt ảnh tinh tế và bố cục responsive xuất sắc. Sử dụng HTML ngữ nghĩa và JavaScript thuần sạch sẽ, có cấu trúc rõ ràng. Phản hồi cuối cùng chỉ được chứa tài liệu HTML hoàn chỉnh có thể thực thi.

Tạo một trang web HTML tương tác hoàn chỉnh, trau chuốt, chỉ gồm một tệp duy nhất, có tiêu đề “Nhà hát soundscape mì ramen lúc nửa đêm”. Chỉ xuất tài liệu HTML cuối cùng với toàn bộ CSS và JavaScript được viết inline. Trang phải chạy trực tiếp trong trình duyệt hiện đại, không cần bước build và không có dependency bên ngoài, thư viện, font, hình ảnh, tệp âm thanh, tài nguyên CDN, network request hay asset liên kết nào. Xây dựng một khung cảnh tương tác giàu biểu cảm bên trong một quán mì ramen siêu thực lúc nửa đêm. Đối tượng trung tâm là một bó mì đàn hồi liên tục duy nhất được dựng bằng Canvas, SVG hoặc sự kết hợp được tích hợp cẩn thận giữa cả hai. Bó mì phải chạy chéo qua tiền cảnh và tạo cảm giác hữu hình về mặt vật lý: người dùng có thể nắm nó ở bất kỳ vị trí nào bằng chuột hoặc touch, kéo, kéo giãn, quất, gập chồng lên chính nó rồi thả ra. Triển khai vật lý lò xo thuyết phục với quán tính, giảm chấn, trọng lực, nhiều đoạn liên kết, phản hồi va chạm và chuyển động thứ cấp rõ ràng. Giữ mô phỏng ổn định ngay cả khi kéo mạnh, đổi hướng nhanh, thay đổi kích thước viewport hoặc tương tác lặp lại nhiều lần. Sắp xếp ít nhất ba bát ramen khác biệt cùng nhiều nguyên liệu dọc theo một cung uốn lượn xuyên suốt bố cục, tạo nhịp điệu thị giác mạnh quanh sợi mì chéo. Mỗi bát phải có họa tiết nước dùng minh họa riêng, bản sắc màu riêng, nhãn riêng và đặc trưng âm thanh riêng. Khi sợi mì chạm vào hoặc rơi vào một chiếc bát, hãy kích hoạt phản hồi nghe nhìn đồng bộ: một nhịp gõ riêng biệt được tổng hợp bằng Web Audio API, luồng hơi nước bốc lên, các hạt hành lá xanh bắn tung, gợn nước dùng, giọt nhỏ, rung lệch đăng ký kiểu in lưới và chữ tượng thanh viết tay phong cách Nhật như “ZURU!”, “PON!”, “JUU!” hoặc “BASHAN!” được tạo bằng văn bản đã tạo kiểu thay vì font bên ngoài. Cường độ va chạm phải ảnh hưởng đến âm lượng, cao độ, số lượng hạt, kích thước gợn nước, tỷ lệ chữ và lực hoạt ảnh. Âm thanh chỉ được bắt đầu sau lần tương tác đầu tiên của người dùng và phải có điều khiển tắt/bật tiếng rõ ràng. Trạng thái cao trào về hình ảnh nên gợi lên một khung hình đóng băng, trong đó sợi mì được kéo căng ngoạn mục giữa không trung còn nước dùng lơ lửng ngay trước khoảnh khắc bắn tóe. Hỗ trợ trạng thái này bằng điều khiển “ĐÓNG BĂNG CÚ BẮN” và phím Space: khi vào chế độ đóng băng, áp dụng một chuyển cảnh ngắn, mạnh, tạm dừng khung cảnh vật lý nhưng vẫn giữ nguyên trạng thái, nhấn mạnh các giọt nước đang bay và độ căng của sợi mì, hiển thị kinetic typography đậm chất poster, đồng thời duy trì hiệu ứng lấp lánh nhẹ của đường nét tạo theo thủ tục để trang vẫn có sức sống. Nhấn Space hoặc điều khiển một lần nữa để tiếp tục mượt mà. Thêm điều khiển đặt lại, chỉ báo trạng thái âm thanh nhỏ gọn và thông số “tempo/impact” trực tiếp, tiết chế, được điều khiển bởi các va chạm gần đây. Bộ điều khiển bàn phím phải dễ khám phá trong một bảng trợ giúp tích hợp nhỏ: Space bật/tắt đóng băng, R đặt lại, M tắt tiếng và các phím mũi tên tạo xung lực định hướng cho sợi mì. Sử dụng phong cách lai tinh tế giữa thiết kế poster in lưới vintage và hoạt ảnh đường nét tạo theo thủ tục. Nền xanh chàm đậm phải chiếm ưu thế, được cắt bởi hơi ấm cục bộ của lửa bếp quanh các bát mì và điểm va chạm. Sử dụng các màu spot nhiều lớp—đỏ vermilion, vàng gừng, xanh hành lá, kem ấm và gần đen—cùng texture halftone, mép mực thô, lệch đăng ký màu nhẹ, bóng đồ họa đậm và các đường viền chuyển động. Kết quả phải mang cảm giác thủ công và sân khấu thay vì bóng bẩy hoặc photorealistic. Bao gồm hơi nước môi trường tinh tế, ánh lửa bếp chập chờn, hạt bụi trôi và đường nét chuyển động, nhưng vẫn duy trì độ tương phản mạnh và các điều khiển dễ đọc. Tránh phong cách cyberpunk neon chung chung. Làm cho bố cục responsive trên màn hình desktop rộng, tablet và mobile; đây là một trang web, vì vậy không được ép theo tỷ lệ khung hình cố định 16:9. Điều chỉnh linh hoạt vị trí bát, typography, điều khiển, giới hạn mô phỏng và vùng chạm mà không cắt mất nội dung thiết yếu. Sử dụng pointer events để thống nhất thao tác chuột, bút và touch. Chỉ ngăn trang cuộn khi người dùng đang chủ động thao tác với sợi mì. Tôn trọng prefers-reduced-motion bằng cách giảm hoạt ảnh môi trường nhưng vẫn giữ tương tác cốt lõi hoạt động. Duy trì hiệu năng mượt mà nhờ pooling hạt hiệu quả hoặc giới hạn hạt nghiêm ngặt, requestAnimationFrame, kết xuất có xét device-pixel-ratio với giới hạn độ phân giải hợp lý và xử lý tọa độ an toàn khi resize. Yêu cầu về nội dung và độ hoàn thiện: bao gồm phần tiêu đề giàu không khí, một lời mời tương tác ngắn gọn trong một dòng, ba bát mì trở lên có nhãn, nhiều loại topping khác biệt về hình ảnh, các từ tượng thanh viết tay theo ngữ cảnh, trạng thái điều khiển trau chuốt, kiểu focus rõ ràng, nhãn nút dễ tiếp cận và một gợi ý tương tác không gây chú ý, sẽ mờ dần sau lần sử dụng đầu tiên. Khung cảnh mở đầu phải trông như một poster sưu tầm đã hoàn thiện trước khi có bất kỳ tương tác nào, trong khi trạng thái hoạt động phải trở thành một món đồ chơi nhịp điệu sống động với phản hồi nhiều lớp và chuyển động phát sinh đầy bất ngờ. Ràng buộc loại trừ: không có asset hoặc dependency bên ngoài; không có URL hình ảnh; không có âm thanh thu sẵn; không có framework; không có placeholder chưa hoàn thiện; không có chú thích TODO; không có điều khiển bị hỏng; không có canvas cố định 16:9; không có giao diện mặc định đơn điệu; không có nền chỉ gồm gradient chung chung; không dùng emoji làm hình ảnh chính; không có quá nhiều văn bản giải thích; không tự động phát âm thanh; không để số lượng hạt tăng mất kiểm soát; không có vật lý mong manh bị phát nổ hoặc tạo ra giá trị NaN; không có tương tác chỉ hoạt động bằng chuột; và không xuất bất kỳ nội dung nào bên ngoài tài liệu HTML hoàn chỉnh duy nhất.