3d-web-experience
Expert in building 3D experiences for the web - Three.js, React Three Fiber, Spline, WebGL, and interactive 3D scenes. Covers product configurators, 3D portfolios, immersive websites, and bringing ...
Install with Tessl CLI
npx tessl i github:boisenoise/skills-collections --skill 3d-web-experience67
Does it follow best practices?
If you maintain this skill, you can automatically optimize it using the tessl CLI to improve its score:
npx tessl skill review --optimize ./path/to/skillValidation for skill structure
Discovery
54%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
The description effectively identifies its niche in 3D web development with good technology-specific trigger terms, making it distinctive. However, it critically lacks a 'Use when...' clause and appears truncated, significantly hurting completeness. The description would benefit from explicit trigger guidance and more concrete action verbs.
Suggestions
Add a 'Use when...' clause with explicit triggers like 'Use when the user asks about Three.js, WebGL, 3D animations, interactive 3D websites, or product configurators'
Complete the truncated description and add specific action verbs like 'create 3D scenes', 'animate objects', 'build interactive configurators', 'optimize WebGL performance'
Ensure the full description is included without truncation to provide complete capability information
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Names the domain (3D web experiences) and lists technologies (Three.js, React Three Fiber, Spline, WebGL) plus some use cases (product configurators, 3D portfolios, immersive websites), but the description is truncated ('bringing ...') and doesn't provide comprehensive concrete actions like 'create', 'animate', or 'optimize'. | 2 / 3 |
Completeness | The description addresses 'what' (building 3D web experiences) but completely lacks a 'Use when...' clause or any explicit trigger guidance. The truncation also suggests incomplete information, and there's no guidance on when Claude should select this skill. | 1 / 3 |
Trigger Term Quality | Good coverage of natural terms users would say: 'Three.js', 'React Three Fiber', 'Spline', 'WebGL', '3D', 'interactive 3D scenes', 'product configurators', '3D portfolios', 'immersive websites' are all terms users would naturally use when seeking this skill. | 3 / 3 |
Distinctiveness Conflict Risk | The 3D web development niche with specific technologies (Three.js, React Three Fiber, Spline, WebGL) creates a clear, distinct domain that is unlikely to conflict with other skills. The combination of these specific technologies makes it highly distinguishable. | 3 / 3 |
Total | 9 / 12 Passed |
Implementation
64%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This skill provides solid, actionable code examples for 3D web development with good coverage of common tools (Spline, R3F, Three.js). The anti-patterns section adds practical value. However, it suffers from some introductory fluff, missing validation steps in workflows, and could benefit from splitting detailed content into referenced files.
Suggestions
Remove the role description paragraph and capabilities list - they add no actionable value and Claude already understands the domain
Add validation checkpoints to the 3D Model Pipeline (e.g., 'Verify model loads: open in https://gltf-viewer.donmccurdy.com before deploying')
Extract detailed patterns into separate files (e.g., SCROLL-3D.md, MODEL-PIPELINE.md) and keep SKILL.md as a concise overview with links
Add error handling examples for common failures (model load errors, WebGL context loss, mobile fallbacks)
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The skill includes some unnecessary framing ('You bring the third dimension to the web') and the capabilities list is redundant with the patterns shown. However, the code examples are reasonably tight and the tables are efficient. | 2 / 3 |
Actionability | Provides fully executable code examples for Spline, React Three Fiber, GLTF compression commands, and scroll-driven 3D. The bash commands and JSX snippets are copy-paste ready with real imports and proper syntax. | 3 / 3 |
Workflow Clarity | The 3D Model Pipeline has a clear 6-step sequence, but lacks validation checkpoints. There's no guidance on verifying the model works after compression or testing steps beyond 'Test file size'. The decision tree is helpful but workflows lack error recovery. | 2 / 3 |
Progressive Disclosure | Content is organized into clear sections with patterns and anti-patterns, but everything is inline in one file. References to related skills exist but no actual linked documentation for advanced topics like WebGL optimization or complex scene management. | 2 / 3 |
Total | 9 / 12 Passed |
Validation
90%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 10 / 11 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
frontmatter_unknown_keys | Unknown frontmatter key(s) found; consider removing or moving to metadata | Warning |
Total | 10 / 11 Passed | |
- 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.