คู่มือ

ซอร์สโค้ดเกมจังหวะ: โน้ตชาร์ต ไทมิ่ง และการเพิ่มเพลง

Riffvolt เก็บ 12 เพลงและโน้ตชาร์ต 48 ชุดอย่างไร ไทมิ่งและคะแนนตัดสินที่ไหน และต้องทำอะไรบ้างเพื่อเพิ่มเพลงของคุณเอง

ภาพ Riffvolt: ทางโน้ตสี่เลนสีชมพู เหลือง ฟ้า และเขียว ทอดไปยังเวทีคอนเสิร์ตที่สว่างไสว มีฝูงชนและกีตาร์ไฟฟ้า

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

บทความนี้พาไล่ดูแพ็กเกจ: เกมมีอะไร ไทมิ่งและคะแนนอยู่ตรงไหน วิธีเพิ่มเพลง การ build ใหม่และโฮสต์ ไลเซนส์อนุญาตอะไร และอะไรที่ฉบับนี้ไม่มี ชื่อไฟล์มาจากคู่มือผู้ซื้อที่มากับเกม

เรื่องหนึ่งที่ควรจำไว้ตั้งแต่ต้น: ต่างจากเทมเพลตบางตัวของเรา Riffvolt ต้อง build ใหม่หลังแก้ซอร์สหรือเพิ่มเพลง ส่วนการโฮสต์โฟลเดอร์ game ที่ให้มาใช้แค่เว็บโฮสต์แบบสแตติกก็พอ

ซอร์สโค้ดเกมจังหวะนี้มีอะไรให้เล่น

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

  • 12 เพลงเต็ม แต่ละเพลงมีชาร์ต Easy, Normal และ Hard บวก Rock God ที่ปลดล็อกหลังจบทัวร์ รวมโน้ตชาร์ต 48 ชุด
  • ทัวร์สี่สถานที่ (Garage, The road, Festival และ Arena) แห่งละสามเพลง ดาวจากสองเพลงแรกเปิดเพลงอังกอร์ และเล่นอังกอร์จบจะเปิดสถานที่ถัดไป พร้อมฉากเนื้อเรื่องและรางวัลตกแต่ง เช่น เส้นแสงและกรอบ
  • เล่นอิสระ: เพลงไหน ระดับไหนก็ได้ สถิติส่วนตัวบันทึกแยกทีละเพลงในเบราว์เซอร์
  • การควบคุม: ค่าเริ่มต้นคือ D, F, J และ K แตะเลนบนจอสัมผัส หรือใช้เกมแพด ตั้งปุ่มได้ใน Settings
  • ความสะดวก: ปรับเทียบเสียงเพื่อตั้งค่าออฟเซ็ต ช่วยเรื่องหูฟังบลูทูธ ลดการเคลื่อนไหว และโหมดไวต่อแสงที่ลดแสงวาบและฟ้าแลบ
  • อินเทอร์เฟซ 14 ภาษา

ดูหน้า Riffvolt เดโม และคู่มือ

การจัดโครงสร้างไฟล์

ไฟล์ดาวน์โหลดมี game/ (ไฟล์สำหรับติดตั้งใช้งาน) source/ (โปรเจกต์ TypeScript) documentation/ (คู่มือพร้อมภาพภาษาอังกฤษและโปรตุเกส) และ licenses/ (ประกาศของบุคคลที่สาม) ภายใน source/ ข้อมูลเพลงกับลอจิกเกมแยกกันชัดเจน

  • public/manifest.json: แคตตาล็อกเพลง พร้อมความยาว เวอร์ชันเสียง และพาธชาร์ตของแต่ละเพลง
  • public/charts/: โน้ตชาร์ต 48 ชุด
  • public/audio/: ไฟล์เสียงเพลง
  • src/core/chartValidate.ts: สคีมาของชาร์ตและการตรวจไทมิ่ง
  • src/core/judge.ts: การตัดสินไทมิ่ง
  • src/core/scoring.ts: กติกาคะแนนและคอมโบ
  • src/game/campaign.ts: ความคืบหน้าของทัวร์
  • src/game/session.ts: วงจรชีวิตของเพลงหนึ่งเพลงและการคำนวณผล
  • src/i18n/locales.ts: พจนานุกรมอินเทอร์เฟซ 14 ภาษา
  • src/net/localRecords.js: สถิติส่วนตัวแบบโลคัล
  • src/ui/style.css: อินเทอร์เฟซและเลย์เอาต์แบบ responsive

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

