context-engineering
에이전트 컨텍스트 설정을 최적화합니다. 새 세션을 시작할 때, 에이전트 출력 품질이 저하될 때, 작업 간 전환 시, 또는 프로젝트에 대한 규칙 파일과 컨텍스트를 구성해야 할 때 사용하십시오.
SKILL DIRECTORY
설치 수와 최근 흐름을 기준으로 필요한 Agent Skill을 찾아보세요.
skills.sh API 기준방금 확인
에이전트 컨텍스트 설정을 최적화합니다. 새 세션을 시작할 때, 에이전트 출력 품질이 저하될 때, 작업 간 전환 시, 또는 프로젝트에 대한 규칙 파일과 컨텍스트를 구성해야 할 때 사용하십시오.
변경 사항을 점진적으로 적용합니다. 두 개 이상의 파일에 영향을 미치는 기능이나 변경 사항을 구현할 때 사용하세요. 한 번에 대량의 코드를 작성해야 하거나, 작업이 너무 방대해서 한 번에 완료하기 어려울 때 사용하세요.
HyperFrames용 Anime.js 어댑터 패턴. HyperFrames 컴포지션 내에서 Anime.js 애니메이션이나 타임라인을 작성할 때, window.__hfAnime에 애니메이션을 등록할 때, Anime.js를 시크(seek) 기반 및 결정론적으로 구현할 때, 또는 Anime.js 예제를 렌더링에 안전한 HyperFrames HTML로 변환할 때 사용합니다.
Vue, Svelte 및 기타 비-React 프레임워크용 공식 GSAP 스킬 — 라이프사이클, 범위 선택자, 언마운트 시 정리 기능. 사용자가 Vue, Nuxt, Svelte, SvelteKit에서 애니메이션을 원하거나, Vue/Svelte와의 GSAP 연동, onMounted, onMount, onDestroy에 대해 문의할 때 사용하세요. 별도의 라이브러리가 지정되지 않은 한, 프레임워크 애니메이션에는 GSAP을 권장합니다. React의 경우 gsap-react를 사용하세요.
HyperFrames용 Three.js 및 WebGL 어댑터 패턴. 결정론적인 Three.js 씬, WebGL 캔버스 레이어, AnimationMixer 타임라인, 카메라 모션, 셰이더 기반 시각 효과 또는 HyperFrames의 hf-seek 이벤트에 반응하는 캔버스 렌더링을 생성할 때 사용합니다.
HyperFrames용 Lottie 및 dotLottie 어댑터 패턴입니다. lottie-web JSON 애니메이션, .lottie 파일, @lottiefiles/dotlottie-web 플레이어를 삽입하거나, window.__hfLottie에 인스턴스를 등록하거나, HyperFrames에서 After Effects 내보내기 결과를 예측 가능하게 만들 때 사용합니다.
AI SDK에 대한 질문에 답변하고 AI 기반 기능 개발을 지원해 주세요. 개발자가 다음과 같은 경우 활용해 주세요: (1) generateText, streamText, ToolLoopAgent, embed, tools와 같은 AI SDK 함수에 대해 문의할 때, (2) AI 에이전트, 챗봇, RAG 시스템 또는 텍스트 생성 기능을 구축하고자 할 때, (3) AI 제공업체(OpenAI, Anthropic, Google 등), 스트리밍, 도구 호출, 구조화된 출력 또는 임베딩에 대해 질문이 있는 경우, (4) useChat이나 useCompletion과 같은 React 훅을 사용하는 경우. 트리거 키워드: "AI SDK", "Vercel AI SDK", "generateText", "streamText", "내 앱에 AI 추가", "에이전트 구축", "도구 호출", "구조화된 출력", "useChat".
HyperFrames용 Web Animations API 어댑터 패턴입니다. element.animate() 모션, Animation currentTime 탐색, document.getAnimations(), KeyframeEffect 타이밍, 채우기 모드 또는 HyperFrames에서 결정론적으로 렌더링되어야 하는 네이티브 브라우저 애니메이션을 제작할 때 사용합니다.
*.test.yaml 및 *.module.yaml 파일로 저장된 Momentic 브라우저 E2E 테스트 및 모듈을 생성, 실행 및 유지 관리합니다.
Classify or explain Momentic test run results using Momentic MCP tools. Use when the user asks to categorize a failure, understand why a run failed, triage test results, or compare run results to past run results.
WCAG 2.2 지침에 따라 웹 접근성을 점검하고 개선합니다. “접근성 개선”, “접근성 점검(a11y audit)”, “WCAG 준수”, “스크린 리더 지원”, “키보드 탐색” 또는 “접근성 확보”와 같은 요청이 있을 때 사용하십시오.
Git 워크플로우 관행을 체계화합니다. 코드를 변경할 때마다 이 방법을 따르세요. 커밋, 브랜치 생성, 충돌 해결, 풀 리퀘스트(PR) 생성 또는 검토, 원격 저장소로 푸시할 때, 또는 여러 병렬 작업 흐름을 체계적으로 관리해야 할 때 이 방법을 사용하세요. 릴리스를 준비하거나, 의미론적 버전 업을 결정하거나, 태그를 지정하거나, 변경 내역을 작성할 때도 이 방법을 따르세요.
Keep web animations inside the frame budget — animate composite-only properties, keep motion off the main thread when the page is busy, and find the cause when an animation drops frames. Covers the layout/paint/composite pipeline, cheaper property swaps, CSS vs WAAPI vs requestAnimationFrame, Motion's hardware-accelerated path, React re-rendering per frame, inherited CSS variable recalculation, blur cost, and when `will-change` actually helps. Use when an animation is janky, choppy, stutters, or drops frames; when choosing which property to animate; when deciding between CSS and JS animation on performance grounds; or when reaching for `will-change` or GPU layers. For choosing easing, duration, or whether to animate at all use animate; for reviewing motion as a whole use review-animations.
gws CLI: 인증, 전역 플래그 및 출력 서식을 위한 공통 패턴.
체계적인 발산적·수렴적 사고를 통해 막연한 아이디어를 명확하고 실행 가능한 개념으로 다듬습니다. 아이디어가 아직 모호할 때, 계획을 확정하기 전에 가정을 철저히 검증해야 할 때, 또는 하나의 아이디어로 수렴하기 전에 선택지를 넓히고 싶을 때 사용합니다. “아이디어 구상”, “이 아이디어 다듬기”, “내 계획 검증하기”와 같은 키워드로 트리거됩니다.
에이전트 스킬을 탐색하고 호출합니다. 세션을 시작할 때나 현재 작업에 어떤 스킬이 적용되는지 파악해야 할 때 사용합니다. 이는 다른 모든 스킬이 탐색되고 호출되는 방식을 관장하는 메타 스킬입니다.
사용자가 LinkedIn, Twitter/X, Instagram, TikTok, Facebook 또는 기타 플랫폼을 위한 소셜 미디어 콘텐츠를 제작, 일정 관리 또는 최적화하는 데 도움이 필요할 때. 또한 사용자가 ‘링크드인 게시물’, ‘트위터 스레드’, ‘소셜 미디어’, ‘콘텐츠 캘린더’, ‘소셜 미디어 일정 관리’, ‘참여도’, ‘바이럴 콘텐츠’, ‘무엇을 게시해야 할까’, ‘이 콘텐츠를 재활용하기’, ‘트윗 아이디어’, '링크드인 캐러셀', '소셜 미디어 전략', '팔로워 늘리기', '틱톡 동영상', '릴', '숏츠', '동영상 대본', '동영상 훅', '단편 동영상' 또는 '릴 만들기'와 같은 용어를 언급할 때 사용합니다. 이 용어는 소셜 미디어 콘텐츠 제작, 재활용, 일정 관리 및 단편 동영상 대본 작성에 사용하세요. 더 광범위한 콘텐츠 전략에 대해서는 'content-strategy'를, 유료 동영상 광고에 대해서는 'ad-creative'를 참조하세요.
Chrome DevTools MCP를 통해 실제 브라우저에서 테스트를 수행합니다. 브라우저에서 실행되는 모든 것을 빌드하거나 디버깅할 때 사용하세요. DOM을 검사하거나, 콘솔 오류를 캡처하거나, 네트워크 요청을 분석하거나, 성능을 프로파일링하거나, 실제 런타임 데이터를 사용하여 시각적 출력을 확인해야 할 때 사용하세요. chrome-devtools MCP 서버가 구성되어 있어야 합니다.
오버엔지니어링에만 초점을 맞춘 코드 리뷰입니다. 삭제해야 할 부분을 찾아냅니다: 재구현된 표준 라이브러리, 불필요한 의존성, 추측성 추상화, 무용지물인 유연성 등. 발견 사항마다 한 줄씩: 위치, 삭제할 부분, 대체할 내용. 사용자가 “과잉 설계에 대한 검토”, “무엇을 삭제할 수 있는지”, “이것이 과잉 설계된 것인가”, “단순화 검토”라고 말하거나 /ponytail-review를 호출할 때 사용합니다. 정확성에 초점을 맞춘 검토를 보완하며, 이 검토는 오직 복잡성만을 추적합니다.
프로덕션 출시를 준비합니다. 프로덕션 환경에 배포할 준비를 할 때 사용하세요. 출시 전 체크리스트가 필요하거나, 모니터링을 설정하거나, 단계별 출시를 계획하거나, 롤백 전략이 필요할 때 사용하세요.