LuegoLuego
2018 - 2019
Adobe XD, Illustrator, Photoshop, After effects Jira & Confluence, Slack and Google forms.
Branding, diseño visual, de interaccion e investigacion sobre user experience (UX)
Este es un proyecto desarrollado en una pre-startup llamada Credytag. Comenzó con la idea simple de poder pagar con un smartphone escaneando códigos QR. Formamos una asociación de unas 8 personas, cada una encargada de diferentes áreas como Marketing, Legal, Desarrollo móvil, Backend y Frontend, Gestión, Seguridad y Diseño.
LuegoLuego abarca varios productos para satisfacer las necesidades de compradores y comerciantes, completando así el flujo de uso de la idea. El proceso comienza con la creación de la marca, luego conociendo el producto, generando códigos QR, escaneando estos códigos y, finalmente, gestionando el dinero.
Proceso de diseño:
El Proceso de... "Startup", un buen rush
Este proyecto comenzó directamente a partir de la visión del CEO, quien tenía una idea general muy clara. Para comprender mejor su concepto, se desarrollaron wireframes que ayudaron a hacer funcional la interfaz. Mi tarea fue estructurar esa idea en una aplicación que no solo fuera clara, sino que también ofreciera funcionalidad, estética y una experiencia de usuario adecuada. El proceso en este proyecto fue algo singular, avanzando rápidamente hacia los mockups, marketing, interacciones y branding para cubrir todos los aspectos del diseño.
Fue una experiencia muy dinámica y divertida, y al final, el resultado fue excelente. Sin embargo, el proyecto tuvo que detenerse cuando el gobierno implementó una función similar en todos los mercados a través de CODI, un sistema de pago y cobro mediante códigos QR.
MVP
1. Gestionar la marca y la comunicación para brinfarle toda la informacion necesaria al usuario, tanto al negocio como al usuario final, quien sería el comprador de los servicios o poroductos que los negocios intermediarios ofrezcan a través de LuegoLuego.
2. Producto A Web-appdel negocio que...
• Funcione tanto en móvil como en una laptop
• Gestione finanzas de los negocios
• Genere codigos QR para cobrar sus productos y/o servicios
3. Producto B. Aplicación para smartphones Android/iOS para el comprador que...
• Pueda utilizar las tarjetas bancarias del cliente de manera segura
• pueda escanear un codigo QR
• Cree un historial de compras
1. La marca
El logotipo fue diseñado para representar el vínculo entre el cliente y el negocio mediante una imagen simple y pregnante. Se eligió una paleta de colores que destacara sobre el resto de las empresas dedicadas a las transacciones financieras, como bancos y dispositivos electrónicos, ofreciendo al mismo tiempo una visión fresca y limpia del producto.
La tipografía seleccionada, Open Sans, se eligió por su simplicidad y legibilidad, cualidades esenciales para este proyecto, que debía mostrar múltiples tablas de datos y contenido textual de manera clara y accesible.
Inicialmente el startup se llamaba Credytag, pero al darnos cuenta de que estaba registrado, cambiamos todo el proyecto a LuegoLuego, en los mockups de esta documentación, en ocasiones se verá un nombre o el otro.
Se creó una iconografía amigable para ilustrar conceptos que ayudarían al usuario a digerir con facilidad la informacion que se presentaba en la empresa de LuegoLuego y hacerle mas facil la comprensión de las indicaciones del servicio.
Se investigó una paleta de color que sobresaliera de entre multiples marcas de concepto financiero para hacerla destacar.
Starter Pack
Al iniciar el negocio, despues de la suscripción y además de contar con el material necesario digitalmente proveído en las aplicaciones moviles disponibles, se envía un Starter Pack impreso con instrucciones y tarjetas con su código QR impreso para poder cobrar inmediatamente, asi como stickers para pegarlos al frente de su negocio.
2. El producto A : El Negocio
Este producto se dividió en 3 partes:
1. La Herramienta Web para Negocios, una web app responsiva para gestionar nuevos códigos QR para cobrar en diferentes locaciones del negocio asi como para registrar todos los movimientos financieros que se realizan en el negocio.
2. La aplicación móvil A, donde se almacenan los códigos generados y asi poder cobrar con facilidad en cualquier lugar sin necesidad de tener una terminal, cada celular con esta app funciona al final como una terminal bancaria.
3. Un sitio web A con toda la información necesaria para introducirse en este servicio asi como una cuenta con asistencia mientras el cliente del negpocio intactua con LuegoLuego.
Webapp / Creación de QRs:
Esta aplicación web fue desarrollada por mi amigo Serguei Orosco, un experto en diseño de productos y planificación de la experiencia de usuario. Él creó esta herramienta responsive dirigida a usuarios comerciales.
La característica principal de esta herramienta es la creación y gestión de códigos QR, cada uno identificado como un ID de una sucursal, un cajero o un repartidor. Esta sección de creación de QRs es la pantalla final donde el comprador escanea y paga. También se desarrolló una sección de historial de ventas para revisar los movimientos anteriores de cada QR escaneado. Se crearon varias secciones adicionales para gestionar las ventas de los negocios, proporcionando estadísticas e informes de clientes de la manera más sencilla posible.
Aplicación movil A
Esta aplicación móvil se conecta con la webapp A para presentar y promocionar los códigos creados, funcionando como una terminal bancaria. La app fue diseñada para situaciones en las que se requiere una acción rápida y directa: simplemente abrir la aplicación y mostrar el código con el que se cobrará el producto o servicio de la manera más intuitiva posible.
Flujo de usuario simplificado de la aplicacion móvil de negocio:
Sitio web informativo
El sitio web está diseñado para promover el servicio de LuegoLuego entre las personas que ya tienen su negocio listo para aceptar pagos.
3. El producto B : El Cliente
Este producto se divide en 2 partes:
1. La aplicación móvil B, donde los clientes finales pueden utilizarla como tarjeta digital sin necesidad de sacar su cartera, simplemente escaneando los códigos QR que los negocios participantes presentan al hacer una venta.
2. Un sitio web A con toda la información necesaria para que los clientes comprendan como funciona LuegoLuego.
PlayStore
 |  |  |
|---|---|---|
 |  |  |
 |  |
Sitio web informativo
El sitio web está diseñado para promover el servicio de LuegoLuego entre las personas que toman parte como clientes finales, los que escanean la app y pagan con su tarjeta desde su celular.
