note_image11Contrariamente a lo que vemos en las películas de Hollywood, en la antigua Roma la bajada del pulgar del César le salvaba la vida a un gladiador. Muchas veces tenemos que aprender cosas y algunas veces nos toca desaprenderlas. Con el advenimiento y auge de los nuevos “smartphones”, sobre todo los que cuentan con pantallas táctiles, se nos abre un nuevo y amplio abanico de opciones a la hora de diseñar sus interfaces de usuario. En saber encontrar las diferencias que nos plantea esta nueva tecnología y poder adaptar nuestros conocimientos, considero se encuentra la clave del éxito del diseño de nuestra interface. Ese éxito se trasladará al usuario, cuando bajando su pulgar sobre la pantalla, obtenga lo que estaba esperando de su dispositivo.

Hace un tiempo tuve el agrado de participar en un proyecto que consistía en pasar una aplicación web al sistema operativo Android (conocido por mi tía como “el celular de Google”). La aplicación era un e-commerce de contenidos para celulares (ringtones, wallpapers, videos y juegos) llamada Playphone.

A continuación voy a enumerar algunas de las particularidades con las que me encontré a la hora de diseñar para estos dispositivos.

Mi pulgar no es preciso

La primera gran diferencia que detecté diseñando los controles de la aplicación fue que el tamaño de mi pulgar no es igual al del puntero de un mouse. Por lo tanto todas las áreas sensibles de ser tocadas deben ser realmente grandes en comparación a lo que uno está acostumbrado a usar. Esto, sumado a que las pantallas son mucho más chicas que nuestros monitores, nos pone en el reto de seleccionar y excluir unas u otras acciones.

Volver, siempre volver

note_image3-300x182Esta necesidad de poner menos elementos por pantalla nos va a repercutir en la navegabilidad de la aplicación. Inevitablemente se nos va a generar un árbol de navegación mucho más vertical de lo que estamos habituados. ¿Qué quiero decir con esto? En la actualidad estamos acostumbrados a diseñar pantallas de 1024 x 768 pixeles como mínimo, y tenemos un puntero de mouse con una precisión de 1×1 pixeles. Contrariamente, en los smartphones tenemos pantallas de 480 x 320 pixeles (iPhone) y una precisión de puntero que puede tener un rango de error superior a los 30 pixeles. Esto nos obliga a hacer pantallas con menos opciones, si no queremos abusar del scroll, y a poner estas opciones más distanciadas entre sí. En ocasiones deberemos dividir pantallas y transformarlas en flujos de varias pantallas, lo que genera navegaciones mucho más verticales.

Rollover al sobre

Prácticamente perdemos el estado Rollover de los botones. En iPhone no existe, o tocás la pantalla o no la tocás, pero no podés estar situado en un área seleccionada de la pantalla.

En Android sí existe. Uno puede moverse a través de las diferentes áreas sensibles utilizando la “ruedita” del estilo de la Blackberry. Pero lo cierto es que su uso es tan esporádico como quien usa la tecla “Tab” en una computadora.

El usuario sí lo conoce

Los diferentes dispositivos también tienen sus propias particularidades. El iPhone, por ejemplo, cuenta con un solo botón de escape. Pero el G1 (Android) tiene una serie de botones que ejecutan acciones comunes como “menú” o “home” que el usuario ya está habituado a utilizar y que pueden ser nuestros aliados. Considero que habituarse al dispositivo es una de las principales tareas antes de comenzar a diseñar la interface.

La lupa no está incluida

note_image4La diferencia de tamaños, sobre todo, en la percepción de las tipografías es otra cosa que debemos tener en cuenta. Cuando trabajamos para la web, una tipografía Verdana de 12 px. de alto es cómoda para ser leída, y diría que en ocasiones puede resultar algo grande. En un dispositivo que tiene muchos más pixeles por pulgada en su pantalla, no debemos usar menos de 14 o 15 pixeles para que el usuario no crea que está leyendo la receta de un medicamento.

Giros, dar media vuelta y ver que pasa…

Nadie va a andar girando el monitor de su computadora, pero no estamos con una computadora enfrente. Las pantallas tienen que adaptarse muchas veces a las dos orientaciones. Por ejemplo, en las primeras versiones de Android la única posibilidad de tipear texto era con la pantalla en orientación horizontal y el teclado físico desplegado. De nada servía poner un buscador en la versión vertical ya que no contábamos con teclas.

La funcionalidad de detectar el ángulo y la orientación en que se encuentra también nos abre un abanico de nuevas posibilidades que pueden enriquecer poderosamente la experiencia del usuario. A la hora de diseñar un juego, por ejemplo, nos ayuda a capturar la atención del usuario en forma que pocos controles pueden hacerlo.

Concluyendo

Terminando con este puñado de anotaciones sobre una materia que está naciendo, pero que ya se la puede respirar colosalmente, les diría que si el día de mañana tienen que diseñar una interface de usuario para alguno de estos dispositivos, comiencen usándolo. Usen el dispositivo un tiempo, fíjense cómo otras personas resolvieron situaciones similares a las de ustedes, pónganse en los zapatos del usuario de su aplicación y no tengan miedo en pararse en la arena como un gladiador en la materia y enfrentarse al pulgar del César.

Facebooktwitterredditlinkedinby feather

Leave a Reply

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

  1. Avatar

    Muy buenas anotaciones, para tener en cuenta a la hora de empezar, sobre todo porque se abren nuevas maneras y posibilidades que nos desafian a responder siempre de un modo creativo y original!

  2. Avatar

    Cada campo tiene sus complejidades, y esta bueno tomarse un tiempo para analizarlas y ver como sortearlas de la manera mas creativa pero tambien mas amigable para el usuario. Muy abarcativo el articulo!