Tessl • The package manager for agent skills

SkillPublic

r3f-shaders

React Three Fiber shaders - GLSL, shaderMaterial, uniforms, custom effects. Use when creating custom visual effects, modifying vertices, writing fragment shaders, or extending built-in materials.

Quality

81%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Quality

Content

71%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.

The body is highly actionable with executable examples for every major R3F shader technique, and the core define-extend-use workflow is clearly sequenced. It is weakened by generic GLSL reference material Claude already knows (built-in functions, gradients, duplicated noise code) and by its monolithic structure — no progressive disclosure via reference files.

Suggestions

Move generic GLSL material (built-in function listings, gradient snippets, noise functions) into a references/ file (e.g., references/glsl-patterns.md) and keep only R3F-specific guidance in SKILL.md, removing the duplicated noise function in the Dissolve section.

Trim or delete the 'GLSL Built-in Functions' and 'Gradient' sections entirely — this is textbook GLSL knowledge Claude already has.

Add an explicit validation step for shader development, e.g., checking browser console for shader compile errors and using the debug color-output pattern to verify varyings before iterating.

Dimension	Reasoning	Score
Conciseness	The R3F-specific sections (shaderMaterial, extend, HMR key, onBeforeCompile injection points, instanced attributes) are lean and valuable, but 'GLSL Built-in Functions' (listing abs, sin, mix...), 'Gradient' snippets, and the noise function duplicated verbatim in the Dissolve section are concepts Claude already knows. Mostly efficient with some unnecessary padding.	3 / 5
Actionability	Every section provides fully executable, copy-paste-ready code covering the common cases: Quick Start, raw THREE.ShaderMaterial, uniform updating, displacement, Fresnel, dissolve, onBeforeCompile with named injection chunks, instancing, external .glsl imports with Vite config, TypeScript declarations, and debugging.	5 / 5
Workflow Clarity	The core workflow is explicitly numbered ('1. Define the material / 2. Extend R3F / 3. Use in component') and Quick Start shows an end-to-end flow, with a debugging section as a feedback aid. Minor validation gaps: no explicit guidance on verifying shader compilation or handling compile errors.	4 / 5
Progressive Disclosure	An ~875-line monolithic body with all reference material inlined and no bundle files (references/, scripts/, assets/ do not exist). Section headers aid navigation, but pattern-library content (noise functions, GLSL function reference, instancing, effect recipes) that belongs in separate reference files is inline.	3 / 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: it names the domain, lists concrete capabilities, and includes an explicit 'Use when...' clause with actionable triggers. Third person is used correctly. Only minor improvements possible around trigger synonyms and slightly broader capability coverage.

Dimension	Reasoning	Score
Specificity	Names the domain and several concrete capabilities ('GLSL, shaderMaterial, uniforms, custom effects') and actions ('creating custom visual effects, modifying vertices, writing fragment shaders, or extending built-in materials'). Minor gaps in coverage (e.g., debugging, post-processing) keep it below a 5.	4 / 5
Completeness	Explicitly answers 'what' ('React Three Fiber shaders - GLSL, shaderMaterial, uniforms, custom effects') and 'when' ('Use when creating custom visual effects, modifying vertices, writing fragment shaders, or extending built-in materials') with concrete trigger phrases.	5 / 5
Trigger Term Quality	Good natural keyword coverage ('shaders', 'GLSL', 'custom visual effects', 'fragment shaders', 'vertices', 'built-in materials') but misses common variations like 'vertex shader' as a user phrase, '.glsl', or 'shader material'. Not generic enough for a 3.	4 / 5
Distinctiveness Conflict Risk	'React Three Fiber shaders' is a clear niche with distinct triggers, but there is minor overlap risk with a generic GLSL/WebGL or plain three.js shader skill.	4 / 5
	Total	17 / 20 Passed

Validation

93%

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 — 15 / 16 Passed

Validation for skill structure

Criteria	Description	Result
skill_md_line_count	SKILL.md is long (880 lines); consider splitting into references/ and linking	Warning

	Total	15 / 16 Passed

Repository: AzizBelhassan/timeverse
Path: .agents/skills/r3f-shaders/SKILL.md
Revision: 9dc2cb4

Reviewed: 8 hours ago

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.

r3f-shaders

Table of Contents

Is this your skill?