Análisis de Software Web: Facebook

Para hacer un análisis de una pagina o herramienta web, utilizaremos la red social Facebook.

A lo largo de su historia, esta red social ha modificado en repetidas ocasiones su interfaz de usuario, recibiendo indefectiblemente con cada actulización una lluvia de criticas por parte de sus usuarios. Incluso  se han generado varias teorías que para explicar cambios, como por ejemplo que buscaba reducir el poder de los desarrolladores de aplicaciones externas, o que trataba de competir con Twitter como servicio de microblogging social. 

Nos centraremos para este análisis la versión actual de la interfaz de usuario.

El usuario tiene el control

En una interfaz web, el control por parte del usuario se vuelve un aspecto critico. Se debe buscarque el usuario sea un actor activo, no bombardeandolo con acciones no deseadas, pop-ups, publicidad, etc..

Facebook cuida mucho este aspecto. Como red social, uno de sus principales objetivos es que sus usuarios sean agentes activos, que participen y compartan información, por lo que cuidan que el usuario este contento y tenga el control sobre lo que hace: no se abren pop-ups, no se le redirecciona sin consentimiento (salvo errores),...

Metaforas

En si, toda la web es una metáfora a un "muro" o una hoja de papel donde se van apuntando noticias. Aparte de este detalle, se puede observar que la pagina usa de forma coherente aunque no intensa de las metáforas.

El interfaz es tan sobrio que prácticamente no precisa de metáforas organizativas, y usa metaforas visuales solo como apoyo a los distintos en laces de dirección.

Realimentación

 En las interfaces web, suele ser el navegador el encargado de ofrecer una realimentación al usuario, dado que, por norma general, las acciones en la interfaz son inmediatas y requieren poca realimentación, siendo los problemas en los servidores o retardos en la red los culpables de las pausas que pueden provocar dudas en el usuario.

Facebook, por su parte, ha incorporado ciertos elementos para reforzar la realimentación. Por ejemplo, en actualizaciones que requieren acceso a la base de datos, como actualizar las noticias de inicio, se muestra una acción de movimiento que indica al usuario que su acción esta siendo procesada.

Manipulación directa

Aquí se busca reducir el esfuerzo del usuario, permitiendo que las operaciones se hagan con mas rapidez y menores esfuerzos.

Aquí se observa como los diseñadores se han esforzado en crear una interfaz intuitiva y sencilla. Todas las acciones se pueden realizar mediante accesos cortos, claramente indicados y estructurados, de forma rapida y sencilla.

Coherencia

La coherencia en esta pagina esta muy bien cuidada. Como red social, esta orientada a incentivar al usuario a compartir información, y mostrar la información compartida por sus allegados. Se ahí que todos los ámbitos donde se implique este intercambio de información están marcadamente resaltados en esta versión del interfaz, relegando otras aplicaciones a zonas mucho menos visibles.

Integridad estética

La importancia de la integridad estética estriba en no descentrar al usuario de la información importante por cuestiones visuales (colores, tamaños, formas...) 

En el caso de Facebook, se observa se ha cuidado la integridad estética de la plataforma, ciñiendose a un esquema de color dominado por el blanco y azul, y aprovechandose de los principios de la percepción (principalmente de la pregnancia, la agrupación y la semejanza) para crear un interfaz bien estructurado pero ligero, que no sobrecargue ni desconcierte al usuario

Reversibilidad

La reversibilidad parte de la posibilidad de deshacer una acción. En Facebook, prácticamente todas las  acción puede deshacerse, y para aquellas que no, como por ejemplo la eliminación de un contenido, se solicita una confirmación por parte del usuario para mejorar la tolerancia al error y evitar acciones hechas por descuido.

Accesibilidad

La accesibilidad refiere a como se facilita el acceso a personas con capacidades reducidas. Aparte de ser una pagina con una interfaz bastante intuitiva y poco recargada, Facebook ofrece soporte a personas con capacidades reducidas, ofreciendo soporte a tecnologias de ayuda (lectores de pantalla, etc), versiones ligeras de la pagina sin javascript, soporte tecnico especializado...

Análisis de Software de Escritorio: Calibre

El software de escritorio a analizar es el Calibre, un software de gestión y conversión de libros electrónicos. Se trata de un software gratuito muy recomendado en multitud de foros dado a la cantidad de funcionalidades que presenta: conversión entre multitud de tipos de e-book, etiquetas, metadatos, caratulas...

Calibre versión 0.7.34

Pero pasemos a un análisis desde el punto de vista del Diseño de Interfaces:

El usuario tiene el control

Aquí partimos de la base de que debe ser el usuario el que tiene el control sobre las acciones que se realizan el el software, tomando un papel activo en su utilización, y no siendo un mero espectador.

En este software este principio se cumple con buen criterio. No se producen acciones que no sean activadas por el usuario, este tiene la capacidad de detener tareas que se automatizan (cuando se lanza la conversión en bloque de varios libros, por ejemplo).

Metaforas

Este software hace un correcto uso de metaforas tanto visuales como organizativas. Al tratarse de un gestor de libros, de manera lógica han buscado asimilarlo a una biblioteca y dirigir las metaforas en ese sentido. Aqui tenemos un claro ejemplo:

Donde podemos seleccionar un libro pasando por las caratulas, tal como si estuvieran en el anaquel de una estantería.

Realimentación

