Leyes de UX, con demos

No se memorizan: se sienten. Prueba cada demo y mira el número.

Ley de Fitts

Mientras más grande y cerca el objetivo, más rápido se alcanza.

El tiempo para tocar algo depende de la distancia y del tamaño. Por eso los botones de móvil miden al menos 44 px y las acciones principales van al alcance del pulgar.

Regla: alvo táctil mínimo 44 px, con 8 px de separación. Las acciones frecuentes, abajo en móvil.
56 px
Toca el círculo 8 veces.

Ley de Hick

Más opciones, más tiempo para decidir.

El tiempo de decisión crece con la cantidad de opciones. No las quites sin pensar: agrúpalas, ordénalas y revela por etapas.

Regla: máximo 5 o 7 opciones por nivel. Si hay más, agrupa en categorías o agrega búsqueda.
24
Encuentra "Informes".

Ley de Miller

Recordamos unos 7 elementos a la vez.

Dividir en grupos (chunking) hace legible lo largo: teléfonos, RUT, tarjetas, códigos.

Regla: formatea valores largos en bloques de 3 o 4. Un código de 12 caracteres se lee en 3 grupos.
Sin agrupar
Agrupado

Umbral de Doherty

Bajo 400 ms la app se siente instantánea.

Si no puedes ser rápido, parece rápido: muestra el resultado al tiro (optimista) o da progreso inmediato. Un silencio de más de 1 segundo rompe el flujo.

Regla: feedback visual en menos de 100 ms. Más de 1 s: spinner o skeleton. Más de 10 s: barra de progreso con estimado.
1200 ms

Ley de Postel

Sé flexible con lo que recibes, estricto con lo que entregas.

Acepta el RUT con puntos, sin guion o en minúscula y guárdalo siempre en un solo formato. Menos errores, menos frustración.

Regla: normaliza en vez de rechazar. Solo muestra error cuando de verdad no se puede interpretar.
Lo guardamos como:
Esperando...

Gradiente de meta

Mientras más cerca de la meta, más ganas de terminar.

Una barra que empieza con avance regalado (por ejemplo "perfil 1 de 4 listo") motiva más que una en cero. Es el efecto de progreso dotado.

Regla: muestra el progreso total desde el principio y regala el primer paso (nombre ya cargado, cuenta creada).
Empieza en cero
Con un paso regalado

Efecto Von Restorff

Lo distinto se recuerda.

Si todo destaca, nada destaca. Reserva el color más fuerte para la acción que quieres que elijan.

Regla: un solo botón primario por vista. El resto, secundario. Recomendado = el plan destacado.
Básico$29
Equipo$79
Empresa$199

Ley de proximidad

Lo cercano se percibe como un grupo.

El espacio comunica relación. Dos filas de tres se leen como dos grupos solo si el espacio entre grupos es mayor que dentro de ellos.

Regla: espacio dentro del grupo 8 px, entre grupos 24 px o más. Un label siempre pegado a su campo.
16 px

Reglas de la casa