5 lecciones importantes que he aprendido sobre el diseño de la interfaz de la aplicación móvil

He estado diseñando para ganarme la vida desde 2009 y, en los últimos tres años, he estado enfocando mis habilidades en el diseño de la interfaz de usuario móvil y web. Durante este tiempo he experimentado lo bueno y lo malo de la industria. Buenos clientes, malos clientes. Buenas ideas, malas ideas. Buenos desarrolladores, malos desarrolladores. Ha habido aprobaciones de aplicaciones y rechazos de aplicaciones.

A veces puede ser frustrante, y aunque estas llamadas ¿malas experiencias? pueden apestar, me han enseñado algunas lecciones importantes. Estas lecciones no solo aceleran mi flujo de trabajo diario, sino que también me ayudan a diseñar una mejor experiencia de usuario para el público objetivo.

Conozca al cliente y sus necesidades

"Crear un gran producto y experiencia de usuario es el número uno para mí"

Antes de iniciar un proyecto, establezca una conversación / llamada en línea o una reunión cara a cara con su cliente. Es bueno conocerlos un poco antes de trabajar, ya que los choques de personalidad a veces causan problemas. Si comparte intereses comunes, ¡es probable que se lleve bien!

He estado en una situación con un cliente donde él tenía una mentalidad de negocios increíble y su prioridad número uno era ganar la mayor cantidad de dinero posible en un corto período de tiempo. Aunque ganar dinero es importante, crear un gran producto y una experiencia de usuario es el número uno para mí (si el producto es bueno y a los usuarios les encanta usarlo, creo que el dinero vendrá eventualmente).

En este caso particular, decidimos no seguir trabajando juntos, ya que quería más tiempo para dedicarme al trabajo que se me pedía, y su prioridad era lanzar el producto tan pronto como fuera posible.

Una vez pasada la etapa de conocernos un poco y descubrir que eres una buena pareja, es importante que averigües todo lo que puedas sobre la aplicación. Tiendo a dividir esto en dos secciones; 'Información básica' e 'Información avanzada'.

Me entero de la información básica antes de conocer al cliente. Esto implica para qué es la aplicación, para quién es, y sus características principales. Luego paso a descubrir la información avanzada. En este paso, me reúno con el cliente y discuto el flujo de trabajo y las pantallas en detalle.

Entre nosotros creamos una lista completa de pantallas que serán necesarias para que la aplicación funcione. Personalmente, me gusta usar una hoja de cálculo de Google Drive que todos podamos ver y editar, y hacer cualquier comentario. Aceptamos y firmamos que este es el conjunto completo de funciones y pantallas que se requieren.

¿Por qué todo este trabajo?

Hay un par de razones válidas detrás de mí haciendo esto. La primera es que es un activo esencial a la hora de elaborar wireframes y flujos de trabajo. La segunda es que potencialmente puede salvarle la espalda a los clientes, lo que aumenta su flujo de trabajo al deslizar pantallas y funciones adicionales aquí y allá.

Una vez tomé un proyecto relativamente grande de iOS y Android con un amigo mío donde rompimos esta regla y, lo que originalmente habíamos citado como aproximadamente 320 horas de trabajo, pronto se convirtió en casi 500 horas de trabajo. Debido a que el cliente agregó tantas características nuevas a la mitad del proyecto, la estructura completa de la aplicación tuvo que cambiarse en las plataformas iOS y Android.

Comenzó a ser aburrido, repetitivo, y generalmente perdimos mucho amor que inicialmente teníamos por el proyecto. Lo completamos, pero no sin trabajar hasta altas horas de la madrugada, estresándonos, haciendo malabares con los proyectos y retrasando los proyectos de otros clientes que teníamos en fila. No vale la pena cuando se puede arreglar con una simple lista de pantallas y características.

Ponte en los zapatos de los usuarios

Lo último que me gusta hacer antes de comenzar a planificar el proyecto es ponerme en el lugar de los usuarios. A veces, esto puede ser un tipo de usuario, otros dos o incluso más. Esta regla se aplica a todas las aplicaciones móviles.

? navegar por la aplicación tiene que ser simple y muy rápido?

Trabajé con un mapa off-road y un arranque de GPS en la segunda mitad de 2011, y ponerme en la piel de un usuario típico fue muy importante. Agarraría un trozo de papel, escribía "usuario" en el medio y escribía cualquier cosa que me viniera a la mente. Tres de las grandes preguntas que me hice fueron:

  • ¿Para qué usarán la aplicación?
  • ¿Dónde van a utilizar la aplicación?
  • ¿Cuánto tiempo tienen para usar la aplicación?

Obviamente, el usuario iba a utilizar la aplicación para navegar tanto en carreteras como en caminos todo terreno, la usará en el automóvil ya pie. A veces, esto estará expuesto a la luz solar directa (por lo tanto, una IU oscura no es adecuada). ).

La aplicación se utilizará durante largos períodos de tiempo, aunque en algunos casos el usuario solo tendrá un tiempo limitado para interactuar con la aplicación (por ejemplo, en los semáforos), por lo que navegar por la aplicación debe ser sencillo y muy rápido.

Pasé una buena hora 'en los zapatos de los usuarios', realmente me ayuda a imaginar cómo funcionará la aplicación y cómo podría verse también.

