¿Quién es?
Lesswatts es una empresa mexicana especializada en soluciones de eficiencia energética para la industria. Su propuesta de valor gira en torno a la implementación de tecnologías inteligentes para la reducción del consumo eléctrico y el cumplimiento de normativas ambientales.
Desafío
El sitio web anterior presentaba problemas de usabilidad, arquitectura de la información desorganizada y un diseño visual obsoleto.
El principal reto fue rediseñar la experiencia digital desde un enfoque centrado en el usuario para mejorar la comprensión del servicio, generar confianza y aumentar la captación de leads.
Mi rol
Actué como UX/UI Designer y Web Developer, liderando todas las fases del proyecto bajo la metodología de Design Thinking, desde la investigación hasta la implementación. Mis responsabilidades incluyeron:
- Investigación de usuarios y definición de arquetipos.
- Wireframing y diseño de experiencia (UX).
- Creación del Design System.
- Desarrollo del prototipo de alta fidelidad.
- Implementación responsiva en WordPress + Elementor Pro.
Herramientas
- Figma – User flows, wireframes, prototipos interactivos y sistema de diseño.
- Adobe Photoshop – Optimización de imágenes.
- Adobe Illustrator – Íconos e ilustraciones vectoriales
- WordPress + Elementor Pro – Desarrollo del sitio con enfoque modular y responsive.
Metodología UX: Enfoque de Design Thinking
¿Qué es Design Thinking?
Es una metodología centrada en el usuario que guía la resolución de problemas mediante cinco etapas iterativas: empatizar, definir, idear, prototipar y testear. Me permite diseñar soluciones digitales funcionales, empáticas y alineadas con objetivos de negocio.foque modular y responsive.
Empatizar
Realizamos entrevistas informales y benchmarks competitivos para entender las necesidades, frustraciones y motivaciones de los usuarios clave.
Definir
Con base en los hallazgos, identificamos los pain points del sitio anterior: navegación confusa, jerarquía de contenido débil, escasa conversión y diseño no responsive.
Idear
Exploramos soluciones enfocadas en la claridad, accesibilidad y conversión: navegación intuitiva, bloques visuales informativos y CTA´s claros desde el primer scroll.
Prototipar
Creamos wireframes de baja fidelidad, luego prototipos interactivos en Figma para validar flujo, contenido y jerarquía visual.
Testear
Validamos con stakeholders internos antes de la implementación para iterar sobre funcionalidades críticas como formularios, CTA, versión móvil y fichas de servicio.
User persona
Luis, 43 años
Gerente de Mantenimiento Industrial
- Objetivos: Reducir consumo energético y cumplir con normativas.
- Comportamiento digital: Requiere acceso rápido a fichas técnicas y consultoría especializada.
- Pain points: Sitios con lenguaje técnico denso y sin evidencia de experiencia previa.
Ana, 36 años
Responsable de Compras Corporativas
- Objetivos: Evaluar proveedores tecnológicos confiables.
- Comportamiento digital: Comprender los beneficios y diferenciales de los servicios.
- Pain points: Procesos poco claros y contacto difícil.
Soluciones UX/UI Implementadas
- Arquitectura de información reorganizada por niveles de prioridad.
- Diseño visual limpio con enfoque en legibilidad y escaneabilidad.
- Jerarquía tipográfica clara y contrastes fuertes para facilitar el consumo de contenido.
- Microinteracciones y CTA persistentes para fomentar la conversión.
- Diseño Mobile-First, asegurando consistencia y accesibilidad en todos los dispositivos.
- Uso de patrones de diseño reconocibles, como layout tipo F y tarjetas de servicio.
Proceso en Acción: Vistas del Proyecto
Desde los primeros trazos hasta el prototipo funcional, este proyecto fue diseñado paso a paso con base en evidencia y decisiones estratégicas. Cada una de estas etapas formó parte de un proceso iterativo, centrado en el usuario, que permitió validar decisiones y construir una experiencia digital sólida, funcional y alineada al negocio.
Aquí presento una selección de elementos clave que documentan el proceso completo:
Mapa Mental de Navegación
Estructuré las secciones y jerarquías del sitio para reorganizar el contenido de forma lógica y orientada a la experiencia del usuario.
Customer Journey Map
Analicé el recorrido del usuario desde su primera visita hasta la conversión, identificando puntos de fricción y oportunidades clave para el diseño.
Bocetos Iniciales a Mano
Esbocé ideas rápidas de layout, priorización de contenido y flujo visual antes de pasar al entorno digital, para validar conceptos de forma ágil.
Wireframes de Estructura (Figma)
Construí wireframes de baja fidelidad que definieron la arquitectura funcional del sitio, enfocados en jerarquía visual y navegación fluida.
Design System (Figma)
Desarrollé una guía de estilos reutilizable con tipografías, colores, botones, íconos y componentes, asegurando coherencia visual en todo el sitio.
Prototipo Interactivo (Figma)
Diseñé un prototipo de alta fidelidad en Figma que permitió testear la experiencia final antes de la implementación en WordPress.
Resultados Estimados
(Benchmarks del sector B2B)
Aunque no se cuenta con métricas directas post-lanzamiento, se estiman los siguientes impactos con base en casos comparables de rediseño UX/UI:
Indicador UX
Estimación Post-Rediseño
Tiempo promedio en sitio
↑ +35%
Tasa de rebote
↓ -25%
Conversiones vía formulario
↑ +40%
Velocidad de carga en móviles
↓ hasta 2.2 s
Percepción de marca
↑ mayor claridad y profesionalismo
Reflexión final
“Este proyecto fue una muestra clara del impacto del UX Research y el diseño iterativo. Al aplicar una lógica centrada en el usuario desde el inicio, logramos alinear la experiencia digital con los objetivos de negocio del cliente. La colaboración entre diseño e implementación permitió entregar un producto eficiente, escalable y con una identidad sólida.”
Contacto
No busco solo un empleo, busco aportar.
Si necesitas una diseñadora con experiencia, criterio y energía para sumar al equipo.
