tentándote.com

UN CASO DE ESTUDIO

Hace poco estaba prototipando una interfaz que permitía al usuario gestionar las etiquetas asociadas a una imagen. Concretamente estaba pensada y diseñada para que el usuario pudiese llevar a cabo dos tareas:

• Borrar una etiqueta concreta
• Visualizar las imágenes asociadas a una etiqueta para, con posterioridad, añadir más etiquetas a dichas imágenes o realizar otras operaciones sobre ellas.

Después de un rato salieron dos opciones:

 

Alternativa A:

 

Alternativa B:

 

En la alternativa A las etiquetas se agrupan alfabéticamente por la primera letra. El objetivo es facilitar la búsqueda de una etiqueta concreta para lo que se recurre a una doble solución:

• Por un lado se utiliza el espacio en blanco para introducir una separación visual entre letras que sea lo suficientemente significativa para que rápidamente se perciba la “ruptura” de cada bloque,
• Por otro, se añaden las letras del alfabeto en mayúsculas, agrupando en conjuntos las etiquetas que empiezan por la misma. Con ello se pretende crear un punto focal sobre las letras mayúsculas de inicio de cada bloque para facilitar la búsqueda de las etiquetas una vez localizado rápidamente el grupo.

 

En la alternativa B por el contrario se eliminan las letras mayúsculas agrupadoras y se usa el espacio en blanco como único recurso para separar los conjuntos de etiquetas.

Aunque lo mejor para un escaneado más rápido y una lectura óptima es tener una sola columna con la relación de todas las etiquetas, se optó por distribuirlas en tres paralelas con el fin de evitar un excesivo scroll vertical.

El caso es que después de estar un rato mirándolas se me planteó la pregunta de cual de las dos opciones sería la mejor por usabilidad.

¿?

 

ATENCIÓN, LOCUS DE ATENCIÓN E IMPLICACIONES PARA LA USABILIDAD DE LAS INTERFACES

En su libro The Humane Interface (me encanta este libro y lo voy a seguir utilizando como fuente de inspiración para futuros posts) Jef Raskin reflexiona sobre dos conceptos que vienen al caso, la atención y el Locus de Atención.

En cuanto a la atención Fernández-Abascal, Dolores Martín y Domínguez Sánchez (1) (2009, p. 52) la definen como:

• Un estado de concentración en algo.
• Capacidad de procesamiento que puede distribuirse o compartirse en el tiempo entre las diversas tareas y estímulos que exigen atención.

Ahondando en la definición, Tejero (2) menciona que:

“La atención puede definirse como el mecanismo cognitivo mediante el que ejercemos control voluntario sobre nuestra actividad perceptiva, cognitiva y conductual, entendiendo por ello que activa/inhibe y organiza las diferentes operaciones mentales requeridas para llegar a obtener el objetivo que pretendemos y cuya intervención es necesaria cuando y en la medida en que estas operaciones no pueden desarrollarse automáticamente”.

Los procesos en los que media nuestra atención son procesos conscientes. La atención nos permite centrarnos en parte de la información que recibimos a través de nuestros órganos sensoriales y controla y orienta nuestra actividad de forma consciente para conseguir un objetivo concreto. Por el contrario hay ocasiones en que las tareas las llevamos a cabo guiadas por un hábito, las hacemos de forma automática o insconciente.

No obstante, ambos procesos, no se dan plenamente por separado sino que puede haber un cierto grado de interacción entre los mismos.

Un buen ejemplo es el el de escribir en el ordenador. Si hemos aprendido mecanografía ejecutamos esta acción de manera inconsciente. Una vez que posamos las manos sobre el teclado no sómos conscientes de dónde se encuentran posicionadas las teclas que corresponden a los caracteres del alfabeto. Cuando pensamos en una palabra nuestros dedos se mueven de manera automática presionando las que hagan falta y como resultado aparece la palabra en pantalla. El proceso de escribir está guiado por nuestro hábito adquirido a través de un proceso de aprendizaje. Y si el hábito está mal adquirido, los errores tenderán a repetirse.

Por el contrario,si tuviésemos que pensar en los caracteres que conforman una palabra determinada, por ejemplo -g-a-z-p-a-c-h-o- y decidiéramos escribirlos uno a uno, en el proceso entraría en juego nuestra consciencia: En tal caso las operaciones serían:

• ¿Cuál es el primer carácter de la palabra que estamos escribiendo? –> la “g”
• ¿Dónde está la tecla que se corresponde con el carácter “g”– > en la parte central del teclado, la localizamos –> y la presionamos continuando la tarea con el resto de caracteres en un proceso recursivo hasta completar la palabra.

