Atras

QRcodeKit_fondo_negro

Multiplataforma para crear, escanear y gestionar códigos QR

Este proyecto es real y puedes explorarlo en este enlace

Rol

Diseñador UX / UI

Introdución

¿Qué es QRcodekit?

QRCodeKit es una herramienta multiplataforma para crear, escanear y gestionar códigos QR, ofreciendo características avanzadas como códigos QR dinámicos y análisis detallados.

El problema

El flujo de gestión de cuentas era confuso y contenía demasiados pasos, lo que dificultaba a los usuarios realizar tareas básicas como cambiar contraseñas, editar información personal o gestionar sus preferencias.

Consecuencias

Los usuarios experimentaban frustración y pérdida de tiempo al navegar por la plataforma, lo que impactaba negativamente en su experiencia general.

Contexto

QRCodeKit es una herramienta SaaS para crear y gestionar códigos QR, utilizada por empresas de diversos sectores. La sección de «Account» necesitaba una modernización que estuviera alineada con las expectativas actuales de los usuarios en términos de usabilidad y diseño.

Requisitos funcionales
  • Simplificar procesos como edición de contraseña, idioma o información de usuario.
  • Crear notificaciones claras para errores o confirmaciones.
  • Garantizar consistencia visual con el resto de la plataforma.
Objetivo principal

Optimizar la gestión de cuentas para ofrecer una experiencia más intuitiva, rápida y accesible, alineada con las necesidades de los usuarios.

Proceso de trabajo

Investigación

Benchmarks

Analizo plataformas similares para identificar mejores prácticas en la gestión de cuentas. Evalúo cómo otras plataformas y/o la competencia como qrfy, qr-generator optimizan flujos de usuarios similares, prestando especial atención a la simplicidad y accesibilidad.

Entrevistas y encuestas a usuarios

Hablo con usuarios actuales de QRCodeKit para entender sus puntos de fricción al usar la sección de «Account». Pregunto sobre las tareas más comunes y las dificultades que enfrentan al realizarlas.

Mapeo de necesidades

Identifico los principales problemas que el rediseño debe resolver:

  • Reducir pasos innecesarios en los flujos.
  • Mejorar la navegación y claridad en las acciones disponibles.
  • Asegurar que la interfaz sea accesible para todos los usuarios.

Diseño

Wireframes de baja fidelidad

Desarrollo wireframes en escala de grises para definir los flujos clave. Esto me permite centrarme en la estructura y funcionalidad antes de avanzar al diseño visual detallado.

Prototipos de alta fidelidad

Utilizo Figma para crear prototipos interactivos que representan cada paso del flujo de «Account». Incluyo pantallas para editar contraseñas, gestionar idiomas, subir fotos de perfil y personalizar preferencias.

Componentes específicos

Adapto y creo nuevos componentes visuales basados en el design system de QRCodeKit, asegurando consistencia en botones, formularios y notificaciones.

Trabajo en equipo

Trabajo con el equipo de desarrollo

Me reúno con los desarrolladores para garantizar que los flujos diseñados sean técnicamente viables y fáciles de implementar. Ajustamos juntos detalles técnicos para asegurar una experiencia fluida.

Trabajo con otros equipos
  • Producto: Alineo los objetivos del rediseño con las metas comerciales de la plataforma.
  • Copywriting: Colaboro con el equipo de texto para ajustar mensajes de error y notificaciones, asegurando que sean claros y comprensibles.

Implementación

Ajustes finales

Basándome en el feedback, realizo mejoras en elementos como mensajes de confirmación, notificaciones de error y diseño de formularios.

QA y validación técnica

Acompaño al equipo de QA en la etapa final para asegurar que la funcionalidad rediseñada esté libre de errores y lista para producción.

Este proyecto es real y puedes explorarlo en este enlace