เปิดตัว 90s.dev เกมเมกเกอร์ที่ทำงานบนเว็บ

 (90s.dev)
27 คะแนน โดย GN⁺ 2025-05-22 | 2 ความคิดเห็น | แชร์ทาง WhatsApp
  • 90s.dev คือ API สำหรับเกมเมกเกอร์รูปแบบใหม่ที่ทำงานบน เว็บเบส โดยมอบประสบการณ์การสร้างแอป GUI สไตล์ยุค 90
  • แพลตฟอร์มนี้ ไม่ใช่เอนจินเกมหรือเกมเมกเกอร์โดยตรง แต่เป็น API สำหรับสร้างเกม เอนจินเกม และเครื่องมือสร้างเกม
  • จุดเด่นคือ ทำงานบน HTML Canvas, หน้าจอขนาด 320x180, รองรับ WebGL2 และรับประกันทั้งความปลอดภัยและประสิทธิภาพผ่าน Web Worker
  • ด้วย SDK แบบ TypeScript-first และการรองรับการนำเข้าโมดูล wasm จากหลายภาษา ทำให้สร้างต้นแบบได้รวดเร็วและขยายต่อได้ง่าย
  • ผู้ใช้สามารถสร้างแอปของตนเองแล้ว แชร์หรือโหลดผ่าน GitHub หรือ NPM ได้ โดยมีเป้าหมายเพื่อการทำงานร่วมกันและการขยายตัวของชุมชนนักพัฒนา

ความสำคัญของการเปิดตัว 90s.dev

  • 90s.dev เป็นแพลตฟอร์ม API สำหรับเกมเมกเกอร์รูปแบบใหม่ที่ทำงานบนเว็บ
  • มอบ สภาพแวดล้อมการสร้างแอป GUI สไตล์ยุค 90 และมี API สำหรับการสร้างเกม เอนจินเกม และเครื่องมือเกมเมกเกอร์
  • เป้าหมายคือสร้างระบบนิเวศที่ทุกคนสามารถสร้างและแชร์ พิกเซลอาร์ต สไปรต์ แผนที่ และเครื่องมือ สำหรับเกมได้อย่างง่ายดายบน HTML Canvas

คุณสมบัติหลักและวิสัยทัศน์

แนะนำแพลตฟอร์มเบื้องต้น

  • 90s.dev ทำงานในเบราว์เซอร์ และมีหน้าจอที่เติมเต็มหน้าต่างเว็บด้วยความละเอียด 320x180 (16:9)
  • ทุกแอปทำงานใน สภาพแวดล้อม Web Worker เพื่อให้ได้ทั้งความปลอดภัยและประสิทธิภาพที่ดียิ่งขึ้น
  • รองรับการรันเกมได้สูงสุด 60fps ผ่าน WebGL2 offscreen canvas
  • สามารถเรียกใช้และเผยแพร่ โมดูลแอปที่โฮสต์บน GitHub และ NPM ได้อย่างอิสระ
  • รองรับการสร้างต้นแบบอย่างรวดเร็วด้วย TypeScript SDK ที่เป็นมิตรกับ VSCode
  • ใช้งานร่วมกับโมดูลจากหลายภาษาที่บิลด์เป็น WebAssembly (wasm) ได้

แอปที่มีมาให้พื้นฐาน

  • มีแอปพื้นฐานสำหรับสร้างแอสเซ็ตเกม เช่น พิกเซลอาร์ต เครื่องมือสร้างสไปรต์ และแมปเอดิเตอร์ มาให้โดยค่าเริ่มต้น
  • ยังไม่มีเครื่องมือแก้ไขเสียงและดนตรี แต่ ใครก็สามารถพัฒนาแล้วเผยแพร่/แชร์ได้เอง
  • แอปและเครื่องมือที่สร้างขึ้นสามารถแชร์ให้ผู้ใช้ทุกคนได้ผ่าน iframe หรือลิงก์

แรงบันดาลใจและจุดแตกต่าง

