mcpField
R
remix-game-creation

remix-game-creation

github.com/farworld-labs开发59 次安装
代码仓库

关于 remix-game-creation

用于在 Remix 平台创建 HTML 游戏的工作流技能，涵盖游戏规划、实现和平台要求检查，包括触控操作与 RemixSDK 回调。

主要功能

  1. 01规划小型 HTML 游戏
  2. 02要求 2:3 视口布局
  3. 03要求以触控为主要操作
  4. 04检查 RemixSDK 回调
  5. 05检查上传准备情况

适用场景

  1. 01创建面向移动设备的 HTML 游戏
  2. 02上传前检查游戏

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/farworld-labs/remix-skills --skill remix-game-creation

安装后在 Claude Code 中输入/remix-game-creation确认已加载。

详细介绍

游戏创建工作流

概述

本技能将指导你在 Remix 平台上创建新的 HTML 游戏。

前提条件

  • 必须设置 REMIX_API_KEY 环境变量。

约束

  • 游戏必须采用 2:3 的宽高比（例如 720x1080）。
  • 游戏必须按该宽高比填满整个视口——在游戏容器上使用 width: 100vw; height: 100vh。不得出现滚动条或溢出。
  • 游戏必须支持触控操作作为主要输入方式（Remix 平台主要面向移动设备和触控操作）。欢迎支持键盘和鼠标操作，但并非必需。

步骤

1. 规划游戏

确定游戏概念、机制和视觉风格。控制好范围——单文件 HTML 游戏应能在 30 秒内玩起来。

2. 编写 HTML

创建一个包含内联 <style> 和 <script> 标签的 HTML 文件。结构如下：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Game Title</title>
  <script src="https://cdn.jsdelivr.net/npm/@remix-gg/sdk@latest/dist/index.min.js"></script>
  <style>
    /* Game styles can go here */
  </style>
</head>
<body>
  
  <script>
    // Game logic here
  </script>
</body>
</html>
必需的 RemixSDK 函数

  1. window.RemixSDK.singlePlayer.actions.gameOver({ score }) —— 游戏结束时调用，并以 { score: number } 的形式传入玩家最终得分。此函数会将得分报告给平台。

  2. window.RemixSDK.onPlayAgain(callback) —— 注册一个回调函数（不接收参数），当玩家请求再玩一次时触发。该回调应重置游戏状态并重新开始游戏。

  3. window.RemixSDK.onToggleMute(callback) —— 注册一个接收 { isMuted: boolean } 的回调函数。游戏必须根据 isMuted 的值静音或取消所有音频的静音。

3. 验证

上传前，读取 HTML 文件并确认：

  1. 包含 <!DOCTYPE html> 声明
  2. 包含 <meta name="viewport" ...> 标签
  3. 包含 RemixSDK 脚本标签：<script src="https://cdn.jsdelivr.net/npm/@remix-gg/sdk@latest/dist/index.min.js"></script>
  4. 不包含旧版 @farcade/game-sdk 脚本标签
  5. 调用 singlePlayer.actions.gameOver( 或 multiplayer.actions.gameOver(（不能两者都调用）
  6. 注册 .onPlayAgain( 回调
  7. 注册 .onToggleMute( 回调
  8. 不使用 localStorage 或 sessionStorage
  9. 不使用内联事件处理程序（onclick=、onload= 等）

继续之前，修复所有问题。

4. 上传游戏

按照 upload-game 工作流，在 Remix 平台上创建游戏并部署你的 HTML 代码。

提示

  • 使用 requestAnimationFrame 实现游戏循环，而不是 setInterval。
  • 必须支持触控操作（主要输入方式）；键盘和鼠标操作可作为额外选项。
  • 将 HTML 总大小控制在 100KB 以下，以便快速加载。

评论

支持 Markdown