CtrlK
BlogDocsLog inGet started
Tessl Logo

build-threejs-scroll-worlds

Build rich, scroll-controlled real-time Three.js experiences as one persistent 3D world whose camera, lighting, atmosphere, materials, objects, DOM story, and interactions evolve across authored chapters. Use for 3D scrollytelling, scroll-driven WebGL worlds, camera journeys, interactive portfolios, product stories, exhibitions, explainers, game or film microsites, spatial narratives, and multi-scene websites where native scroll should travel through one continuous place. Not limited to landing pages.

71

Quality

87%

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

SKILL.md
Quality
Evals
Security

Quality

Content

75%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 a thorough, expert-level build guide with executable code, concrete budgets, strong verification, and well-organized reference delegation. It is slightly verbose in places and references a demo path that is not present in the bundle.

Suggestions

Tighten expository prose (e.g. the 'Every visible detail must support the same world...' paragraph) into directives to lift conciseness toward 5.

Add an explicit validate-fix-retry loop for the QA phase (run verification -> log failures -> fix -> re-verify) to strengthen workflow_clarity.

Resolve the demo/index.html reference: either include the demo bundle directory or drop the link to avoid a dead reference.

DimensionReasoningScore

Conciseness

Dense and assumes Claude's competence without explaining basics, but a few expository prose passages (e.g. 'Random noise... create complexity without cohesion') could be trimmed; overall noticeably above the efficient midpoint.

4 / 5

Actionability

Provides concrete executable code (chapter ledger, scroll conductor usage, interpolation block) and specific numeric budgets, with minor gaps where internal helpers like progressFromScroll and segmentState are referenced but defined in the conductor file.

4 / 5

Workflow Clarity

A clear end-to-end sequence from intake through delivery with a strong verification checklist and several validation checkpoints, though explicit validate-fix-retry feedback loops are less spelled out than the top anchor.

4 / 5

Progressive Disclosure

Well-signaled one-level-deep references to real bundle files (world-bible.md, realtime-architecture.md, quality-and-qa.md, scroll-conductor.js) with clear purpose annotations; held below 5 by a dangling demo/index.html reference with no matching demo directory.

4 / 5

Total

16

/

20

Passed

Description

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

The description is exemplary: concise yet comprehensive, naming concrete capabilities and a broad set of natural trigger phrases, clearly answering both what and when in third person with a distinct niche.

DimensionReasoningScore

Specificity

Names the domain and enumerates many concrete evolving subsystems (camera, lighting, atmosphere, materials, objects, DOM story, interactions), matching the comprehensive-coverage anchor.

5 / 5

Completeness

Explicitly states both what (build a persistent 3D world with evolving subsystems across chapters) and when (a concrete Use-for clause with multiple trigger scenarios), with third-person voice throughout.

5 / 5

Trigger Term Quality

Provides extensive natural trigger phrases users would say (3D scrollytelling, scroll-driven WebGL worlds, camera journeys, interactive portfolios, game or film microsites, spatial narratives), covering many synonyms and use cases.

5 / 5

Distinctiveness Conflict Risk

The persistent live-WebGL-world-with-native-scroll niche is distinct from pre-rendered video and DOM-first alternatives (which the skill routes elsewhere), giving minimal conflict risk.

5 / 5

Total

20

/

20

Passed

Validation

93%

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

CriteriaDescriptionResult

relative_links

Relative link issues: 1 missing

Warning

Total

15

/

16

Passed

Repository
MengTo/Skills
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.