Santino Design

Muebles en madera maciza

De imágenes sueltas y contacto por WhatsApp a una tienda en Shopify que muestra y vende sus piezas.

Tipo: Rediseño de ecommerce
Estado: Diseño en proceso · Figma
Mi aporte: Arquitectura y diseño UX/UI
Año: 2025
Herramientas: Figma · Shopify (implementación)

Hero del rediseño de Santino Design: titular «El espacio donde tu vida ocurre.» sobre fotografía de un mueble de madera. — Fig. 01Diseño en FigmaPrimer viewport en desktop.

01Resumen

Rediseño web de Santino Design, taller de muebles en madera maciza, que se implementará en Shopify. El sitio anterior no mostraba productos: subía imágenes y dirigía el contacto a WhatsApp o a un formulario. La marca busca modernizar su imagen y la forma de presentar sus piezas. El diseño está en proceso en Figma.

Vista general de la propuesta de home, dividida en tres columnas. — Fig. 02Diseño en FigmaLa propuesta de home completa, en tres columnas que se leen de izquierda a derecha.

02Mi participación

Rol y alcance: Arquitectura de contenidos y diseño UX/UI en Figma; la implementación será en Shopify.
Colaboración: Proyecto en curso en Agencia Böll.
Entregables: Arquitectura de catálogo y navegación
Diseño de home en Figma
Diseño de página de producto en Figma

03El problema

Pasar de un portafolio de imágenes a un catálogo real: cada pieza necesita nombre, precio, material, medidas y una forma clara de comprar o cotizar, sin perder lo que distingue a un taller —el proceso artesanal—.

Diseñar pensando en Shopify: cada componente debe poder construirse y mantenerse como sección del theme.

04Decisiones clave

Cada decisión se lee como necesidad → decisión → efecto. «Esperado» indica la intención de diseño, no un resultado medido.

Decisión 01

El proceso como recorrido en cuatro pasos

Necesidad: Transmitir el valor artesanal antes de mostrar precios.
Decisión: Diseñé «Así nace cada mueble» como cuatro pasos —la conversación, la madera, el oficio, tu espacio— que cambian la imagen y el texto del paso activo.
Efecto esperado: Entender cómo se trabaja antes de llegar al catálogo.

Sección «Así nace cada mueble» con cuatro pasos numerados, fotografía de una mesa y el texto del paso activo. — Fig. 03Diseño en FigmaPasos numerados a la izquierda; imagen y texto del paso activo a la derecha.

Decisión 02

Un catálogo con precio a la vista

Necesidad: Que el cliente vea las piezas disponibles sin tener que escribir por WhatsApp.
Decisión: Diseñé «Piezas del taller» con fotografía, nombre, tipo y precio de cada pieza, y acceso a su página de producto.
Efecto esperado: Pasar de la consulta al carrito.

Sección «Piezas del taller» con fotografías de mesas, nombre de cada pieza y precio. — Fig. 04Diseño en FigmaCatálogo de piezas con nombre y precio.

Decisión 03

Una página de producto que responde todo

Necesidad: Comprar un mueble a medida requiere confianza en el material, las medidas y los tiempos.
Decisión: La ficha reúne historia de la pieza, precio, selector de madera, ficha técnica, cuidados y guía de maderas, con agregar al carrito como acción principal y cotizar o WhatsApp como alternativas.
Efecto esperado: Decidir sin salir de la página.

Página de producto «La salita de los domingos» con galería, precio, selector de madera, botones de carrito, cotizar y WhatsApp, y ficha técnica. — Fig. 05Diseño en FigmaPágina de producto con selector de madera y ficha técnica.

05Del diseño a la implementación

El diseño está en proceso en Figma. La implementación será en Shopify, con cada bloque pensado como sección editable del theme.

06Resultado y aprendizaje

Entregado: Propuesta de home y página de producto en Figma, en iteración con el cliente.
Aprendizaje: Diseñar un ecommerce para un taller es encontrar el equilibrio entre catálogo y oficio: el precio tiene que estar visible, pero el valor está en la historia de cada pieza. Diseñar ya pensando en secciones de Shopify evita sorpresas en la implementación.