เกมหมากรุกแบบสแตติก (Static Chess)

 (val.town)
1 คะแนน โดย GN⁺ 2024-05-14 | 1 ความคิดเห็น | แชร์ทาง WhatsApp
  • Static Chess เป็นการทดลองเว็บหมากรุกแบบสแตติกที่สร้างทุกหน้าจอของหมากรุกด้วย HTML และ CSS เท่านั้น และให้เดินแต่ละตาผ่านการคลิกลิงก์
  • เมื่อผู้เล่นคนหนึ่งเดินตาแล้วส่ง ลิงก์ที่สร้างขึ้นให้เพื่อน อีกฝ่ายก็ส่งลิงก์กลับมาเพื่อเล่นต่อ
  • ใช้ อินเทอร์เฟซแบบ Brutalist ที่ตัดแอนิเมชันและการโต้ตอบที่ลื่นไหลออกไป เพื่อให้โฟกัสที่กระดานหมากรุกและการเลือกตาเดินเอง
  • ฟีเจอร์ยัง ค่อนข้างจำกัด และอาจมีส่วนที่ใช้งานไม่ได้ ทำให้ยังมีข้อจำกัดสำหรับการเล่นจริง
  • เปิดความเป็นไปได้ในการต่อยอดในอนาคต เช่น รองรับการเล่นจริง อินเทอร์เฟซเรียบง่ายสำหรับเกมระยะยาว และคู่ต่อสู้แบบ AI สแตติก

หมากรุกแบบสแตติกที่เล่นต่อผ่านลิงก์

  • Static Chess เป็นเว็บไซต์หมากรุกที่ตั้งเป้าเป็น “plain, brutalist, no bloat chess”
  • หน้าจอประกอบขึ้นด้วย HTML และ CSS เท่านั้น และการเดินหมากทำผ่าน การคลิกลิงก์
  • เกมดำเนินต่อด้วยวิธีส่งลิงก์ไปมา
    • ผู้เล่นคนหนึ่งเดินตาของตนแล้วส่งลิงก์ให้เพื่อน
    • เพื่อนเดินตาจากลิงก์นั้นแล้วส่งลิงก์กลับมาเพื่อเข้าสู่ตาถัดไป
  • ตั้งใจตัดแอนิเมชันหรือ interaction ที่ลื่นไหลออกไป
  • ยังตั้งคำถามไว้ด้วยว่า หาก Google ทำดัชนีเว็บไซต์นี้ จะลงเอยด้วยการคำนวณตาเดินหมากรุกที่เป็นไปได้ทั้งหมดหรือไม่

