Categoría: UX

Mis 10 principios de Usabilidad

  1. Mantener una interacción con el usuario simple y natural.

    Intefaz adaptados al momento, dispositivo de uso y siempre con sencillez y limpieza en el diseño, sin complejidades y de fácil manejo

  2. Hablar el mismo idioma que el usuario.

    Mantener un lenguaje que el usuario entienda, huyendo de lenguajes informáticos o de negocio.

  3. Minimizar recordar procesos.

    El usuario no está preparado para recordar es la máquina, la lógica del software (geolocalización, cámara de fotos, qrs) que tiene que hacer esta tarea y los procesos deben ser lo suficientemente intuitivos para que no sea necesario memorizarlo.

  4. Crear mensajes de error constructivos.

    Los mensajes deben ayudar al usuario a corregir errores

  5. Interacción clara y rápida.

    Cuanto menos piense el usuario mejor, dar la facilidad para que pueda continuar/grabar o salir de un proceso de forma rápida y sencilla

  6. Añadir atajos.

    Para los usuarios expertos sin perjudicar a los usuarios noveles

  7.  Dar feedback al usuario en todo momento.

    Siempre decir al usuario que está pasando de los usuarios, lo bueno y lo malo, el paso del proceso.

  8. Prevenir errores.

    Anticiparse antes de que el usuario lo cometa

  9. Luchar por la consistencia.

    Entre las plataformas, aplicaciones o portales donde esté tu software.

  10. Nunca olvidarse de ningún principio mencionado con anterioridad

    😉

Obama hablando de User Research

Vamos a echar de menos a este hombre. En esta charla habla de como han realizado un estudio de usuarios para mejorar el sistema de «Aids forms», incluso habla de hacer un focus group.

Estamos en un momento de cambio para el UX

 

Usabilidad y ROI en las empresas

He realizado una ponencia en la Ciudad Financiera de Boadilla en Junio de 2016 sobre la conexión entre la UX y el retorno de inversión (ROI) que puede tener una empresa. Se incluyen ejemplos reales de como empresas que mejoran la usabilidad y tienen en cuenta a los usuarios pueden mejorar sus cuentas de resultados.

 

 

 

 

Pésima usabilidad en las máquinas de metro en Bruselas

Hace unas semanas tuve la oportunidad de pasar un fin de semana en Bruselas y tuve una experiencia bastante curiosa intentando sacar uno billete sencillo de metro y francamente no me resulto muy “sencillo”. Me surge la duda, primero, si será un problema mío cultural, por estar acostumbrado a un tipo de máquinas y estar en un país diferente, o si por el contrario, es un problema extrapolable a cualquier nuevo usuario del metro de Bruselas.

interfaz maquina metro

Continúa leyendo Pésima usabilidad en las máquinas de metro en Bruselas

Nueva estructura en los resultados Google y la búsqueda por voz

Una vez que sacó Google sus actualizaciones de Knowledge Graph y HummingBird se ha cambiado la forma de estructurar la información en los resultados de búsqueda para determinadas palabras. Resulta muy curiosos como Google aborda esta actualización y hace una arquitectura de la información totalmente fácil y adaptada al usuario. He realizado algunas pantallas de como se muestran estas nuevas estructuras en los resultados de búsqueda que hace que los usuarios tengan la respuesta a un sólo click o si usan la búsqueda por voz que el propio sistema de voz de google te dé la respuesta.

Continúa leyendo Nueva estructura en los resultados Google y la búsqueda por voz

Sustituir el HOVER en dispositivos táctiles

En los móviles con pantalla táctil no existe la interacción hover. Esta interacción, como todos sabréis, es lo que ocurre cuando pasamos el ratón por encima de un elemento. Normalmente aparece una capa, un tooltip con información adicional o secundaria. En las webs que accedemos con pantallas no táctiles a través de ordenadores o portátiles muchas veces es un contenido que no queremos mostrar en la pantalla principal por lo que usamos este recurso para que el usuario vea más información pasando el ratón por encima de los elementos de nuestra web. Esta técnica actualmente no es muy usada y sólo en caso particulares en los que debemos estudiar con detalle. Esta interacción la usa Twitter, Google adwords, Google Maps, aplicaciones webs con Gráficas…

Continúa leyendo Sustituir el HOVER en dispositivos táctiles

Problemas de usabilidad con Windows 8 y Metro Style

Windows 8 y su Metro Style tiene una serie de desventajas para usuarios que no están con pantallas táctiles y usan el ratón. La gente de Teksindicate ha realizado una crítica bastante interesante que podéis ver en este vídeo que hay en youtube.

