remix-game-best-practices

星标10

分支5

更新时间2026年3月5日 21:21

Mobile-first game creation best practices for Remix

安装

用 Codex 或 Claude 帮你安装复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。

来源

farworld-labs

farworld-labs/remix-skills

打开 GitHub 仓库查看创作者相关仓库

下载

Game Creation Best Practices

Mobile-First Requirements

Build for portrait orientation only.
Canvas must be 720x1080 (2:3 aspect ratio).
Do not use landscape layouts or controls.
Design for thumb-friendly interactions and readable UI.

Mandatory Remix SDK Usage

Include the SDK script in HTML <head>:

<script src="https://cdn.jsdelivr.net/npm/@remix-gg/sdk@latest/dist/index.min.js"></script>

Use only the supported SDK APIs:

window.RemixSDK.singlePlayer.actions.saveGameState({ gameState: {...} })
window.RemixSDK.singlePlayer.actions.gameOver({ score: number })
window.RemixSDK.onPlayAgain(() => { ... })
window.RemixSDK.onToggleMute((data) => { ... })
window.RemixSDK.ready()
window.RemixSDK.gameState
window.RemixSDK.hapticFeedback()

Forbidden APIs and Patterns

Do not use localStorage.
Do not use sessionStorage.
Do not use navigator.vibrate(...).
Do not use window.RemixSDK.vibrate(...).
Do not use non-existent SDK methods (save, checkpoint, etc.).

Game Over and Restart Flow

End runs only with:

window.RemixSDK.singlePlayer.actions.gameOver({ score: finalScore })

Do not implement a custom game-over screen.
Handle replay via window.RemixSDK.onPlayAgain(...).

State Persistence

Persist progress only with saveGameState.
Read persisted values from window.RemixSDK.gameState after await window.RemixSDK.ready().
Keep saved state compact and serializable.

Haptics and Audio

Use window.RemixSDK.hapticFeedback() for collisions, scoring, UI interactions, and game over.
Respect onToggleMute state for all game audio.
Use lightweight Web Audio API SFX for better mobile performance.

Framework Rules

Phaser (2D)

Use global Phaser (no imports).
Use scene lifecycle (preload, create, update).
Use Arcade physics for collisions.
Do not set parent in Phaser.Game config.

Three.js + Cannon-ES (3D)

Use globals THREE and CANNON (no imports).
Use requestAnimationFrame loop.
Include ambient + directional lighting.
Sync mesh transforms from physics bodies every frame.

Code and Runtime Constraints

Write ES6 JavaScript only (no TypeScript).
Do not use import statements.
Assume browser-only runtime (no Node.js APIs).
Define initGame() and call it at the end of the file.

Validation Checklist

Before finalizing a game, verify:

Portrait 2:3 canvas (720x1080).
SDK hooks present (gameOver, onPlayAgain, onToggleMute).
No forbidden storage or vibration APIs.
Haptics integrated for meaningful gameplay events.
Restart flow works cleanly from onPlayAgain.

同仓库更多 Skills

同仓库

remix-add-image

farworld-labs/remix-skills

Generate and add images to a Remix game

2026-04-1510

remix-add-sprite

farworld-labs/remix-skills

Generate and add sprites to a Remix game

2026-04-1510

remix-agent-publish

farworld-labs/remix-skills

Build and publish Remix games with the current Remix toolchain. Use when work touches the official Remix CLI, MCP server, REST publishing APIs, or the @remix-gg/sdk game runtime.

2026-04-1510

remix-api-reference

farworld-labs/remix-skills

OpenAPI-first endpoint reference for Remix game publishing REST routes

2026-04-1510

remix-cli

farworld-labs/remix-skills

Use the official Remix CLI for authentication, config inspection, game creation, uploads, and analytics. Trigger this skill when a task involves `remix login`, `remix whoami`, `.remix-cli.json`, `REMIX_API_KEY`, or terminal-based game management on Remix.

2026-04-1510

remix-mcp-quickstart

farworld-labs/remix-skills

Quickstart for the official Remix MCP server. Use when configuring or operating `@remix-gg/mcp`, wiring MCP auth, or choosing the right Remix MCP tools and skill resources.

2026-04-1510

name	remix-game-best-practices
description	Mobile-first game creation best practices for Remix

Game Creation Best Practices

Mobile-First Requirements

Build for portrait orientation only.
Canvas must be 720x1080 (2:3 aspect ratio).
Do not use landscape layouts or controls.
Design for thumb-friendly interactions and readable UI.

Mandatory Remix SDK Usage

Include the SDK script in HTML <head>:

<script src="https://cdn.jsdelivr.net/npm/@remix-gg/sdk@latest/dist/index.min.js"></script>

Use only the supported SDK APIs:

window.RemixSDK.singlePlayer.actions.saveGameState({ gameState: {...} })
window.RemixSDK.singlePlayer.actions.gameOver({ score: number })
window.RemixSDK.onPlayAgain(() => { ... })
window.RemixSDK.onToggleMute((data) => { ... })
window.RemixSDK.ready()
window.RemixSDK.gameState
window.RemixSDK.hapticFeedback()

Forbidden APIs and Patterns

Do not use localStorage.
Do not use sessionStorage.
Do not use navigator.vibrate(...).
Do not use window.RemixSDK.vibrate(...).
Do not use non-existent SDK methods (save, checkpoint, etc.).

Game Over and Restart Flow

End runs only with:

window.RemixSDK.singlePlayer.actions.gameOver({ score: finalScore })

Do not implement a custom game-over screen.
Handle replay via window.RemixSDK.onPlayAgain(...).

State Persistence

Persist progress only with saveGameState.
Read persisted values from window.RemixSDK.gameState after await window.RemixSDK.ready().
Keep saved state compact and serializable.

Haptics and Audio

Use window.RemixSDK.hapticFeedback() for collisions, scoring, UI interactions, and game over.
Respect onToggleMute state for all game audio.
Use lightweight Web Audio API SFX for better mobile performance.

Framework Rules

Phaser (2D)

Use global Phaser (no imports).
Use scene lifecycle (preload, create, update).
Use Arcade physics for collisions.
Do not set parent in Phaser.Game config.

Three.js + Cannon-ES (3D)

Use globals THREE and CANNON (no imports).
Use requestAnimationFrame loop.
Include ambient + directional lighting.
Sync mesh transforms from physics bodies every frame.

Code and Runtime Constraints

Write ES6 JavaScript only (no TypeScript).
Do not use import statements.
Assume browser-only runtime (no Node.js APIs).
Define initGame() and call it at the end of the file.

Validation Checklist

Before finalizing a game, verify:

Portrait 2:3 canvas (720x1080).
SDK hooks present (gameOver, onPlayAgain, onToggleMute).
No forbidden storage or vibration APIs.
Haptics integrated for meaningful gameplay events.
Restart flow works cleanly from onPlayAgain.