ข้อจำกัดปัจจุบันและไอเดียต่อยอด

  • ฟีเจอร์ยัง จำกัด และอาจมีส่วนที่เสียอยู่
  • ขอให้แจ้งหากพบ bug
  • ได้แรงบันดาลใจจาก การอภิปรายบน HN เกี่ยวกับเว็บไซต์ที่มีสถานะเกม tic-tac-toe ที่เป็นไปได้ทั้งหมด
  • มีแผนจะขยายให้รองรับการเล่นจริงในอนาคต
  • อาจพัฒนาเป็น อินเทอร์เฟซเรียบง่าย สำหรับเล่นเกมกับเพื่อนเป็นเวลานาน
  • มองว่าการเพิ่มฟีเจอร์ให้เล่นกับ AI แบบสแตติกก็น่าจะสนุก
  • หากมีฟีเจอร์ที่ต้องการ สามารถเสนอการเปลี่ยนแปลงผ่าน PR ได้

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

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

 
GN⁺ 2024-05-14
ความคิดเห็นจาก Hacker News

  • ถ้าใส่ FEN ต่อท้ายใน URL ก็สามารถเล่น Chess960 (Fischer Random Chess) หรือรูปแบบ “ตำแหน่งเริ่มต้นแบบกำหนดเอง” อื่น ๆ ได้เช่นกัน โดยเปลี่ยนช่องว่างเป็นขีดล่าง
    ตัวอย่าง: https://chess.maxmcd.com/bbnqrknr/pppppppp/8/8/8/8/PPPPPPPP/...

    • แต่ Chess960 มีกฎ castling ต่างจากหมากรุกทั่วไปด้วย ดังนั้นดูเหมือนว่าเว็บคงไม่สามารถรู้ได้จาก FEN อย่างเดียวว่าควรใช้กฎนั้น

  • ยังไม่แน่ใจว่าย่อหน้าแรกที่บอกว่า “หมากรุกที่บริสุทธิ์ หยาบ ๆ และไร้ส่วนเกิน” นั้นเป็นข้อดีหรือข้อเสียของการทำแบบนี้กันแน่
    การบอกว่าทำออกมาในวิธีแปลก ๆ เพื่อสำรวจความเป็นไปได้นั้นอย่างหนึ่ง แต่การอธิบายซอฟต์แวร์ที่สร้างด้วยเทคโนโลยีเหมาะสมว่าเป็น ความเทอะทะ แอนิเมชันตลก ๆ และปฏิสัมพันธ์ที่ลื่นไหลจนรบกวนการเล่นนั้นเป็นอีกเรื่องหนึ่ง
    พอมีย่อหน้าที่สองบอกว่าฟีเจอร์ยังจำกัดและอาจพังก็ยิ่งทำให้ข้อจำกัดของแนวทางนี้ชัดขึ้น แน่นอนว่าอาจเป็นการเสียดสีทั้งหมดและผมอาจโดนหลอกก็ได้ แต่ก็เป็นงานที่ฉลาดและทำได้ดี

    • ดูมีแนวโน้มว่าจะเป็นคำอธิบายเชิงขำขัน และเหมือนกับผลักข้อดีบางอย่างไปจนถึง สุดโต่งแบบไร้ตรรกะ
      ส่วนข้อจำกัดของฟีเจอร์ก็น่าจะหมายถึงอย่างอื่นนอกเหนือจากสิ่งที่ถูกเรียกว่าความเทอะทะเหล่านั้น
    • มันดูใกล้เคียงกับการทำขึ้นมาเพราะ “คิดว่าน่าจะทำได้” และผมว่าการสร้างอะไรแปลก ๆ นิดหน่อยด้วยเหตุผลนั้นก็โอเคเสมอ
      ผมชอบไอเดียของการเล่นผ่านการส่งลิงก์แบบไร้สถานะอยู่พอสมควร และความ “สวย” ของแอนิเมชันกับปฏิสัมพันธ์อย่างน้อยสำหรับผมไม่ได้ให้ผลบวกเสมอไป
      “เทคโนโลยีที่ถูกต้อง” ขึ้นอยู่กับประสบการณ์ผู้ใช้ที่ต้องการสร้างอย่างมาก สำหรับเป้าหมายนี้ HTML และ CSS คือเทคโนโลยีที่เหมาะสม เช่นเดียวกับที่เว็บซึ่งมีฟีเจอร์มากกว่าจะเหมาะกับชุดเทคโนโลยีอีกแบบตามเป้าหมาย UX ของมัน
    • ความคิดที่ว่าไม่ต้องการ แอนิเมชัน ในเกมนี่ค่อนข้างขำเลยนะ น่าจะเป็นมุก หรือไม่ก็คงอินกับแนวคิดว่าเว็บไม่ควรมี JavaScript มากเกินไป

  • ถ้าพูดแบบเคร่งครัด นี่ก็ไม่ใช่ เว็บไซต์แบบสแตติก จริง ๆ ใช่ไหม? มันเป็นการเรนเดอร์แบบไดนามิกจากฝั่งแบ็กเอนด์ทุกครั้งที่มีคำขอ
    ไม่น่าจะมีหน้าเว็บที่เรนเดอร์ไว้ล่วงหน้า 999999919291293923 หน้าเก็บอยู่บนเซิร์ฟเวอร์ที่ไหนสักแห่งหรอก

    • ในทางเทคนิค ถ้าจะครอบคลุมทุกตำแหน่งหมากรุกที่ถูกกฎหมาย จะต้องใช้ประมาณ 4.8 * 10^44 หน้า [1]
      แถมมันยังเสิร์ฟตำแหน่งที่ผิดกติกาแบบสุด ๆ ได้ด้วย: https://chess.maxmcd.com/rnbqkbnr/qqqqqqqq/8/8/8/8/QQQQQQQQ/...
      [1] https://github.com/tromp/ChessPositionRanking
    • คำว่าสแตติกที่นี่น่าจะหมายถึงไม่มี XmlHttpRequest
    • ก็มีหน้าแบบเรนเดอร์ล่วงหน้าอยู่นั่นแหละ แค่ถูกบีบอัดด้วยรูปแบบการบีบอัดเฉพาะแอปพลิเคชัน
    • จริง ๆ แทบไม่จำเป็นต้องให้แบ็กเอนด์เรนเดอร์เลยด้วยซ้ำ ถ้าเป็น single-page app ที่ใช้ pushState ก็อาจเป็นไฟล์เดียวตามตัวอักษรได้เลย

  • การตรวจจับตาเดินที่ถูกกฎนั้นดีนะ แต่ดูเหมือนจะไม่รู้จัก checkmate ใช่ไหม?
    https://chess.maxmcd.com/r1b1kRnr/p1ppB2p/n2P2p1/8/7P/1p6/PP...
    ไม่ควรแสดงว่าเป็นรุกจนหรือ?

    • จากที่ตัวหมากไม่สามารถขยับต่อได้ก็ดูเหมือนว่ามันตรวจจับ checkmate ได้ แต่แค่ แสดงผลไม่ถูกต้อง
    • ถ้าหน้า checkmate มีคำว่า ‘checkmate’ เขียนอยู่จริง ๆ Google bot ก็อาจไล่จัดทำดัชนีทั้งเว็บแล้วหาการรุกจนเจอได้
      ตามอุดมคติ แต่ละหน้าควรมีสตริงที่สรุปสถานะกระดานก่อนหน้าทั้งหมดที่นำไปสู่สถานะนั้นด้วย แบบนั้นก็จะสามารถค้นหาสถานะกระดานปัจจุบันพร้อมกับ ‘checkmate white’ เพื่อหาวิธีทั้งหมดที่ชนะได้จากสถานะนั้น
      สิ่งเดียวที่เหลือเพื่อทำให้ Google เป็นผู้พยากรณ์หมากรุกสูงสุด ก็คือการโน้มน้าวให้อีกฝ่ายเดินตามที่เราหามาได้เป๊ะ ๆ
    • มันไม่รองรับ en passant ด้วย

  • ตอนแรกนึกว่าจะเป็นหมากรุกสายพันธุ์ที่ไม่มีหมากตัวไหนขยับได้เลย

    • ผมก็นึกแบบนั้น ช่วงนี้ถ้าอยากเล่นเกมคล้ายกันแต่สแตติกกว่าก็ลอง Go ได้ โดยค้นหาชื่อจีนว่า Weiqi หรือชื่อเกาหลีว่า Baduk จะเจอง่ายกว่า
    • ถ้าไม่คลิกลิงก์ มันก็เป็นแบบนั้นจริง ๆ

  • งานเจ๋งมาก อยากเห็นว่าถ้าเอาไปไว้หลัง CDN อย่าง Cloudflare แล้วอัตราแคชฮิตจะออกมาเป็นอย่างไร

    • ตัวสำรวจโอเพนนิงของ Lichess น่าจะเป็นตัวชี้วัดที่ค่อนข้างแม่นว่า อัตราแคชฮิต จะเป็นอย่างไร
      https://lichess.org/analysis#explorer
      มันน่าจะใกล้กับฐานข้อมูลของ Lichess มากกว่าฐานข้อมูล Masters ซึ่งค่อนข้างต่างกัน ตัวอย่างเช่น ใน Masters การตอบ e4 ด้วย c5 มีสัดส่วน 46% แต่ใน Lichess นั้น c5 มีแค่ 19%

  • https://chess.maxmcd.com/rnbqk3/pppp2pB/2P1p3/1P1P2Bp/3n4/b2...
    เจ๋งมาก และผมลองเล่นต่อจนไปถึง checkmate ได้ด้วย

    • น่าจะดีถ้า URL เก็บแค่ ลำดับตาเดิน แทนสถานะกระดาน แบบนั้นแค่ใส่ลำดับตาเดินใน URL ก็สร้างสถานะกระดานได้แล้ว

  • เมื่อก่อนผมก็เคยทำหน้าหมากรุกแบบสแตติกเหมือนกัน และใส่การเชื่อมต่อ P2P ด้วย WebRTC เพื่อให้เล่นกับเพื่อนได้

    • Try it
    • Fork it
    • บางครั้งผมเห็นบั๊กแปลก ๆ ที่เกมเดินหมากเองแทนผู้เล่น โดยเฉพาะเวลาที่ควีนฝั่งหนึ่งกินหมาก แล้วควีนอีกฝั่งสามารถกินควีนตัวนั้นกลับได้ เกมดูเหมือนจะเดิน ควีนกินควีน ให้อัตโนมัติ
    • เสียงเอฟเฟกต์ดีมาก โดยเฉพาะเสียง check

  • การโปรโมตเบี้ยถูกล็อกเป็น ควีน อย่างเดียว น่าจะดีถ้ารองรับการโปรโมตแบบอื่นด้วย: https://www.chess.com/forum/view/game-showcase/checkmate-by-...

  • เจ๋งมาก นอกจาก FEN แล้ว ถ้ามี บันทึกลำดับตาเดิน ด้วยก็น่าจะดี และน่าจะใส่ไว้ใน fragment ได้
    ตัวอย่าง: https://chess.maxmcd.com/rnbqkbnr/ppp1pppp/8/3p4/3P1B2/8/PPP...