Skip to main content

Auditoría diaria del sistema de diseño

Programa a Devin para que analice los PR ya integrados y señale colores codificados de forma fija y tokens faltantes.
AuthorCognition
CategoryAutomatizaciones
FeaturesProgramaciones, Integraciones
1

Permite que Devin aprenda tu sistema de diseño

El escáner solo es tan bueno como las reglas con las que compara. En lugar de escribir tú mismo las entradas de Knowledge, dirige Advanced Devin a los archivos fuente de tu sistema de diseño y deja que genere Knowledge automáticamente.Abre Advanced Devin y pega un prompt como este:Devin lee los archivos fuente, extrae las reglas y crea entradas de Knowledge como estas:
  • Color tokens — “Todos los colores deben usar tokens de src/tokens/colors.ts. Nunca uses valores hexadecimales directos como #3B82F6. Usa colors.primary.500 en su lugar.”
  • Spacing grid — “Todo el espaciado debe seguir nuestra cuadrícula de 4 px. Usa los tokens de espaciado de src/tokens/spacing.ts (por ejemplo, spacing.2 = 8px, spacing.4 = 16px). Nunca escribas valores de píxeles fijos como margin: 10px.”
  • Component library — “Usa siempre los componentes compartidos de src/components/ui/ — incluidos <Button>, <Avatar>, <Modal> y <Card>. No crees alternativas puntuales.”
Revisa las entradas generadas en Settings > Knowledge y ajusta cualquier redacción o disparador antes de continuar.
2

Conectar Linear para crear tickets

El escaneo diario crea tickets de Linear por cada infracción que detecta, así que asegúrate de conectar Linear antes de configurar la planificación.
  1. Ve a Settings > Integrations > Linear y haz clic en Connect
  2. Autoriza a Devin y selecciona los equipos a los que debería tener acceso
  3. En Linear, crea un proyecto llamado “Design Debt”
  4. Crea una etiqueta llamada “design-fix” — la usarás para activar las correcciones automáticas en el último paso
Consulta la integración con Linear para obtener la guía completa de configuración.
3

Programar el análisis diario

Navega a Settings > Schedules y haz clic en Create schedule. Configúralo de la siguiente manera:
  • Name: Design system scanner
  • Schedule type: Recurring
  • Frequency: Daily at 9:00 AM (zona horaria de tu equipo)
  • Agent: Devin
  • Email notifications: Always (para que veas los resultados cada mañana)
Pega esto como prompt:También puedes crear esto directamente desde el cuadro de entrada: escribe tu prompt, haz clic en el menú de tres puntos (⋯) y selecciona Schedule Devin. Consulta Scheduled Sessions para más detalles.Cada mañana, después de que se ejecute el escaneo, encontrarás tickets como estos en tu proyecto Design Debt:
TicketFileViolationSuggested fix
DD-101src/pages/Settings.tsx:42Hardcoded #3B82F6Reemplazar con colors.primary.500
DD-102src/components/UserCard.tsx:18Custom avatar componentUsar <Avatar> de src/components/ui/
DD-103src/pages/Dashboard.tsx:95margin: 10pxUsar spacing.3 (12px, valor más cercano en la cuadrícula de 4px)
DD-104src/views/Profile.tsx:33No mobile breakpointAgregar breakpoint md: para el grid layout
4

Cierra el ciclo con PRs de corrección automática

Una vez que confíes en el resultado del escáner, modifica el prompt para que Devin corrija las infracciones en la misma ejecución, sin necesidad de un disparador separado. Añade un paso de corrección al final de tu prompt de escaneo:Ahora todo el ciclo se ejecuta de forma automática: escaneo → ticket + PR de corrección → revisión. Cada mañana, tendrás tanto los reportes de infracciones como los PR que las corrigen.Para generar un resumen semanal de todas las infracciones encontradas, ejecuta esto como seguimiento: