Allbirds
Materiales naturales sobre lino blanco.
Allbirds funciona con una confianza serena y natural: un lienzo casi completamente acromático, complementado con arena cálida (#e0dacf) y tonos tierra apagados extraídos directamente de la fotografía de producto. La interfaz de usuario no interfiere con la experiencia del producto: superficies blancas, bordes finos, navegación en mayúsculas y controles en forma de píldora que se sienten más como botones físicos que como elementos web. Self Modern (una fuente serif personalizada) se usa para los pocos momentos cruciales que requieren atención editorial (títulos y nombres de colecciones), mientras que Geograph se usa para cada letra, texto y botón en tres grosores equilibrados. Las tarjetas de categoría se convierten en un sistema de color: cada una toma su tono de fondo del producto destacado, transformando la navegación en una paleta Pantone viva.
El ancho máximo es de aproximadamente 1200 px, centrado con un generoso relleno lateral. El elemento principal es una tira editorial de ancho completo sobre un fondo arena cálido con un gran carrusel de productos que irradia desde el centro. La navegación de categorías es una cuadrícula de cuatro tarjetas de colores idénticos en cuatro columnas, cada una con un único modelo de zapato centrado. Debajo del pliegue, el diseño alterna entre paneles divididos de ancho completo (foto de estilo de vida a la izquierda + muestra de producto a la derecha) y carruseles de productos centrados bajo un pequeño título de sección subrayado. El ritmo general es: panel editorial de ancho completo → cuadrícula de cuatro columnas → carrusel de productos centrado → división de dos columnas → carrusel de productos centrado. El espaciado entre secciones es de 40-56 px, creando transiciones ligeras pero no abrumadoras. La navegación es una barra superior fija minimalista con enlaces principales centrados.
La fotografía abarca todo el sistema visual. Todas las tomas de producto son primeros planos, desde un ligero ángulo, sobre un fondo sólido que coincide o complementa el color de acento del zapato, convirtiendo cada foto en un estudio de color. Las fotos de estilo de vida se toman en tonos cálidos y soleados, en entornos naturales (campos de agave, terrazas de madera, terrenos accidentados), con una sutil atenuación que armoniza con la paleta de colores sobria. No hay ilustraciones, ni renders 3D, ni gráficos abstractos. En colaboración con Pantone, la paleta de colores literal se utiliza como elemento gráfico. La iconografía es minimalista y monocromática (iconos de contorno en la navegación y posiciones auxiliares).
Paleta
Neutral
- Canvas White
#ffffff— Imágenes de fondo de página, superficies de tarjetas, imágenes de fondo de tarjetas de producto. - Charcoal
#212121— Se admite un color neutro para los elementos secundarios de la interfaz de usuario, los divisores y las etiquetas atenuadas. No debe utilizarse como color principal para las llamadas a la acción. - True Black
#000000— Encabezados, iconos, marcos de alto contraste, texto de navegación. - Warm Sand
#e0dacf— Fondo de la sección principal, sombreado de superficie adicional, grandes paneles editoriales. - Olive Char
#222519— Se admite un color neutro para los elementos secundarios de la interfaz de usuario, los divisores y las etiquetas atenuadas. No debe utilizarse como color principal para las llamadas a la acción. - Iron Gray
#525252— Texto secundario, texto auxiliar, marcos discretos.
Tipografía
De 12 a 40 píxeles · 6 pasos
- Self Modern — reemplazo: Playfair Display · esquemas 400 · Los titulares y el contenido editorial se utilizan con moderación, destacando frases clave y títulos de colecciones. Las tipografías con serifa y cursiva rompen la monotonía de las tipografías sin serifa y transmiten el mensaje: «Esta es la esencia de la historia».
- Geograph — reemplazo: Inter · esquemas 400, 500, 700 · La tipografía principal de la interfaz de usuario incluye texto, etiquetas de navegación, botones, encabezados de productos, pies de página, campos de entrada e iconos. Se utiliza un tamaño de 500 para los encabezados resaltados y de 700 para los nombres de los productos. El amplio espaciado entre letras (0,025em–0,10em) en mayúsculas en las etiquetas de navegación y las categorías establece un estilo de marca coherente.
- HurmeGeometricSans3 — reemplazo: Inter · esquemas 400 · Rara vez se utiliza como etiqueta de respaldo o dedicada para un botón. Geograph utiliza este sistema a diario.
Intervalos y forma
| Objetivo | Significado |
|---|---|
| Densidad | denso |
| Paso básico | 8-16px |
| Radio del botón | 9999px (pill) |
| Radio de la tarjeta | 16px |
| Oscuridad | no - bordes en lugar de sombras |
| Entre secciones | 40-56px |
| Ancho de página | 1200px |
La IA construirá tu sitio web al estilo de Allbirds y lo rellenará.
- Rellena con productos y publicaciones a través del enlace - Instagram, TikTok, Facebook.
- Transfiere el contenido de tu antiguo sitio web; solo tienes que especificar la dirección.
- Diseño moderno sobre el mejor motor: React ( Next.js) con renderizado del lado del servidor y optimización SEO integrada.
- Optimización SEO totalmente automatizada para resultados de búsqueda y recomendaciones mediante redes neuronales.
Estilos similares
- Lightship — Un diorama cinematográfico de la carretera abierta. Paredes de color crema cálido adornadas con grandes fotografías de paisajes montadas a intervalos cortos, letras negras finas apenas visibles en los marcos y un único toque de naranja brillante que rompe la monotonía como una hoguera en un prado.
- Faire ES — Catálogo mayorista de crema tibia
- Adanola — Un catálogo editorial en papel blanco. Una sesión de fotos de moda donde la tipografía y la fotografía cobran vida sobre superficies blancas impolutas, con tinta negra para la tipografía y una sutil fuente sans-serif distintiva (Favorit), que refleja el estilo general de la marca.
- Oura Ring — Un acogedor taller para hacer avena, bañado por la suave luz del día.
- Stykka — Un taller escandinavo en luz blanca: una tranquila sala de exposiciones artesanal donde la única voz es la fotografía.
- DJI — Lienzo negro aeroespacial con un único detalle en azul eléctrico.
- Altitude Beverages — Doble página de revista en blanco y negro. Imagina una doble página de una revista de moda desprovista de todo color, excepto las fotografías: el texto y el espacio en blanco cuentan toda la historia.
- AATHER — Una palma abierta, una sola llama: un lujo silencioso contenido en la quietud.
- Cowboy — Una galería de bicicletas belga en un entorno de porcelana blanca como la nieve. Una sala de exposiciones donde las superficies mates, las tipografías grandes utilizadas en los materiales editoriales y la casi total ausencia de decoración dirigen la mirada hacia la bicicleta y su contenido.
- Refero — Diseño editorial sobre mármol blanco: una página de producto creada por un tipógrafo, donde el titular con serifa es la tarjeta de presentación de la marca y todo lo demás es discreto.
- Face Formula — Un retrato editorial escandinavo. Una imagen serena, al estilo de una revista, donde la mirada de la modelo y el titular, escrito en una tipografía serif condensada, hablan por sí solos sobre un fondo brumoso y frío.
- Shupatto — Vitrina de museo sobre mármol blanco