Caso · Marca y tienda

Rebon: una marca para un producto que el cliente no entiende

Daniel Hauser
· 3 min de lectura
Rebon: una marca para un producto que el cliente no entiende

La filtración de agua es un producto en el que el cliente no tiene idea de qué está comprando. No conoce la composición de su agua, no entiende la diferencia entre los cartuchos y no tiene forma de juzgar si una oferta es buena. Para una marca eso significa una sola cosa: tiene que responder antes de empezar a hablar de sí misma.

1marca del logotipo a la tienda
4equipos en una familia visual
27páginas con un aspecto único
9iconos de lo que sale del agua

Punto de partida: ninguna marca

Rebon empezó de cero. Sin logotipo, sin color, sin web. Y vende un producto en el que es fácil caer en el aspecto de laboratorio: fondo blanco, azul, gráficos de eficacia, certificados. Ese aspecto parece experto y justo por eso no funciona: el cliente tiene miedo de su agua, no interés por los adsorbentes.

Decidimos ir en sentido contrario. No laboratorio, sino cocina. No prueba a primera vista, sino tranquilidad.

Un signo que sostiene toda la marca

El logotipo se apoya en una sola figura: una gota trazada con una línea azul y, dentro, trazos verdes de hoja. Agua y naturaleza en una forma, sin pie que lo explique. El mismo motivo vuelve en la letra O de REBON, de modo que la marca aguanta donde tiene que caber en un círculo: una foto de perfil, un favicon, una etiqueta.

Todo lo demás salió de ese par de colores. El azul lleva el agua y la confianza, el verde lo natural y la idea de que esto es una solución y no química. No añadimos un tercero.

En un producto técnico, el diseño no está para hacerlo interesante. Está para hacerlo comprensible antes de que la persona se asuste.
REBON, úvodní stránka e-shopu s filtrací vody
Una gota en el logotipo, azul y verde en toda la página, el producto sobre la encimera. Un mismo lenguaje de la marca a la foto.

El producto sobre la encimera, no sobre fondo blanco

Los visuales de producto muestran los equipos donde realmente están: bajo el fregadero, sobre la encimera, junto a un vaso de agua. Hay una razón práctica y otra de contenido. Práctica: se ve de inmediato el tamaño y cuánto espacio ocupa bajo el fregadero. De contenido: la foto responde a la pregunta que uno se hace primero, ¿me cabe, y va a parecer un taller?

La misma regla rige los iconos y los esquemas. El bloque filtrante está dibujado como el camino del agua, no como un plano técnico. Las nueve cosas que desaparecen del agua recibieron cada una su icono, para que el resumen se lea antes de empezar a leer.

Por qué el diseño y la construcción van juntos

El diseño de la tienda nació junto a la estructura de las páginas, no después. Esa diferencia se nota en el resultado:

  • El orientador origen del agua → qué resuelve → por dónde empezar está diseñado como parte de la página, no como un añadido posterior.
  • Las páginas de contenido sobre elegir filtro o sobre el agua de pozo tienen aspecto propio, porque se diseñaron a la vez que se pensaron.
  • Los segmentos fuera del hogar — oficinas, hostelería, acuariofilia, casas de campo — tienen su propia entrada, y esa entrada cupo en el diseño porque estaba prevista.

El sitio lo construyó, a partir del diseño, nuestro estudio hermano Developer Online sobre la plataforma Upgates. Del contenido dirigido a la búsqueda se encargó Independency, que ha escrito su propia mirada sobre la estructura según la búsqueda.

El resultado

Una marca que se ve igual en el logotipo, en la foto de producto y en una página sobre agua de pozo. Y una tienda donde uno sabe qué compra antes de llegar al precio. El proyecto completo está en la referencia Rebon.

¿Tienes un proyecto parecido?

Escribe unas líneas sobre lo que necesitas. Te respondo personalmente.

Hablar del proyecto

Más artículos

Una web que la IA pueda leer: qué significa para el diseño y la construcción

Una web que la IA pueda leer: qué significa para el diseño y la construcción

Una página bonita puede llegarle vacía a la máquina. Cuatro decisiones de diseño que lo provocan y por qué esto no significa hacer webs aburridas.

Google se llevará sus vídeos por su cuenta. La marca deja de decidir qué la representa

Google se llevará sus vídeos por su cuenta. La marca deja de decidir qué la representa

Desde el 23 de octubre Performance Max toma hasta diez vídeos de sus redes y su web para los anuncios. No es un ajuste publicitario, es conducción de marca.

Una marca que aguanta varios mercados

Una marca que aguanta varios mercados

En una expansión suele romperse antes la marca que las campañas. Qué debe quedar igual en cada país, qué tiene que doblarse y por qué se decide en el primer envase y no en el quinto mercado.

Un envase que también tiene que funcionar en miniatura

Un envase que también tiene que funcionar en miniatura

Hoy la mayoría ve un envase por primera vez como un cuadradito en un comparador, no en el lineal. Qué sobrevive a la reducción, qué se pierde y por qué se decide antes del primer trazo.

Hecho a mano frente a la perfección de la IA: por qué vuelve lo imperfecto

Hecho a mano frente a la perfección de la IA: por qué vuelve lo imperfecto

Cuando cualquiera puede generar un visual pulido, lo pulido deja de significar cuidado. Qué le hace eso a las marcas, dónde dejamos entrar a la IA y dónde sigue habiendo una mano sobre el papel.

¿Estudio pequeño o gran agencia? Lo que pagas de verdad

¿Estudio pequeño o gran agencia? Lo que pagas de verdad

Por qué un experto con herramientas modernas y una red de especialistas suele dar más que una gran agencia. Y por qué los clientes vuelven años después.

Cómo la IA acelera nuestro trabajo (y dónde no la dejamos decidir)

Cómo la IA acelera nuestro trabajo (y dónde no la dejamos decidir)

Esta web en ocho idiomas nació en dos días. Así trabajamos con agentes de IA, qué hemos creado a su alrededor y por qué siempre decide una persona.

AXA Racing: tres marcas, una web y plataforma propia en días

AXA Racing: tres marcas, una web y plataforma propia en días

Cómo unificamos los datos de Polaris, CFMOTO y GOES en una sola web con administración propia. Hecha con Next.js, primera versión en tres días.