¿Por qué revisar las leyes del UX en 2025?
La IA generativa y las nuevas tecnologías no invalidan las leyes clásicas del UX, pero sí cambian radicalmente el contexto en el que las aplicamos. Ya no diseñamos solo pantallas estáticas: diseñamos conversaciones, sistemas que aprenden, experiencias multimodales (voz, gesto, imagen) y flujos donde la respuesta puede ser creada al instante por un modelo. Desde Micelia.net vemos que las leyes siguen siendo una brújula válida, siempre que las reemplacemos en su nuevo mapa: accesibilidad primero, sostenibilidad realista y ética algorítmica aplicada.
“Las mismas leyes, otro terreno de juego: del clic esperado al diálogo impredecible.”
— Equipo Micelia.net
¿Qué ha cambiado exactamente?
- Interacción conversacional y multimodal: el objetivo ya no es solo un botón; puede ser una frase, un gesto o una imagen.
- Respuestas generadas en tiempo real: más variabilidad exige consistencia de patrones y explicabilidad para mantener confianza.
- Personalización continua: los microcontextos cambian la interfaz sobre la marcha; hay que equilibrar control del usuario y automatización.
- Coste computacional: la IA trae latencia y consumo energético; el diseño debe contemplar rendimiento y huella como parte de la experiencia.
- Accesibilidad ampliada: voz, lectores de pantalla, contraste, subtítulos y descripciones deben convivir con resultados dinámicos.
- Marco ético y normativo en evolución: transparencia, consentimiento y gestión del sesgo son requisitos de diseño, no anexos legales.
¿Qué permanece vigente?
- Claridad, jerarquía y feedback inmediato: siguen reduciendo carga cognitiva.
- Patrones familiares: disminuyen curva de aprendizaje aunque la respuesta la produzca un modelo.
- Control y reversibilidad: permitir deshacer, revisar o auditar lo que la IA propuso.
¿Cómo lo abordarlo?
- Reinterpretar cada ley con tres lentes: accesibilidad, sostenibilidad y responsabilidad algorítmica.
- Diseñar para variabilidad (lo que la IA genera) sin perder consistencia (lo que la persona espera).
- Optimizar rendimiento y consumo (modelos ligeros, edge, estados skeleton) como parte del UX, no como tarea técnica aparte.
En Micelia Estudio de Diseño aplicamos los principios del UX en productos digitales reales –desde apps de naturaleza hasta chats de IA generativa– y hemos comprobado que cada ley sigue vigente, pero necesita un lenguaje más cercano, ejemplos cotidianos y un criterio planet-centric para reducir coste cognitivo y el coste ambiental. Vamos a desmenuzar las leyes más importantes del UX paso a paso, con problemas y soluciones que puedas adaptar mañana.
1. Ley de Fitts — Llega antes al objetivo
¿Qué dice, en palabras de andar por casa? Cuanto más grande o más cerca esté un objetivo, antes lo pulsas. No es magia: es motor + ojo + distancia.
¿Por qué importa la Ley de Fitts en los proyectos de IA?
Aunque uses voz o gestos, siempre acabas confirmando algo en pantalla. Para personas con movilidad reducida o en pantallas pequeñas, el tamaño y la proximidad siguen siendo clave.
Accesibilidad y mirada planet-centric
- Accesibilidad: objetivos táctiles ≥ 44×44 px, estados de foco visibles, y alternativas por voz/teclado.
- Planeta: menos pasos = menos llamadas al servidor, menos inferencias del modelo y menos energía.
Ejemplo: Donación guiada por IA en una ONG
- Problema: el flujo tenía varios pasos pequeños (importe, periodicidad, método), dispersos en la pantalla; en móvil, costaba acertar.
- IA: un asistente predictivo sugiere importe y periodicidad según contexto (país, campaña, histórico).
- Solución: un botón flotante grande “Donar ahora” abre un panel compacto con 1–2 opciones ya preseleccionadas por la IA y confirmación con un toque.
- Accesibilidad: objetivo ≥ 44×44, foco visible, voz (“Donar 10 euros”), etiquetas ARIA claras.
- Planeta: menos pasos → menos peticiones al servidor. Cacheamos recomendaciones durante la sesión.
2. Ley de Hick — Menos opciones, decisiones más rápidas
La idea, sin fórmulas raras: más opciones = decisiones más lentas. Nuestro cerebro se satura.
¿Qué cambia de la Ley de Hick con la IA?
La IA puede reducir opciones según contexto, pero debemos explicar por qué prioriza (transparencia) y ofrecer salida accesible.
Accesibilidad y mirada planet-centric
- Accesibilidad: modo “enfoque” con 3–4 opciones visibles; navegación por teclado y compatibilidad con lectores.
- Planeta: menos consultas y menos re-cálculos en tiempo real. Menú corto, carga corta.
Ejemplo: Recomendador de rutas en una app de ecoturismo con IA
- Problema: 40 rutas visibles de inicio saturaban; muchas eran irrelevantes para la persona.
- IA: modelo de recomendación prioriza 3 rutas según estación, accesibilidad del terreno y transporte público cercano.
- Solución: portada con tres tarjetas (“Cerca y accesible”, “Con transporte público”, “Observación de aves hoy”) y un botón “Ver todas” opcional.
- Accesibilidad: modo “enfoque” con 3 opciones, navegación por teclado, lectura fácil.
- Planeta: priorizar rutas con transporte público reduce huella de desplazamiento.
3. Ley de Miller — Agrupa en bloques digeribles (7 ± 2)
¿Qué significa eso de 7 ± 2? Tu memoria de trabajo maneja bien alrededor de 7 “bloques”. Si le das 15 de golpe, se bloquea.
IA + accesibilidad
La IA puede resumir y capar la complejidad por capas (resumen → detalle bajo demanda).
Accesibilidad y mirada planet-centric
- Accesibilidad: “lectura fácil”, subtítulos y resúmenes por voz.
- Planeta: textos condensados = menos ancho de banda; carga progresiva de detalles.
Ejemplo: Triage de síntomas en un chat sanitario con IA
- Problema: lista de 15 preguntas clínicas seguidas; abandono alto.
- IA: NLU convierte el relato libre en 5 bloques (“dolor”, “fiebre”, “inicio”, “medicación”, “antecedentes”).
- Solución: el chat devuelve un resumen en 5 pasos editable antes de enviar a un profesional; detalles se despliegan bajo demanda.
- Accesibilidad: resumen con botón “escuchar”, contrastes AA, campos bien etiquetados.
- Planeta: enviar un resumen compacto reduce bytes y re-cálculos en backend.
4. Ley de Jakob — Usa patrones familiares
De forma sencilla: Si un patrón se parece a lo que ya conoces, aprendes antes.
Ley de Jakob IA
No reinventes el chat. Usa convenciones (entrada de texto + botón enviar + micrófono), y deja que aprenda la IA, no la persona.
Accesibilidad y mirada planet-centric
- Accesibilidad: estructura semántica estable para lectores de pantalla, atajos consistentes.
- Planeta: reutilizar componentes = menos desarrollo, menos pruebas y menos despliegues.
Ejemplo: Chat cultural con IA como guía de museo
- Problema: cada sala tenía comandos distintos (“Explorar”, “Saber más”, “Detalles de autor”). Curva de aprendizaje innecesaria.
- IA: orquestador de intents que entiende “¿Quién pintó esto?” o “Cuánto dura la visita” en cualquier sala.
- Solución: patrón único de chat (campo + enviar + micrófono) y la IA adapta la respuesta al contexto de la sala.
- Accesibilidad: comandos por voz y por texto, transcripciones y subtítulos de audios.
- Planeta: un solo patrón y componentes reutilizados reducen desarrollo y pruebas.
5. Ley de Tesler — La complejidad se reubica, no desaparece
Dicho de otra forma: La complejidad no desaparece; la colocas donde menos duele.
IA + sostenibilidad
Procesa lo pesado cuando y donde convenga (diferido, edge) y cuéntalo con lenguaje claro.
Ejemplo: Declarador fiscal con IA para autónomos creativos
- Problema: 50 campos visibles, validaciones lentas y confusas.
- IA: motor de reglas y extracción desde facturas (OCR + IA) precalcula deducciones.
- Solución: preguntas adaptativas (se muestran solo las necesarias) y panel “Cómo lo calculé” con explicación paso a paso. Cálculos pesados en batch nocturno.
- Accesibilidad: lectura fácil del cálculo, estados de error claros, foco bien gestionado.
- Planeta: trabajos batch en horas valle; cache de resultados para evitar recomputar lo mismo.
Ejemplos
- Calculadora fiscal para autónomos creativos (institucional)
Problema: 50 campos a la vista; pánico.
Solución: preguntas adaptativas (la IA oculta lo irrelevante) + panel transparente “Cómo calculo tu cuota”. Efecto: menos errores, menos tiempo en pantalla. - App de naturaleza
Problema: identificación offline muy lenta.
Solución: foto local → subida diferida → notificación con resultado. Entrenamiento y batch nocturnos con energía renovable. Efecto: experiencia fluida y menor huella.
6. Ley de Prägnanz (Gestalt) — Estructuras simples, significado claro
El cerebro prefiere lo simple y los grupos lógicos.
IA en dashboards
El clustering agrupa señales en pocas tarjetas con significado.
Accesibilidad y mirada planet-centric
- Accesibilidad: etiquetas claras, contraste AA/AAA, no depender solo del color.
- Planeta: visualizaciones comprensibles evitan recargas y rondas extra de análisis.
Ejemplo: Dashboard de calidad del aire con IA
- Problema: 12 métricas crípticas en una tabla; nadie entendía la situación real.
- IA: clustering agrupa variables en 3 conceptos: “Partículas”, “Gases”, “Ruido”.
- Solución: tres tarjetas con tendencia (mejora/empeora) y explicación: “Gases altos, ventila o evita ejercicio intenso”.
- Accesibilidad: no dependemos solo del color; iconos + texto; lector de pantalla describe los grupos.
- Planeta: una vista clara evita recargas y peticiones extra.
7. Efecto Von Restorff (Aislamiento) — Lo que destaca, se recuerda
Lo que resalta, se recuerda. Si todo grita, nada importa.
IA para alertas responsables
Menos notificaciones, más relevancia. Prioriza y eleva solo lo crítico.
Accesibilidad y mirada planet-centric
- Accesibilidad: icono + texto + patrón vibratorio opcional; nada de color como único indicador.
- Planeta: menos “pings” inútiles, menos sesiones reabiertas y recomputadas.
Ejemplo: Detección de fraude en wallet de ONG con IA
- Problema: demasiadas alertas; las críticas se perdían entre las triviales.
- IA: modelo de anomalías puntúa el riesgo y solo eleva casos de umbral alto.
- Solución: una alerta ámbar con icono, texto claro y vibración opcional; pide doble confirmación biométrica en alto riesgo.
- Accesibilidad: mensajes no dependen del color; hay texto y descripciones.
- Planeta: menos notificaciones → menos sesiones reabiertas y recomputadas.
8. Principio 80/20 (Pareto) — Pocas funciones, gran valor
Un puñado de funciones aporta casi todo el valor.
IA para limpiar funciones fantasma
Analiza logs, detecta lo que nadie usa y sugiere retiro o fusión.
Accesibilidad y mirada planet-centric
- Accesibilidad: menos “ruido” visual y cognitivo; navegación más directa.
- Planeta: eliminar código muerto reduce tamaño de la app, despliegues y consumo.
Ejemplo: Generador de arte con IA
- Problema: 25 estilos y 30 sliders; la gente usaba siempre 3–4 presets.
- IA: análisis de uso identifica funciones “fantasma”.
- Solución: interfaz con top-3 presets y buscador; sliders avanzados detrás de “Más opciones”.
- Accesibilidad: foco secuencial limpio, etiquetas, valores por defecto sensatos.
- Planeta: menos controles renderizados y menos renders “prueba y error” reducen tiempo de GPU.
9. Umbral de Doherty — < 400 ms o feedback inmediato
¿En qué consiste? Si la interfaz responde en < 0,4 s, sentimos flujo; si tarda, sube la frustración.
IA práctica
Precargar con modelos ligeros y mostrar skeletal screens honestos.
Accesibilidad y mirada planet-centric
- Accesibilidad: feedback inmediato (texto y aria-live) reduce ansiedad; animaciones discretas y opcionales.
- Planeta: prioriza inferencias locales cuando baste; evita llamadas de ida y vuelta.
Ejemplo: Editor de vídeo en la nube con copiloto de IA
- Problema: aplicar transiciones tardaba ~2 s; la persona perdía el ritmo creativo.
- IA: modelos ligeros en el edge que anticipan las 5 transiciones típicas y precalculan vistas previas.
- Solución: respuesta instantánea; si hay algo más pesado, mostramos skeleton y texto “Procesando en segundo plano”.
- Accesibilidad: aria-live con estado de progreso, posibilidad de pausar animaciones.
- Planeta: edge reduce tráfico y picos en el data center.
10. Ley de Postel — Tolerante con la entrada, estricto con la salida
Sé flexible con lo que recibes y riguroso con lo que entregas.
IA + accesibilidad
Entiende errores, dialectos y sinónimos; devuelve HTML semántico, alternativas textuales y contenido compatible con WCAG 2.2.
Accesibilidad y mirada planet-centric
- Accesibilidad: validaciones amables, mensajes claros, ejemplos de formato.
- Planeta: validar en cliente evita viajes inútiles al servidor.
Ejemplo: Buscador de trámites ambientales con IA
- Problema: “permisos plàstico” (acento grave) o “PLASTICO” devolvían cero resultados.
- IA: normalización semántica (sinónimos, errores, mayúsculas/minúsculas).
- Solución: el buscador entiende variaciones (“plástico”, “envases”), pero devuelve HTML semántico, headings ordenados y resultados con etiquetas accesibles.
- Accesibilidad: ejemplos de búsqueda, mensajes de error claros, soporte por voz.
- Planeta: validación en cliente evita idas y vueltas al servidor.
Checklist práctico (añádelo a tu README)
- Fitts: ¿Botones “gorditos” y a mano? ¿Confirmaciones en 1–2 toques?
- Hick: ¿Menos de 5 opciones clave visibles? ¿Explicas por qué prioriza la IA?
- Miller: ¿Información en bloques digeribles con resumen/voz?
- Jakob: ¿Patrones familiares y consistentes en todo el sistema (también por voz)?
- Tesler: ¿Dónde vive la complejidad? ¿Transparencia del cálculo?
- Prägnanz: ¿Agrupaciones claras con etiquetas y contraste AA/AAA?
- Von Restorff: ¿Alertas solo críticas y multimodales (icono+texto+vibración)?
- 80/20: ¿Has retirado funciones fantasma y código muerto?
- Doherty: ¿<0,4 s o feedback inmediato honesto?
- Postel: ¿Entrada tolerante, salida accesible y validada?
Mini-guía planet-centric para productos con IA
¿Cómo reducimos la huella sin sacrificar experiencia?
- Menos inferencias, más caching: si la recomendación no cambia, guarda resultados.
- Modelos ligeros primero: usa el grande solo cuando aporte valor diferencial.
- Edge cuando tenga sentido: latencia baja, tráfico menor.
- Medios optimizados: imágenes en AVIF/WebP, bitrate adaptativo, subtítulos por defecto.
- Estados off-line útiles: no obligues a recalcular si no hay red.
- Medición continua: bytes servidos, tiempos de inferencia, consumo de CPU/GPU, abandonos.
“Diseñar con IA es sembrar instrucciones; diseñar de forma planet-centric es podar lo superfluo para que todo lo demás crezca mejor.”
¿Cómo lo integro en mi proyecto desde mañana?
- Haz una auditoría de accesibilidad rápida con esta lista práctica: 50 criterios de accesibilidad en WordPress.
- Mide tu base de sostenibilidad y rendimiento y define objetivos: te orienta la Guía completa para diseñar webs sostenibles
- Reescribe un flujo clave aplicando las 10 leyes (elige donación, checkout, alta o primer uso en tu chat de IA).
- Documenta decisiones: por qué la IA recomienda X, cómo se agrupa la información, cuándo se recalcula.
¿Seguimos?
Si te apetece, revisamos juntes un flujo de tu web o app y te proponemos mejoras concretas con estas leyes, formato “antes → después”. En Micelia nos mueve un diseño que sirve a las personas y al planeta. ¿Por dónde empezamos?
Recomendado: para ampliar el enfoque sostenible, revisa nuestra Guía completa para diseñar webs sostenibles con WordPress y cómo la carga cognitiva también es ecológica en este artículo: Diseño UX y sostenibilidad digital. Si te preocupa la infraestructura, mira por qué importa el alojamiento web y repasa los 50 criterios de accesibilidad en WordPress.