webgl-3d-object

Create a real 3D WebGL object with geometric mesh depth, physically based material, directional and ambient lighting, perspective camera, subtle rotation, and floating motion. Use when a page needs a faceted 3D hero object or product-like visual with real lighting instead of CSS transform tricks.

Quality

96%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Low

Low-risk findings worth noting

Quality

Content

100%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 tight, self-contained skill body: executable code, concrete defaults, an explicit avoidance list, and a verification checklist, all well-organized without conceptual padding. It exemplifies lean, actionable skill content.

Dimension	Reasoning	Score
Conciseness	No padding explaining what WebGL or Three.js is; every section (Rules, defaults, Avoid, Quick Checks) is dense and purposeful, and the recipe is the core artifact rather than filler.	5 / 5
Actionability	Provides a fully executable copy-paste-ready initWebGL3DObject function, complete HTML/CSS, concrete numeric material and lighting defaults, and named Three.js APIs covering the common cases.	5 / 5
Workflow Clarity	A single-purpose render-setup skill with numbered Rules and a 'Quick Checks' verification checklist; no destructive or batch operation applies, and the action is unambiguous.	5 / 5
Progressive Disclosure	No bundle files are present (references/scripts/assets are empty or absent), so the self-contained body is scored on organization; clear section headers make navigation easy at a single level.	5 / 5
	Total	20 / 20 Passed

Description

92%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, specific description that answers what and when with concrete capability terms and an explicit 'Use when' trigger. It is only slightly short of perfect trigger-term breadth, missing a few natural user phrasings.

Dimension	Reasoning	Score
Specificity	Lists multiple concrete capabilities — geometric mesh depth, PBR material, directional and ambient lighting, perspective camera, rotation, floating motion — giving comprehensive coverage of what the skill produces.	5 / 5
Completeness	Explicitly answers both what ('Create a real 3D WebGL object with...') and when ('Use when a page needs a faceted 3D hero object or product-like visual with real lighting instead of CSS transform tricks').	5 / 5
Trigger Term Quality	Includes natural terms like '3D WebGL object', '3D hero object', 'product-like visual', and 'real lighting', but misses common synonyms users might say such as '3D model', 'WebGL scene', or 'Three.js object'.	4 / 5
Distinctiveness Conflict Risk	Carves a clear niche — real WebGL 3D rendering with lighting versus CSS transform fakery — with minimal overlap risk against related 2D/CSS skills.	5 / 5
	Total	19 / 20 Passed

Validation

100%

Warnings & errors only

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: MengTo/Skills
Path: agent-skills/web-design/webgl-3d-object/SKILL.md
Commit: 4c716b5

Reviewed: 1 day ago

Table of Contents

Discovery Implementation Validation

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.