Cosmética profesional de lujo

Una tienda más rápida para cada tipo de cliente.

Migramos la tienda de Casmara a Next.js con un backend a medida: carga más rápida, buscador mejorado y catálogos diferenciados para clientes hogar y profesionales.

Servicio: E-commerce
Año: 2024
Duración: 4 meses
Equipo: 3 personas

Laptop con la nueva tienda online de Casmara junto a productos de la marca

El reto

Migrar todo el e-commerce a un nuevo stack sin detener la venta, con productos variables e imágenes pesadas.

Lo que hicimos

Next.js con API y base de datos propias, un panel de gestión autónomo y roles que separan el catálogo hogar del profesional.

El resultado

Carga mucho más rápida, un buscador más preciso y un equipo que actualiza productos y banners sin depender de terceros.

01 · OBJETIVO

Velocidad y un catálogo fácil de gestionar

El objetivo principal fue migrar y optimizar la plataforma de venta online de Casmara Chile, enfocándonos en incrementar la velocidad y mejorar la gestión de su catálogo de productos. Además, se buscó modernizar la experiencia de compra, creando un diseño limpio que guiara al usuario de manera intuitiva y facilitara la toma de decisiones.

Celular con resultados de búsqueda de cremas hidratantes en la tienda de Casmara

02 · DESAFÍO

Migrar sin frenar el negocio

El proyecto presentó desafíos complejos tanto en el ámbito de la arquitectura técnica como en el diseño de la interfaz. Tuvimos que realizar una migración completa a un nuevo stack tecnológico sin afectar el funcionamiento del negocio, lo que requirió una planificación meticulosa. Además, el diseño de la interfaz se centró en simplificar la navegación y destacar la información relevante de los productos, en un sector donde la estética es crucial.

Desafío técnico

• Migración a Next.js: El mayor desafío fue la transición de la plataforma a un framework moderno como Next.js para asegurar un rendimiento superior y un mejor SEO, minimizando cualquier impacto negativo en la operación.
• Backend a medida: Se diseñó una aplicación de backend personalizada para permitir una gestión de productos, inventario y banners mucho más cómoda y eficiente.
• Optimización de imágenes y velocidad: Enfrentamos el reto de reducir el peso de las imágenes de los productos y banners sin perder calidad visual, vital para un e-commerce del sector belleza.
• Productos compuestos y variables: Enfrentamos el reto de la clasificación, discriminación y carga de productos, y su optimización de búsqueda.
• Modulo de Usuarios registrados: Discriminación entre tipo de usuario y los productos a la venta destinados a los tipos de usuario.

También

Se realizó un estudio de UX/UI para crear una interfaz limpia y minimalista que prioriza el producto, facilitara la lectura de descripciones y guiara al usuario hacia la compra de manera natural.

Escritorio de desarrollo con la tienda antigua cargando, código y notas sobre migración, variantes e imágenes pesadas

03 · SOLUCIÓN

Next.js, backend propio y catálogos por rol

Implementamos una arquitectura escalable y modular utilizando las mejores prácticas del desarrollo web moderno y tecnologías de vanguardia. La solución se basó en una migración completa a Next.js, lo que nos permitió construir un sitio web de alto rendimiento, con un backend optimizado para la gestión de contenido.

Cómo lo hicimos

• Arquitectura: React + Next.js con una API personalizada y base de datos optimizada para un alto rendimiento en la carga de productos y consultas.
• Diseño: Se desarrolló una interfaz de usuario limpia y minimalista, con una jerarquía de información clara y una navegación intuitiva, ideal para el sector de la cosmética

Tablet con el panel de administración de productos y la tienda con catálogo hogar y profesional

Resultados

Mejora drástica en la velocidad de carga, resultando en una mejor experiencia de usuario y un mejor ranking SEO.
Backend de fácil gestión, permitiendo al equipo de Casmara actualizar el catálogo de productos y banners de manera autónoma y eficiente.
Diseño responsivo y pulido que asegura una experiencia de compra óptima en cualquier dispositivo.
Mejora en la usabilidad del buscador, permitiendo a los usuarios encontrar productos de forma rápida y sencilla.
Sistema automatizado para discriminar usuarios y producto: mediante roles de usuarios, en este sistema se discriminan los productos y así como usuarios. De esta manera se obtiene una web e-commerce con catálogo de productos diferenciados para clientes hogar y profesionales.

