모션-성능-수정은(는) 무엇을 하나요?
레이아웃 스래싱, 컴포지터 속성, 스크롤 연동 모션, 블러 효과 등 애니메이션 성능 문제를 감사하고 수정합니다. 애니메이션이 끊기거나, 전환이 버벅이거나, CSS/JS 애니메이션 성능을 검토할 때 사용합니다.
레이아웃 스래싱, 컴포지터 속성, 스크롤 연동 모션, 블러 효과 등 애니메이션 성능 문제를 감사하고 수정합니다. 애니메이션이 끊기거나, 전환이 버벅이거나, CSS/JS 애니메이션 성능을 검토할 때 사용합니다.
이 스킬은 웹 애니메이션 성능 문제를 진단하고 최적화하는 데 특화된 도구입니다. 개발자가 CSS 및 JavaScript 애니메이션에서 발생하는 레이아웃 스래싱, 컴포지터 속성 비효율, 스크롤 연동 모션, 블러 효과 등 다양한 성능 저하 원인을 식별하고 수정할 수 있도록 지원합니다. Cursor, Claude Code, Codex 등 주요 AI 에이전트 플랫폼에서 사용할 수 있으며, SKILL.md 문서를 기반으로 구체적인 진단 방법과 최적화 기법을 제공합니다. 애니메이션의 초당 프레임 수를 개선하고, 브라우저의 리플로우와 리페인트를 최소화하여 부드러운 사용자 경험을 구현하는 데 유용합니다.
npx skills add https://github.com/ibelick/ui-skills/tree/main/skills/fixing-motion-performance레이아웃 스래싱, 컴포지터 속성, 스크롤 연동 모션, 블러 효과 등 애니메이션 성능 문제를 감사하고 수정합니다. 애니메이션이 끊기거나, 전환이 버벅이거나, CSS/JS 애니메이션 성능을 검토할 때 사용합니다.
This repo contains 3 individual skills — each has its own dedicated page.
Quickly deslop UI code by fixing spacing, hierarchy, typography, and small layout issues. Use when the interface needs a fast cleanup or polish pass.
Audit and fix HTML accessibility issues including ARIA labels, keyboard navigation, focus management, color contrast, and form errors. Use when adding interactive controls, forms, dialogs, or reviewing WCAG compliance.
Audit and fix HTML metadata including page titles, meta descriptions, canonical URLs, Open Graph tags, Twitter cards, favicons, JSON-LD structured data, and robots directives. Use when adding SEO metadata, fixing social share previews, reviewing Open Graph tags, setting up canonical URLs, or shipping new pages that need correct meta tags.
Extract frames or short clips from videos using ffmpeg.
Summarize or transcribe URLs, YouTube/videos, podcasts, articles, transcripts, PDFs, and local files.
Use when testing, fixing, or extending the OpenClaw Control UI GUI with Vitest + Playwright end-to-end checks, mocked Gateway WebSocket flows, mocked dashboard runs, screenshots/videos, or agent-verifiable browser proof.
Obra superpowers agent skills.
See, Understand, Act on video and audio. See- ingest from local files, URLs, RTSP/live feeds, or live record desktop; return realtime context and playable stream links. Understand- extract frames, build visual/semantic/temporal indexes, and search moments with timestamps and auto-clips. Act- transcode and normalize (codec, fps, resolution, aspect ratio), perform timeline edits (subtitles, text/image overlays, branding, audio overlays, dubbing, translation), generate media assets (image, audio...
End-to-end marketing campaign planning and execution. Covers audience research, positioning, campaign angle definition, landing page copy, email sequences, social posts, ad copy, short-form video scripts, and content calendars. Use as the orchestration layer for multi-channel product launches. Use when planning or executing a multi-channel product launch, or producing landing page, email, social, or ad copy.