El día 26 de junio se presentó en nuestro país el tan esperado Apple Watch. No es la primera vez que en este blog abordamos el tema. De hecho, ya hemos hablado sobre las  funcionalidades que tiene y sobre cómo programar en él. Y ¿que pasa con el diseño? Tranquilos, en la última Slashfriday nuestra SlashGirl del departamento de UI & UX  (@MarinaJG27) Marina Jurado, analizó los elementos de diseño y la navegación del reloj, elementos totalmente nuevos para usuarios de iOS y hoy, os lo contamos a todos vosotros.

¿Qué elementos encontramos? Aquí los principales:

Gestos

  • Multi-gesto: No se encuentra. En Apple Watch, si quisiéramos ampliar una imagen no podemos hacer lo mismo que con nuestro iPhone. No podríamos “pellizcar” la pantalla, dado que en tamaños tan reducidos no sería fácil de usar.
  • Tap y swipes: Siguen presentes, aunque en el caso de los swipes no serán sólo para movernos por la pantalla. Sino que nos desplegarán opciones como los glaces y las notificaciones.
  • Force Press: ¡Novedad! Los usuarios Android están más habituados, pero en iOS no es tan común. Prolongando la presión del tap se abrirán menús.
  • Gestos únicos en Apple Watch: Si subimos y mantenemos la muñeca vemos notificaciones y lo podemos desbloquear. Si bajamos la muñeca bloqueamos la pantalla.

gestos applewatchgestos applewatch2

Elementos de diseño

  • Glances: Es lo más parecido a un widget que encontraremos en iOS. Son opcionales para la app. Nos mostrarán información estática y sólo contarán con una interacción que nos llevará a un lugar concreto de la app.
  • Notificaciones: son similares a las de iPhone pero con características diferentes de personalización y cantidad de información. Existen dos tipos de notificación:
    • Short Look: Serán breves e icónicas.
    • Long Look: Donde podremos hacer scroll y leer más cantidad de texto o interactuar con opciones.
  • Grupos: Será la distribución de los elementos de la app. Podrán ser verticales, horizontales o incluso combinarlos anidando unos respecto a otros.

 

icono apple watchNavegación

La navegación podemos dividirla en dos tipos:

  • Paginada: Nos movemos en lateral entre items equivalentes. Un ejemplo sería entre glaces.
  • Jerárquica: Es una navegación secuencial entre items subordinados. Por ejemplo: de un listado de elementos entramos en uno y vemos el detalle.

Tipografía: bye, bye Helvetica

Nos despedimos de la Helvetica Neue. Sí, Apple se despide de ella dando paso a la San Francisco: una tipografía diseñada para pantallas y con muy buena legibilidad en tamaños reducidos.

El icono de la app

Nuestro icono debe ser lo más parecido posible al de la app de iPhone. Pero simplificando al máximo (aún más) siendo conscientes del tamaño del reloj.

A continuación os dejamos la presentación que sirvió de apoyo durante la sesión.

Autora del post: Marina Jurado (@MarinaJG27), UI & UX Designer en SlashMobility

Recommended Posts

Leave a Comment