design-motion

Plugin design-motion from marketplace bjorn-dev-skills in BjornMelin/dev-skills. Commands read from the repo's manifest — 28 days ago.

Skills (2)

• design-motion-audit

  Audits a repo, route, screen, or 3D scene for motion quality, covering design-token consistency, frame-rate and draw-call risk, reduced-motion coverage, and accessibility. Use to audit, critique, or find motion gaps. Returns a prioritized punch list rather than implementing fixes.

• r3f-scene-polish

  Art-directs an existing three.js or React Three Fiber scene to cinematic quality with postprocessing, HDRI and PBR lighting, contact shadows, transmission materials, and camera choreography. Use for look-development once the scene renders, not for scene setup or lifecycle.

Subagents (7)

• motion-design-director

  Use for creative direction, design-system motion grammar, branded choreography, premium UI polish, Awwwards-level experience strategy, and deciding what motion should exist before implementation.

• motion-performance-auditor

  Use for STATIC, code-level auditing of animation jank, R3F frame loops, draw calls, WebGL GPU budgets, Reanimated UI-thread safety, worklet usage, layout thrashing, reduced motion, accessibility, and production readiness. Does not drive a running app — for runtime/browser proof (real FPS, blank-canv

• motion-qa-reviewer

  Use for final QA of design motion work, acceptance criteria, manual verification, edge cases, reduced-motion validation, accessibility checks, and launch readiness.

• motion-runtime-verifier

  Use to PROVE motion works at runtime, not just statically — drive a running app in a real browser to confirm a 3D scene renders (non-blank canvas), interactions respond, motion holds its frame budget, and reduced motion is honored. Reaches for playwright-cli + MotionScore when available and degrades

• motion-token-systems-integrator

  Use for motion tokens, design token architecture, CSS variables, TypeScript constants, Tailwind theme integration, Reanimated spring constants, R3F scene constants, and replacing hardcoded animation values.

• r3f-scene-architect

  Use for three.js, React Three Fiber, Drei, WebGL, GLB, shaders, PBR materials, lighting, camera choreography, postprocessing, particles, scroll-driven 3D, and performance-safe 3D implementation.

• reanimated-ios-motion-engineer

  Use for Expo (iOS and Android), React Native Reanimated, Gesture Handler, shared values, worklets, withSpring, withTiming, layout transitions, bottom sheets, cards, tabs, carousels, scroll headers, and native touch physics.

Similar plugins