Se basa en la continua información al usuario de la ejecución de las actividades y la respuesta a sus acciones. En este software, la realimentación no presenta un problema en prácticamente ningún aspecto, pues la practica totalidad de las acciones tienen una respuesta inmediata que hace innecesaria la actualización del estado al usuario. El único punto crítico es el la automatización de tareas, como la ya mencionada conversión en bloques. Para estos casos, la interfaz gráfica se sirve de este apartado:

donde mediante el movimiento se informa al usuario que las tareas se están ejecutando en segundo plano, e indica de forma numérica cuantas tareas restan de ser ejecutadas. 

Manipulación directa

Aquí se busca reducir el esfuerzo del usuario, permitiendo que las operaciones se hagan con mas rapidez y menores esfuerzos.

Para esto, el software aporta multidud de accesos directos a las tareas, que están identificadas de una manera correcta, e incluso disponen de ventanas emergentes con información adicional. Además, pese a la gran cantidad de funcionalidades que presenta el programa, estas se encuentran muy bien estructuradas, haciendo fácil la búsqueda y acceso en la interfaz gráfica.

Coherencia

Aquí la aplicación se defiende correctamente. Al tratarse de una aplicación multiplataforma, obviaremos la coherencia con el sistema operativo, si bien muestra una estructura y un esquema que recuerda bastante a las aplicaciones Windows.

En la propia aplicación se mantiene la coherencia en todos sus apartados, de forma que la interfaz no dificulta la adaptación del usuario y facilita el aprendizaje.

Integridad estética

La integridad estética busca ayudar al usuario a comprender la información y focalizar la atención en lo importante, no descentrando al usuario. 

En esta aplicación se cumple con este concepto. Los iconos que dan acceso a acciones principales tienen un tamaño mayor, y en toda la aplicación se mantiene una integridad adecuada de colores, iconos, etc...

Reversibilidad

Todas las acciones de edición son reversibles, excepto las que por definición no se pueden deshacer, como el borrado de ficheros, a través de un icono de Cancelar visible en todo momento (aportando seguridad al usuario). Por otra parte, en los casos donde no se puede deshacer, como el borrado, se le solicita la confirmación al usuario, para evitar errores o acciones echas por despiste.

Accesibilidad

La accesibilidad refiere a como se facilita el acceso a personas con capacidades reducidas. Aquí, si bien las acciones principales están claramente diferenciadas en iconos de tamaño considerable, lo cual facilitaría la accesibilidad, muchas de las acciones precisan de una mayor precisión, al tratarse de introducción y edición de texto, donde no se aportan opciones de apoyo a la accesibilidad. 

Televisor

Aquí vamos a ver un vídeo de como arranca el televisor de mi cocina:

Como se puede ver, con el televisor en stand-by, el piloto azul esta encendido. Cuando pulsamos una tecla del mando este se apaga, y luego NADA durante 9 segundos hasta observar un cambio en la pantalla. ¿Se esta encendiendo, lo apague, se rompió...? Este es un claro problema de causalidad, en la frontera de evaluación.

Como solución, el piloto azul debería de parpadear en vez de apagarse durante la espera, informando así al usuario que un proceso (el encendido) esta ocurriendo.

Practica 2: Despertador

Este el control del despertador. Mediante los controles laterales, el usuario puede determinar la hora y minuto en que desea ser despertado, que se le presenta numéricamente, y dispone de un botón para confirmar la hora. El botón inferior es un botón de retorno al menú anterior.

Realidad disminuida

Recientemente hemos estado comentando en clase la utilidad de la realidad aumentada como apoyo a los interfaces humanos, debatiendo si realmente tiene una utilidad desde el punto de vista del usuario, o si simplemente es un alarde tecnológico sin mayor trascendencia.

Solo como curiosidad, un vídeo que vi hace no mucho, sin la mayor trascendencia de todo lo contrario: la realidad disminuida.

Practica 2: Menú de Calefacción

Este el el menú de control de la calefacción. Mediante el regulador desplazable, el usuario puede determinar la temperatura ambiente que desea, que se le presenta numéricamente junto al desplazable. El botón inferior es un botón de retorno al menú anterior.

Papelera de Reciclaje

El otro día vi esta papelera de reciclaje en el edificio de usos múltiples de la universidad.

Magnifica muestra de ecologismo, pero... ¿donde va cada cosa? Aceptemos que hay una convención para separar los residuos por colores, pero es una convención arbitraría y poca gente se la sabe. Y en esta papelera no hay ninguna indicación mas.

Este es un problema de expectativas, en la frontera de evaluación. !No se como usar correctamente una papelera! Esto se solucionaría añadiendo unas indicaciones, como en la siguiente imagen.

Practica 2: Menú de Iluminación

Este el el menú de control de la iluminación. El usuario puede elegir mediante los iconos si desea regular iluminación eléctrica o la iluminación natural, y mediante el regulador puede decidir si quiere mas o menos iluminación. El botón inferior es un botón de retorno al menú anterior.

Se puede comprobar como se mantiene la coherencia y la integridad estetica para no despistar al usuario, aportándole solo información relevante.

Puerta del maletero

Esta es la puerta del maletero de mi coche:

Todo normal. Vamos a abrirlo. ¿Donde esta el botón para abrirlo? Aqui:

Si bien es una cuestión echa ex-profeso por seguridad, se genera un problema de expectativas y de convenciones, ambas en la frontera de evaluación. El usuario nuevo no sabe como abrir la puerta, pues se espera que haya un tirador en algún sitio de esta (como en cualquier puerta).

La solución vendría de poner algún tipo de manecilla en la puerta, como en la común normalidad de los vehículos.