一键导入
tinyworld-visual-qa
Use when visually testing Tiny World Builder UI, camera, ghost opacity, buildings, tile geometry, or frontend polish in the browser.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
菜单
Use when visually testing Tiny World Builder UI, camera, ghost opacity, buildings, tile geometry, or frontend polish in the browser.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Use when changing Tiny World Builder renderer setup, shadows, smoke, voxel clouds, ghost board render cost, frame loop, or GPU performance.
Use when changing the first-class Island Viewer shell, sequential generated-island viewer routing, or viewer-scoped graphics defaults.
Use when adding, importing, designing, reviewing, or animating low-poly / stylized 3D assets in Tiny World Builder, including Three.js procedural meshes, GLB/GLTF assets, Poly Pizza models, material palettes, scale/orientation, silhouettes, clouds/planes/crop dusters, and toolbar thumbnails.
Use when adding or changing persisted user state — settings defaults, audio, camera/orbit, panel positions, feature flags, and the in-app "Save Defaults" pipeline that snapshots localStorage into tinyworld-defaults.json. Also covers the inline-script regex gotcha that has burned us twice.
Tinyverse collectibles lane — pack reveal, frozen islands, play-mode visits. Universe carousel is archived but code stays in repo.
Use when changing Tiny World Builder API, webhook, SSE, MCP, plugin, or automation examples.
| name | tinyworld-visual-qa |
| description | Use when visually testing Tiny World Builder UI, camera, ghost opacity, buildings, tile geometry, or frontend polish in the browser. |
Use the browser route http://localhost:3000/tiny-world-builder when available.
For Worlds screen/API QA, run the local build first and launch through Netlify on
8888:
./publish.sh
npx --yes netlify dev --dir dist --functions netlify/functions --port 8888 --staticServerPort 3998
Worlds cards should use real /api/worlds preview data. Do not invent seeded or
hardcoded island layouts in the client; the 2D isometric renderer may draw the
default grass base for the world grid, then overlay only API-provided terrain /
object tuples.
Checks:
0, 1-9, letter tools, E.x * CELL, z * CELL) for drawing and the same direct inverse for clicks; do not rotate or
mirror it to chase a camera angle./api/worlds preview data, keep legacy
multi-gate data collapsed to the single center world-selection stargate, and
keep search/filter/arrow/dot navigation reachable on desktop and mobile.pointer-events: none, stay below UI controls, and remain visible during pan/orbit/zoom movement.body.ui-theme-dark should give it the same
dark pill surface/text treatment as the rest of the top chrome.?shield=1, confirm window.VoxelShield exposes the
supplied class/API names, has 4 keystones and 32 panels, blue rune faces point
outward, open() / close() / toggle() / setProgress() work, and the
bottom toolbar Home and Shield buttons sit side by side with Shield reflecting
raised/lowered state..modal-head strong treatment, with explanatory body copy in .modal-copy / .confirm-copy and readable darker muted text.setCell; unsupported creative edits can fall back to prompts.selection-preview-canvas, selection-preview-actions, and the Preview/Details tabs should exist in the panel, and renderSelection() should call updateSelectionPreview() as the selected target changes.http://localhost:3000/tiny-world-builder?planet=desert&planetStyle=lowpoly&planetDrop=60&seed=skytest&planetProof=1 and http://localhost:3000/tiny-world-builder?planet=desert&planetStyle=realistic&planetDrop=60&seed=skytest&planetProof=1: they hide non-canvas chrome, dismiss the welcome modal, widen the perspective camera, apply the underlay horizon haze and between-layer atmosphere sheets, and leave a small proof badge. Prefer this over judging one-shot screenshots where normal UI panels or default camera framing obscure the underlay.Useful browser probes:
pickTile(window.innerWidth / 2, window.innerHeight / 2)
getComputedStyle(document.body, '::before').pointerEvents
getComputedStyle(document.body, '::after').pointerEvents