Lo primero que debemos saber para crear el diseño de una app es a qué publico nos dirigimos para ello necesitamos un análisis de fondo muy grande y una vez detectado desarrollar nuestro proyecto en estos pasos:
CONCEPTUALIZACIÓN
Necesidad de los Usuarios | Ventajas competitivas | Contenido
FLUJO DE NAVEGACIÓN
Pantallas mínimas | Wireframe | Prototipo Interactivo |Test de Navegación
DISEÑO DE INTERFAZ
Definimos Tipografía | Definimos Color | Definimos iconografía | Resultado Final
INTERACCIÓN Y PREPARACIÓN
Animaciones | Transiciones | Exportación de Archivos para el programador.
Una vez sepamos cual será nuestro timeline para ir cerrando cada uno de estos procesos debemos saber que existen más de mil aplicaciones en el apps store y que los usuarios tienen una media de 48 app instaladas, de las cuales usan durante 13 minutos de media cada una, pero lo que esta claro es que pasamos el 86% de las veces que cogemos el teléfono utilizando app.
Diferentes estudios nos indican el tamaño correcto de los botones para que nuestras manos sean capaces de alcanzar los diferentes elementos dentro de la pantalla.
No olvidemos que en Movil trabajamos con las manos
Zona de Toque 44pt – Para todos los elementos
Otro elemento a tener en cuenta es la zona segura de nuestro movil esto lo detectamos cuando observamos que el pulgar es el protagonista de nuestras acciones, por lo tanto en la zona verde colocaré botones principales «comprar» y en la zona roja elementos que no quiero que el usuario pueda tocar «Borrar»
Debemos evitar poner elementos que el usuario ya conoce, esto ocurre con los movimientos de los dedos se tratan de acciones ya establecidas con los dedos. Zoom, Desplazar, Arrastrar. Para estas acciones podemos prescindir de botones dejando un diseño más limpio e intuitivo.
Una de las aplicaciones que mejor trabaja esto es la app de iPHOTO de apple.
Nunca debemos perdernos en los recursos e iconografía pues si hemos creado un botón para confirmar acciones ejemplo «enviar» con forma de estrella, este debe repetirse a lo largo de la navegación así el usuario solo tendrá que hacer una vez el aprendizaje de color y forma para saber que ese elemento cuando lo vuelva a ver será el de enviar.
Muy importante al no tener ( Hover ) el usuario no puede pasar el ratón por encima en una app por lo que cada vez que toquemos un elemento con acciones o botón debemos devolver un feedback, comunicar al usuario que ocurre algo al hacer toque.
Podemos hacerlo con una opacidad sobre el elemento, por ejemplo.
Trabajemos con metáforas reales, si pongo un botón para una categoría de inmobiliaria pondré una casa que es un objeto reconocible para el usuario un ejemplo es este video donde la rana reconoce perfectamente el icono en la pantalla
Nunca debemos olvidar que una app estará en diferentes sistemas operativos por lo que vamos a diseñar de tal forma que mi propuesta sirva para iOS, Android y Windows phone:
Por último muy importante reutilicemos elementos del sistema operativo para hacer más facil el aprendizaje de nuestra app.
Teniendo estos principios de diseño de interfaz en la cabeza podremos hacer aplicaciones muy intuitivas para el usuario haciendo que viva una experiencia agradable dentro de nuestro diseño para una app