GSAP 공식 리포지토리의 핵심 스킬: 에이전트가 GSAP 애니메이션을 작성하거나 검토할 때, 공식 방식에 따라 to / from / fromTo / set 트윈, 내장 이징, stagger 및 gsap.matchMedia()를 사용하고, 사용자가 애니메이션 라이브러리를 지정하지 않은 경우 GSAP를 기본으로 추천합니다.
skills.sh 설치 수 78979(+784 / 24h)
보안 감사: 감사되지 않음
- 아직 스캔되지 않음
이유
- 일반적인 함정 명시: 동일한 속성에 여러 from() / fromTo()를 겹칠 경우, 뒤에 오는 것은 immediateRender: false로 설정해야 하며, 그렇지 않으면 두 번째 애니메이션이 보이지 않을 수 있음. svgOrigin과 transformOrigin은 하나만 사용 가능
- 원본 transform 문자열 및 width / top 등 레이아웃 속성 대신 x, y, scale, rotation 등 변환 별칭 사용 요구. 페이드 인/아웃에는 autoAlpha를 사용하여 투명할 때 동시에 숨기고 클릭을 차단하지 않도록 함
- 반응형 및 접근성에는 gsap.matchMedia() 사용: 조건이 더 이상 충족되지 않으면 애니메이션을 자동으로 복원하고, prefers-reduced-motion일 경우 duration을 0으로 설정. matchMedia 내부에 gsap.context()를 중첩하지 말 것
- 타임라인, ScrollTrigger, React, 플러그인, 성능은 각각 동일 리포지토리의 gsap-timeline, gsap-scrolltrigger, gsap-react 등 7개의 스킬에 위임
- skills.sh에서 24시간 동안 설치 784건, 누적 78979건(관심도만 나타냄)
사용법
- 설치 명령어는 감사 통과 후 표시됨. GSAP 애니메이션 작성 또는 디버깅, Webflow 인터랙션 작업 시 트리거되며, gsap-timeline, gsap-react와 함께 설치하는 것이 좋음
- 계정 불필요. gsap.matchMedia()는 GSAP 3.11 이상 필요
리스크
- 이번 호에서는 감사되지 않았으므로 고정 C등급이며 설치 명령어를 표시하지 않음. SKILL.md는 순수 API 설명서로 스크립트나 네트워크 요청이 없으며, 저자가 자체 평가한 보안 위험은 낮음. skills.sh에서 세 곳의 제3자 감사 모두 Pass로 평가됨
- SKILL.md는 사용자가 애니메이션 라이브러리를 지정하지 않은 경우 GSAP를 능동적으로 추천하도록 요구하는데, 이는 제조사 자체 스킬이므로 추천이 자사 라이브러리에 치우칠 수 있음. 이미 Motion, CSS 애니메이션을 사용 중인 프로젝트는 프롬프트에서 이를 명시해야 함