¿Cómo podemos crear aplicaciones con funcionalidades espectaculares y con un diseño atractivo?
Hasta ahora, siempre que hemos hablado, o mejor dicho escrito, sobre el desarrollo de aplicaciones nos hemos centrado en la programación. Es una parte muy importante en la creación de Apps pero si no tenemos en cuenta la segunda pierna, todo lo que hayamos realizado puede que no haya servido para nada. Efectivamente, me refiero al Diseño de la Interfaz y la Usabilidad de nuestra aplicación. El UI/UX.
Antes de nada, hay que aclarar que este artículo está escrito desde el prisma de un desarrollador con conocimientos muy muy básicos de Diseño Gráfico. Lo que sí tenemos todos (bueno, la mayoría de gente XD) es el buen gusto y las opiniones válidas para darnos cuenta de que muchas soluciones adoptadas por terceros quedarían de lujo en las apps que estamos desarrollando.
Pero, ¿Cómo podemos crear aplicaciones con funcionalidades espectaculares y con un diseño atractivo? Lo primero, lo podemos hacer nosotros… y para lo segundo, tenemos las librerías de diseño de terceros. ¡La comunidad al rescate!
No es la primera vez que hablamos sobre librerías de terceros, pero hasta ahora nos hemos centrado en la programación. Ahora toca hacer hincapié en el aspecto. En este artículo nombraremos 5 librerías interesantes que afectan a diferentes partes del diseño y que, gracias a su fácil implementación, añadirán valor visual a la App. Los ámbitos que tocaremos son:
- Animaciones
- Avisos personalizados
- Reproducción de videos
- Vistas
- Edición de fotos
Animaciones: Lottie
Lottie es una librería que permite incluir animaciones en aplicaciones nativas de Android (también en iOS y React) de una manera muy sencilla. La librería parsea animaciones creadas en Adobe After Effects que se exportan en formato JSON. Si no somos hábiles con la herramienta de Adobe, Lottie nos ofrece de una librería de animaciones que se pueden customizar para integrarlas en nuestros desarrollos.
Está desarrollado por el equipo desarrollador de Airbnb y podéis encontrarlo en este enlace: https://airbnb.design/lottie/
Avisos personalizados: StyleableToast
Los Toast son unas herramientas muy útiles a la hora de mostrar información relevante al usuario. El método más fácil es utilizar los que proporciona el sistema pero esto hace que el diseño sea el que se utiliza por defecto en el sistema operativo. Para personalizar estos mensajes, lo mejor es utilizar la librería StyleableToast.
Permite personalizar los toast mediante código o xml. Algunas características que ofrece son:
- Personalización de colores
- Personalización de las formas.
- Oportunidad de incluir iconos
- …
La librería está disponible en este enlace: https://github.com/Muddz/StyleableToast
Reproducción de videos: Preview Seek Bar
Si la app que se está desarrollando utiliza un reproductor de video, esta librería debe ir incluida. Permite visualizar una vista previa del fotograma cuando el usuario mueve la barra de progreso hacia adelante o hacia atrás. Desarrollada por Ruben Sousa, la ofrece como librería open source y replica el funcionamiento de la app Google Play Movies.
Enlace a la librería: https://github.com/rubensousa/PreviewSeekBar
Esta librería permite dar diversas formas a las vistas de Android. Las opciones pueden ser:
- Imágenes personalizadas
- Border redondeados
- Burbujas
- Animaciones
- …
La librería está accesible desde este enlace: https://github.com/florent37/ShapeOfView
Además de eso, ofrece la posibilidad de crear diseños tan atractivos como el siguiente:
Edición de fotos: PhotoEditor
Esta librería puede que no case al 100% con el tema que estamos tratando, pero es tan útil y sencilla de utilizar que debía comentarlo de una forma u otra. Hoy en día todas las apps que ofrecen la oportunidad de compartir fotografías, han añadido las funcionalidades de manipularlas antes del envío. Estas opciones incluyen: recortar, añadir textos e iconos, pintar encima…
Si queremos incluir estas opciones en nuestra app lo mejor es utilizar la librería PhotoEditor. Es una librería que está en desarrollo pero tiene muchísimo potencial.
Si queréis salsear y hacer pruebas lo podéis descargar del siguiente enlace: https://github.com/burhanrashid52/PhotoEditor
La utilización de estas librerías, o selección de las mismas, se debe ajustar a las necesidades y gustos de cada uno. Esto es algo orientativo. Para funcionalidades que no se han tenido en cuenta o diseños que cuadren más con vuestras necesidades ya sabéis donde podéis realizar las búsquedas: GitHub, Android Arsenal, Android LibHunt… y sobre todo Google.
¡Ánimo con la programación!
