Catusita
Catusita es un grupo de empresas dedicado a la importación y comercialización de autopartes. El proyecto consistió en diseñar una nueva experiencia web que permitiera presentar la compañía, organizar su amplio catálogo de productos y facilitar el acceso a información relevante para sus clientes.
El proyecto
Una nueva experiencia digital para Grupo Catusita
Grupo Catusita es una empresa peruana especializada en la importación y distribución de productos para el mantenimiento automotriz, con un portafolio que incluye autopartes, filtros, lubricantes, neumáticos y repuestos para vehículos livianos y pesados.
El proyecto consistió en rediseñar su presencia digital y construir una experiencia web responsive capaz de organizar y presentar un amplio ecosistema de productos, marcas y servicios. La propuesta buscó crear un punto de entrada más claro hacia la compañía: permitir que los usuarios conozcan el grupo, exploren sus líneas de productos, identifiquen las marcas disponibles y encuentren rápidamente los canales para contactar con la empresa.
El reto
Organizar un catálogo amplio sin convertir la experiencia en un catálogo complejo.
Estructurar múltiples categorías, productos y marcas para que los usuarios pudieran entender la oferta y encontrar rápidamente lo que necesitaban.
Construir una arquitectura clara que conectara la información corporativa con el catálogo, evitando que la cantidad de contenido hiciera compleja la experiencia.
Diseñar una interfaz responsive que mantuviera la jerarquía, legibilidad y acceso a los contenidos principales tanto en desktop como en dispositivos móviles.
Decisiones que definieron el producto
El producto como eje de la experiencia
Las líneas de productos se organizaron por categorías y se les dio un espacio protagonista dentro de la navegación y la página principal, facilitando el acceso a la oferta de Catusita.
Menos pasos entre el usuario y el producto que está buscando.
Las marcas como referencia
La variedad de marcas se incorporó como un segundo nivel de exploración, permitiendo mostrar la amplitud del portafolio y relacionar las marcas con la oferta de productos.
Productos y marcas funcionan juntos para facilitar la exploración del catálogo.
Una estructura que se adapta
La interfaz se construyó sobre una grilla de 12 columnas y una estructura modular, permitiendo reorganizar los contenidos entre desktop y mobile manteniendo jerarquía y consistencia.
Una misma lógica de contenido, adaptada a diferentes tamaños de pantalla.
Exploración
Exploramos distintas formas de organizar productos, categorías y marcas hasta encontrar una estructura que permitiera mostrar la amplitud de la oferta sin hacer más compleja la navegación.
arrastra →
v1 — Organización del contenido
v2 — Estructura y jerarquía
v3 — Composición de interfaz
v4 — Adaptación responsive
El producto
Una plataforma que se lee de un vistazo y se opera con teclado.
Aprobar desde el móvil sin abrir el escritorio: la misma jerarquía, un solo gesto.
Diseñar el sistema, no solo las pantallas.
La propuesta visual se construyó a partir de reglas compartidas para que las distintas páginas mantuvieran una misma lógica, en lugar de resolver cada pantalla de manera independiente.
Una estructura de 12 columnas permitió ordenar los contenidos, mantener proporciones consistentes y establecer una base adaptable para las diferentes resoluciones.
Se definieron jerarquías tipográficas para diferenciar navegación, títulos, categorías, descripciones y contenido complementario, facilitando la lectura en páginas con bastante información.
El azul de Catusita funciona como color principal de la experiencia, acompañado del rojo como acento y una escala de neutros para organizar los distintos niveles de información.
Se desarrolló un lenguaje gráfico consistente para representar beneficios y contenidos de apoyo, reduciendo la dependencia del texto y facilitando el reconocimiento visual.
Las mismas reglas de composición se trasladaron a mobile, reorganizando bloques y jerarquías en lugar de simplemente reducir la interfaz de desktop.
Lo que me dejó este proyecto
Cuando existe una gran cantidad de productos, marcas y contenidos, organizar y jerarquizar la información es tan importante como diseñar la interfaz.
Definir reglas de composición desde el inicio ayuda a mantener una experiencia consistente entre diferentes páginas y dispositivos.
Diseñar para mobile no significa reducir la versión desktop, sino priorizar y reorganizar el contenido según el espacio disponible.
Una estructura visual simple puede hacer que un catálogo complejo sea más fácil de entender, explorar y mantener.
¿Tienes un proyecto en mente?
Hablemos →