Bpco
Isang manipesto ng tipograpiko na gawa sa isang tipak ng kongkreto. Isang itim at puting press kit kung saan ang napakalaking Helvetica font ay ginagaya ang isang litrato, at ang tanging tekstura ay isang piraso ng gusot na papel sa ilalim ng pangunahing typeface.
Gumagamit ang Bigpicture ng monochrome editing system na tinatrato ang webpage na parang isang printed press kit na nakalagay sa hilaw na papel. Ang interface ay ganap na walang mga chromatic na kulay, umaasa lamang sa itim na tinta, puting espasyo, manipis na linya, at isang pare-parehong tekstura ng gusot na papel upang lumikha ng kapaligiran. Ang tipograpiya ay produkto: ang mga heading ay umaabot sa 274px sa Helvetica Neue 700 na may agresibong negatibong espasyo sa mga letra, na ginagawang ang teksto ang nangingibabaw na visual mass sa bawat screen. Ang mga monospaced caption ([01-N PANIMULA], CREATIVE/AGENCY) ay nagsisilbing mga lagda sa istilo ng pag-print, at ang mga makintab na icon na may apat na tulis ay nagsisilbing tanging dekorasyon sa pagitan ng mga seksyon. Ang layout ay malawak at nakapagpapaalaala sa self-publishing—72px na puwang sa pagitan ng mga seksyon, 144-250px na pahalang na margin, at mga full-width na image block na may 288px na sulok ay nagbibigay-daan sa pahina na huminga na parang isang gallery wall sa halip na isang piraso ng software.
Ang pinakamataas na lapad ay ~1440px, nakasentro na may pahalang na padding na 40–144px depende sa densidad ng seksyon. Ang hero image ay isang full-width na imahe na may nakapatong na teksto. Sa ibaba ng imahe, ang nilalaman ay nagpapalitan sa pagitan ng mga nakasentrong bloke ng teksto at tipograpiya mula gilid hanggang gilid. Ang 60% sa ibaba ng pahina ay isang mahaba at nag-iiskrol na manifesto, na may malaking tipo na pumupuno sa buong lapad ng viewport linya por linya, na pinaghihiwalay ng mga hanay ng makintab na divider. Ang nabigasyon ay isang lumulutang na bar na nakasentro sa itaas ng viewport, sa halip na isang full-width na panel. Ang footer ay isang strip na may manipis na border.
Nangingibabaw ang potograpiya sa pangunahing screen—malalaking imahe ng arkitektura at panlabas na advertising (mga billboard, cladding ng gusali, advertising sa antas ng kalye) na inihaharap nang buong laki na may mga bilugan na sulok. Isang gusot na tekstura ng papel ang nakapatong sa ibabang bahagi ng pahina, na lumilikha ng pakiramdam na parang hinahawakan at nagbibigay sa interface ng hitsura ng isang naka-print na magasin. Isang maliit na icon ng globo, na iginuhit gamit ang mga linya, ang tanging elementong naglalarawan. Walang 3D effect, walang abstract gradients, walang product mockups—ang mga imahe ay dokumentaryo, pang-industriya, at batay sa portfolio ng panlabas na advertising ng ahensya.
Paleta
Neutral
- Press Ink
#121212— Ang body text, manipis na linya, border ng seksyon, mga balangkas ng icon, at footer text ay pawang gumagamit ng iisang madilim na tono na naglalaman ng 95% ng lahat ng impormasyon sa foreground. - Paper White
#ffffff— Canvas ng pahina, mga ibabaw na karton, background ng navigation bar, mga ibabaw na may mga title frame. - Newsprint
#f1f1f1— Maselan na pagpuno sa ibabaw, malalambot na hangganan, manipis na mga divider, tonong nakatago sa likod ng tekstura ng gusot na papel. - Foil Gray
#e1e1e1— Mga light frame, mga accent sa anyo ng mga balangkas ng icon, mga karagdagang divider. - Mute Gray
#c5c5c5— Pangalawang teksto, katayuan sa kapansanan, mga linya sa ibabaw na may mababang contrast
Tipograpiya
mula 13 hanggang 274px · 6 na hakbang
- Helvetica Neue — kapalit: Inter · mga balangkas 400, 500, 700 · Isang pangkalahatang kagamitan - body text sa 17px/1.29, display headings sa 75–274px na may -0.04em letter spacing sa pinakamalalaking sukat, navigation labels sa 15px
- PPSupplyMono — kapalit: JetBrains Mono · mga balangkas 400 · Ang mga meta tag at mga parenthetical label tulad ng [01-N PANIMULA], pati na rin ang mga section tag (ADVERTISING, CREATIVE/AGENCY, OFFLINE MARKETING) ang tanging mga tipograpiyang accent na bumabasag sa monotony ng Helvetica.
- PPSupplySans — kapalit: Inter · mga balangkas 400 · Pangalawang nabigasyon at microcopy sa footer kung saan kinakailangan ang ibang sans-serif font.
Mga pagitan at anyo
| Layunin | Kahulugan |
|---|---|
| Densidad | karaniwan |
| Pangunahing hakbang | 50px |
| Radius ng buton | 8px |
| Radius ng card | 20px |
| Mga anino | walang - mga hangganan sa halip na mga anino |
| Sa pagitan ng mga seksyon | 72px |
| Lapad ng pahina | 1440px |
Gagawa ang AI ng website mo sa estilong Bpco at pupunuin ito
- Punuin ng mga produkto at post gamit ang link - Instagram, TikTok, Facebook.
- Maglipat ng nilalaman mula sa iyong lumang site—tukuyin lamang ang address.
- Modernong disenyo gamit ang pinakamahusay na engine: React ( Next.js) na may kasamang server rendering at SEO optimization na agad-agad.
- Ganap na awtomatikong pag-optimize ng SEO para sa mga resulta ng paghahanap at mga rekomendasyon sa neural network.
Mga katulad na estilo
- Steep — Pagsusuri ng mga Serif Font sa Mainit na Papel
- Newformcap — Pahayagang editoryal sa dressing room
- Claude — Isang artifact na nakalimbag sa mainit na pergamino—tinta sa papel na gawa sa buto, luwad bilang tanging hininga ng kulay
- 11x– Digital workers — Isang sinematikong editoryal na kaparangan—mga panoramic na litrato ng tanawin na nakadikit sa mga napakalaking serif na headline na parang isang luxury magazine na nakalagay
- Revolut — Isang monochrome na akdang editoryal batay sa isang litrato ng mga ulap—puting tinta, mga butones ng pillbox, isang asul na guhit ng kulay sa isang mundong kung hindi man ay kulay abo.
- Scheduling — Tinta ng editoryal sa kremang papel
- Titan — archive ng monochrome na may mainit na kulay
- Programa — Isang Swiss design studio sa tanghali. Ang puting gallery wall ay naiilawan ng isang dilaw na table lamp—lahat ay nasa kulay abo hanggang sa isang buton, icon, o accent ang pumukaw sa atensyon, at pagkatapos ay ang nag-iisang dilaw na accent na iyon ang magbibigay-kahulugan sa buong silid.
- Sana Agents — Kislap ng dayap sa puting background sa editoryal
- Visual — Mainit na editoryal na samizdat. Kremang papel, mga serif poster, monochrome marginalia, isang dilaw na marker.
- Midday — Brosyur na editoryal sa vellum - 72px serif na pamagat sa mainit na batong background, sans-serif na kopya ng katawan na may pagitan, mga kontrol na hugis-pill, walang mga anino
- Chat for impact — Isang klinika na luntian at may mga silid na kulay pastel