CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

three-webgl-game

Implement browser-game runtimes with plain Three.js. Use when the user wants imperative scene control in TypeScript or Vite with GLB assets, loaders, physics, and low-level WebGL debugging.

63

Quality

79%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide
SecuritybySnyk

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./plugins/game-studio/skills/three-webgl-game/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

65%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

A well-disciplined overview that models progressive disclosure cleanly and stays free of known-concept padding. Its weaknesses are the absence of any executable code or commands in the body and the lack of a sequenced workflow — the skill reads as principles plus pointers rather than a process.

Suggestions

Add a minimal runnable snippet or setup commands (e.g., the npm install line for three, @types/three, and rapier, or a 10-line render-loop skeleton) so the body itself is actionable without opening a reference.

Provide an ordered build sequence (e.g., 1. scaffold structure, 2. wire loaders, 3. add Rapier, 4. attach DOM HUD, 5. verify with SpectorJS) so the thematic sections become a workflow.

Merge the 'Initial Scaffold UX' section into Core Rule 7 (or vice versa) and trim 'Good Fit Scenarios' overlap with 'Use This Skill When' to reclaim tokens.

DimensionReasoningScore

Conciseness

The body is a lean bullet overview with no explanation of concepts Claude already knows. Minor redundancy exists: the low-chrome UI rule appears in both 'Core Rules' (rule 7) and 'Initial Scaffold UX', and 'Good Fit Scenarios' partially restates 'Use This Skill When'.

4 / 5

Actionability

Guidance is concrete and opinionated ('Keep simulation state outside Three.js objects', explicit simulation/, render/app/, physics/ module boundaries), but the body contains no code or commands — all executable detail is deferred to referenced starter files, leaving it short of 'mostly executable guidance'.

3 / 5

Workflow Clarity

This is a principles/routing skill with no ordered multi-step process; sections are thematic rather than a build sequence, and no checkpoints or validation steps appear anywhere. Ordering is only implied by the structure list.

3 / 5

Progressive Disclosure

The body is exactly an overview: all deep detail (architecture, starters, debugging, asset pipeline) is pushed to one-level-deep reference files, each labeled in a consolidated References section and invoked contextually ('Use the module shape in ../../references/three-webgl-architecture.md'). No bulk content is inlined that belongs in a separate file.

5 / 5

Total

15

/

20

Passed

Description

83%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A strong description with an explicit 'Use when' clause, concrete stack enumeration, and good natural trigger terms. Main gaps are jargon-heavy trigger phrasing ('imperative scene control') and no explicit exclusion of the React path.

Suggestions

Add a natural-language synonym such as '3D game' or 'WebGL scene' to the trigger phrasing so users who don't say 'imperative scene control' still match.

State the React exclusion explicitly (e.g., 'for non-React projects; use the react-three-fiber skill inside React apps') to reduce overlap risk with the sibling skill.

Break the single 'Implement browser-game runtimes' verb into a couple of discrete actions (e.g., 'set up loaders, wire physics, debug frames') for fuller specificity.

DimensionReasoningScore

Specificity

"Implement browser-game runtimes with plain Three.js" is one broad verb, but the enumeration of concrete capability areas ("GLB assets, loaders, physics, and low-level WebGL debugging") gives several specific anchors. It sits between the 1-2-action anchor and the multi-action anchor, noticeably above the midpoint.

4 / 5

Completeness

It explicitly answers both questions: the what ("Implement browser-game runtimes with plain Three.js... GLB assets, loaders, physics") and the when ("Use when the user wants imperative scene control in TypeScript or Vite...") with a concrete trigger clause.

5 / 5

Trigger Term Quality

"Three.js", "TypeScript", "Vite", "GLB", and "WebGL" are terms users naturally say, but "imperative scene control" is developer jargon and common synonyms like "3D game" or "threejs" are absent.

4 / 5

Distinctiveness Conflict Risk

"plain Three.js" plus stack-specific triggers carve a distinct niche away from a React-Three-Fiber sibling, but React is never explicitly excluded, so a Three.js request inside a React app could still route here — minor overlap risk.

4 / 5

Total

17

/

20

Passed

Validation

100%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository

openai/plugins

Path

plugins/game-studio/skills/three-webgl-game/SKILL.md

Reviewed

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.