Herramientas y servicios

Next.jsFramework de React para el desarrollo Frontend.

FigmaHerramienta para el diseño UI/UX.

PostgreSQLBase de datos

AWS AmplifyPara el hosting y despliegue del proyecto.

Optimización SEOOptimización SEO

Diseño UI/UXDesarrollo FrontendBackend & APIOptimización de Banners y ContenidoMejoras en el BuscadorResponsive Design

Siguiente proyectoDiseño y contenido visual · Casmara ChileVer caso →

¿Quieres resultados así para tu negocio?

Cuéntanos qué necesitas y te mostramos cómo lo haríamos.

Hablemos de tu proyecto

Velocidad y un catálogo fácil de gestionar

Migrar sin frenar el negocio

Desafío técnico

• Migración a Next.js: El mayor desafío fue la transición de la plataforma a un framework moderno como Next.js para asegurar un rendimiento superior y un mejor SEO, minimizando cualquier impacto negativo en la operación.
• Backend a medida: Se diseñó una aplicación de backend personalizada para permitir una gestión de productos, inventario y banners mucho más cómoda y eficiente.
• Optimización de imágenes y velocidad: Enfrentamos el reto de reducir el peso de las imágenes de los productos y banners sin perder calidad visual, vital para un e-commerce del sector belleza.
• Productos compuestos y variables: Enfrentamos el reto de la clasificación, discriminación y carga de productos, y su optimización de búsqueda.
• Modulo de Usuarios registrados: Discriminación entre tipo de usuario y los productos a la venta destinados a los tipos de usuario.

También

Se realizó un estudio de UX/UI para crear una interfaz limpia y minimalista que prioriza el producto, facilitara la lectura de descripciones y guiara al usuario hacia la compra de manera natural.

Next.js, backend propio y catálogos por rol

Cómo lo hicimos

• Arquitectura: React + Next.js con una API personalizada y base de datos optimizada para un alto rendimiento en la carga de productos y consultas.
• Diseño: Se desarrolló una interfaz de usuario limpia y minimalista, con una jerarquía de información clara y una navegación intuitiva, ideal para el sector de la cosmética

Resultados

Mejora drástica en la velocidad de carga, resultando en una mejor experiencia de usuario y un mejor ranking SEO.

Backend de fácil gestión, permitiendo al equipo de Casmara actualizar el catálogo de productos y banners de manera autónoma y eficiente.

Diseño responsivo y pulido que asegura una experiencia de compra óptima en cualquier dispositivo.

Mejora en la usabilidad del buscador, permitiendo a los usuarios encontrar productos de forma rápida y sencilla.

Sistema automatizado para discriminar usuarios y producto: mediante roles de usuarios, en este sistema se discriminan los productos y así como usuarios. De esta manera se obtiene una web e-commerce con catálogo de productos diferenciados para clientes hogar y profesionales.

Herramientas y servicios

Next.jsFramework de React para el desarrollo Frontend.

FigmaHerramienta para el diseño UI/UX.

PostgreSQLBase de datos

AWS AmplifyPara el hosting y despliegue del proyecto.

Optimización SEOOptimización SEO

Diseño UI/UXDesarrollo FrontendBackend & APIOptimización de Banners y ContenidoMejoras en el BuscadorResponsive Design

Una tienda más rápida para cada tipo de cliente.

Velocidad y un catálogo fácil de gestionar

Migrar sin frenar el negocio

Next.js, backend propio y catálogos por rol

Resultados

Herramientas y servicios

¿Quieres resultados así para tu negocio?

Cuéntanos tu proyecto y te escribimos hoy.

Déjanos tus datos

Una tienda más rápida para cada tipo de cliente.

Velocidad y un catálogo fácil de gestionar

Migrar sin frenar el negocio

Next.js, backend propio y catálogos por rol

Resultados

Herramientas y servicios

¿Quieres resultados así para tu negocio?