Communitygithub.com

QA de Movimiento en Portafolio

Revisar o implementar animaciones de IU de portafolio contra un sistema de movimiento existente, incluyendo restricciones de movimiento reducido, teclado, rendimiento y diseño adaptable.

¿Qué es QA de Movimiento en Portafolio?

Este skill guía a los agentes de IA para revisar y garantizar la implementación correcta de animaciones en sitios web de portafolio, basándose en un sistema de movimiento preexistente. Su propósito es asegurar que las animaciones solo se utilicen cuando aporten un valor claro a la jerarquía, orientación, retroalimentación, secuencia o continuidad de la interfaz, evitando movimientos superfluos o costosos. Es útil para desarrolladores y diseñadores que desean mantener un rendimiento óptimo, accesibilidad (incluyendo soporte para movimiento reducido y navegación por teclado) y coherencia visual en sus proyectos. Funciona inspeccionando primero las reglas y primitivas de movimiento del proyecto, aplicando reglas de decisión que priorizan propiedades como opacidad y transformación sobre animaciones costosas, y validando el comportamiento en múltiples estados y dispositivos.

Compatible con~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/husheng-web/personal-website-skills/tree/HEAD/skills/portfolio-motion-qa

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

¿Qué hace QA de Movimiento en Portafolio?

Usa movimiento solo cuando aclare la jerarquía, orientación, retroalimentación, secuencia o continuidad.

Inspeccionar primero

Lee las reglas de movimiento del proyecto, la fuente de tokens y las primitivas de movimiento existentes. Reutiliza sus semánticas y duraciones en lugar de agregar una escala independiente o una nueva biblioteca de animación.

Reglas de decisión

  • Mantén el contenido de lectura estático a menos que la animación proporcione un beneficio claro.
  • Prefiere opacidad y transformación; evita animación de diseño, bucles ambientales, secuestro de desplazamiento, escalonado de caracteres y transition: all.
  • Mantén el movimiento opcional: el movimiento reducido se resuelve inmediatamente y la operación del teclado nunca espera la animación.
  • Verifica que los estados hover y focus produzcan cambios de estado equivalentes; no dependas del comportamiento del puntero en dispositivos móviles.

Validar

Prueba los estados normal y de movimiento reducido, enfoque de teclado, diseño de escritorio/móvil y comportamiento de reproducción/salida cuando corresponda. Reporta la razón de cada elección de movimiento, su token/primitiva y cualquier desviación que requiera una decisión documentada del proyecto.

Individual skills in this repo

This repo contains 7 individual skills — each has its own dedicated page.

Skills relacionados