Bang & Olufsen
Galeria escandinava sobre porcellana. Quan la pàgina B&O és fosca, la peça s'il·lumina, com una escultura en un racó de mitjanit; quan s'il·lumina, la peça sembla surar sobre seda blanca, sense res més que distregui la seva atenció.
Bang & Olufsen funciona segons un principi de galeria-museu: llenços de porcellana gairebé blancs sobre els quals els productes suren com objectes escultòrics, interromputs per insercions cromàtiques ocasionals que abasten tota l'amplada de la pantalla —un violeta ultramarí profund que consumeix tota la pantalla, de vegades un vermell terracota intens— per a accents emocionals. La tipografia és una única tipografia neogrotesca de disseny personalitzat (BeoSupreme) que parla per si sola: gairebé imperceptible en pantalles grans, majúscules generosament omplertes en microetiquetes, sense necessitat d'altres tipografies. Els components es redueixen al mínim: controls translúcids en forma de píndola, vores primes, sense ombres decoratives, sense botons de degradat, sense icones. La quadrícula és generosa, l'espai negatiu és un luxe. Cada producte té el seu propi sòcol flotant; el blanc circumdant és espai. El color es distribueix com un material preciós: quan apareix, ocupa tot el marc.
El contenidor d'amplada màxima de 1440 px està centrat i té 25 px de marges horitzontals a les vores. L'element hero ocupa tota l'amplada de la pàgina (trencant el contenidor) i la càmera ultramarina s'estén de vora a vora. Les quadrícules de productes es disposen uniformement en 4-5 columnes amb espais de 25 px i es desplacen horitzontalment en dispositius mòbils. Les seccions alternen entre un fons blanc i càmeres de color d'amplada completa; el ritme és el següent: quadrícula de producte blanca → element hero ultramarina → quadrícula de producte blanca → bàner editorial vermell intens → quadrícula de producte blanca → peu de pàgina ultramarina. La navegació és una barra superior minimalista que sura per sobre de les seccions blanques i de color (el text s'inverteix a blanc sobre un fons fosc). La pàgina "respira": els espais entre les seccions són de 60-80 px, els productes individuals tenen el seu propi espai dins de les cel·les i no hi ha densitat d'informació.
La fotografia de producte és l'únic element visual: no hi ha imatges d'estil de vida, models ni context ambiental. Els productes es fotografien sobre fons purament neutres (blanc, negre i blau fosc degradat) amb il·luminació d'estudi controlada que ressalta els materials: alumini mat, textura de cuir, coure anoditzat i silicona mat. El retall és ajustat, centrat i s'emfatitza el subjecte principal. La reproducció del color és apagada i adequada al material: el coure es percep com a coure, no com a "hora daurada". Els motius visuals secundaris inclouen siluetes de productes disperses i a pantalla completa contra plans rics i monocromàtics (ultramarí, vermell terracota) per a moments editorials dramàtics. Iconografia: línia fina d'1 px, negre monocrom sobre blanc o blanc sobre fosc, geomètric, sense farciment, sense multicolor.
Paleta
Marca
- Ultramarine Velvet
#060daa— Imatges de fons a la part superior i inferior de les pàgines, seccions dramàtiques que abasten tota l'amplada de la pàgina i peus de pàgina: un color ric, gairebé negre-blau-violeta, que s'utilitza per englobar fotogrames sencers i donar un toc teatral a un sol producte.
Neutral
- Porcelain Canvas
#ffffff— Les imatges de fons de la pàgina, el disseny de la targeta del producte i les barres de navegació són la base fonamental sobre la qual es construeix cada producte. - Bone
#fcfaee— Una superfície secundària per a blocs de tons neutres càlids, text de botons sobre un fons fosc, un llenç alternatiu quan el blanc es percep com a estèril. - Obsidian
#191817— El text principal i el text de la descripció del producte són d'un color càlid, gairebé negre, que sembla més suau que el #000000 pur sobre un fons blanc. - Pure Ink
#000000— Contorns d'icones, microetiquetes, vores subtils i els contrastos de text més nítids. - Graphite
#555555— Text secundari, metadades, etiquetes de preu, text auxiliar silenciós - Mist
#e5e5e5— Límits de dades d'entrada prims i l'únic separador estructural del sistema.
Tipografia
de 12 a 36 px · 5 passos
- BeoSupreme — reemplaçament: Neue Haas Grotesk Display Pro (closest) · esquemes 400, 500, 700 · Una sola font que reflecteixi tota la identitat de la marca. Per a títols i encapçalaments: gruix de 500 a 700, 24 a 36 px amb espaiat entre lletres ajustat (-0,056 em → -0,014 em) per a titulars segurs i concisos. Per al text del cos i la interfície d'usuari: gruix de 400, 14 a 16 px, espaiat entre lletres normal, espaiat entre línies d'1,5 a 1,7. Microetiquetes (navegació, icones, l'eslògan "Fundada el 1925"): gruix de 500, 9 a 12 px amb espaiat entre lletres ample de fins a +0,143 em, mostrades en majúscules per utilitzar-les com a anotacions arquitectòniques discretes. No hi ha cap altra font competidora.
- object-fit: cover; object-position: center; — reemplaçament: Inter · esquemes 400 · object-fit: cover; object-position: center; - es troba a les dades extretes però no descrit per la IA.
Intervals i forma
| Propòsit | Significat |
|---|---|
| Densitat | dens |
| Pas bàsic | 8-16px |
| Radi del botó | 40px |
| Radi de la targeta | 0px |
| Ombres | sense vores en comptes d'ombres |
| Entre seccions | 60-80px |
| Amplada de la pàgina | 1440px |
La IA crearà el vostre lloc web a l'estil Bang & Olufsen i l'omplirà.
- Omple amb productes i publicacions a través de l'enllaç: Instagram, TikTok, Facebook.
- Transfereix contingut del teu lloc web antic; només cal que especifiquis l'adreça.
- Disseny modern en el millor motor: React ( Next.js) amb renderització de servidor i optimització SEO des del primer moment.
- Optimització SEO totalment automatitzada per a resultats de cerca i recomanacions de xarxes neuronals.
Estils similars
- Structured — Galeria renaixentista sobre paper semblant a la plastilina
- Apple (España) — La galeria del museu, a la llum suau del dia, és un espai blanc únic, captivador i sense pes, amb cada exposició il·luminada per un focus contra una paret lleugerament tintada.
- Apple (España) — La vitrina de la Galeria Obsidian és una sala d'exposicions fosca on un únic objecte de titani brilla sobre un fons negre com la nit.
- 099 SUPPLY — Una paret de galeria plena d'objectes en blanc i negre
- Custo — Una galeria de color bronze amb una font monolítica. Una sala d'exposició en tons verdosos i grisos apagats, on un únic objecte fosc i una font de 57 px parlen per si sols.
- Apple (España) — La Galeria del Museu Blanc al migdia
- VITURE — Una presentació de producte de neó darrere d'un vidre de mitjanit: una sala d'exposició fosca on un únic raig taronja talla la foscor, il·luminant unes ulleres sobre un suport.
- HNST Studio — Un estudi acollidor amb teles de lli tacades d'òxid és una galeria de moda lenta on un únic detall de taronja cremat escalfa l'interior, altrament monàstic, de crema i carbó vegetal.
- OFFFICE : — una galeria noir engolida per una font monolítica
- ARTU — Galeria mural sobre paper blanc. ARTU tracta l'espai de visualització com si fos un museu: fotos de productes a gran escala, marques subtils i un toc de llima a la part inferior que completa la composició.
- Specht Studio — Una paret de galeria plena de discreta curiositat. L'acabat cromat propi de l'estudi és una superfície blanca i lletres negres; els focs artificials visuals es concentren completament dins de les rajoles del projecte.
- MindMarket — Un llibre de conte de fades acollidor sobre paper crema: un llenç editorial agradable on grans titulars d'Inter i personatges de paper retallats conviuen sobre una superfície suau com un adhesiu banyada pel sol.