GPT 6 Astra for Computer Use

สร้างหน้าเว็บ HTML แบบอินเทอร์แอกทีฟที่สมบูรณ์ในไฟล์เดียว ชื่อ “ห้องทดลองอุบัติเหตุแท่นพิมพ์จดหมายยามเที่ยงคืน” ให้ส่งออกเฉพาะเอกสาร HTML ที่เสร็จสมบูรณ์ โดยฝัง CSS และ JavaScript ทั้งหมดไว้ภายใน เอกสารต้องเปิดและทำงานได้โดยตรงในเบราว์เซอร์สมัยใหม่โดยไม่พึ่งพา dependency ภายนอก, CDN, ไลบรารี, ฟอนต์, ลิงก์รูปภาพ, ไฟล์ SVG หรือแอสเซ็ตอื่นใด นี่ต้องเป็นเว็บเพจแบบ responsive ไม่ใช่ภาพหรือองค์ประกอบ canvas แบบตายตัวอัตราส่วน 16:9 และต้องปรับตัวได้อย่างราบรื่นบนหน้าจอเดสก์ท็อป แท็บเล็ต และมือถือ สร้างเครื่องจำลองแท่นพิมพ์ตัวเรียงแบบสัมผัสได้ โดยผู้ใช้จัดองค์ประกอบงานพิมพ์ด้วยการลากบล็อกตัวพิมพ์โลหะแต่ละชิ้นไปวางบนแผ่นกระดาษตรงกลาง หมุนและขยับตำแหน่ง จากนั้นปรับปริมาณหมึก แรงกดแท่นพิมพ์ และความชื้นของกระดาษ ก่อนดึงคันโยกกดพิมพ์เชิงกลขนาดใหญ่ ผลงานพิมพ์ต้องตอบสนองต่อพารามิเตอร์เหล่านี้แบบ procedural: หมึกมากเกินไปทำให้หมึกซึมและช่องว่างภายในตัวอักษรตัน หมึกน้อยทำให้ขอบแห้งและแตก แรงกดเปลี่ยนรอยบุ๋มและการเสียรูป ความชื้นเพิ่มการฟุ้งเป็นเส้นและความเสียหายของเส้นใยกระดาษ การวางตัวพิมพ์ไม่ตรงทำให้เกิดการเหลื่อมตำแหน่ง และการกดพิมพ์ซ้ำทำให้เกิดเงาเหลื่อมกับภาพหลอน อนุญาตให้พิมพ์ทับหลายสีโดยใช้เฉพาะสีแดงชาด สีน้ำเงินอุลตร้ามารีน และสีเหลืองกรด พร้อมการผสมสีแบบพิมพ์ทับที่สมจริง การแสดงลำดับเลเยอร์ การเปิดปิดการมองเห็นแยกแต่ละเลเยอร์ การ undo/redo ทีละขั้น และความสามารถในการยกมุมกระดาษเพื่อเผยให้เห็นงานพิมพ์ที่กำลังก่อตัวอยู่ด้านล่าง ตรึงช่วงดราม่าหลักของภาพไว้ที่จังหวะซึ่งลูกกลิ้งกดพิมพ์เพิ่งยกขึ้น และผลงานพิมพ์ที่เสร็จแล้วกำลังจะถูกเปิดเผย กระดาษตรงกลางต้องให้ความรู้สึกราวกับเป็นเวทีละคร จัดบล็อกตัวพิมพ์ ลูกกลิ้งหมึก แหนบ หมุดจัดแนว เศษวัสดุ มาตรวัด และตัวควบคุมต่าง ๆ เป็นวงแหวนไม่สมมาตรล้อมรอบ ใช้พื้นฐานกระดาษสีงาช้างนวลกับสีเทาตะกั่ว ส่องสว่างด้วยโคมไฟสีขาวอุ่นที่สาดเฉียงจากมุมซ้ายบน เรนเดอร์ทุกอย่างด้วย CSS, องค์ประกอบ HTML, Canvas และ procedural textures ในสไตล์สกรีนพิมพ์เชิงกายภาพแบบหยาบและคอลลาจทำมือ: ขอบฉีกขาด ลายเสี้ยนกระดาษ เม็ดสีไม่สม่ำเสมอ จุดฮาล์ฟโทน โลหะเป็นรอยขีด รอยเปื้อนหมึก เศษเทป มุมมองเล็กน้อย การจัดแนวไม่สมบูรณ์ และเงาซ้อนหลายชั้น หลีกเลี่ยงไล่ระดับสีเงาวาว สไตล์ SaaS ที่ปลอดเชื้อ การ์ดทั่วไป สีไซเบอร์พังก์นีออน ภาพเสมือนจริง อีโมจิ ภาพประกอบสต็อก และรูปทรงเวกเตอร์ที่สะอาดสมบูรณ์แบบ ใส่คลังตัวพิมพ์ที่เลื่อนได้ขนาดใหญ่ ซึ่งมีตัวอักษร เครื่องหมายวรรคตอน ตัวเลข และบล็อกตกแต่งหลายแบบ ผู้ใช้ต้องลากบล็อกจากคลังไปยังพื้นที่จัดองค์ประกอบ เลือกหลายบล็อก หมุนด้วยแฮนเดิลหรือแป้นพิมพ์ลัด ขยับละเอียดด้วยปุ่มลูกศร ลบหรือทำสำเนา และแก้ไขเนื้อหาข้อความได้โดยไม่สูญเสียรูปลักษณ์ของบล็อกทางกายภาพ เพิ่มเส้นช่วยจัดแนวที่เปิดปิดได้ แต่ยังคงความคลาดเคลื่อนเล็กน้อยจากการปรับด้วยมือไว้ แสดงสถานะ hover, active, selected, disabled และ focus อย่างชัดเจน รองรับการโต้ตอบด้วย pointer และ touch มีการควบคุมด้วยแป้นพิมพ์ที่เหมาะสม ป้ายกำกับที่เข้าถึงได้ และตัวบ่งชี้โฟกัสที่มองเห็นได้ สร้างตัวควบคุมแบบสัมผัสได้สามรายการสำหรับปริมาณหมึก แรงกด และความชื้น โดยค่าของแต่ละรายการต้องอัปเดตตัวอย่างกระดาษ การจำลองพื้นผิว มาตรวัด ป้ายเตือน และพฤติกรรมแวดล้อมของเครื่องแบบเรียลไทม์ ระบบควรเผยสถานะอุบัติเหตุแสนสนุกเมื่อค่าผสมอยู่ที่สุดขั้ว เช่น หมึกบานอย่างรุนแรง ตัวอักษรซ้อนสองชั้น ตัวพิมพ์เลื่อน รอยร้าวของเส้นใยที่ขรุขระ เสียงกระตุกของลูกกลิ้ง และรอยจัดแนวที่กระเด็น แต่ยังคงให้องค์ประกอบอ่านได้ เพิ่มบันทึกการทดลองขนาดกะทัดรัดที่บันทึกการกดพิมพ์แต่ละครั้งและพารามิเตอร์ของมัน ผู้ใช้ต้องเลือกสีของ pass ดึงคันโยกผ่านแนวโค้งที่สมจริงเพื่อกดพิมพ์ ดูรอบการทำงานของแท่นพิมพ์ที่สั้นแต่มีรายละเอียด แล้วจึงเปิดลอกกระดาษกลับ แอนิเมชันควรมีแรงต้านของคันโยก การสั่นของเครื่อง การเคลื่อนที่ของลูกกลิ้ง การบีบอัดกระดาษ ละอองฝุ่น การกะพริบเล็กน้อยของโคมไฟ และช่วงหยุดอย่างลุ้นระทึกก่อนการเปิดเผย ต้องเคารพ prefers-reduced-motion ทำให้ undo และ redo ทำงานได้จริงกับการวาง การหมุน การเปลี่ยนพารามิเตอร์ การพิมพ์ pass สี และการเปิดเผยผลงาน ใส่ตัวควบคุม รีเซ็ต, อุบัติเหตุสุ่ม, เติมหมึกใหม่, เพิ่ม pass, Undo และ Redo รวมถึงคำแนะนำเริ่มต้นแบบกระชับที่หายไปหลังมีการโต้ตอบ ป้อนโปสเตอร์ที่จัดองค์ประกอบไว้บางส่วนอย่างน่าสนใจให้หน้าเว็บตั้งต้น เพื่อให้มุมมองแรกมีรายละเอียดทางภาพมากมาย แต่ให้องค์ประกอบสำคัญทุกส่วนยังแก้ไขได้ เพิ่มฟีดแบ็กทางภาพละเอียดอ่อนที่ให้ความรู้สึกคล้ายเสียงโดยไม่ใช้แอสเซ็ตเสียง ตรวจสอบให้ procedural texture มีผลลัพธ์ที่กำหนดได้เมื่อทำได้ เพื่อให้ undo คืนรูปลักษณ์เดิมกลับมาได้ ประสบการณ์ควรให้ความรู้สึกเหมือนพิธีกรรม งานทำมือ ตึงเครียด และควบคุมไม่ได้อย่างเจ้าเล่ห์ มากกว่าจะเป็นเพียงของตกแต่ง ให้ความสำคัญกับรายละเอียดการโต้ตอบที่ขัดเกลาแล้ว การเชื่อมโยงพารามิเตอร์ที่น่าเชื่อถือ อาร์ติแฟกต์จากการพิมพ์แบบ procedural หลายชั้น จังหวะแอนิเมชันที่ประณีต และการจัดองค์ประกอบ responsive ที่ยอดเยี่ยม ใช้ semantic HTML และ vanilla JavaScript ที่สะอาดและมีโครงสร้างดี คำตอบสุดท้ายต้องมีเฉพาะเอกสาร HTML ที่ทำงานได้อย่างสมบูรณ์ทั้งหมด

