Bpco
Un manifesto tipográfico feito cunha laxe de formigón. Un dossier de prensa en branco e negro onde a fonte Helvetica de gran tamaño imita unha fotografía e a única textura é unha única folla de papel engurrado debaixo da tipografía principal.
Bigpicture emprega un sistema de edición monocromático que trata a páxina web coma un dossier de prensa impreso sobre papel en bruto. A interface carece por completo de cores cromáticas, baseándose unicamente en tinta negra, espazo en branco, liñas finas e unha textura uniforme de papel engurrado para crear atmosfera. A tipografía é produto: os títulos alcanzan os 274 px en Helvetica Neue 700 cun espazado negativo agresivo entre letras, o que fai que o texto sexa a masa visual dominante en todas as pantallas. As lendas monoespaciadas ([01-N INTRODUCTION], CREATIVE/AGENCY) actúan como sinaturas de estilo impreso e as iconas brillantes de catro puntas serven como única decoración entre as seccións. A maquetación é xenerosa e lembra a autopublicación: espazos de 72 px entre seccións, marxes horizontais de 144-250 px e bloques de imaxe de ancho completo con esquinas de 288 px permiten que a páxina respire coma unha parede de galería en lugar dunha peza de software.
A anchura máxima é de ~1440 px, centrada cun recheo horizontal de 40–144 px dependendo da densidade da sección. A imaxe principal é unha imaxe de ancho completo con texto superposto. Debaixo da imaxe, o contido alterna entre bloques de texto centrados e tipografía de bordo a bordo. O 60 % inferior da páxina é un manifesto longo e desprazable, con letra grande que enche todo o ancho da ventá gráfica liña por liña, separado por filas de divisores brillantes. A navegación é unha barra flotante centrada na parte superior da ventá gráfica, en lugar dun panel de ancho completo. O pé de páxina é unha única tira cun bordo fino.
A fotografía domina a pantalla principal: grandes imaxes arquitectónicas e de publicidade exterior (carteis publicitarios, revestimentos de edificios, publicidade a pé de rúa) presentadas a tamaño completo con esquinas redondeadas. Unha textura de papel engurrado superpóñese nas seccións inferiores da páxina, creando unha sensación táctil e dándolle á interface o aspecto dunha revista impresa. Unha pequena icona dun globo terráqueo, debuxada con liñas, é o único elemento ilustrativo. Sen efectos 3D, sen gradientes abstractos, sen maquetas de produtos: as imaxes son documentais, de natureza industrial e están baseadas no catálogo de publicidade exterior da axencia.
Paleta
Neutro
- Press Ink
#121212— O texto do corpo, as liñas finas, os bordos das seccións, os contornos das iconas e o texto do pé de páxina empregan un único ton escuro que contén o 95 % de toda a información en primeiro plano. - Paper White
#ffffff— Lenzo da páxina, superficies de cartón, fondo da barra de navegación, superficies con marcos de título. - Newsprint
#f1f1f1— Recheo superficial delicado, bordos suaves, divisores finos, ton agochado tras a textura do papel engurrado. - Foil Gray
#e1e1e1— Marcos claros, acentos en forma de contornos de iconas, divisores adicionais. - Mute Gray
#c5c5c5— Texto secundario, estado da discapacidade, liñas superficiais de baixo contraste
Tipografía
de 13 a 274 px · 6 pasos
- Helvetica Neue — substitución: Inter · contornos 400, 500, 700 · Unha ferramenta universal: corpo de texto a 17 px/1,29, títulos a mostrar a 75–274 px cun espazado entre letras de -0,04 em nos tamaños máis grandes, etiquetas de navegación a 15 px
- PPSupplyMono — substitución: JetBrains Mono · contornos 400 · As metaetiquetas e as etiquetas entre parénteses como [01-N INTRODUCIÓN], así como as etiquetas de sección (PUBLICIDADE, CREATIVIDADE/AXENCIA, MÁRKETING OFFLINE) son os únicos acentos tipográficos que rompen a monotonía de Helvetica.
- PPSupplySans — substitución: Inter · contornos 400 · Navegación secundaria e microcopia no pé de páxina onde se require unha fonte sans-serif diferente.
Intervalos e forma
| Propósito | Significado |
|---|---|
| Densidade | media |
| Paso básico | 50px |
| Radio do botón | 8px |
| Radio da tarxeta | 20px |
| Sombras | sen bordos en vez de sombras |
| Entre seccións | 72px |
| Largura da páxina | 1440px |
A IA creará o teu sitio web ao estilo de Bpco e o encherá
- Enche con produtos e publicacións a través da ligazón: Instagram, TikTok, Facebook.
- Transfire contido do teu sitio antigo: só tes que especificar o enderezo.
- Deseño moderno no mellor motor: React ( Next.js) con renderización de servidor e optimización SEO listas para usar.
- Optimización SEO totalmente automatizada para resultados de busca e recomendacións de redes neuronais.
Estilos semellantes
- Steep — Análise de fontes serif en papel quente
- Newformcap — Editorial do xornal no vestiario
- Claude — Un artefacto impreso en pergamiño cálido: tinta sobre papel de óso, arxila como único alento de cor
- 11x– Digital workers — Un ermo editorial cinematográfico: fotografías panorámicas da paisaxe contra titulares monumentais con serifas que se len como a publicación dunha revista de luxo.
- Revolut — Un traballo editorial monocromo baseado nunha fotografía de nubes: tinta branca, botóns de caixa de pastillas, unha única franxa azul de cor nun mundo que doutro xeito sería en escala de grises.
- Scheduling — Tinta editorial sobre papel crema
- Titan — arquivo monocromático de tons cálidos
- Programa — Un estudo de deseño suízo ao mediodía. A parede branca da galería está iluminada por unha única lámpada de mesa amarela; todo está en tons grises ata que un botón, unha icona ou un detalle chama a atención, e entón ese único detalle amarelo define toda a habitación.
- Sana Agents — Brillo de lima sobre fondo branco no editorial
- Visual — Samizdat editorial cálido. Papel crema, pósteres serif, marxinal monocromático, un rotulador amarelo.
- Midday — Folleto editorial en pergamiño: título con serifas de 72 px sobre un fondo de pedra cálida, corpo de texto sans-serif con espazado, controis en forma de pílula, sen sombras
- Chat for impact — Unha clínica verde bosque con habitacións en cores pastel