เครื่องมือพัฒนาเกมที่ใช้อ้างอิง

  • pico8: เน้นมินิมัลลิสม์ รองรับภาษาเดียว
  • tic80: ปลดข้อจำกัดหลายอย่างของ pico8
  • love2d: ต้องใช้ IDE ภายนอก
  • picotron: นำสถาปัตยกรรมแบบระบบปฏิบัติการมาใช้
  • 90s.dev เป็นเหมือน pico8 ในระดับเมตา และใกล้เคียงกับ love2d ที่นำ TypeScript มาใช้ หรือ tic80 ที่เน้นการขยายเชิงแนวตั้งมากกว่า

นวัตกรรมด้าน GUI และรายละเอียดทางเทคนิค

ระบบเลย์เอาต์

  • มีระบบจัดเลย์เอาต์อัตโนมัติที่เรียบง่ายแต่ทรงพลัง เพื่อลด ความยุ่งยากของการจัดวางและปรับขนาดด้วยมือ
  • วิว (API) วาดหน้าจอโดยตรงและใช้ โครงสร้าง tree ของ child view

ระบบ Ref

  • จัดการคุณสมบัติของวิว (เช่น ขนาด ลูก สีพื้นหลัง ฯลฯ) ผ่าน watchable pointer (ref)
  • ทุกคุณสมบัติจะมีอ็อบเจ็กต์อ้างอิง (ref) กำกับไว้ เพื่อ ตรวจจับและสะท้อนการเปลี่ยนแปลงของคุณสมบัติโดยอัตโนมัติ
  • ออกแบบแยกจาก ref ของ React/Vue แบบสิ้นเชิง

Composites (แนวคิดของ composite view)

  • ใน JSX มีการสลับการใช้ string tag (ตัวพิมพ์เล็ก) และ value tag (ตัวพิมพ์ใหญ่) เพื่อ แยกการใช้งานออกจากการติดตั้งใช้งานได้ชัดเจนยิ่งขึ้น
  • ลงทะเบียน abstract view ไว้ใน global table และนำไปใช้อย่างอิสระในส่วนอื่นของระบบได้
  • ตัวอย่าง: colorpicker view มี implementation เริ่มต้นมาให้ แต่ผู้พัฒนาสามารถแทนที่ด้วยสไตล์ที่ต้องการได้
  • มอบ ความยืดหยุ่นและการขยายต่อสูง สำหรับการพัฒนาแอป GUI

การเผยแพร่แอปและการทำงานร่วมกันของชุมชน

การเปลี่ยนแปลงวิธีเผยแพร่แอป

  • เดิมใช้ไดรฟ์แชร์ net/ ที่อิงกับฐานข้อมูลภายใน
  • ล่าสุดรองรับการ โฮสต์และนำเข้าโมดูลโดยตรง จาก NPM/GitHub ผ่าน CDN
    • ตัวอย่าง: /os/fs/ghb/someuser/project@1.0.0/some/file.js
  • ใช้ Service Worker เพื่อทำให้กลไกการโหลดจากหลายแหล่งสมบูรณ์

การมีส่วนร่วมและความร่วมมือ

  • ด้วยการออกแบบแบบระบบปฏิบัติการ จึง ส่งเสริมการพัฒนาแอปของชุมชน นอกเหนือจากแอปหลักที่จำเป็น
  • รองรับการสื่อสารและความร่วมมือผ่าน issue tracker, forum และ wiki (ทั้งหมดอยู่ใน GitHub repo)
    • Issues: ขอฟีเจอร์และรายงานบั๊ก
    • Forum: ประกาศโปรเจกต์และพูดคุย
    • Wiki: รวมและคัดสรรโปรเจกต์

การแชร์แอป

  • สามารถแชร์แอปได้ผ่านลิงก์รูปแบบ /os/#app
  • มุ่งสู่การสร้างและกระจาย แอป ไลบรารี และแอสเซ็ตอย่างเสรี โดยมีชุมชนเป็นศูนย์กลาง

บทสรุปและทิศทาง

  • 90s.dev คือแพลตฟอร์ม API ที่ ออกแบบและนิยามระบบนิเวศของเกมเมกเกอร์ เอง
  • มุ่งสู่ สภาพแวดล้อมสร้างเกมบนเว็บแบบขยายต่อได้ ที่ทุกคนสามารถสร้าง เผยแพร่ และใช้งานแอปได้อย่างง่ายดาย
  • เป็น เครื่องมือพัฒนาเกมที่มองไปข้างหน้า บนพื้นฐานของความร่วมมือในชุมชนและปรัชญาแพลตฟอร์มแบบเปิด