Raskin sumariza las diferencias entre los procesos cognitivos conscientes e inconscientes de la siguiente forma (3):

Propiedad	Cognitivos conscientes	Cognitivos inconscientes
Guiados por	La novedad  Emergencias Peligro	Repetición  Eventos esperados Seguridad
Usados en	Nuevas circunstancias	Situaciones rutinarias
Puede manejar	Decisiones	Tareas no ramificadas
Admiten	Proposiciones lógicas	Lógica o incosistencias
Opera	Secuencialmente	Simultáneamente
Los controla	La voluntad	Hábitos
Capacidad	Pequeña	Grande
Persistencia durante	décimas de segundos	Décadas (toda la vida)

Por último, en cuanto al concepto de Locus de atención comenta que (4):

“Uso el término locus porque significa un lugar, o en el sitio. El término foco, que a veces se utiliza de forma similar, se puede entender como un verbo, por lo que transmite una falsa impresión sobre cómo trabaja la atención. Cuando uno está despierto y consciente, el Locus de Atención es una característica, un rasgo de, o un objeto en el mundo físico, o una idea sobre la que está pensando activamente y con atención”

¿Cómo influye la atención y el locus de atención en el desempeño de las tareas que acometemos cuando interactuamos con el ordenador?

Volvamos a la interfaces planteadas al principio del post.

Considerando el ejemplo A, cuando el usuario busca una etiqueta específica como por ejemplo “invertebrado” el locus de atención se centra en la búsqueda de palabras que empiecen por “i”. Este proceso lo ejecutamos en un primer momento de manera inconsciente. La separación de las etiquetas en grupos usando el espacio en blanco no interfiere con la tarea, no añade “ruido”, ni visual, ni cognitivo, sino más bien lo contrario, aporta una pista sutil y que, de manera insconsciente, nos ayuda a diferenciar unos grupos de otros rápidamente.

El problema se presenta cuando la persona se topa con la letra mayúscula que abre cada grupo de etiquetas. -¿?- -¿Qué es esto…?- piensa. En ese momento se rompe el proceso inconsciente al encontrarse el usuario con algo inesperado que le lleva a tener que razonar e interpretar lo que está viendo. A partir de ahí el proceso requiere de su consciencia y atención:

• ¿Una letra mayúscula? ¿? –> ha de interpretar que las letras mayúsculas agrupan conjuntos de etiquetas que empiezan por las mismas.
• A continuación pasa a preguntarse por qué letra empieza la etiqueta buscada –> por “i” –> pasa a buscar el grupo de la “I” mayúscula –>una vez que lo ha localizado –>
• ¿Qué etiqueta estaba buscando y cuál es el siguiente carácter de la misma? –> “invertebrados” –> busca la palabra invertebrados en el conjunto de etiquetas identificado.

El diseño con letras mayúsculas para separar los grupos de etiquetas rompre nuestro locus de atención e interfiere directamente con la acción que se está llevando a cabo.

La altenativa de diseño B es más óptima dado que se juega con los espacios en blanco y no se incluyen terceros elementos como las letras mayúsculas que desencadenen un proceso de razonamiento consciente. La mirada fluye de manera natural por el listado, los espacios en blanco organizan las letras marcando los diferentes conjuntos de etiquetas y el locus de atención no se rompe, siendo el proceso mucho más rápido. La interfaz es más óptima.

 

REPENSAR LA INTERACCIÓN Y LAS METÁFORAS DE LOS SISTEMAS OPERATIVOS: DECONSTRUIRLOS

Las metáforas que utilizamos para dar forma a, y modelar los espacios de información, y los procesos de interacción de los actuales sistemas operativos requieren de un importante esfuerzo por parte del usuario para comprenderlos o llevarlos a cabo.

Las interrupciones son parte inherente de cualquier actividad. No obstante podemos optimizar los flujos de interacción de los actuales sistemas operativos para disminuir el esfuerzo cognitivo necesario para realizar las tareas que ejecutamos con ellos.

