CtrlK
BlogDocsLog inGet started
Tessl Logo

react-three-fiber-game

Build React-hosted 3D browser games with React Three Fiber. Use when the user wants pmndrs-based scene composition, shared React state, and 3D HUD integration inside a React app.

63

Quality

73%

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/react-three-fiber-game/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

72%Weight 40%Scale 1-3

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

A lean, well-structured overview skill that avoids teaching known concepts and uses clean progressive disclosure to delegate concrete starters to reference files. Its weaker points are actionability and workflow clarity: the in-body guidance is architectural and directive rather than executable or sequenced with checkpoints.

Suggestions

Add at least one compact, executable snippet (e.g. a minimal <Canvas> scene-root component) so the in-body guidance is copy-paste ready rather than purely architectural.

Offer a short sequenced "first build" checklist (pick stack -> set up scene root -> wire shared state -> add DOM HUD) with a verify step so the skill reads as a workflow, not just categorical rules.

Tighten the mild overlap between "Use This Skill When" and "Best Fit Scenarios" so each section carries distinct signal.

DimensionReasoningScore

Conciseness

The body assumes Claude's knowledge of React, R3F, drei, and physics and never explains what these libraries are; it is organized as decision criteria, rules, and anti-patterns with every section earning its place, matching the lean/efficient level-3 anchor.

3 / 3

Actionability

It gives specific library-to-purpose mappings (drei for controls/loaders, rapier for physics, postprocessing for effects) and concrete rules, but the guidance is architectural and directive rather than executable code, delegating concrete starters to external reference files — matching level-2's "some concrete guidance but incomplete".

2 / 3

Workflow Clarity

The body is clearly organized (Use When / Do Not Use / Best Fit / Core Rules / Anti-Patterns) with an unambiguous skill-selection decision flow, but it is categorical guidance rather than a sequenced multi-step workflow with validation checkpoints, so it sits at the level-2 anchor.

2 / 3

Progressive Disclosure

SKILL.md acts as a lean overview that points outward to nine clearly-labeled, one-level-deep reference files (starters, asset pipeline, debugging), with content appropriately split and easy navigation, matching the level-3 anchor.

3 / 3

Total

10

/

12

Passed

Description

75%Weight 40%Scale 1-3

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 concise, well-structured description that answers both what and when with an explicit trigger and a distinct React/R3F niche. Its main weakness is that the action list is a single bundled activity rather than multiple discrete actions, and it mixes one jargon term ("pmndrs-based") with natural user phrasing.

DimensionReasoningScore

Specificity

The description states one concrete action ("Build React-hosted 3D browser games with React Three Fiber") plus capability areas ("scene composition, shared React state, and 3D HUD integration"), but these are aspects of a single activity rather than a list of multiple discrete actions like the level-3 anchor.

2 / 3

Completeness

It explicitly answers both what ("Build React-hosted 3D browser games with React Three Fiber") and when via an explicit "Use when the user wants..." trigger clause, matching the level-3 anchor for clearly answering both what and when.

3 / 3

Trigger Term Quality

It includes natural terms a user might say ("3D browser games", "React Three Fiber", "React app") but leans on the jargon "pmndrs-based" and omits common variations such as "R3F" or "three.js in React", matching the level-2 anchor of some relevant keywords missing common variations.

2 / 3

Distinctiveness Conflict Risk

The React-Three-Fiber-in-React niche with specific triggers (shared React state, React app shell) carves a clear niche unlikely to trigger for vanilla Three.js or 2D game skills, matching the level-3 clear-niche anchor.

3 / 3

Total

10

/

12

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.

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
openai/plugins
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.