Los problemas de usabilidad de Windows 8 y Metro Style para usuarios de ratón principalmente son:

  •  El escritorio está pensado para pantallas táctiles, con el ratón tienes que hacer movimientos más largos para cliclar en los iconos, realizar más clicks, mezcla el scroll vertical del ratón con el scroll horizontal de la pantalla, etc…
  • Un ejemplo, de que el movimiento de arriba a abajo se convierte enmovimiento de izquierda a derecha, es cuando abres la aplicación del tiempo y haces scroll horizontal y de repente te aparece un contenido con scroll vertical y no es fácil manejar el ratón ya que se mezclan estos movimientos perpendiculares. Si lo manejas de forma táctil no hay problema pero para un usuario con ratón es bastante confuso.
  • Si quieres realizar una búsqueda “impresoras” no encuentra nada, tienes que buscar primero “Panel de Control” y luego dentro de esa ventana buscar impresora. Lo mismo pasa si quieres desinstalar un programa. Esto en Mac está solventado desde hace tiempo.
  • Un ejemplo de más clics es cuando quieres cambiar de pestaña dentro de IE9. Con Metro Style tienes que realizar 2 clics, una faena para usuarios que sean unos enfermos, yo estoy dentro, de las pestañas de los navegadores.
  • Cuando divides la pantalla para mostrar 2 aplicaciones no hay forma de dividirla en 50%, mitad de una aplicación y mitad de otra. Sólo te deja: 1/8 y 7/8
  • Otro ejemplo de más clicks. Para reiniciar el ordenador tienes que realizar 3 clics.
  • En la aplicación del tiempo de Windows 8 introducen publicidad. No creo que sea una buena práctica.
  • Eliminación del botón de “Inicio” se echa en falta en muchas ocasiones. Con el Metro Style el botón de Inicio se abre en ventana completa y esto a veces es molesto ya que pierdes la visualización de la pantalla y necesitas realizar más clics para acceder a la información que deseas.

Los labels dentro de los inputs

En estos últimos años, después del auge de aplicaciones móviles, cada vez se está usando más el poner los labels dentro de los inputs para los formularios de validación.

Estos ejemplos los puedes ver en aplicaciones y webs tan importantes como facebook, evernote… :

evernote loginfacebook login

¿Por qué se ponen los labels dentros de estas cajas de texto?

Cuando diseñamos para aplicaciones móviles el espacio es algo muy privilegiado por lo que dejar un input vacio parace un espacio desaprovechado. Sobretodo estas cajas de texto deben ser bastante grandes, más de lo normal ya que van a tener interacción táctil. Si ponemos el label fuera del input esto nos hará tener que agrupar más los elementos y no habrá tantos márgenes o espacios vacios, Lukew, un gran conferenciante sobre mobile, es un gran defensor de este tipo de práctica.

Problemas de poner labels dentro de un input

Cuando el usuario quiere acceder a una zona privada de una web lo ideal es que visualmente vea los inputs vacios donde van a tener que introducir información, según puedes leer en UXmatters, este espacio está reservado para los usuarios.
También ocurre que cuando el usuario pulsa dentro del input el label desaparece y el usuario no recuerda si tiene que introducir un email o un nombre de usuario (esto me ha pasado a mí muchas veces), visualmente no encuentra ningún sitio donde diga que dato tiene que introducir y lo único que puede hacer es borrar la información que ha introducido en el input y visualizar de nuevo el label.
Entiendo que esta situación en móvil se realice ya que el espacio es muy preciado pero en un formulario de validación de una web, donde suele haber sitio, no veo sentido hacer esta práctica. También tenemos que tener en cuenta que en un móvil hay muchos factores del entorno que nos hacen distraernos, quien no consulta facebook mientras va andando, y si tienes que validarte, a veces no eres capaz de rellenar un formulario entero manteniendo la mirada fija en el móvil por lo que las distracciones externas no te hacen recordar que tipo de campo era si usuario o e-mail.

Continúa leyendo Los labels dentro de los inputs

Inspiración para diseños web, móvil y tablets

Listado de webs para inspiración a la hora de realizar cualquier proyecto online

Inspiración web:

Inspiración de colores:

Inspiración css y html, responsive, jquery:

Inspiración revista, fotografía, maquetación:

Blogs de lectura, diseño, ux, seo:

Inspiración móvil y tablets:

Ver mi web en un móvil

Google ha sacado un nuevo servicio para adaptar tu página web a dispositivos móviles. Mensajes del tipo:

“2 de cada 3 personas usan su móvil como si fuera una linterna”
“las tendencias para el 2013 es que habrá más usuarios que se conecten a internet desde su móvil que desde un pc”
“En el 2010 las búsquedas por móvil sufrieron un crecimiento del 400%”

Bueno, todo esto quiere decir que tu web debería estar optimizada para poder ser visualizada de forma correcta desde un dispositivo móvil.
¿Qué quiere decir que tu móvil se vea de forma correcta en un dispositivo móvil?

– El texto de tu web se debería de leer sin tener que hacer zoom
– Los enlaces y botones deben ser fácilmente clikables con el dedo también sin hacer zoom.
– Las cajas de búsqueda y formularios deberán ser grandes para que el usuario acceda de forma correcta.
– Tu página tarda mucho en cargar desde un móvil?

Para poder contestar a estas preguntas puedes acceder a la web de Haz tu web móvil y probar el Test móvil de tu página web