สร้างหน้าเว็บ HTML แบบอินเทอร์แอกทีฟที่สมบูรณ์ ขัดเกลาแล้ว และอยู่ในไฟล์เดียว ชื่อ “โรงละครซาวด์สเคปบะหมี่กึ่งสำเร็จรูปยามเที่ยงคืน” ให้ส่งออกเฉพาะเอกสาร HTML สุดท้าย โดยฝัง CSS และ JavaScript ทั้งหมดไว้ภายใน ต้องทำงานได้โดยตรงในเบราว์เซอร์สมัยใหม่โดยไม่ต้องมีขั้นตอน build และไม่พึ่งพา dependency ภายนอก ไลบรารี ฟอนต์ รูปภาพ ไฟล์เสียง ทรัพยากร CDN คำขอเครือข่าย หรือแอสเซ็ตที่ลิงก์จากภายนอก สร้างฉากเชิงอารมณ์ภายในร้านราเม็งยามเที่ยงคืนเหนือจริง วัตถุศูนย์กลางคือกลุ่มเส้นบะหมี่แบบต่อเนื่องหนึ่งกลุ่มที่เรนเดอร์ด้วย Canvas, SVG หรือการผสานทั้งสองอย่างอย่างพิถีพิถัน กลุ่มเส้นบะหมี่ควาดเฉียงผ่านฉากด้านหน้าและต้องให้ความรู้สึกจับต้องได้ ผู้ใช้สามารถคว้าจากจุดใดก็ได้ด้วยเมาส์หรือ touch ลาก ยืด สะบัด พับทบ และปล่อยได้ ใช้ฟิสิกส์สปริงที่น่าเชื่อถือ โดยมีแรงเฉื่อย แรงหน่วง แรงโน้มถ่วง หลายเซกเมนต์ การตอบสนองต่อการชน และการเคลื่อนไหวรองที่มองเห็นได้ รักษาเสถียรภาพของการจำลองแม้มีการลากอย่างรุนแรง การเปลี่ยนทิศทางรวดเร็ว การปรับขนาด viewport หรือการโต้ตอบซ้ำ ๆ จัดชามราเม็งที่แตกต่างกันอย่างน้อยสามใบและส่วนผสมอีกหลายอย่างตามแนวโค้งที่กวาดผ่านองค์ประกอบ เพื่อสร้างจังหวะทางภาพที่ชัดเจนรอบเส้นบะหมี่แนวทแยง ชามแต่ละใบต้องมีลวดลายน้ำซุปแบบวาดด้วยมือ อัตลักษณ์สี ป้ายชื่อ และคาแรกเตอร์เสียงของตัวเอง เมื่อเส้นบะหมี่สัมผัสหรือตกลงในชาม ให้เรียกใช้การตอบสนองด้านภาพและเสียงที่สอดคล้องกัน ได้แก่ จังหวะเพอร์คัสชันเฉพาะที่สังเคราะห์ด้วย Web Audio API ไอน้ำพุ่งขึ้น อนุภาคสีเขียวต้นหอมกระจาย ระลอกน้ำซุป หยดน้ำเล็ก ๆ การสั่นของการจัดแนวแบบสกรีนพิมพ์ และคำเลียนเสียงแบบลายมือสไตล์ญี่ปุ่นที่เคลื่อนไหว เช่น “ZURU!”, “PON!”, “JUU!” หรือ “BASHAN!” ซึ่งสร้างจากข้อความที่ตกแต่งสไตล์เองแทนการใช้ฟอนต์ภายนอก ความรุนแรงของการชนต้องส่งผลต่อระดับเสียง ความถี่เสียง จำนวนอนุภาค ขนาดระลอก ขนาดตัวอักษร และแรงของแอนิเมชัน เสียงต้องเริ่มทำงานหลังจากผู้ใช้โต้ตอบครั้งแรกเท่านั้น และต้องมีตัวควบคุมปิด/เปิดเสียงที่ชัดเจน สถานะภาพไคลแมกซ์ควรให้ความรู้สึกเหมือนภาพหยุดชั่วขณะ ซึ่งเส้นบะหมี่ถูกยืดอย่างดราม่ากลางอากาศ ขณะที่น้ำซุปค้างอยู่ก่อนจะกระเซ็น สนับสนุนสถานะนี้ด้วยตัวควบคุม “หยุดการกระเซ็น” และปุ่ม Space เมื่อเข้าสู่โหมดหยุด ระบบต้องใช้ทรานซิชันสั้น ๆ ที่มีแรงกระแทก หยุดฉากทางกายภาพโดยไม่สูญเสียสถานะ เน้นหยดน้ำกลางอากาศและแรงตึงของเส้นบะหมี่ที่ยืดอยู่ แสดง kinetic typography แบบโปสเตอร์ที่เด่นชัด และคงประกายระยิบของเส้นแบบ procedural อย่างละเอียด เพื่อให้หน้ายังรู้สึกมีชีวิต กด Space หรือตัวควบคุมอีกครั้งเพื่อกลับมาทำงานต่ออย่างราบรื่น เพิ่มตัวควบคุมรีเซ็ต ตัวบ่งชี้สถานะเสียงขนาดกะทัดรัด และค่าการอ่าน “จังหวะ/แรงกระแทก” แบบสดที่ขับเคลื่อนด้วยการชนล่าสุด ควบคุมด้วยแป้นพิมพ์ต้องค้นพบได้ง่ายผ่านแผงช่วยเหลือขนาดเล็กในองค์ประกอบเดียวกัน: Space สลับโหมดหยุด, R รีเซ็ต, M ปิดเสียง และปุ่มลูกศรใช้ส่งแรงกระตุ้นตามทิศทางให้เส้นบะหมี่ ใช้การผสมผสานอันซับซ้อนทางภาพระหว่างการออกแบบโปสเตอร์ซิลค์สกรีนวินเทจกับแอนิเมชันเส้นแบบ procedural พื้นหลังสีน้ำเงินครามเข้มควรครองพื้นที่ โดยมีความอบอุ่นเฉพาะจุดจากไฟเตารอบชามและตำแหน่งชน ใช้สีสปอตแบบซ้อนชั้น ได้แก่ สีแดงชาด สีเหลืองขิง สีเขียวต้นหอม สีครีมอุ่น และสีดำเกือบสนิท พร้อมพื้นผิวฮาล์ฟโทน ขอบหมึกหยาบ การเหลื่อมสีเล็กน้อย เงากราฟิกหนา และเส้นขอบที่เคลื่อนไหว ผลลัพธ์ควรให้ความรู้สึกทำมือและเป็นละครเวที มากกว่าจะเงาวาวหรือเสมือนจริง เพิ่มไอน้ำบรรยากาศ การเรืองแสงของเตาที่กะพริบ เม็ดเกรนที่ลอย และเส้นลายที่เคลื่อนไหวอย่างละเอียด แต่ยังคงคอนทราสต์สูงและตัวควบคุมที่อ่านง่าย หลีกเลี่ยงสไตล์ไซเบอร์พังก์นีออนทั่วไป ทำให้องค์ประกอบ responsive บนหน้าจอเดสก์ท็อปกว้าง แท็บเล็ต และมือถือ นี่คือเว็บเพจ จึงห้ามบังคับอัตราส่วน 16:9 แบบตายตัว ปรับตำแหน่งชาม ตัวอักษร ตัวควบคุม ขอบเขตการจำลอง และพื้นที่สัมผัสให้ลื่นไหลโดยไม่ตัดเนื้อหาสำคัญ ใช้ pointer events เพื่อรวมการรองรับเมาส์ ปากกา และ touch เข้าด้วยกัน ป้องกันการเลื่อนหน้าเฉพาะขณะที่ผู้ใช้กำลังควบคุมเส้นบะหมี่อยู่เท่านั้น เคารพ prefers-reduced-motion ด้วยการลดแอนิเมชันแวดล้อม แต่ยังคงให้การโต้ตอบหลักทำงานได้ รักษาประสิทธิภาพที่ลื่นไหลด้วยการใช้ particle pooling ที่มีประสิทธิภาพหรือจำกัดจำนวนอนุภาคอย่างเข้มงวด requestAnimationFrame การเรนเดอร์ที่คำนึงถึง device-pixel-ratio พร้อมเพดานความละเอียดที่เหมาะสม และการจัดการพิกัดที่ปลอดภัยต่อการปรับขนาด ข้อกำหนดด้านเนื้อหาและความสมบูรณ์: ใส่ชื่อเรื่องที่สร้างบรรยากาศ คำเชิญชวนให้โต้ตอบแบบสั้นหนึ่งบรรทัด ชามที่มีป้ายชื่ออย่างน้อยสามใบ ท็อปปิ้งที่แตกต่างกันทางภาพหลายแบบ คำเลียนเสียงแบบลายมือที่ปรับตามบริบท สถานะตัวควบคุมที่ขัดเกลาแล้ว สไตล์โฟกัสที่ชัดเจน ป้ายกำกับปุ่มที่เข้าถึงได้ และคำแนะนำการโต้ตอบที่ไม่รบกวนซึ่งค่อย ๆ หายไปหลังใช้งานครั้งแรก ฉากเปิดควรดูเหมือนโปสเตอร์สะสมที่เสร็จสมบูรณ์แล้วก่อนมีการโต้ตอบใด ๆ ขณะที่สถานะใช้งานควรเปลี่ยนเป็นของเล่นจังหวะที่มีชีวิตชีวา พร้อมฟีดแบ็กหลายชั้นและการเคลื่อนไหวที่เกิดขึ้นอย่างน่าประหลาดใจ ข้อจำกัดเชิงลบ: ห้ามใช้แอสเซ็ตหรือ dependency ภายนอก ห้ามใช้ URL รูปภาพ ห้ามใช้เสียงที่บันทึกไว้ล่วงหน้า ห้ามใช้เฟรมเวิร์ก ห้ามมี placeholder ที่ยังไม่เสร็จ ห้ามมีคอมเมนต์ TODO ห้ามมีตัวควบคุมที่ใช้งานไม่ได้ ห้ามใช้ canvas แบบตายตัวอัตราส่วน 16:9 ห้ามใช้ UI เริ่มต้นธรรมดา ห้ามใช้พื้นหลังที่มีเพียงไล่ระดับสีทั่วไป ห้ามใช้อีโมจิเป็นงานศิลป์หลัก ห้ามมีข้อความอธิบายมากเกินไป ห้ามเล่นเสียงอัตโนมัติ ห้ามปล่อยให้อนุภาคเพิ่มขึ้นอย่างไร้การควบคุม ห้ามใช้ฟิสิกส์ที่เปราะบางจนระเบิดหรือสร้างค่า NaN ห้ามมีการโต้ตอบที่ทำงานได้เฉพาะเมาส์ และห้ามมีเอาต์พุตใด ๆ นอกเหนือจากเอกสาร HTML ฉบับสมบูรณ์เพียงไฟล์เดียว