Planee con anticipación para evitar errores más adelante

La planificación de su proyecto es donde la lista de pantallas y características que mencionamos en la lección uno se convierte en un activo esencial. Una vez que la lista de pantallas y funciones se haya cerrado, es hora de comenzar el cableado.

Cuando comencé a enfocar mis habilidades en el diseño de la interfaz móvil, solía omitir el cableado cuando vi la oportunidad. Lo encontré como una tarea para la mayoría de los proyectos, pero finalmente mi pereza fue contraproducente. Tomé un proyecto para una pequeña aplicación de utilidad de iOS, el cliente y yo decidimos no pasar medio día dibujando algunos esquemas de alambre simples ya que teníamos una imagen bastante clara en nuestra cabeza de cómo queríamos que funcionara.

Avanzamos y, antes de que te des cuenta, nos encontrábamos con pequeños problemas de flujo de trabajo, nada importante, pequeñas cosas como cómo llega un usuario desde allí, cómo eliminan esto sin pasar por muchos pasos para llegar allí, etc. etc.Antes de que se diera cuenta, pasábamos una hora aquí y una hora solucionando estos problemas, que podrían haberse evitado fácilmente al dedicar ese medio día a armar un flujo de trabajo simple y un conjunto de tramas de alambre.

Esto no quiere decir que deba pasar días o incluso semanas planificando sus proyectos (especialmente para aplicaciones de utilidad más pequeñas), pero definitivamente vale la pena escribir a lápiz y anotar algunas ideas para las pantallas más importantes y luego volver a consultar su Lista completa de pantallas y funciones para las que no necesita dibujar.

Hago esto todo el tiempo, tanto antes como durante un proyecto, ¡tanto que realmente lancé Dotgrid.co para animar a otros a comprar libros de cuadrículas de puntos y hacer más bocetos! Para proyectos más grandes (especialmente servicios) siempre reservo una buena parte del tiempo del proyecto para el cableado y otros planes. Siempre vale la pena.

Podría valer la pena usar un servicio para convertir sus wireframes en un prototipo funcional (me gusta la aplicación Invision). Para proyectos grandes, encuentro que esto le ayuda a detectar errores o posibles problemas antes de sumergirse demasiado en el proyecto.

Cumplir con las directrices del sistema operativo

Adherirse a las directrices del usuario es importante. Es genial experimentar con nuevos sistemas de navegación, interacciones y gestos táctiles, y lo aliento a que lo haga, pero seguramente tendrá problemas de vez en cuando, ya sea que a su desarrollador le resulte difícil implementar la idea de diseño o Los críticos de Apple son exigentes y rechazan tu aplicación.

Para tener una buena idea de lo que es posible, haga una investigación sobre las aplicaciones en el mercado y asegúrese de leer las pautas.

Podría ser la diferencia entre una aplicación que se aprueba o una aplicación que se rechaza y luego tener que dedicar mucho más tiempo al rediseño de diferentes elementos.

Otra buena razón para seguir las pautas es que permite a los usuarios acostumbrarse a su aplicación rápidamente debido a que todas las aplicaciones siguen las mismas pautas. Por ejemplo, los botones de retroceso están en la parte superior izquierda. Las barras de pestañas están en la parte inferior de la pantalla. Los interruptores hacen lo mismo en todas las aplicaciones. ¡La lista continua!

Enlaces útiles

  • Pautas de interfaz humana de iOS
  • Pautas de interfaz de usuario de Android
  • Pautas de diseño de Windows Mobile
  • Pautas de interfaz de usuario de Blackberry

Vale la pena mantener las cosas simples

Cuando le digo a los clientes que quiero? Mantener las cosas simples? a menudo me malinterpretan y creen que voy a diseñar su interfaz con un estilo de diseño minimalista. ¡Este no es el significado de la palabra!

Simple significa que un usuario nuevo puede abrir la aplicación y comenzar a usarla sin tener que leer las instrucciones o seguir una guía.

Esto significa que pueden completar tareas simples en muy pocos pasos, o en situaciones donde se requieren más pasos, todavía es sencillo. Significa que los colores se utilizan de manera efectiva (el rojo para los botones de eliminación es un ejemplo común). Mantener las cosas tan simples como sea posible sin complicarlas en exceso sin ninguna razón, no solo alienta a los usuarios a descargar una aplicación en primer lugar, sino que también hace que regresen.

¿Por qué usarían una aplicación que es confusa y difícil de manejar cuando probablemente hay una alternativa que es simple y al punto?

Estaba trabajando con un cliente en una aplicación de utilidad de GPS simple que rastrea cuánto ha viajado el usuario, su velocidad media, velocidad máxima y altitud. La aplicación continuó registrando datos hasta que el usuario los restablece. Para restablecerlo, optamos por una divertida opción de 'Agitar para restablecer', que se ilustra claramente con un ícono y el texto correspondiente leyendo algo similar a 'Agitar para restablecer estadísticas'.

A los pocos días del lanzamiento de la aplicación, varios usuarios se pusieron en contacto con nosotros para preguntarnos cómo restablecer las estadísticas que se habían registrado, y rápidamente agregamos un botón rojo que leía "Restablecer estadísticas" en la aplicación, lo que les permite hacerlo de una manera sencilla. ¡Vale la pena mantener las cosas simples!