« Artículos « BlogTutorialesDownloads

Interfaces Web: Hay que fijarse en los detalles (I)

Sábado, 23 de Mayo, 2009

Acerca de

Soy Sergio Nouvel, diseñador y consultor Web. Escribo sobre Web, cultura y tecnología, así como artículos y tutoriales para desarrolladores Web. Más...

Una buena interfaz se distingue de una mediocre por los detalles. Los detalles demuestran qué tan lejos ha llegado el interés y el cuidado del diseñador y del arquitecto de información por entender las necesidades y expectativas del usuario de una aplicación.

Es, en definitiva, lo que nos hace diferenciar, de manera inconsciente, las interfaces que “se sienten sólidas y profesionales” de aquellas a las que meramente estamos obligados a adaptarnos. Una interfaz cuidada en los detalles despierta confianza en el usuario.

Vamos a revisar ejemplos anónimos de aplicaciones chilenas, con las que me topo día a día, para identificar algunos de esos detalles. Observando, nos daremos cuenta que es posible, con cambios sencillos, mejorar bastante la efectividad de una interfaz gráfica de usuario.

Y en esta primera parte, volveremos sobre el tema del lenguaje y el uso de la semántica. Continúa leyendo…

Volvemos al Lenguaje

Sí, el tema del uso del lenguaje en las interfaces es algo que ya habíamos revisado hace un tiempo, en este artículo. Ahora quiero cubrir aspectos más finos y semánticos con respecto a las palabras que se usan en una interfaz:

  1. Asesórate con Alguien Que Sepa
  2. Usa un Lenguaje Amigable y/o Cercano al Usuario
  3. Evita la Confusión de Términos
  4. Enfócate en los Objetivos, No en las Tecnologías

Veamos…

1 - Asesórate con Alguien Que Sepa

En este sentido, mi recomendación N°1 es la siguiente: hazte asesorar por alguien que sepa escribir. A vuelo de pájaro pienso en periodistas, publicistas, escritores, psicólogos, sociólogos, pero más allá de la profesión, lo importante es que sea alguien con:

  • mucho, mucho vocabulario
  • buena ortografía y puntuación
  • excelente redacción y estilo
  • conocimientos de comunicación y semántica
  • experiencia con interfaces

No le dejes a un programador o a un diseñador la responsabilidad de decidir el lenguaje a usar en tu interfaz, a menos que cumpla estos requisitos (y si los cumple, recompénsalo debidamente y cuídalo, porque son un bien escaso).

Haz que este experto revise tu interfaz de principio a fin, se fije en el lenguaje usado, y sea capaz de cotejarlo con los objetivos que cumple cada sección de la aplicación. Un experto así hará que el lenguaje sea consistente, claro, motivante a la acción y orientador para el usuario.

Dicho esto, aplica tú mismo los siguientes criterios al momento de construir una interfaz Web:

2 - Usa un Lenguaje Amigable y/o Cercano al Usuario

Al acceder a la página de inicio de sesión de una empresa de telecomunicaciones, aparece el siguiente título de página:

Sucursal Virtual - Formulario de autentificacion (sic) de Usuario

Seguramente este título lo puso algún “experto en TI”, y nadie más se lo volvió a cuestionar. ¿Podrá existir un texto menos amigable y más burocrático para explicarle al usuario dónde se está metiendo? ¿Por qué nadie revisa la ortografía para colocarle tilde en la O a “autentificación”?

Usa texto que represente lo que el usuario necesita. Una buena manera es imaginarse preguntándole a un usuario común y corriente, que está accediendo a la página apuradamente desde un ciber café, “¿qué necesitas hacer?” La persona contestará algo como “necesito poner mi clave para entrar a mi Sucursal Virtual”. Eso podemos traducirlo a un lenguaje menos coloquial, pero que sintonice con esa necesidad. Así que un mucho mejor texto sería:

Bienvenido a <Empresa> - Inicia sesión para ingresar a tu Sucursal Virtual

3 - Evita la Confusión de Términos

Un ejemplo que veo cuando expira mi sesión en otro sitio de telecomunicaciones:

Sesión Expirada - Para reiniciar debes registrar tu celular y clave nuevamente.

Esta frase tiene al menos dos problemas graves:

  • ¿Reiniciar? ¿reiniciar qué, mi equipo? Claramente no es una palabra afortunada, puesto que está asociada al reinicio de un sistema operativo. Acá simplemente se trata de volver a ingresar al sistema.
  • ¿Registrar tu celular y clave nuevamente? ¿Eso significa que todos mis datos de usuario se perdieron y tengo que volver a registrarme? La palabra “registro” también tiene una connotación que confunde al usuario. Y ¿qué significa “registrar mi celular”? ¿Es el aparato o el número?

Si piensas que estoy exagerando con esto, visita Clientcopia (en inglés) y ve de lo que son capaces ciertos clientes a la hora de malinterpretar instrucciones.

Usa términos precisos para describir la acción que se va a ejecutar. Si tienes dudas, mira otros ejemplos, haz encuestas o pruebas de usuario, pregunta a otros.

Una frase mucho más adecuada sería:

Sesión Expirada - Debes ingresar nuevamente en la Sucursal Online con tu número de celular y tu clave.

4 - Enfócate en los Objetivos, No en las Tecnologías

Un sitio de búsqueda de mapas de calles posee un buscador que pide nombres de calles, intersecciones, comuna, servicios, etc. Abajo del cuadro de búsqueda dice “Cambiar a versión clásica”. Al hacer clic, aparece el mismo formulario, con dos opciones más (muy poco útiles, por cierto): Color de Mapa y Cambiar Icono. Ahora el texto ofrece “cambiar a versión normal”.

Éste es un ejemplo de confusión innecesaria, por enfocarse en cómo está hecho el formulario (tecnología), y no en lo que el usuario necesita (objetivo).

Una mejor manera de hacerlo habría sido ocultar todos aquellos campos no imprescindibles (entre ellos, una opción de “texto para personalizar mapa”), y ofrecer un link con “Más opciones”, o “Búsqueda avanzada”.

Enfoca tu interfaz no hacia lo que sabe hacer, sino hacia lo que el usuario necesita. Microsoft con Windows 7 lo ha entendido bien. Por ejemplo, posee un sistema de encriptado de archivos llamado BitLocker. Pero si ingresas a BitLocker, el título de la sección dice:

Cifre las unidades para proteger los archivos y carpetas

Dicho texto está enfocado en la utilidad que la tecnología podría significarle al usuario. Otros ejemplos: la funcionalidad Homegroups (Grupo Hogar) presenta el título “Compartir con otros equipos domésticos que ejecutan Windows 7”, Conexión de RemoteApp y Escritorio dice “Conectarse a escritorios y programas en su lugar de trabajo”, etcétera.

Las siguientes partes de este artículo cubrirán aspectos como la gráfica, el uso de blancos y el comportamiento de la interfaz. ¡Mantente conectado! ¿Tienes dudas, consultas, algún otro criterio que aportar? Hazte parte en los comentarios. ¡Saludos!

Comenta.