WRW Energy: Plataforma
de contratación para un proveedor de gas natural
Industria
Energía
Comercialización minorista de servicios públicos
Servicios
Diseño UX/UI
Desarrollo frontend
Automatización backend
Sitio web
wrw.energyResumen
WRW Energy ofrece a los clientes de Enbridge Ohio Gas planes de precios fijos para el suministro de gas natural. Al inicio del proyecto, la empresa contaba con una página HTML estática: sin formulario de contratación, sin comparación de planes y sin ningún camino hacia la conversión. Todo el negocio dependía del tráfico dirigido proveniente de plataformas de comparación y socios referentes. Nos contrataron para diseñar y desarrollar una plataforma de contratación completa desde cero, en un plazo de cuatro semanas.
Problema
La audiencia llega lista para contratar, pero el sitio no le ofrecía ningún camino claro. Además, el proceso de contratación requiere datos confidenciales de la factura del servicio público: en particular, un número de cuenta de 13 dígitos que la mayoría de los usuarios no tiene a mano.
El desafío era claro: crear una plataforma digital especializada que convierta el tráfico entrante en solicitudes completadas de forma eficiente, sin fricciones y cumpliendo todos los requisitos.
Solución
Rediseñamos wrw.energy como una herramienta única de contratación. La página de inicio se abre directamente con las tarjetas de planes y precios. El formulario de contratación utiliza máscaras de campo, validación en tiempo real y guías contextuales de factura para evitar que los usuarios abandonen el proceso. Al enviar el formulario, el sistema genera automáticamente un acuerdo en PDF, lo envía por correo electrónico y transmite los datos al proveedor, todo respaldado por un panel de administración ligero que el equipo gestiona de forma independiente.
Desafío
1. El tráfico dirigido exige claridad inmediata
La audiencia de WRW llega con una decisión ya en proceso. Cualquier demora en mostrar las opciones de planes o cualquier capa de navegación innecesaria impacta directamente en la conversión. La página de inicio tenía que funcionar como el primer paso del embudo, no como un folleto informativo.
2. La contratación de servicios públicos requiere datos confidenciales y difíciles de obtener
Para contratar, el cliente debe proporcionar su número de cuenta de Enbridge de 13 dígitos y la dirección del servicio exactamente como aparecen en la factura, información que la mayoría de las personas no tiene memorizada. Sin orientación en ese momento preciso, el abandono es predecible y significativo.
3. Un contrato de energía debe transmitir confianza
Un acuerdo de suministro de gas natural no es una compra impulsiva. La interfaz tenía que transmitir legitimidad, profesionalismo y cumplimiento normativo, sin sobrecargar la página con textos legales, afirmaciones promocionales o contenido innecesario. La confianza debía surgir de la estructura, no de las palabras.
4. El backend debía ser simple y fácil de mantener
WRW no contaba con CMS ni infraestructura técnica existente. El sistema necesitaba un panel de administración ligero para gestionar los precios de los planes, generación automática de acuerdos en PDF y entrega confiable por correo electrónico, todo sin integraciones complejas ni mantenimiento técnico continuo.
5. Los documentos del acuerdo requerían un flujo de trabajo en dos etapas
La contratación no termina con el envío del formulario. Cada cliente requiere un acuerdo formal: un documento que el proveedor genera y que el usuario debe revisar y aceptar. Gestionar el ciclo de vida de este documento, desde la generación automática hasta la entrega al usuario y su confirmación, añadía una capa de complejidad operativa que debía integrarse directamente en la plataforma.
Solución
Rediseñamos wrw.energy desde cero como una herramienta única de contratación. Cada decisión de diseño y desarrollo partió de un solo principio: la selección del plan debe ser inmediata y el proceso de contratación, sin fricciones.
La página de inicio como embudo
En lugar de construir una página de inicio convencional con múltiples secciones, diseñamos la experiencia above the fold en torno a una acción directa.
El mensaje de posicionamiento, el calificador de audiencia («Para clientes de Enbridge Ohio Gas») y las cuatro tarjetas de planes son visibles en el momento en que carga la página. La primera interacción del usuario es una elección, no un recorrido por el contenido.
Comparación de planes que respeta el tiempo del usuario
Cada una de las cuatro tarjetas — 12 meses, 24 meses, 36 meses y mes a mes — muestra la duración del plan, la tarifa actual y un botón de contratación. Un enlace «Ver acuerdo» en cada tarjeta abre los términos completos del servicio en PDF en una nueva pestaña, garantizando el acceso a la información de cumplimiento antes de asumir cualquier compromiso.
El diseño es visualmente equilibrado y completamente responsive: en dispositivos móviles los elementos se apilan con claridad sin perder la jerarquía.
Formulario de contratación con validación precisa
Tras seleccionar un plan, el usuario accede a un formulario de contratación estructurado. Cada campo presente es operativamente necesario.
- El número de cuenta se enmascara en el formato Enbridge y se valida para 13 dígitos, incluidos los ceros iniciales.
- El teléfono se enmascara en formato estadounidense.
- El correo electrónico se valida en tiempo real.
- El campo Estado viene precargado con Ohio y bloqueado, eliminando una posible fuente de error.
- El botón de envío permanece inactivo hasta que todos los campos obligatorios estén completos y se acepte el Acuerdo de Términos de Servicio, lo que evita envíos parciales o inválidos.
Un campo opcional de exención fiscal ajusta el formato del CSV enviado al proveedor. La ayuda contextual, activada con el icono «?», explica el campo con claridad: «Si está exento de impuestos, indique el porcentaje de exención.»
Guía contextual de factura
Cuatro campos — Nombre del titular de la cuenta, Número de cuenta, Dirección y Consumo anual total — incluyen un botón «?» que abre un modal con una captura de pantalla anotada de la factura de Enbridge, con el campo correspondiente destacado.
Esta función elimina el principal riesgo de abandono: el usuario no sabe dónde encontrar sus datos. En lugar de redirigirlo a una sección de preguntas frecuentes o de ayuda, la respuesta aparece exactamente donde surge la duda.
Generación y entrega automática del acuerdo
Al enviar el formulario, el sistema genera un acuerdo en PDF completo con los datos del usuario. Los campos del documento se completan con precisión: nombre del titular, dirección del servicio, plan seleccionado, tarifa aplicable y fechas de inicio y fin calculadas.
La lógica de la fecha de inicio contempla un margen mínimo de un mes, con un mes adicional cuando la solicitud se realiza a partir del día 10, lo que garantiza que no se genere ningún acuerdo con una fecha de inicio imposible o incorrecta. Para los acuerdos mes a mes, la fecha de fin se indica como «vigente hasta la cancelación por cualquiera de las partes».
El acuerdo completado se entrega al instante al cliente por correo electrónico, con las direcciones internas del equipo de WRW en copia. El correo es simple, profesional y directo: sin ventas adicionales ni texto de marketing.
Panel de administración ligero
Desarrollamos un panel de administración interno minimalista: acceso protegido por credenciales, una única interfaz con los cuatro campos de tarifas, un botón de guardar y cierre de sesión. El equipo de WRW puede actualizar los precios de forma independiente, en cualquier momento, sin necesidad de intervención técnica.
Proceso
Antes de comenzar el diseño, mapeamos el recorrido completo del usuario de principio a fin: fuente de tráfico → página de inicio → selección de plan → formulario de contratación → procesamiento automático → confirmación. A partir de ese mapa identificamos los momentos exactos donde el abandono era probable: incertidumbre sobre los requisitos, dificultad para encontrar datos en la factura, dudas al completar el formulario y falta de claridad sobre los pasos siguientes tras el envío.
Cada riesgo identificado se convirtió en una decisión de diseño. Los modales de guía de factura, las máscaras de campo, el estado precargado y el botón de envío bloqueado no son elementos decorativos. Son respuestas a puntos de fallo concretos en el proceso de contratación.
Resultado
WRW Energy pasó de tener un sitio web provisional a contar con una plataforma de contratación estructurada y operativa. El producto final gira en torno a la selección del plan, elimina las fricciones en cada punto de abandono identificado, guía a los usuarios en la introducción de datos sensibles en el momento preciso en que lo necesitan y gestiona automáticamente todo el flujo posterior al envío: generación del PDF, transmisión de datos y entrega por correo electrónico.
El sitio ahora hace exactamente lo que el modelo de negocio requiere: recibe tráfico dirigido y lo convierte en solicitudes completadas, de forma simple y confiable.
Cada decisión de diseño respondía directamente a un riesgo de conversión que identificamos en el proceso de contratación.
Artyom Dovgopol, desarrollador y líder de equipo
