ซอร์สโค้ดเกมเรียงสีแบบ Water Sort: ควรแก้อะไรก่อน
ใช้ Mochi Monsters เป็นตัวอย่าง: กติกา ไฟล์ ไฟล์คอนฟิกไฟล์เดียว และการเปลี่ยนแปลงที่ต้องบิลด์ใหม่
การซื้อซอร์สโค้ดเกมเรียงสีคุ้มค่า เมื่อคุณอยากได้เกมแนว water sort บนเว็บของตัวเอง โดยไม่ต้องเขียนกติกาการย้าย ตัวสร้างด่าน และระบบบันทึกเอง Mochi Monsters คือแพ็กเกจแบบนั้น มี 60 ด่านในสามโลก โหมด Endless (เล่นไม่รู้จบ) TypeScript ที่อ่านง่าย และโฟลเดอร์ game ที่พร้อมขึ้นโฮสต์ ราคาปกติ $39
กติกาเบื้องหลัง water sort, ball sort และ Mochi Monsters เหมือนกัน คือย้ายได้เฉพาะไปยังภาชนะที่ว่าง หรือไปวางบนชิ้นบนสุดที่ตรงกัน สิ่งที่ทำให้เทมเพลตแต่ละตัวต่างกันคือทุกอย่างรอบกติกานั้น บทความนี้พาดูแพ็กเกจตามลำดับที่ผู้ซื้อจะเจอ และปิดท้ายด้วยสิ่งที่แก้ได้ในห้านาที กับสิ่งที่ต้องใช้นักพัฒนา
กติกาการเรียง และลูกเล่นสองอย่างที่เพิ่มเข้ามา
ผู้เล่นแตะรังหนึ่ง แล้วแตะอีกรัง กลุ่มเพื่อนเยลลี่ที่อยู่บนสุดจะกระโดดข้ามไปได้ก็ต่อเมื่อรังปลายทางว่าง หรือเพื่อนบนสุดในรังนั้นเป็นสายพันธุ์เดียวกัน ด่านจะผ่านเมื่อทุกรังมีเพียงสายพันธุ์เดียว มี Hint, Undo และ Restart (คำใบ้ ย้อนกลับ เริ่มใหม่) ให้ในตัว
มีกลไกสองอย่างที่ทำให้ 60 ด่านไม่รู้สึกเหมือนด่านเดิมวนซ้ำ ฝาเปลือกหอยปิดรังไว้ และจะเปิดเมื่อคุณเติมรังนั้นด้วยสายพันธุ์ที่แสดงบนฝา ส่วน Undo อาจทำให้ฝาปิดอีกครั้ง รังน้ำขึ้นน้ำลงที่เชื่อมกันจะสลับที่เมื่อรังใดรังหนึ่งว่าง ทำให้กระดานเปลี่ยนไปกลางแผนของผู้เล่น
เรื่องนี้สำคัญกับผู้ซื้อ เพราะทุกอย่างเขียนและทดสอบไว้แล้ว การเพิ่มลูกเล่นแบบนี้ให้เกมเรียงธรรมดาเป็นงานที่มักใช้เวลานานกว่าที่คิด ส่วนใหญ่เพราะกรณีขอบ ๆ ที่เกี่ยวกับการย้อนกลับ
ซอร์สโค้ดเกมปริศนาเรียงสีมีอะไรบ้าง
- 60 ด่านแคมเปญใน Sugar Meadow, Bubble Beach และ Mushroom Village โลกละ 20 ด่าน
- โหมด Endless ที่สร้างจาก seed เปิดหลังด่านที่ 20
- อัลบั้มสะสม สวนที่โต้ตอบได้ และหมวกหกใบที่ซื้อด้วย Sugar Drops ที่ได้จากการเล่น
- ควบคุมได้ทั้งแบบสัมผัสและเมาส์ บันทึกในเครื่อง และมีตัวเลือกลดการเคลื่อนไหว
- โฟลเดอร์ game/ พร้อมขึ้นโฮสต์ ซอร์ส JavaScript และ TypeScript ที่อ่านได้ คอนฟิก ชุดทดสอบ และประกาศไลเซนส์
- คู่มือออฟไลน์พร้อมภาพประกอบ 14 ภาษา ภาพหน้าจอเป็นภาษาอังกฤษ
อินเทอร์เฟซมี 14 ภาษา ได้แก่ อังกฤษ โปรตุเกส สเปน ฝรั่งเศส เยอรมัน อิตาลี ดัตช์ โปแลนด์ ตุรกี รัสเซีย อินโดนีเซีย ญี่ปุ่น เกาหลี และจีนตัวย่อ คู่มือจะแสดงตามภาษาของผู้อ่านโดยอัตโนมัติ
เทคโนโลยีที่ใช้คือ TypeScript และ JavaScript บน Canvas 2D พร้อม Web Audio ไฟล์มีทั้ง HTML, CSS, JavaScript, JSON, TypeScript, WebP, PNG และ MP3
โปรเจกต์จัดวางอย่างไร
ให้มองแพ็กเกจเป็นสามชั้น แต่ละชั้นใช้แรงไม่เท่ากัน
ชั้นที่ 1: เกมที่ขึ้นโฮสต์
โฟลเดอร์ game/ สมบูรณ์แล้ว อัปโหลดไฟล์ข้างในขึ้นโฮสต์ HTTP(S) แบบสแตติกก็เล่นได้ ชั้นนี้ไม่มีอะไรต้องบิลด์
ชั้นที่ 2: ไฟล์คอนฟิก
mochi.config.js อยู่ข้าง index.html ใช้กำหนดชื่อบนเบราว์เซอร์ โลโก้ ภาษาเริ่มต้น และคีย์บันทึก แก้ค่า อัปโหลดไฟล์ แล้วโหลดหน้าใหม่ ยังไม่ต้องบิลด์
ชั้นที่ 3: ซอร์ส TypeScript
กติกา ภาพ ด่าน และราคาหมวกอยู่ในซอร์ส การเปลี่ยนส่วนนี้หมายถึงแก้ TypeScript แล้วบิลด์ใหม่ด้วย npm ซึ่งต้องใช้ Node.js 22.13 ขึ้นไป ซอร์สมีเครื่องมือสร้างด่าน และชุดทดสอบอัตโนมัติ 52 รายการที่ครอบคลุมกติกา ด่าน การบันทึก และคำแปล
เทมเพลตเกมเรียงสี: ควรแก้อะไรก่อน
นี่คือลำดับที่เราแนะนำ ไล่จากสิ่งที่ไม่ต้องบิลด์ไปจนถึงงานของนักพัฒนา
- ชื่อและโลโก้ใน mochi.config.js เพื่อให้แท็บเบราว์เซอร์และหน้าจอเริ่มเกมเป็นแบรนด์ของคุณ
- ภาษาเริ่มต้นในไฟล์เดียวกัน ถ้าผู้เล่นส่วนใหญ่ของคุณไม่ได้ใช้ภาษาอังกฤษ
- คีย์บันทึก: ตั้งครั้งเดียวก่อนเปิดตัว แล้วอย่าแตะอีก การเปลี่ยนบนเว็บที่เปิดใช้งานอยู่จะทำให้ผู้เล่นเสียความคืบหน้า
- ภาพและสีของเพื่อนเยลลี่ ถ้าต้องการเปลี่ยนหน้าตาทั้งหมด งานนี้ทำในซอร์ส
- ราคาหมวกและระบบรางวัล ซึ่งอยู่ในซอร์สเช่นกัน
- ด่านใหม่ โดยใช้เครื่องมือสร้างด่าน แล้วรันชุดทดสอบ
สำหรับหลายเว็บไซต์ สามขั้นแรกคืองานทั้งหมด ส่วนการเปลี่ยนหน้าตาทั้งหมดหมายถึงต้องเปลี่ยนตัวละคร รัง และฉากหลังทุกชิ้นในสามโลก ซึ่งเวลาส่วนใหญ่หมดไปตรงนั้น วางแผนตามจริงก่อนรับปากวันส่งงานกับลูกค้า
ทำ white label ได้ ชื่อและโลโก้ของคุณหรือของลูกค้าใส่แทนของเราได้ทุกจุดในเกม
โฮสติ้ง การฝังในหน้าเว็บ และการต่อยอด
อัปโหลดไฟล์ในโฟลเดอร์ game/ ขึ้นโฮสต์ HTTP(S) แบบสแตติกที่ไหนก็ได้ จะไว้ในโฟลเดอร์ย่อยก็ได้ การเล่นไม่ต้องใช้ฐานข้อมูล PHP หรือบริการ Node.js การเปิดไฟล์จากดิสก์ด้วย file:// ใช้ไม่ได้ ให้ทดสอบผ่านเว็บเซิร์ฟเวอร์ในเครื่องหรือเซิร์ฟเวอร์จริง
เกมทำงานบน Chrome, Edge, Firefox และ Safari เวอร์ชันปัจจุบัน ทั้งบนคอมพิวเตอร์ แท็บเล็ต และมือถือ ความคืบหน้าเก็บใน local storage ของเบราว์เซอร์ ไม่ซิงก์ข้ามอุปกรณ์ เกมนี้ไม่ใช่แอปออฟไลน์ที่ติดตั้งได้ ผู้เล่นโหลดเกมจากที่อยู่เว็บของคุณ
แพ็กเกจไม่มีโปรเจกต์แอปเนทีฟ ถ้าต้องการนำขึ้นแอปสโตร์ เชื่อมกับ SDK ของพอร์ทัล หรือติดตั้งบนเซิร์ฟเวอร์ของคุณ เราเสนอราคางานนั้นเป็นรายโปรเจกต์
ขอใบเสนอราคาเปลี่ยนหน้าตา โฮสติ้ง หรือเวอร์ชันแอป
สิ่งที่ Mochi Monsters ไม่มี
รุ่นนี้ไม่มีบัญชีออนไลน์ การบันทึกบนคลาวด์ ตารางอันดับทั่วโลก การซื้อด้วยเงินจริง หรือ SDK โฆษณา ไม่รวมโปรเจกต์แอปเนทีฟ โฮสติ้ง และงานพัฒนาตามสั่ง ไม่มีแคมเปญให้เล่นนอกเหนือจากสามโลก หลังจากนั้นโหมด Endless คือสิ่งที่ทำให้เกมเล่นต่อได้
ถ้าคุณวางแผนจะแสดงโฆษณา ไลเซนส์อนุญาตให้หารายได้จากโฆษณาในผลิตภัณฑ์ปลายทางของคุณ แต่การเชื่อมเครือข่ายโฆษณาเป็นงานฝั่งคุณ หรือเป็นงานที่เรารับทำพร้อมใบเสนอราคา
ไลเซนส์และราคาในย่อหน้าเดียว
การซื้อหนึ่งครั้งให้ไลเซนส์แบบถาวรและไม่ผูกขาด สำหรับใช้รุ่นนี้ในผลิตภัณฑ์ปลายทางหนึ่งชิ้น จะเป็นของคุณหรือของลูกค้าหนึ่งรายก็ได้ ผู้เล่นเล่นได้ฟรีหรือผ่านการหารายได้จากโฆษณา คุณแก้โค้ด ภาพ และเสียงภายในผลิตภัณฑ์นั้นได้ แต่ห้ามขายต่อหรือแจกจ่ายเทมเพลต ซอร์ส หรือแอสเซ็ตแยกออกมาเดี่ยว ๆ ไม่ว่าจะเป็นชุดคิตหรืออยู่ในผลิตภัณฑ์อื่นสำหรับนักพัฒนา ซัพพอร์ต 6 เดือน หรือ 12 เดือนถ้าซื้อส่วนขยายตอนชำระเงิน ครอบคลุมการติดตั้ง การใช้งานไฟล์ และการแก้ข้อบกพร่องที่ทำซ้ำได้ ไลเซนส์ไม่สิ้นสุดพร้อมซัพพอร์ต ราคาปกติ $39 จนถึง 30 พฤศจิกายน 2026 มีโปรโมชัน Black Friday ลด 15% ทุกเทมเพลต Mochi Monsters จึงเหลือ $33.15 และตั้งแต่ 1 ธันวาคม ราคากลับเป็นราคาปกติ
คำถามที่พบบ่อย
Mochi Monsters เป็นเกม water sort หรือเปล่า
ใช้กติกาหลักเดียวกัน คือกลุ่มหนึ่งย้ายได้เฉพาะไปยังรังที่ว่าง หรือไปวางบนเพื่อนที่ตรงกัน แทนที่จะเป็นของเหลวในหลอด ผู้เล่นจัดเรียงตัวเยลลี่ลงรัง และมีฝาเปลือกหอยกับรังน้ำขึ้นน้ำลงเพิ่มเข้ามา
ต้องบิลด์เกมก่อนอัปโหลดไหม
ไม่ต้อง อัปโหลดไฟล์ในโฟลเดอร์ game/ ขึ้นโฮสต์ HTTP(S) การพัฒนาจากซอร์สเป็นทางเลือก
เปลี่ยนอะไรได้บ้างโดยไม่ต้องบิลด์ใหม่
ชื่อบนเบราว์เซอร์ โลโก้ ภาษาเริ่มต้น และคีย์บันทึก ทั้งหมดอยู่ใน mochi.config.js ส่วนกติกา ภาพ ด่าน และราคาหมวก ต้องใช้ซอร์ส TypeScript และบิลด์ใหม่ด้วย npm
เพิ่มโลกหรือด่านได้ไหม
รุ่นนี้มี 60 ด่านในสามโลก การเพิ่มต้องแก้ซอร์สด้วยเครื่องมือสร้างด่านที่ให้มา แคมเปญเพิ่มเติมไม่รวมอยู่ในแพ็กเกจ
ความคืบหน้าของผู้เล่นบันทึกไว้ที่ไหน
ใน local storage ของเบราว์เซอร์ที่ใช้อยู่ ไม่มีการซิงก์ผ่านคลาวด์
เล่นบนมือถือได้ไหม
ได้ เกมทำงานบนเบราว์เซอร์มือถือเวอร์ชันปัจจุบันด้วยการสัมผัส และบนเดสก์ท็อปด้วยเมาส์
เกมปริศนาเรียงสีเหมาะกับใคร และควรดูอะไรเพิ่ม
เกมปริศนาเรียงสีเหมาะกับพอร์ทัลเกมแคชวล เว็บไซต์สำหรับครอบครัว และแบรนด์ที่อยากได้เกมสบาย ๆ เล่นรอบสั้น ดูง่ายบนมือถือ และกติกาอธิบายได้ในประโยคเดียว
ถ้าต้องการเกมปริศนาที่ต้องวางแผนมากขึ้น Beep Out เป็นเกมปริศนาจอดรถ 3D 30 ด่าน พร้อมการจับคู่ผู้โดยสาร ราคาปกติ $35 ถ้ากลุ่มผู้เล่นของคุณชอบตัวเลข Tenguin เป็นเกมจับคู่ตัวเลข ที่ผู้เล่นจับคู่เลขที่เท่ากัน หรือสองตัวที่รวมกันได้สิบ ราคาปกติ $39