บทความที่เกี่ยวข้อง

2 ความคิดเห็น

 
lazyhack 2025-05-23

ชวนให้สงสัยว่าเอนจินเกมตัวมันเองจะเป็นอย่างไร
 
GN⁺ 2025-05-22
ความคิดเห็นจาก Hacker News

  • แชร์ประสบการณ์ที่วันหนึ่งตื่นมาตอนตี 2 ในเดือนกุมภาพันธ์แล้วเริ่มเขียนโค้ดทันที เพราะเบื่อที่จะรอต่อไป เลยเขียนโค้ดต่อเนื่องจนสร้างทั้งเครื่องมือสร้างเกมบน API, เอนจินเกม และตัวเกมขึ้นมา พร้อมค้นพบว่าความหลงใหลที่แท้จริงของตัวเองคือการออกแบบ API และรู้สึกว่าคนที่ค้นพบความหลงใหลแล้วทุ่มเทแบบนั้นช่างยอดเยี่ยมมาก

  • ขอบคุณสำหรับคำชม และเสียดายที่ยังอธิบายแก่นของโปรเจกต์ได้ไม่ดีพอ ทั้งที่จริงแล้ว API คือส่วนที่น่าสนใจที่สุด แต่กลับไม่ค่อยแสดงออกมาให้เห็น เลยรู้สึกอึดอัด และคิดว่าน่าจะรอจนกว่าจะมีตัวอย่างที่แสดงการใช้งาน API แบบแปลกใหม่ได้มากกว่านี้ก่อนค่อยเปิดตัว จึงรู้สึกว่ารีบปล่อยเร็วเกินไป

  • ระบุว่าตัวเองคือผู้สร้างโปรเจกต์นี้ และขอบคุณสำหรับฟีดแบ็ก ยอมรับอย่างชัดเจนว่าปล่อยออกมาเร็วไป และกำลังปรับปรุงหลายจุดที่ถูกทักท้วง พร้อมตั้งใจว่าจะกลับมาอีกครั้งในอีกไม่กี่เดือน

  • มองว่าไม่ได้เปิดตัวเร็วเกินไปเลย เป็นโปรเจกต์ที่เจ๋งมากและออกแบบมาอย่างเกินพอดีในทางที่ดี ชื่นชมว่าเป็นตัวอย่างระดับสุดยอดตามอุปมาเรื่อง bike shed และทึ่งมากที่ทำระบบ reactive ของตัวเองขึ้นมาด้วย

  • มองว่าเป็นจังหวะที่เหมาะมากสำหรับ Show HN แค่ดูทัวร์ Hello World ก็เข้าใจได้ทันทีว่าเป็นโปรเจกต์แบบไหน และถ้ามีประสบการณ์กับ PICO-8 และ React มาก่อนก็จะยิ่งรู้สึกสนุกขึ้น อีกทั้งยังเห็นว่าการเลือกอัตราส่วน 16:9 เป็นการตัดสินใจที่ฉลาด เพราะอัตราส่วนสี่เหลี่ยมจัตุรัสของ PICO-8 ดูแปลก ๆ

  • ขอบคุณที่ปล่อยออกมาเร็ว และแนะนำอย่างหนักแน่นให้ปล่อยบ่อย ๆ โดยยกแนวคิดว่าเส้นทางสู่ความสำเร็จคือการทำซ้ำ 10,000 ครั้ง และการลองครั้งเดียวเป็นแค่จุดเริ่มต้น

  • ส่งข้อความให้กำลังใจว่าไม่ได้ปล่อยเร็วเกินไป และผู้สร้างกำลังทำได้ดีมาก

  • แม้จะไม่ได้ลงลึกนัก แต่ยอมรับว่าตัวเองแอบหลงใหลบรรยากาศย้อนยุคนี้มากขึ้นเรื่อย ๆ น่าจะเป็นเพราะความรู้สึกปลอบประโลมจากยุคเก่าที่เรียบง่ายและสบายใจกว่า ซึ่งกลับฟื้นขึ้นมาเมื่อเห็นโปรเจกต์แบบนี้

  • ถามว่าแอป paint ใช้งานได้หรือไม่ เพราะลองทั้งบน Firefox และ Chrome แล้ว เลือกสีกับคลิกก็ยังวาดอะไรไม่ได้เลย และในคอนโซลก็ไม่มี error ใด ๆ อีกเรื่องหนึ่งคือชื่นชมว่าถ่ายทอดบรรยากาศยุค 90s ได้ดีมาก ตอนแรกนึกว่าเป็นกลิ่นอายเทอร์มินัลยุค 70s-80s แต่พอมองดี ๆ ก็พบว่านี่แหละคือหน้าตาของยุค 90s อย่างแท้จริง และแสดงความคาดหวังต่อพัฒนาการในอนาคต

  • บอกว่าขออภัยที่ทำให้สับสน ตอนนี้พัฒนาไปถึงแค่ตัวเลือกสีเท่านั้น ส่วนที่เหลือยังไม่ได้ทำ แต่คิดว่าน่าจะทำเสร็จได้ภายในชั่วโมงเดียว พร้อมอธิบายว่าเจตนาของการพัฒนาคืออยากจำลองความสนุกและพลังของการสร้างแอป GUI ในบรรยากาศแบบยุค 90s โดยตัดความน่ารำคาญออกไป เหลือไว้แต่ความน่าทึ่ง จึงตั้งชื่อว่า 90s.dev

  • ระบุว่าน่าจะยังไม่ได้ implement โดยถ้าคลิกปุ่ม “hash” มุมซ้ายบนของหน้าต่างแล้วเลือก “View Source” จะเห็นว่ายังเป็นเพียง UI mock และในพื้นที่เลื่อนดูจะมีแค่โค้ดที่วาดลวดลายธรรมดา ๆ

  • ของตัวเองก็ใช้ไม่ได้เหมือนกัน

  • แม้จะยังไม่เข้าใจตัวโปรเจกต์ทั้งหมดดีพอ แต่ชอบบรรยากาศของมันมาก รู้สึกทึ่งที่เพียงแค่อารมณ์และองค์ประกอบทางภาพบางอย่างก็ส่งผลต่อความรู้สึกของคนได้มาก และทำให้เกิดความสนใจมากขึ้น

  • ลองคิดในแบบของตัวเองว่าจะอธิบายอย่างไร เดิมทีอยากสร้าง pico8 ที่ใช้งานสะดวกกว่า จึงทำดีไซน์และต้นแบบขนาด 320x180 ขึ้นมา แต่ขณะเดียวกันก็อยากได้ความสะดวกทั้งหมดของ VS Code รวมถึงการรองรับ TypeScript ด้วย สุดท้ายจึงวางแนวคิดให้เป็นแพลตฟอร์มที่มีสิ่งต่าง ๆ ซึ่งปกติจะอยู่ในแท็บของ pico8 ให้สร้างและแจกจ่ายได้ และพอมาคิดตอนนี้ก็ยังรู้สึกว่าเปิดตัวเร็วเกินไปอยู่ดี

  • ชอบบรรยากาศโดยรวม แต่เห็นว่าอัตราส่วน 16:9 กับพีซียุค 90s ไม่ค่อยเข้ากันนัก เพราะชอบอารมณ์เฉพาะตัวของจอ CRT ที่เกือบเป็นสี่เหลี่ยมจัตุรัสมากกว่า

  • ขอบคุณและบ่นว่าเรื่องการอธิบายนั้นยากมาก โพสต์ครั้งนี้ก็เป็นเพียงความพยายามที่จะอธิบายให้สั้นที่สุดว่าตัวเองสร้างอะไรขึ้นมา แต่ถึงจะเขียนสั้นแล้ว เนื้อหาก็ยังเลือนลางอยู่ดี จนรู้สึกอยากยอมแพ้อย่างตรงไปตรงมา

  • คิดว่าโปรเจกต์นี้เจ๋งมาก แต่เริ่มต้นใช้งานค่อนข้างยากเล็กน้อย จึงเสนอว่าอยากเห็น walkthrough สั้น ๆ สำหรับการสร้างมินิเกม

  • กล่าวขอบคุณ และอธิบายว่าปัจจุบันวิธี build เกมเหมือนกับ tutorial การ build แอป ต่างกันตรงที่สามารถสร้าง custom view และ override เมธอด draw ได้ ถ้าจะเน้นประสิทธิภาพก็แนะนำให้สร้างและใช้ OffscreenCanvas เพิ่มเติม ส่วนตอนนี้ยังไม่มี API ที่ห่อ WebGL2 ให้ใช้งานง่ายขึ้น แต่สัญญาว่าในอนาคตจะทำ tutorial ที่แม้แต่มือใหม่ก็สร้างเกมทั้งเกมได้เองแน่นอน ขณะนี้ยังเน้นฝั่งแอปเป็นหลัก จึงให้ความสำคัญกับการพัฒนาเครื่องมือสร้างเกมก่อน เช่น สไปรต์และแผนที่ พร้อมแชร์ลิงก์ Hello World tutorial

  • รู้สึกว่าโปรเจกต์นี้น่าสนใจมาก เหมือนถูกพากลับไปวัยเด็กทันที ชอบ pico8 เหมือนกัน แต่ตัวเองโตมากับเดสก์ท็อปและ GUI มากกว่า จึงรู้สึกว่า pico8 ย้อนยุคไปอีกหนึ่งเจเนอเรชัน ขณะที่โปรเจกต์นี้ปลุกความคิดถึงได้เหมือนการกลับไปซื้อ CD อีกครั้ง

  • ยังแนะนำ Picotron ที่สร้างโดยผู้พัฒนา Pico8 ด้วย โดยอธิบายว่าเป็นเดสก์ท็อป OS ที่คล้าย Pico8 แต่มีข้อจำกัดน้อยกว่าเล็กน้อย ตัวเองยังไม่เคยลองใช้จริง เห็นแค่ GIF เท่านั้น แต่รู้สึกว่าแนวคิดของโปรเจกต์คล้ายกัน คือมุ่งไปที่การเป็น “แพลตฟอร์ม” ที่สามารถสร้าง pico8 ขึ้นมาอยู่ภายในได้ และมองว่าทั้งสองโปรเจกต์กำลังไล่ตามอุดมคติเดียวกันด้วยคนละวิธี

  • ติดอยู่ตั้งแต่ขั้นตอนแรกของคู่มือ Getting Started โดยดาวน์โหลด helloworld.zip มาไว้ในเครื่อง เปิด filer.app.js บนเว็บ แล้วกดปุ่ม mount พร้อมใส่ drive name เป็น helloworld/app แต่ไม่มีอะไรเกิดขึ้นเลย จึงสับสนว่าต้องอัปโหลดไฟล์ zip เข้าไปในอินสแตนซ์ 90s.dev อย่างไร

  • ขอบคุณสำหรับฟีดแบ็ก และเดาว่าน่าจะใช้ Firefox อยู่ เพราะฟีเจอร์นี้พึ่งพา showDirectoryPicker ซึ่ง Firefox ยังไม่รองรับ จึงแนะนำให้ใช้ Chrome นอกจากนี้ในช่อง drive name ต้องใส่แค่ชื่อโดยไม่ต้องมีพาธ เช่น “foo” และสัญญาว่าจะรีบแก้คู่มือ โดยอธิบายต่อว่าหลังจากนั้น foo/helloworld.app.js จะเชื่อมกับพาธบนเครื่องจริง

  • บอกว่าชอบบรรยากาศยุค 90s มาก โดยเฉพาะฟอนต์ที่โดดเด่น และเพิ่งตระหนักว่าตัวเองชอบดีไซน์ยุค 90s มากกว่าพิกเซลอาร์ตสไตล์ 80s มาก

  • วิจารณ์หน้า landing page ว่าทำให้สับสน เพราะเรียกโปรเจกต์ว่าเป็น ‘game maker’ แต่ขณะเดียวกันก็อธิบายว่า ‘ไม่ใช่ game maker’ จึงดูขัดแย้งกัน และชี้ว่าการใช้คำยังไม่สอดคล้องกัน

  • เตือนว่าเรื่องการตั้งชื่อนั้นยากมาก และถือเป็นหนึ่งในปัญหาที่ยากที่สุดของวิทยาการคอมพิวเตอร์ มักถูกยกคู่กับการทำ cache invalidation