sainzs

Pi Webgl Scroll Site — Testing skill for Claude Code

Testing community

A verified AI-agent skill for building scroll-driven WebGL/three.js sites: working spine, measured gotchas, numeric QA loop, multi-agent build protocol.

How to install Pi Webgl Scroll Site

This entry records only its repository, not the path inside it, so there is no exact command to give. Open sainzs/pi-webgl-scroll-site and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What Pi Webgl Scroll Site does

A verified AI-agent skill for building scroll-driven WebGL/three.js sites: working spine, measured gotchas, numeric QA loop, multi-agent build protocol. Works with pi, Prime Agent, Claude Code, and opencode.

Alternatives in Testing

AI Contribution Skills (Engram) — branch-pr: clean branch and PR workflow 2.5k ★
Ext Apps — Official repo for spec & SDK of MCP Apps protocol - standard for UIs embedded AI chatbots, served by MCP serve 1.9k ★
Spec Kit Zh — 💫 帮助你快速上手规格驱动开发的工具包💫 Toolkit to help you get started with Spec-Driven Development Works seamlessly across al 238 ★

README

**Moved.** This skill now lives in [`sainzs/santiagosainz-skills`](https://github.com/sainzs/santiagosainz-skills) under `skills/design/webgl-scroll-site`; install it from that catalog. This repository is frozen at 1.0.0 and kept only so existing install URLs keep working.

![verify](https://github.com/sainzs/pi-webgl-scroll-site/actions/workflows/verify.yml/badge.svg)

webgl-scroll-site

**An agent skill for building immersive scroll-driven 3D websites.**

Drop it into pi, Prime Agent, or Claude Code and your agent can build the "award site" genre end to end: a fixed canvas where scrolling drives a cinematic camera through chapters of procedural three.js scenes, graded by a post-processing chain — then *prove the frames are correct* with a numeric, headless QA gate instead of squinting at screenshots.

[![License: MIT](https://img.shields.io/badge/License-MIT-black.svg)](LICENSE) ![three.js](https://img.shields.io/badge/three.js-0.169-black) ![vite](https://img.shields.io/badge/vite-5-black) ![agents](https://img.shields.io/badge/pi%20%7C%20Prime%20Agent%20%7C%20Claude%20Code-black)

Procedural igloo assembled from scroll-driven brick animation

Three chapters: scattered bricks, a particle vortex, a granular figure

*Every frame above is procedural — no models, no textures, no HDRIs. Built by agents following this skill.*

Supported hosts

Host	Install	Notes
pi	`./install.sh pi`	`~/.pi/agent/skills/`
Prime Agent	`./install.sh prime`	`~/.prime/agent/skills/`
Claude Code (skill)	`./install.sh claude`	`~/.claude/skills/`
Claude Code (plugin)	`claude plugin marketplace add` then `claude plugin install webgl-scroll-site@pi-webgl-scroll-site`	manifests in `.claude-plugin/`, validated with `claude plugin validate --strict`
opencode	`./install.sh opencode` or symli