# Printed Curtain Render

Generate a browser-based p5.js curtain simulation that weaves user-supplied PNG, JPEG...

- Repository: https://github.com/vibe-motion/skills (1498 stars)
- Category: Media
- License: see repository
- Last updated: 2026-10-05
- Runs scripts: yes, review before use

## Install

Claude Code: `npx skills add vibe-motion/skills --skill printed-curtain-render -g -a claude-code -y`
Codex: `npx skills add vibe-motion/skills --skill printed-curtain-render -g -a codex -y`
Cursor: `npx skills add vibe-motion/skills --skill printed-curtain-render -g -a cursor -y`
Gemini CLI: `npx skills add vibe-motion/skills --skill printed-curtain-render -g -a gemini-cli -y`

## Description

Generate a browser-based p5.js curtain simulation that weaves user-supplied PNG, JPEG, or WebP artwork and optional text into individually moving strands. Use when users ask for an interactive curtain or thread simulation, artwork woven into cloth or ropes, image-bearing fabric motion, 可交互线帘/幕布, 图片织入布料, printed curtain effects, or a customizable browser-based fabric reveal.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Printed Curtain Render

## Workflow

1. Resolve the source image, optional text lines, palette, and output directory.
2. Resolve the installed skill directory and run `scripts/create_printed_curtain.py`.
3. Wait for `VALIDATION=PASS` and `OUTPUT_HTML=<absolute path>`.
4. Serve the output directory over HTTP and inspect the result in a browser. Do not use `file://`; browser canvas security can prevent local artwork pixels from being sampled.
5. Return the absolute HTML path, the local-server command, and the chosen artwork settings.

## Quick Start

```bash
/usr/local/bin/python3 scripts/create_printed_curtain.py \
  --image "/absolute/path/to/artwork.png" \
  --text "VIBE MOTION" \
  --output-dir "$(pwd)/out/printed-curtain"
```

## Installed Skill Resolution

Use the installed skill copy, not a source checkout of this skill collection:

```bash
skill_dir=""
for base in "${AGENTS_HOME:-$HOME/.agents}" "${CLAUDE_HOME:-$HOME/.claude}" "${CODEX_HOME:-$HOME/.codex}"; do
  if [ -d "$base/skills/printed-curtain-render" ]; then
    skill_dir="$base/skills/printed-curtain-render"
    break
  fi
done
[ -n "$skill_dir" ] || { echo "printed-curtain-render skill not found under ~/.agents, ~/.claude, or ~/.codex"; exit 1; }

/usr/local/bin/python3 "$skill_dir/scripts/create_printed_curtain.py" \
  --image "/absolute/path/to/artwork.png" \
  --text "VIBE MOTION" \
  --output-dir "$(pwd)/out/printed-curtain"
```

## Preview

Serve the generated directory, then open the printed URL:

```bash
/usr/local/bin/python3 -m http.server 8000 --directory "$(pwd)/out/printed-curtain"
```

- Move the pointer across the curtain to push individual strands aside.
- Press `H` to toggle the live controls and image picker.
- Press `R` to rebuild the cloth.
- Drop a PNG, JPEG, or WebP on the canvas for a temporary in-browser replacement.

## Customization

The rest: https://github.com/vibe-motion/skills/blob/HEAD/printed-curtain-render/SKILL.md