Arquitectura de las aplicaciones moviles y wireframes

La velocidad con que se haga. De hecho, es el propio usuario quien, una vez acostumbrado al movimiento de deslizar el dedo sobre la pantalla, empezará a hacerlo cada vez más rápido y más corto para minimizar esfuerzos. Este movimiento rápido del dedo sobre la pantalla en una dirección recibe el nombre de flick y se puede usar para pasar páginas de un libro, fotografías de una galería, desplazarnos rápidamente por una página web, etc.

El número de dedos que hacemos deslizar a la vez sobre la pantalla. Podemos diseñar acciones para dos, tres e incluso cuatro dedos deslizándose al mismo tiempo y en la misma dirección sobre la pantalla, aunque para teléfonos –dado el tamaño de sus pantallas– resulta recomendable no pasar de dos. Por otro lado, en tabletas no hay que abusar de gestos con tres o cuatro dedos, puesto que resultan incómodos y estorban la visión de buena parte de la pantalla.

Mejor sin serifa. Las tipografías de palo seco, sin serifa, resultan más limpias y cómodas de leer en pantalla, sobre todo cuando esta es pequeña. Si el diseño lo permite, podemos jugar con dos tipos de letra diferentes (por ejemplo, uno para los títulos y otro para el cuerpo del texto).

Tamaño de la fuente. Debe ser lo suficientemente grande como para ser leída cómodamente (debemos evitar a toda costa que el usuario sienta la necesidad de hacer zoom con los dedos para ampliar la letra), aunque sin excedernos: un texto demasiado grande provocará muchos saltos de línea, dificultando la lectura. Una sencilla manera de calcularlo es contando el número de caracteres que caben en una línea: entre treinta y cuarenta caracteres por línea es un buen punto de partida.

Color y contraste. Aunque parezca ir contra el sentido común, no es necesario recurrir siempre al «negro sobre blanco» para conseguir un texto legible. De hecho, en algunos casos, puede incluso que el negro puro sobre blanco dificulte la lectura o fatigue al usuario. Para suavizar el contraste, se pueden usar tonos de gris (tanto para el fondo como para la letra). Por ejemplo, en lugar de un texto negro «puro» (#000000), podemos usar tonos oscuros de gris, como #0D0D0D o #0F0F0F para la letra, o tonos muy claros.

Jerarquías. Mientras que en la web nos hemos acostumbrado al uso de múltiples niveles (H1, H2, H3, H4, etc.), en pantallas pequeñas a menudo nos bastará con dos niveles para organizar jerárquicamente nuestro texto; para facilitar el tema, podemos jugar con variaciones (negrita, itálica) para tener mayor riqueza tipográfica.

Espaciado. Al igual que en el punto anterior, en pantallas pequeñas aumentaremos ligeramente el espaciado –tanto entre palabras como entre líneas– para mejorar la legibilidad del texto. Este aumento de espacio también lo podemos aplicar entre párrafos, ayudando así al lector a identificar mejor los bloques de texto. De nuevo, tampoco conviene pasarse por exceso: un texto con demasiado espacio blanco entre palabras o líneas resulta incómodo de leer.

Tipografía responsiva. Si nuestra aplicación va a utilizarse en diferentes tamaños de pantalla, resulta conveniente cerciorarse que tanto el tamaño de la fuente como el espaciado se escalan convenientemente.

Alineación. La norma básica es evitar el texto justificado, ya que en determinadas ocasiones puede dejarnos líneas con demasiados espacios en blanco. Para el resto de alineaciones, las recomendaciones generales son:

• Alineación a la izquierda. Se trata de la alineación preferente, ya que funciona muy bien en toda ocasión, incluso con grandes bloques de texto.

• Texto centrado. Resulta conveniente usarlo con moderación. Funciona bien con títulos, dentro de botones o en pequeños bloques de texto.

• Alineación a la derecha. También conviene usarla con moderación y en pequeños bloques de texto.

Velocidad: las iteraciones y mejoras del diseño se suceden rápidamente. Basta con arrancar la página y volver a empezar.

Eficiencia: al no centrarnos en los detalles visuales, nuestros diseños van directos al grano, facilitándonos de esta forma dirigir toda la atención hacia los puntos clave de nuestro producto.

Colaboración: cualquiera sabe dibujar con papel y lápiz. Compartir los primeros esbozos con todos los participantes en el proyecto nos permitirá recoger fácilmente ideas y mejoras por parte de todos los miembros del equipo.