เพิ่มเพลงของคุณเองทีละขั้น

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

  1. ใส่ไฟล์เสียงใน public/audio/ ใช้เฉพาะเสียงที่คุณมีสิทธิ์สำหรับผลิตภัณฑ์ปลายทางของคุณ
  2. สร้างชาร์ตหนึ่งชุดต่อระดับความยากที่รองรับใน public/charts/ แต่ละชาร์ตต้องมี songId, difficulty, audioVersion, offset ที่ตรงกัน และโน้ตเรียงตามลำดับ
  3. เพิ่มเพลงใน public/manifest.json พร้อม id ที่ไม่ซ้ำ ความยาว BPM ธีม audioVersion และพาธชาร์ต
  4. ตรวจชาร์ตแต่ละชุดด้วยตัวตรวจใน chartValidate.ts
  5. เล่นทั้งเพลงในทุกระดับเพื่อยืนยันว่าตรงจังหวะ ตัวตรวจเช็กโครงสร้างและกติกาไทมิ่ง ไม่ได้เช็กว่าโน้ตรู้สึกถูกต้องหรือเปล่า
  6. build ใหม่ แล้วอัปโหลดบิลด์ใหม่

ถ้าต้องการเปลี่ยนเพลงประกอบทั้งชุดแทนการเพิ่มเพลงเดียว ให้วางแผนทีละชาร์ต: 12 เพลง สี่ระดับ เท่ากับ 48 ชาร์ต และแต่ละชาร์ตควรได้เล่นจบหนึ่งรอบก่อนเปิดตัว

การ build ใหม่และสิ่งอื่นที่แก้ได้

แนะนำ Node.js 24 LTS ใน source/ รัน npm ci ตามด้วย npm run typecheck และ npm run build แล้วเผยแพร่เฉพาะเนื้อหาใน dist/ npm run preview เปิดบิลด์ในเครื่องให้ตรวจดู อย่าอัปโหลด node_modules/ Vite ใช้ base แบบสัมพัทธ์ บิลด์จึงทำงานในโฟลเดอร์ย่อยได้ รันไทม์ที่ส่งมอบจัดรูปแบบให้อ่านได้ คู่มือขอให้คง minify:false และ cssMinify:false ไว้เมื่อ build ใหม่ เพื่อให้คนถัดไปยังอ่านได้

  1. แบรนด์: สีและเลย์เอาต์ใน src/ui/style.css บวกโลโก้ของคุณ ทำ white label ได้ แบรนด์ของคุณแทนที่ของเราได้เลย
  2. ข้อความ: src/i18n/locales.ts สำหรับภาษาที่คุณเผยแพร่
  3. ทัวร์: ลำดับสถานที่และอะไรปลดล็อกอะไร ใน campaign.ts
  4. ความยาก: ช่วงเวลาตัดสินใน judge.ts แล้วตามด้วยกติกาคะแนนและคอมโบใน scoring.ts
  5. เพลง: ทำเป็นอย่างสุดท้าย เพราะชาร์ตใหม่ทุกชุดต้องเล่นจบหนึ่งรอบ

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

โฮสต์เกม หรือฝังในพอร์ทัล

อัปโหลดเนื้อหาใน game/ ไปยังโฟลเดอร์บนโฮสต์ HTTP(S) คงพาธแบบสัมพัทธ์ไว้ แล้วเปิดที่อยู่ ไม่ต้องใช้ PHP ฐานข้อมูล หรือบัญชี อย่าเปิด index.html ผ่าน file:// ถ้าจะทดสอบในเครื่อง ให้รัน python -m http.server 8765 ภายใน game/

  • เบราว์เซอร์ต้องรองรับ: JavaScript, ES modules, Canvas 2D และ Web Audio
  • เบราว์เซอร์จะเปิดเสียงหลังการแตะหรือคลิกครั้งแรกเท่านั้น หน้าจอแรกที่เงียบจึงเป็นเรื่องปกติ
  • ใน iframe ให้อนุญาต fullscreen และ autoplay
  • ส่ง .js ด้วยชนิด MIME ของ JavaScript ห้ามส่งเป็น text/plain
  • แอสเซ็ตรันไทม์ ฟอนต์ และไลบรารีทั้งหมดอยู่ในบิลด์ ไม่บังคับใช้ CDN แต่นี่ไม่ใช่แอปออฟไลน์ที่ติดตั้งได้

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

สิ่งที่ฉบับนี้ไม่มี

