Blog

Tip 17. Interfaz usuario: Ley de Fitts

Diseña la interfaz para que sea cómoda

En este post os voy a explicar un poco más en profundidad cuales son las claves y algunos ejemplos para que veamos como lo podemos aplicar en una interfaz.

Antes de nada debemos tener claro el concepto de “Carga”, os cuento una historia!:
Imagina que has decidido poner una tarea en la Agenda V7 al Dpto de Sistemas, porque inexplicablemente, a tu teclado no le funcionan algns tclas. Al hacer ese acto, tendrás que pensar y recordar ciertos elementos (cognición), mirar unos elementos en pantalla (visuales) y pulsar inputs, botones y desplegables, moviendo el ratón y escribiendo en el teclado usando tu mano derecha (motores) si eres diestro.

Estos tres elementos se denominan cargas: cognitivas, visuales y motoras. Cada una de estas cargas requieren un nivel de recursos mentales por tu parte. No todas las cargas son iguales: las cargas cognitivas son las que más recursos consumen, luego las visuales y por último las que menos consumen son las motoras.

La Ley de Fitts tiene mucho que ver con la ergonomía, midiendo la eficiencia de las cargas motoras, que son las menos “costosas”. Aun así, si queremos reducir las cargas motoras, la Ley de Fitts nos dice que debemos asegurarnos de que los elementos objetivo sobre los que tiene que hacer clic el usuario, no deben ser pequeños ni estar demasiado lejos entre ellos.

La Ley de Fitts se expresa con una fórmula (ilustrado en la figura) que calcula el tiempo en alcanzar un objetivo, dependiendo este tiempo de una relación entre la velocidad, la el tamaño del objetivo y la distancia.

Tip17-grafico

Claves

  • Sobre las cargas motoras debes saber que si la tarea del usuario es más de ratón, trata de mantener al usuario con el ratón la mayor parte del tiempo, pero si la tarea a realizar por el usuario requiere introducir muchos datos, trata de mantener al usuario lo más posible con el teclado (teclas aceleradoras).
  • Los objetos “objetivo” (iconos, botones, inputs, etc…) deben ser lo suficientemente grandes para que los usuarios los alcancen con facilidad.
  • Los bordes y esquinas de la pantalla son particularmente fáciles de alcanzar porque el puntero queda en el borde independientemente de cuánto más se mueva el ratón.
  • Los menús popup pueden ser usados más rápidamente que los pull-down (menus desplegables), al ahorrar desplazamiento el usuario.
  • Los 5 pixeles de acceso más rápido desde el centro de la pantalla para un usuario diestro son; 1 el punto donde se encuentra (usado por los menu emergentes), 2 esquina inferior derecha (posición estándar de los botones aceptar), 3 esquina superior izquierda, 4 esquina superior derecha y 5 esquina inferior izquierda.
  • Al interactuar con un ordenador, el usuario tiende a «seguir» el puntero del ratón.
  • Los objetos más fáciles de alcanzar el destino son los más cercanos a la posición actual del ratón y con una relación de tamaño adecuado.
  • Tener en cuenta el eje (horizontal o vertical) de movimiento. Si el movimviento es principalmente vertical, por ejemplo, será la altura del botón, y no su ancho, la medida a potenciar.

Algunos ejemplos

Ejemplo 1

Tip17-1

Tip17-2

Ejemplo 2

Tip17-3

Tip17-4

Ejemplo 3

Tip17-5

Referencias

Matematizando interfaces
Wikipedia Ley de Fitts
Diseño de Interfaces
A Quiz Designed to Give You Fitts
Los enlaces y la ley de Fitts
Ley de Fitts: la piedra angular del diseño de interacción web
Diseño inteligente 100 cosas sobre la gente que todo diseñador debe saber

One thought on “Tip 17. Interfaz usuario: Ley de Fitts

Dejar un comentario