Es una empresa dedicada a la venta de pinturas y herramientas. A través del sitio web desarrollado, ofrece cerca de 200.000 colores de más de 100 marcas diferentes. MyPerfectColor.com permite una selección de colores sin precedentes, con la posibilidad de elegir tonos más claros o más oscuros de cada pintura en el mismo proceso de compra. El sitio se accede en https://www.myperfectcolor.com
El sitio web fue desarrollado con un sistema PHP hecho completamente a medida, posee muchos efectos con jQuery™ y ajax que le dan un aspecto moderno. Se utilizan slider y popup para las imágenes. Se cargan módulos configurados para cada vista y según el usuario. La tienda online posee la vista Mi Carro la cual muestra los productos que se han agregado. Allí se puede editar, aumentar o reducir la cantidad o bien eliminar cualquier producto.
Dentro del sistema, la funcionalidad mas importante es el proceso de compras. Para ello, implementamos una forma única de seleccionar el color y el tipo de pintura disponible. Una vez agregados al carro de compras, el sistema calculará automáticamente el peso y volumen total (todos los productos) para hacer una consulta utilizando el Web Service de FedEx™, mostrar los distintos tipos de envío disponibles y sus precios según la dirección donde deben enviarse. El sistema de pago integrado es Stripe el cual permite pagar a través de las cuatro tarjetas de crédito más utilizadas del mercado. Todo el sitio utiliza conexión segura (SSL/TLS) certificada.
Además, integramos CloudFlare para incrementar seguridad y performance.
El framework (sistema ERP + e-commerce)
El cliente quería tener su propio framework para este proyecto, es por eso que en 2009 desarrollamos un nuevo sistema MVC basado en PHP en la primera etapa del proyecto. Este sistema incluye todas las prestaciones que pueda ofrece cualquier otro framework MVC: despachadores, capas de seguridad, manejadores de sesión, plugins y extensiones, temas, etc
Para las búsquedas se utiliza Solr™ de Apache™ que es un potente motor de búsqueda el cual permite realizar complejas búsquedas personalizadas. En las páginas de búsqueda se integra un módulo de filtros el cual permite realizar búsquedas avanzadas. El módulo de búsqueda utiliza la funcionalidad de Autocompletar a través de Ajax y JQuery Las páginas de categorías muestran todos los productos y colores asociados a dicha categoría. También tiene la posibilidad de crear subcategorias y facilitar la navegación entre cada una a través del breadcrumb (árbol de navegación).
Cualquier visitante puede registrarse en el sitio y transformarse en un "cliente" con la habilidad de crear contenidos, comprar productos, compartir sus comentarios y preguntas, etc. Tanto los usuarios como los visitantes pueden compartir las páginas en las más conocidas redes sociales (botones y acciones a través de AddThis.com).
Se integra un blog utilizando WordPress, un sistema pensado para facilitar la creación de los artículos y donde los usuarios pueden compartir su opinión dejando comentarios.
El sistema proporciona un completo panel de administración donde los administradores pueden gestionar todo el sitio, permitiendo agregar, ver, editar y eliminar usuarios, colores, productos, métodos de pago, métodos de envío, pedidos generados y la facturación correspondiente. El panel de administración también proporciona diferentes interfaces donde se pueden cambiar los nombres de los productos, precios, subir imágenes, pinturas y colores asociadas. La característica principal del sistema es el color, eso es porque hemos implementado un gestor de interfaz de color de gran alcance. El administrador puede agregar, editar, eliminar, clasificar y relacionar colores y pinturas. Son capaces de utilizar un generador de imagen inteligente (RGB y de color LAB espacios) para asociar una imagen a color, esto se muestra en la página de color pública para referencia.
El gestor de ordenes provee interfaces para supervisar todas las compras desde su inicio a su envio, el seguimiento de los pagos y el reembolso, añadir o eliminar los productos de un pedido abierto, enviar notas públicas a los clientes e incluso añadir notas privadas para el resto del personal. El administrador es capaz de exportar e imprimir las etiquetas de envío, hemos implementado un servicio Web de FedEx para este propósito. El sistema también proporciona un panel de estadística para ver todas las ventas y ganancias para el año en curso, comparación con años anteriores, gráficos y tablas con toda la información que el personal necesita para dirigir el negocio.
En Julio de 2019 comenzamos a implementar una actualización completa del sistema, integrando Bootstrap 4, gulp y SCSS al template del framework. Esto permitió optimizar mucho mas las paginas de los productos y checkout, mejorando claramente la experiencia de usuarios en todo el proceso de compras. La conversion de ordenes aumentó notablemente con esta actualización.
Migración de Authorize.net a Stripe
En Agosto de 2019 implementamos una migración en la pasarela de pagos. Debido a limitaciones de Authorize.net y a las ventajas que Stripe ofreció al cliente, planificamos y ejecutamos la migración para el método de pago online. Dentro del workflow normal la tienda permite pagar con tarjetas de débito o crédito, al integrar Stripe también permitimos que los usuarios del sistema puedan asociar estas tarjetas con su cuenta en MyPerfectColor de manera tal que en futuras ordenes solo deben elegir la tarjeta en un selector y proceder con un click.
Dentro de las opciones extras en el panel de administrador, implementamos la posibilidad de asignar y quitar tarjetas de crédito asociadas a clientes. Otra funcionalidad requerida por nuestro cliente era la posibilidad de efectuar pagos de forma asíncrona, es decir un usuario puede generar una orden sin pagar, luego de confirmar el costo final de la orden se le envía un email con el monto actualizado y un link para poder seguir el pago dentro de la plataforma.
Integración de taxes e invoices de Stripe
En octubre de 2023, implementamos una solución integral para optimizar la gestión de impuestos y pagos para nuestro cliente, que opera en múltiples estados de Estados Unidos. Automatizamos el cálculo de impuestos mediante la integración de Stripe Invoices, lo que permitió la determinación automática de los impuestos correspondientes a cada estado según la información proporcionada por el cliente. Esto eliminó la necesidad de cálculos manuales y garantizó la precisión en la facturación. Además, conectamos Stripe con TaxJar para automatizar la generación de informes de impuestos, reduciendo significativamente la carga de trabajo del cliente y minimizando el riesgo de errores.
También implementamos un sistema flexible de gestión de pagos, permitiendo la aplicación de notas de crédito para ajustes en precios e impuestos, tanto desde el panel de administración como a través de la plataforma de Stripe. Para mantener la sincronización de la información de pagos en tiempo real entre ambas plataformas, utilizamos los webhooks de Stripe, asegurando así la precisión y la integridad de los datos.
Para ofrecer una experiencia de pago segura y personalizada, desarrollamos un formulario de pago a medida utilizando Stripe Elements. Esta solución no solo garantiza la protección de los datos de los clientes, sino que también permite adaptar el proceso de pago a las necesidades específicas del cliente, reforzando así su identidad de marca.
Productos de Stripe usados:
Stripe Payments: Procesamiento de pagos, cargos y facturación.
Stripe Billing combinando facturación y clientes recurrentes
Stripe Elements: Creando elementos de formulario personalizado de pagos e integrado a nuestro template custom.
Stripe Tax: Automatización de impuestos en cada transacción.
Stripe Radar: Detección de pagos sospechosos y fraudes.
Notas adicionales
Hemos migrado de Bootstrap 4 a Bootstrap 5, optimizando la carga de scripts al separarlos por cada página e importando solo lo necesario. La tarea de gulp se encarga de generar el JS final minificado. Integramos Invoices utilizando Payments de Stripe, permitiendo el cálculo automático de impuestos para cada compra y la generación fácil de reportes a través de TaxJar. Además, utilizamos desde hace tiempo Radar para marcar manualmente órdenes que pueden presentar un riesgo en el pago, facilitando su evaluación.
Implementamos una cola de tareas usando pm2 y Express, que permite ejecutar tareas en segundo plano ante ciertos eventos, como la creación o actualización de un cliente, registrando información de clientes en Hubspot CRM. Mantenemos y damos soporte a los scripts de Python desde la cola de tareas, que también automatizan tareas como el envío de correos electrónicos por deduas vencidas y la sincronización de Hubspot.
Para garantizar la calidad, tenemos un set de tests automáticos implementados con CodeceptJS que valida los flujos más comunes del checkout y asegura la correcta sincronización con Stripe. Además, desde hace un par de años, hemos implementado ShipperHQ para gestionar de manera flexible los métodos de envío, permitiendo al cliente administrar reglas, tamaños de paquetes, grupos de productos y métodos de envío disponibles sin necesidad de actualizar la plataforma.
Cabe destacar que hemos logrado mantener el sistema actualizado, corriendo con tecnologías modernas como Bootstrap 5 y PHP 8.2, obteniendo buenas métricas en Core Vital (pagespeed).
También estamos trabajando en la migración del nuevo panel de administrador de órdenes, con una interfaz más moderna y acorde a las necesidades actuales de la empresa, que incorpora progresivamente nuevas funcionalidades, como una mejor gestión de fórmulas y sus componentes para cada color. Dentro de la linea de producción, cada empleado involucrado en la fabricación de pinturas personalizadas tiene la posibilidad de usar un iPad que cargará este nuevo panel de gestión. En este sistema administrador, desarrollamos un template basado en React 17 y MUI, con un websocket conectando el sistema legacy para gestionar las actualizaciones de órdenes e ítems en tiempo real.
Finalmente, hemos automatizado algunas tareas utilizando scripts de Python que conectan Zapier para ciertas integraciones directas con la base de datos. En cuanto a los scripts de Python, hemos colaborado tambien con actualizaciones de paquetes, mejoras de seguridad y rendimiento.