Si quiero modificar una imagen que estoy viendo en el navegador antes, tengo que llamar a una aplicación para llevar a cabo dicha actividad rompiéndose nuestro locus de atención ¿Por qué tenemos que usar una “aplicación” para editar una imagen si mi tarea es modificar una imagen, no lanzar una aplicación? ¿? A continuación tengo que pensar qué aplicación he de utilizar para ello. Ésta podría ser por citar una Photoshop. La siguiente tarea para conseguir nuestro objetivo sería dilucidar cómo lanzarla ¿Tendría que acudir al escritorio o al menú de inicio? En el menú de inicio, en Windows ¿debería buscarla en el box de búsqueda o ir a la lista de “Todos los programas” para localizarla. Si opto por esta última opción… ¿bajo qué carpeta -grupo de programas- la encontraría? ¿Carpeta? ¿? ¿Por qué usamos la metáfora de una carpeta del mundo real para representar algo que guarda una “aplicación” utilizando la misma metáfora para agrupar aplicaciones y documentos? ¿? Cuando he localizado la carpeta con la aplicación tengo que hacer clic en el icono que la abre, esperar a que se abra lo cual lleva un tiempo variable de ¿15 – 40 segundos…? ¿más? con la consiguiente distracción del usuario hasta que se abre. A continuación he de abrir la imagen que previamente debería haber salvado en el disco duro haciendo clic con el botón derecho del ratón sobre la misma en el navegador, de seleccionar la “carpeta” donde guardarla, y de pulsar el botón “Guardar” del correspondiente cuadro de diálogo.

El proceso y el tiempo que media desde que el usuario decide modificar la imagen que está viendo en el navegador hasta que empieza a editarla puede ser de… ¿3 minutos? ¿5? El proceso de modificar la imagen que estamos viendo en un navegador se termina subdividiendo en multitud de tareas con constantes interrupciones para llevar a cabo toda la serie de pasos intermedios que finalmente nos permitan dar cumplimiento a lo que queremos.

Opciones del menú secundario que se abre al pulsar el botón derecho del ratón sobre el icono de una imagen en el escritorio de Windows 7. Un total de 27 tareas posibles sin contar las que hay detrás de los submenús como el de la opción “Abrir con” de la captura de la imagen. El usuario tiene que hacer el ejercicio de identificar cuál es la tarea adecuada para modifica la imagen: “Abrir” “Edita con Fireworks” “Editar” “Abrir con” > “Adobe Fireworks CS4″, “Adobe Photoshop CS4″,  “Microsoft Picture Manager”, “Paint”, “Snagit Editor” ¿Cuál elijo y a qué coste cognitivo? ¿?

De todas las opciones que se me ofrecen sólo me interesa una: la editar.

¿Cómo podemos diseñar interfaces más optimizadas? ¿Interfaces más orientadas al modelo mental de las personas y no condicionadas por las limitaciones impuestas por el software o el Sistema Operativo?

Una posible solución es lo que Donald Norman denomina”Informática basada en actividades” (Activity-Based Computing, ABC) (5) :

“La idea básica es sencilla: tener a mano todo el material necesario para una tarea, con poco o ningún esfuerzo mental”

Sencillo de explicar, muy difícil hacerlo realidad…

Al menos hasta hoy día sólo se ha conseguido en parte, y sólo ahora comienzan a verse interfaces más centradas en las personas que en la propia tecnología.

Captura de pantalla del “Control por voz” del iPhone
Ahora… ¡¡podemos hablar con nuestros móviles para decirles lo que queremos que hagan…!! Ya iba siendo hora de que por fin podamos comunicarnos por voz con un dispositivo pensado para hablar por voz con otras personas… y aún así… ¿por qué se rotula la pantalla como “Control por voz”?
¿Por qué no mejor algo como… ¿Qué quieres hacer?? ¿? … La complejidad se carga en la tecnología, no en la interfaz.
También se puede prescindir del botón de “Cancelar” dado que ya tenemos el propio del teléfono para volver a la “Home” o “escritorio”.

 

Todavía hoy estamos anclados por el paradigma de las interfaces de unas máquinas y unos lenguajes de programación conceptualizados hace tres décadas y unos modelos de negocio empresariales orientados a maximizar la obtención de beneficios económicos antes que el beneficio para las personas, ejemplo del cual, por citar tan sólo uno, es el actual modelo de aplicaciones que se ha desarrollado para los nuevos móviles “inteligentes”, una oportunidad de oro perdida para centrar de verdad la informática en donde tiene que estar centrada, en las personas, no en la forma de hacer dinero.

Norman (6) establece una jerarquía en los procesos que está conformada por (desde la más alta a las más bajas):

• Actividades: conjunto de tareas dirigidas a unos objetivos concretos -poner al día las cuentas de casa- -llamar a un amigo- son dos posibles ejemplos de actividades.
• Tareas: aquellos pasos que seguimos para llevar a cabo los objetivos subordinados de las actividades.
• Acciones: conjunto de operaciones que llevamos a cabo para ejecutar una tarea, por ejemplo, una operación al escribir una palabra puede ser teclear un carácter y la acción, escribir la palabra.

