DEL LOGO
A LA WEB.
Diseñamos la nueva interfaz de Náutica Cook para acompañar el restyling de su marca, aplicando un sistema visual coherente a todo su catálogo — embarcaciones, motores y motos de agua organizados por astillero.
VER CASO ↓
01 — EL CONTEXTO
NECESIDAD
DE CAMBIOS.
Náutica Cook acababa de renovar su identidad visual con un restyling de logo. Ya tenía web y una estructura armada de catálogo organizado por astillero, pero la interfaz no reflejaba la nueva marca.
Entramos al proyecto en una etapa avanzada para resolver puntualmente eso: traducir el restyling al UI de toda la web, manteniendo la arquitectura existente pero subiendo el estándar visual.
02 — EL DESAFÍO
PONER LA INTERFAZ A LA
ALTURA DE LA MARCA.
La marca evolucionó, la web no
El nuevo logo pedía un sistema visual más moderno. La interfaz anterior arrastraba una estética que ya no representaba a la empresa.
UI fragmentado en el catálogo
Embarcaciones, motores y motos de agua se veían diferentes entre sí. Faltaba un sistema visual común que diera coherencia al recorrido.
Mobile sin acompañamiento
Las consultas llegan en su mayoría desde el celular, pero la experiencia mobile no estaba pensada para explorar un catálogo amplio.
03 — EL PROCESO
CÓMO LO RESOLVIMOS.
DECISIÓN 01 · SISTEMA VISUAL
Traducir el logo al UI.
Definimos paleta, tipografía y jerarquía a partir del nuevo logo. Un sistema visual común aplicable a las tres categorías —embarcaciones, motores y motos de agua— para que toda la web hablara el mismo idioma.
DECISIÓN 02 · ENTRADA POR ASTILLERO
La marca primero, el modelo después.
Diseñamos la vista de categoría como una grilla de astilleros. El usuario reconoce primero la marca que le interesa —Bermuda, Canestrari, Lerch— y desde ahí accede a los modelos disponibles.
DECISIÓN 03 · FICHA DE MODELO
Cards limpias, foco en el producto.
Para la vista de modelos dentro de un astillero, una card centrada en la imagen del producto con nombre debajo. Aire, jerarquía y consistencia para que la lectura del catálogo sea simple en desktop y mobile.
04 — LA SOLUCIÓN
UN UI QUE ACOMPAÑA
EL RECORRIDO.
Un sistema visual alineado al restyling, cards de astillero y de modelo coherentes entre sí, y una jerarquía clara desde categoría hasta producto.
05 — EL IMPACTO
RESULTADOS
TANGIBLES.
* Valores estimados a partir del rediseño
06 — APRENDIZAJES
El UI no es decoración:
traduce la marca
al producto.
— PR. DIGITAL STUDIO