Usa IA para evaluar y mejorar tus diseños de UI/UX identificando barreras de accesibilidad visual, cognitiva y motora, y asegurando representación diversa en ilustraciones y recursos gráficos.
Cuándo usarlo: Evaluación DEI de diseños UI/UX para garantizar accesibilidad e inclusión
Herramienta recomendada: Claude
Eres un diseñador UX/UI especializado en diseño inclusivo y sistemas de diseño accesibles. Voy a compartirte información sobre un proyecto de diseño para que lo evalúes desde la perspectiva de diversidad, equidad e inclusión (DEI). Datos del proyecto: - Tipo de producto: [aplicación web, app móvil, dashboard, landing page, etc.] - Audiencia objetivo: [describir segmentos, edades, contexto cultural, etc.] - Sistema de diseño base: [Material, Ant Design, propio, ninguno] - Paleta de colores actual: [describe o pega los HEX principales] - Estado del proyecto: [wireframes, mockups, prototipo, producción] Desarrolla una evaluación y guía de mejoras en estas áreas: 1. ACCESIBILIDAD VISUAL - Analiza si el contraste entre texto y fondo cumple WCAG AA (mínimo 4.5:1 para texto normal, 3:1 para texto grande) - Identifica si la información se transmite únicamente mediante color (señales de error, estados, diferenciación de elementos) - Evalúa el tamaño de fuente, interlineado y espaciado para usuarios con baja visión - Revisa la legibilidad en pantallas de baja resolución o modos de alto contraste - Comprueba si existe modo oscuro y si es accesible 2. ACCESIBILIDAD COGNITIVA - Evalúa la complejidad del lenguaje en etiquetas, botones y mensajes de error (objetivo: nivel B1 de comprensión) - Detecta interfaces sobrecargadas de información que dificulten la concentración - Revisa si los flujos de usuario tienen demasiados pasos sin retroalimentación clara - Propón microcopies más simples e inclusivos para los elementos de UI identificados 3. ACCESIBILIDAD MOTORA - Revisa si los elementos interactivos tienen tamaño mínimo de 44x44px (recomendación Apple/Google) - Identifica elementos difíciles de usar con control por voz o switch access - Evalúa si los gestos complejos (swipe, pinch) tienen alternativas accesibles 4. REPRESENTACIÓN E INCLUSIÓN VISUAL - Propón criterios para seleccionar o crear ilustraciones, avatares e imágenes de personas que representen diversidad de género, etnia, edad, cuerpo y capacidad funcional - Detecta iconografía que refuerce estereotipos culturales o de género - Sugiere recursos de ilustración y fotografía de stock con enfoque inclusivo (bibliotecas, comunidades) 5. DISEÑO INTERCULTURAL - Identifica elementos de diseño que puedan tener significados diferentes según cultura (colores, símbolos, gestos, dirección de lectura RTL/LTR) - Propón cómo adaptar el diseño para mercados hispanohablantes con matices culturales diversos 6. SISTEMA DE DISEÑO INCLUSIVO - Define tokens de diseño mínimos para garantizar accesibilidad consistente: tamaños de tipografía, colores de foco, estados de componentes - Propón un checklist de revisión DEI para nuevos componentes antes de incorporarlos al sistema Devuelve los resultados organizados por severidad y con recomendaciones concretas listas para implementar en Figma, código CSS o el sistema de diseño elegido.