Canvas 제너러티브 아트

무엇을 해주나

• Retina/HiDPI에서 선명하게 보이는 DPR 대응 캔버스 셋업과 ResizeObserver 리사이즈 처리 코드를 제공합니다.
• 파티클 풀 패턴(런타임 할당 없는 고정 배열), 플로우 필드, fBm 노이즈, L-시스템 터틀 그래픽, 더블 버퍼링(트레일 효과) 의 표준 구현을 알려줍니다.
• Perlin / Simplex / Worley 노이즈의 특성과 용도를 표로 비교해 상황에 맞는 선택을 돕습니다.
• "하지 말 것" 규칙(트레일에 clearRect 금지, 애니메이션 루프에서 getImageData 금지, 핫 루프 내 객체 생성 금지)으로 성능 함정을 미리 차단합니다.

이런 분께 추천

• 웹에서 인터랙티브 배경, 히어로 섹션 애니메이션을 만드는 프런트엔드 개발자
• 크리에이티브 코딩·제너러티브 아트에 입문했지만 60fps 성능 유지가 어려운 분
• p5.js 없이 순수 Canvas 2D API로 작업하고 싶은 분

활용 예시

1. "노이즈 기반 플로우 필드를 따라 흐르는 5,000개 파티클 배경을 만들어줘" → 필드 그리드 생성 + 풀 기반 파티클 + 트레일 페이드까지 한 번에 구성.
2. "랜딩 페이지에 넣을 프랙탈 나무를 그려줘" → L-시스템 공리·규칙·각도 세팅과 터틀 렌더링 코드 생성.
3. "캔버스가 레티나에서 흐릿한데 고쳐줘" → DPR 스케일링과 리사이즈 핸들러로 즉시 수정.

이 파일의 지시를 읽고 그대로 따라서 나를 도와줘:
https://raw.githubusercontent.com/AThevon/genjutsu/HEAD/skills/_jutsu/canvas-generative/SKILL.md

내가 원하는 것: (여기에 하고 싶은 일을 쓰세요)

클로드스킬마트에서 찾은 스킬을 설치해줘.
GitHub 저장소 AThevon/genjutsu 의 skills/_jutsu/canvas-generative 폴더를 내 ~/.claude/skills/canvas-generative/ 에 그대로 복사해줘.
설치가 끝나면 이 스킬로 무엇을 할 수 있는지 한 줄로 알려줘.