Mobile First: Lo que hemos aprendido usando solamente el móvil (1 de 2)

Si deseas ver más fotos de Chris Dorwart, échale un vistazo a su perfil de Instagram

Esta entrada ha sido traducida y adaptada por Antonio Felipe Martín. Si lo deseas puedes leer el artículo íntegro y original escrito en Medium por Joe Toscano, títulado «Mobile First: Insights from going mobile only«

No importa cuanto quiera creer que estamos trabajando a toda velocidad hacia un diseño Mobile First, todavía hay muchas cosas que se están quedando atrás. Es algo que tenemos que cambiar en especial si prestamos atención a un informe reciente de UX Magazine,  aproximadamente el 25% del mundo no es mobile first sino únicamente móvil.

No hace mucho estuve un mes entero sin ordenador para ver cómo era la vida sin esa máquina a la que todos estamos atados (puedes leer la experiencia en este artículo, “El mes sin ordenador”). Obligándome a no pensar en Mobile First sino únicamente en móvil aprendí muchísimo sobre las que podríamos considerar las mejores prácticas para la navegación móvil. ¡Estoy seguro que os ayudarán a crear mejores experiencias!

Haz que la navegación móvil sea fácil

De acuerdo con un estudio del Grupo Nielsen/Norman, líder en la investigación, formación y consultoría de experiencia de usuario, los patrones de navegación ocultos (como los menús hamburguesa) disminuyen en un 21% la capacidad para localizar el contenido correspondiente e incrementan en 2 segundos, de media, el tiempo que tarda el usuario en usar ese elemento de navegación.

Esta reducción a la hora de localizar el contenido ocurre por dos razones:

1. El menú hamburguesa se usa tan a menudo que hemos empezado a ignorarlo. Piensa en la puerta de tu casa. ¿Recuerdas de qué color es? Seguro que lo sabes pero si alguien te preguntase por ello, ¿sabrías decirlo? Pues, de la misma forma, los menús hamburguesa se han hecho tan familiares que no nos fijamos en ellos.
2. Cuando los usuarios no saben que lo que buscan está escondido navegan a lo largo de la página para ver si pueden encontrarlo. Abrir el navegador para buscar algo establece un compromiso entre el usuario y la empresa, ¿qué ocurre si después de abrirlo no encuentro lo que estoy buscando? La experiencia nos muestra que los usuarios prefieren navegar por la página antes que por los elementos de menú.

Aunque un objeto de navegación que muestra a los usuarios todos sus subelementos es uno de los mejores elementos de navegación que podemos crear, desgraciadamente no es factible en la mayoría de los móviles por el tamaño limitado de las pantallas. El mejor patrón de diseño para la navegación en móviles es usar elementos combinados.

Un elemento combinado permite a los usuarios ver las opciones que más podrían necesitar y hacer el resto de ellas accesible en un menú hamburguesa o algo similar. Por ejemplo, el sitio de Apple hace exactamente esto y de una manera excelente.

El contenido del sitio de Apple está tan bien distribuido que no necesitamos botones de navegación. Podemos hacer scroll por la página y llegar a donde queremos muy fácilmente con un botón de “Comprar Ahora” siempre visible y disponible en caso de que decidamos hacer una compra. Y si no descubrimos lo que estamos buscando podemos explorar con más profundidad la página para ver qué está disponible.

De tal manera, los elementos combinados de navegación y el contenido muy bien distribuido por las páginas hacen del sitio web de Apple un gran ejemplo de como crear la mejor experiencia móvil para los usuarios.

Diseña para pulgares

Se ha hecho mucha investigación alrededor del área de navegación del pulgar, pero aún así hay muchos sitios webs y apps que colocan sus elementos de navegación en la parte superior de la pantalla. ¿Por qué? Porque todos los demás lo hacen.

Si examinas el área de trabajo relacionada con el área del pulgar puedes ver que cuanto mayor es el dispositivo más difícil es para los usuarios alcanzar el contenido que está en los bordes de la pantalla más lejanos. Pensemos en ello cuando estemos diseñando.

Si observamos el navegador Safari, la app Google Now o los sitios optimizados para móviles como Pitchfork nos daremos cuenta de que los elementos principales de navegación están en la parte inferior de la pantalla.

Estamos viendo que muchas experiencias de navegación móvil, incluso también en muchas webs, están trasladando su elementos de navegación a la parte inferior (un lugar mucho más fácil para que los usuarios lo alcancen).

Que cada clic sea importante

Hay una falacia en el mundo de la experiencia de usuario que dice que cuantos menos clics mejor será la experiencia.Pero, amigos, la verdad es que a los usuarios no les importará hacer unos clics extra si son relevantes.

¿Tienes un montón de formularios que necesitas que se completen? Divídelos en formularios más pequeños para conseguir que los usuarios se centren en lo que importa. Completa los campos siempre que puedas con la información que hayan introducido anteriormente. Cambia el teclado por defecto para que el formulario se pueda completar antes y ofrece a los usuarios una barra de estado que les permita saber cuánto han completado.

Ofrece a los usuarios la sensación de haber terminado cada tarea, especialmente si  pueden ver cuánto han completado sobre el total. El hecho es que los usuarios pueden trabajar más rápido de lo normal porque la experiencia, totalmente basada en el contexto donde se desarrolla, multiplica la sensación de completar la tarea.

Puede sonar poco intuitivo pero puede reducirse la complejidad añadiendo unos pocos clics extra que sean relevantes. Es mucho mejor ofrecer la información poco a poco que mostrarlo absolutamente todo. Haz que las experiencias de tus usuarios estén basadas en el contexto y sean fácilmente digeribles y nadie notará unos pocos clics extras si lo creen necesario.

Haz que el contenido sea fácil de digerir

Piensa en lo que ocurre cuando vas a un restaurante y abres un menú. ¿Pides la comida más rápido cuando el menú tiene 10 platos con imágenes justo al lado o es más fácil cuando tienes 4 páginas llenas de texto con más de 50 platos?

Hay una razón por la que Google ha escogido el diseño basado en tarjetas como su estándar y por la que el resto de internet lo ha ido aceptando lentamente. Cada tarjeta representa una pedazo de información fácilmente digerible — normalmente está compuesto por un titular, una imagen o gráfico y una cadena corta de texto que ofrece un resumen. Este estilo ofrece a los usuarios la información suficiente para decidir en muy poco tiempo si desean seguir navegando o desean acceder a esa información.

Que tengamos mucho que decir a nuestros usuarios no significa que estos quieran pasar su tiempo navegando por nuestras páginas y contenido para tomar una decisión. Nadie quiere escuchar nuestra historia. Los párrafos de jerga técnica están hechos solo para uso interno así que contrata a un copywriter que pueda ayudarte a transformar tu contenido en algo que tus usuarios puedan leer. No tengas miedo de usar bullet points para que los usuarios puedan leer, entender tu contenido y seguir adelante.

Ofrece a tus usuarios una gran perspectiva global, luego, de forma progresiva, da más información a medida que navegan — lo suficiente para mantenerlos interesados y que quieran seguir adelante pero no tanto para que se vean abrumados.

Cuando llegue la hora de ofrecer contenido, conviértete en ese restaurante gourmet que sabe lo que quieres antes que tú. Utiliza el análisis de tráfico en tu web para saber qué están haciendo los usuarios y crea contenido para hacer ese viaje aún más interesante y divídelo en pedazos pequeños para que los usuarios puedan digerirlos con facilidad.