Riffvolt เป็นฉบับเล่นในเบราว์เซอร์แบบโลคัล ไม่มีห้องออนไลน์หรือผู้เล่นหลายคน ไม่มีอันดับออนไลน์หรือลีดเดอร์บอร์ดร่วม ไม่มี SDK โฆษณาหรือบัญชี ไม่มีโปรแกรมแก้ไขชาร์ต ไม่มีแอปเนทีฟ และไม่รวมโฮสติ้ง สถิติส่วนตัวและความคืบหน้าทัวร์อยู่ในเบราว์เซอร์ของผู้เล่น

ถ้าเกมดนตรีเข้ากับแคตตาล็อกของคุณ เทมเพลตอีกสองตัวของเราที่อาศัยไทมิ่งก็วางคู่กันได้ดี

Pinloop: เกมอาร์เคดจับจังหวะปุ่มเดียว 30 เป้าหมาย

Ricopop: เกมอาร์เคดลูกเด้ง 50 ด่าน

ไลเซนส์และราคา

Riffvolt ราคาปกติ 49 ดอลลาร์สหรัฐ จนถึง 30 พฤศจิกายน 2026 โปรโมชัน Black Friday ลด 15% เหลือ 41.65 ดอลลาร์ และการซื้อเทมเพลตตั้งแต่สองชิ้นในคำสั่งซื้อเดียวได้ส่วนลดแพ็กรวม 5% ถึง 20% ไลเซนส์เป็นแบบถาวรและไม่ผูกขาด สำหรับผลิตภัณฑ์ปลายทางหนึ่งชิ้นของคุณหรือของลูกค้าหนึ่งราย คุณแก้โค้ด ภาพ และเสียง เปลี่ยนแบรนด์ของเราเป็นของคุณ และเปิดให้เล่นฟรีหรือมีโฆษณาได้ ใช้เพลงที่ให้มาเป็นส่วนหนึ่งของผลิตภัณฑ์ปลายทางนั้น ห้ามขายต่อเทมเพลต โค้ด หรือแอสเซ็ตโดยลำพัง มีซัพพอร์ตหกเดือน หรือสิบสองเดือนเมื่อขยายเวลา เพลงใหม่ การเชื่อมต่อระบบ และโฮสติ้งเสนอราคาแยก

อ่านข้อกำหนดไลเซนส์ฉบับเต็ม

คำถามที่พบบ่อย

เพิ่มเพลงของตัวเองในซอร์สโค้ดเกมจังหวะได้ไหม

ได้ เพิ่มไฟล์เสียง ชาร์ตหนึ่งชุดต่อระดับ และรายการใน public/manifest.json ตรวจชาร์ต เล่นให้จบ แล้ว build ใหม่ ไม่มีโปรแกรมแก้ไขชาร์ตมาให้

ต้องใช้ Node.js เพื่อใช้ Riffvolt ไหม

ไม่ต้อง ถ้าแค่โฮสต์โฟลเดอร์ game ที่ให้มา แนะนำ Node.js 24 LTS เฉพาะเมื่อ build ใหม่หลังแก้ TypeScript หรือเพิ่มเพลง

ใช้กับจอสัมผัสและเกมแพดได้ไหม

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

หูฟังบลูทูธกับดีเลย์ล่ะ

Settings มีการปรับเทียบเสียงที่ตั้งค่าออฟเซ็ตของเสียง ช่วยเรื่องหูฟังบลูทูธ

มีลีดเดอร์บอร์ดออนไลน์ไหม

ไม่มี สถิติส่วนตัวบันทึกแยกตามเพลงและระดับในเบราว์เซอร์ของผู้เล่น ไม่มีคู่แข่งระยะไกลหรืออันดับร่วม

ใครควรซื้อ

Riffvolt เหมาะกับพอร์ทัลหรือเว็บที่อยากมีเกมดนตรีในแคตตาล็อก สตูดิโอที่ส่งมอบเกมจังหวะติดแบรนด์ให้ลูกค้ารายเดียว และนักพัฒนาที่อยากอ่านว่าเกม Canvas 2D และ Web Audio ตัดสินไทมิ่งใน TypeScript อย่างไร แต่ไม่ค่อยเหมาะถ้าคุณต้องการโปรแกรมแก้ไขชาร์ตแบบภาพสำหรับคนที่ไม่ใช่นักพัฒนา หรือการแข่งขันออนไลน์ ทั้งสองอย่างเป็นงานพัฒนาเฉพาะ

เล่นเดโม Riffvolt และซื้อไลเซนส์

ต้องการเพลงใหม่หรือเวอร์ชันติดแบรนด์ ขอใบเสนอราคา