12/08/2015

¿Qué es la interfaz de usuario en una aplicación?

Desarrollo de apps

Hasta ahora siempre hemos hablado de funcionalidad, usabilidad y otros conceptos que hacen referencia al proceso de entender la lógica de lo que deseamos construir. Pero no todo es que los datos se relacionen bien, una buena presentación al usuario también se debe tener en cuenta.

Qué es la interfaz de usuario

Hablo de una capa concreta llamada “interfaz de usuario”, la parte que debe transmitir todas nuestras ideas invertidas en nuestra aplicación (en este caso) a la persona que va a sacar partido de ella, ya sea una aplicación de utilidad o de entretenimiento.

Hace poco leía un artículo que resumía los errores más comunes a la hora de desarrollar una aplicación Android y uno de ellos era el crear interfaces de usuario demasiado complejas, y es verdad. Este es uno de los motivos por el cual la usabilidad existe, otro término del cual ya hemos hablado, ya que una interfaz muy cargada espanta, literalmente, a las personas. Esto no sólo se aplica a los programas móviles, también a los de escritorio. De hecho actualmente, y desde hace unos años, se lleva un estilo minimalista en las interfaces, con colores sin degradados, planos, y mostrando al usuario justo lo que necesita saber. No hay que enseñar más de lo que necesita, eso crea confusión y, además, agobia a la vista.

Cómo construir una interfaz de usuario atractiva

1- Definir el target objetivo

¿Qué debéis tener en cuenta para construir una buena interfaz de usuario? Lo primordial es tener claro el target al cual estáis apuntando. No es lo mismo hacer una para niños, adultos o personas mayores, las cuales pueden tener problemas de visión. Y no sólo es cuestión de la edad, recordad que hay personas daltónicas y que ciertas combinaciones de colores pueden ser un inconveniente.

2- Evitar el exceso de iconos 

También hay que evitar cargar de iconos los elementos, como poner uno en cada botón distinto, cuando con un texto siempre queda más limpio y presentable. Todo esto es algo que debéis estudiar con vuestro equipo de diseño, si disponéis de uno, o si estáis en solitario, fijaros en como va evolucionando el mercado.

Hace poco, con motivo  de la actualización 5.0 de Android, se introdujo un concepto nuevo para la web y apps llamado Material Design. Este concepto precisamente reúne todo lo expuesto unas líneas más arriba: simplicidad, lógica y buena distribución, donde la profundidad y las sombras de los objetos tienen su papel. ¿Las sombras un elemento importante? Pues si. Material design persigue un acercamiento a la realidad de nuestra interfaz de usuario, haciendo que la superposición de los objetos y sus sombreados ayuden a las personas a entender la jerarquía de importancia.

materialmap
Por ejemplo, con la imagen anterior: detectamos que el botón con el coche es una opción extra para la navegación del mapa ya que está justo por encima de este y del nombre. No hemos necesitado un texto ni una explicación, es todo visual. La interfaz de usuario tiene la magia de poder comunicar con imágenes al usuario lo que es capaz de hacer con nuestro producto.

3- Animaciones explicativas 

Otro aspecto importante de esta capa son las animaciones. ¿Alguna vez habéis presionado un botón y no sabéis si la app está haciendo lo que se le ha pedido o, por el contrario, se ha quedado colgada? Bien, esto se puede evitar con las animaciones. Un “cargando...” no cuesta nada de poner y parece increíble lo mucho que transmite que te aparezca un reloj de arena o una rueda dando vueltas. Esto se llama “feedback”, genera una relación entre programa y usuario necesaria para una buena interfaz, ya que le da respuesta inmediata de sus actos. No hay nada más frustrante que un internet lento, un ordenador que funcione a pedales, o una aplicación que no sabes si está funcionando o se ha quedado en el limbo de la navegación porque no es capaz de responder.

materialdes

Imágenes sacadas de la guía de Google sobre Material Design

4- Tamaños de pantalla adaptados 

Finalmente, los tamaños de pantalla. Hasta ahora hemos hablado de responsive relacionado con web, pero debéis saber que también existe esto en las aplicaciones móviles, y de hecho es muy importante. Nunca sabéis qué dispositivo va a procesar vuestro diseño. Pueden ser muy altas y poco anchas, ser tabletas enormes, y otros tantos formatos que nunca parecen coincidir. Si bien es cierto que hay resoluciones estandarizadas, parece que los fabricantes nunca se ponen de acuerdo con usarlas y cada uno decide hacer lo que quiere. Vosotros como desarrolladores debéis adelantaros a eso y tener en mente que es imposible llegar a controlar todo el mercado. Una buen interfaz se debe adaptar a todo tipo de tamaños.

Entonces, hemos visto que la interfaz de usuario es la capa que las personas ven, de manera literal, con la que interactúan para poder satisfacer las necesidades que la aplicación debe cubrir, y debe ser simple, clara, con colores planos sin degradados y ofrecer respuesta a todas las acciones que realice el ser humano que está sosteniendo ese pedazo de tecnología.

¿Qué otras variables tendrían que tenerse en cuenta en el diseño de una interfaz atractiva? ¿Qué opináis sobre el "Material Design" de Google? 

Comparte en:

Grado Superior de Desarrollo de Aplicaciones informáticas en la Salle de Barcelona. Trabaja actualmente como desarrollador de aplicaciones para móviles, especialidad en videojuegos.

facebook gaming
22/06/2020
Jordi Mula

Conociendo la nueva app de Facebook Gaming

Facebook Gaming, es la nueva plataforma de streaming de vídeo de la empresa de Zuckerberg, como su propio nombre indica, busca enfocarse en el mundo de los eSports...

pac man
06/06/2020
Jordi Mula

El icónico videojuego Pac-Man cumple 40 años

Los años van pasando y para unos pasan mejor que para otros. PacMan cumple 40 años y vamos a hacer un breve repaso a su historia y su impacto para intentar ver cómo...

El auge de la tecnología beacon en las apps
25/03/2020
Jordi Mula

El auge de la tecnología beacon en las apps

El posicionamiento, la ubicación y la geolocalización son elementos cada vez más integrados en el desarrollo de aplicaciones. La geolocalización en exterior es un ...