La Interfaz Humana (prefiero éste término al de Sistema Operativo, ajeno a las personas) ha de estar centrada en las actividades, no en las tareas. No en tener que pensar en qué programas o aplicaciones “estancas” necesito para llevarlas cabo.

No en algo llamado Mozilla Thunderbird sino en escribir un mensaje y en mandárselo a mi hermana.

Aza Raskin explica muy bien un nuevo modelo de negocio que podría convertirse en una alternativa al de la informática actual (que está basado en aplicaciones y programas, algo que entra en constante conflicto con nuestro modelo mental que tenemos como personas que somos) y que es igualmente viable desde un punto de vista económico y más centrado en las personas.

Un ejemplo de ello es la evolución que están sufriendo los navegadores. El navegador se está transformando en una capa que está envolviendo a los sistemas operativos convirtiéndolos en interfaces “más humanas” orientadas a responder nuestras actividades cotidianas:

• las necesidades de interrelación social -redes sociales –> Facebook, Tuenti-
• las necesidades de comunicación –> Twitter, Skype, Google Voice, GMail, Hotmail…-
• las de productividad -búsqueda y localización de información –> Google, Bing-
• para servirnos como memoria –>almacenamiento en la nube –> Google Docs, Dropbox-
• y para la recuperación, gestión y aprovechamiento de la información –> Google, Bing, Google Docs…

Y lo están empezando a hacer de forma bastante más eficaz que los sistemas operativos. Integrando todo ello en una interfaz deconstruida que se centraliza en un campo de entrada de texto que está dejando de ser “barra de navegación” para convertirse en “barra de interacción”:

La AwesomeBar HD permite seleccionar un comando para, a continuación, escribir la necesidad de información.
Pulsando a continuación retorno se ejecuta la acción (por ejemplo, se presenta la página de resultados de Amazon
con los títulos de los libros que coinciden con las palabras escritas

El binomio Web-navegador está reemplazando a los sistemas operativos por algo más cercano a nosotros y ha de seguir evolucionando.

Un posible camino para ello y hacia una interfaz más humana puede ser el proyecto en el que está trabajando MozillaLabs –> AwesomeBar HD que no es sino una pequeña adaptación de algo mucho más potente, Ubiquity, una metainterfaz que se sitúa por encima del sistema operativo y que se integra plenamente en el navegador. La comunicación tanto con la AwesomeBar HD como con Ubiquity se da mediante palabras escritas y comandos muy específicos aunque el día de mañana quizá podra darse también a través de la voz y en un lenguaje natural. Una interfaz como Ubiquity permitiría simplificar el proceso de editar una imagen para que fuese algo así como seleccionarla en el navegador, hacer clic en la barra de navegación, escribir “modificar”, y lanzar la interfaz en la misma ventana para llevar a cabo la acción. Compararlo con el anterior proceso descrito…

Desde un punto de vista cognitivo mucho mejor.

La AwesomeBar HD da continuidad al proyecto Ubiquity, un éxito tan rotundo y algo tan innovador e importante que posiblemente lo estarán desarrollando internamente. La AwesomeBar HD no es más que un vistazo a lo que veremos a medio plazo.

Google podría hacer algo similar y la verdad, es que es sorprendente que todavía no lo hayan hecho, evolucionar su interfaz para pasar de un buscador a un asistente personal que guíe al usuario en su interacción con la Web. Medio trabajo ya lo tienen hecho, la pregunta que deberían plantearse los ingenieros de Google es la de cómo podrían unificar las funcionalidades de los diferentes box de búsqueda-interacción de los distintos servicios que ofrecen: Gmail, Google Docs, Google Calendar, Google Translate… en el box del buscador principal.

Recuperar la idea del sistema operativo, ubicuo, multimodal y humano, vamos

Quizá mañana, Mozilla, Google, Microsoft o Apple vuelvan a sorprendernos.

Seguro que sí.

–O–

BIBLIOGRAFÍA:

1. Fernández Abascal, Enrique G.; Martín Díaz, María Dolores; Domínguez Sánchez; Javier. Procesos psicológicos. Madrid : Ediciones Pirámide, p. 52. ISBN 978-84-368-1605-1
2. – Ibid. p. 36.
3. Raskin, Jef. The Humane Interface: New directions for designing interactive systems. Boston : Addison Wesley, p. 16, ISBN: 0-201-37937-6
4. – Ibid. p. 17.
5. Norman, Donald. El ordenador invisible. Paidós : Barcelona, p. 101. ISBN 84-493-1089-X
6. –Ibid, p. 102.