Glossier
Sessione fotografica di sole - carta bianca, inchiostru neru, un accentu giallu brillanti
Glossier funziona cum'è una rivista di bellezza digitale: una tela guasi monocromatica di biancu è neru, punteggiata da un unicu accentu giallu vibrante chì serve ancu da logu di a marca è da unicu invitu à l'azione. U sistema hè editorialmente cuntenutu - tituli Apercu sovradimensionati, ampiu spaziu di testu, fotografia di stile di vita à piena pagina chì porta a maiò parte di u pesu emotivu - è utilitaristu in l'esecuzione: carte di produttu piatte, bordi fini è una mancanza cumpleta di abbellimenti. U giallu ùn hè micca un culore secundariu di a marca; HÈ a marca, aduprata cù parsimonia, affinchì ogni apparizione si senti cum'è un lampu di fotocamera. Tuttu u restu hè destinatu à sfumà in u fondu: i neutri sò grigi caldi cù un sottile sottotono rossore, i bordi sò sottili è u tipu hè densu è condensatu. U risultatu hè una vetrina chì si sente sicura, discreta è senza compromessi muderna.
A pagina presenta una seria di sezzioni à schermu pienu disposte verticalmente, ognuna cuncipita cum'è una diffusione editoriale indipendente. A sezzione principale hè una foto à larghezza piena cù una sovrapposizione bianca flottante (in cima à manca) è un logu giallu massicciu chì occupa tutta a parte inferiore di a pagina. Sottu à a sezzione principale, e sezzioni alternanu trà immagini à schermu pienu è griglie di carte individuali. A divisione di e categurie (cura di a pelle / maquillaje) in duie colonne cù un rapportu uguale di immagini (50/50) si faci senza un bordu visibile - solu una linea chì cullega l'imagine li separa. U catalogu di i prudutti usa una griglia di quattru colonne di carte quadrate nantu à una tela #f7f7f7. A navigazione hè una barra superiore minimalista cù una striscia pubblicitaria secundaria sopra. I spazii trà e sezzioni sò abbastanza grandi (64px), ma e transizioni trà e sezzioni sò lisce - senza divisori o culori di fondu alternati, eccettu per u piè di pagina caldu. U ritmu generale hè: fotografia, testu, fotografia, griglia, fotografia - cum'è sfoglià una rivista di moda.
A fotografia hè u linguaghju visuale duminante. Tutta a zona di visualizazione hè piena d'imagine di stile di vita è ritratti - illuminazione calda di l'ora d'oru, primi piani morbidi di a pelle, mani chì tenenu buttiglie di prudutti contr'à un sfondate di sole abbagliante. A paleta di culori in e fotografie hè calda è desaturata: cieli pesca, tonalità di pelle terracotta, blu oceanichi prufondi. L'imagine occupanu sempre tutta a superficia di a pagina, senza anguli arrotondati, cornici o sovrapposizioni, à l'eccezzione di e carte di testu bianche o di u logu giallu. E foto di i prudutti nantu à e carte di u catalogu sò scattate contr'à un sfondate biancu puru senza cuciture cù una illuminazione piatta è uniforme. U rapportu imagine-testu hè di circa 70/30 - l'imagine trasmettenu emozione, u testu, funzione. Nisuna illustrazione, nisuna grafica astratta, nisun rendering 3D.
Paletta
Marca
- Glossier Yellow
#fff116— U giallu hè adupratu cum'è accentu secundariu per i dettagli decorativi è per mette in risaltu e dumande di ricerca menu aduprate. Ùn deve esse adupratu cum'è culore primariu per una chjama à l'azzione.
Neutru
- Ink
#000000— Testu di u corpu, ligami di navigazione, testu primariu, testu di u piè di pagina, contorni di l'icone, bordi fini; culore tipograficu è strutturale dominante. - Paper
#ffffff— Superficie di carte di produttu, zone di riempimentu, pannelli rialzati; u livellu di superficia più luminosu in a pila. - Fog
#f7f7f7— Tela di pagina, sfondi di sezioni, transizioni trà l'imagine nantu à a pagina; a superficia di basa nantu à a quale si trova tuttu u situ web. - Blush
#faf2f4— Sfondu di u piè di pagina, divisori di sezioni morbidi è caldi; una tinta bianca rosata sottile aghjusta calore à u fondu di e pagine. - Mist
#f0f0f0— Una superficia di supportu ligera per creà un sfondate discretu è separà sezioni. Ùn deve esse aduprata cum'è culore primariu per a chjama à l'azzione. - Ash
#e8e8e8— Bordi di i campi d'input, sfondi d'icone, linee di separazione fine; culore di u bordu strutturale per e carte è l'elementi di u furmulariu.
Tipografia
da 12 à 32px · 5 passi
- Apercu — rimpiazzamentu: Inter · contorni 400, 500, 700 · U caratteru tipograficu principale hè utilizatu in tutta l'interfaccia utente - u corpu di u testu à 16px/400, a navigazione è e didascalie à 12–14px/500, i sottotitoli à 20px/500, è i tituli editoriali à 32px/700. U disignu geometricu è umanisticu di Apercu dà à a marca un stile cundensatu è mudernu; a spaziatura di e lettere quasi nulla (0.002–0.003em) rende u caratteru tipograficu compactu è simile à una rivista, invece di esse arioso o amichevule. U pesu 700 hè riservatu à l'elementi di visualizazione in l'editoriali, micca à l'elementi di l'interfaccia utente.
- Apercu Mono — rimpiazzamentu: JetBrains Mono or IBM Plex Mono · contorni 400 · Tipografia microutilitaria per i metadati di l'ordine, i numeri di tracciamentu è l'etichette accantu à u codice; a versione monospaziata crea una struttura tecnica contr'à un tipu di corpu proporzionale.
- GTStandard-M — rimpiazzamentu: Inter · contorni 400 · GTStandard-M - Truvatu in i dati estratti ma micca discrittu da l'IA.
Intervalli è forma
| Scopu | Significatu |
|---|---|
| Densità | mediu |
| Passu basicu | 8px |
| Raggiu di u buttone | 0px |
| Raggiu di a carta | 0px |
| Ombre | nò - bordi invece di ombre |
| Trà e sezioni | 64px |
| Larghezza di a pagina | 1440px |
L'IA custruisce u vostru situ web in stile Glossier è u riempirà
- Riempite cù prudutti è publicazioni via u ligame - Instagram, TikTok, Facebook.
- Trasferisce u cuntenutu da u vostru vechju situ - basta à specificà l'indirizzu.
- Design mudernu nant'à u megliu mutore: React ( Next.js) cù rendering di u servitore è ottimizazione SEO pronta per l'usu.
- Ottimizazione SEO cumpletamente automatizata per i risultati di ricerca è e raccomandazioni di rete neurale.
Stili simili
- Lightship — Un diorama cinematograficu di a strada aperta. Muri di galleria di culore crema caldu adurnati cù grandi fotografie di paisaghji muntate à intervalli ravvicinati, caratteri neri fini appena visibili nantu à e cornici, è un unicu accentu aranciu brillanti chì rompe u monocromu cum'è un focu in un pratu.
- Faire ES — catalogu à l'ingrossu di crema calda
- Adanola — Un lookbook editoriale nant'à carta bianca. Una sessione fotografica di moda induve a tipografia è a fotografia respiranu nant'à superfici bianche pulite, cù inchiostru neru per u caratteru è un carattere sans-serif sottile (Favorit), chì riflette u stile generale di a marca.
- Oura Ring — Un attellu accogliente di preparazione di farina d'avena, immersu in una dolce luce di ghjornu
- Stykka — Un attellu scandinavu in luce bianca - una sala d'esposizione tranquilla è artigianale induve l'unica voce hè a fotografia
- DJI — tela nera aerospaziale cù un unicu puntu culminante blu elettricu
- Altitude Beverages — Pagina di rivista monocromatica. Imaginate una pagina di rivista di moda spugliata di tutti i culori, eccettu per e foto fisse - u testu è u spaziu biancu contanu tutta a storia.
- AATHER — Una palma aperta, una sola fiamma - un lussu tranquillu cuntenutu in a tranquillità
- Cowboy — Una galeria di biciclette belghe in un ambiente di porcellana bianca cum'è a neve. Una sala d'esposizione induve e superfici opache, i grandi caratteri utilizati in i materiali editoriali è una assenza virtuale di decorazione attiranu l'attenzione versu a bicicletta è u so cuntenutu.
- Refero — Layout editoriale nantu à u marmaru biancu - una pagina di pruduttu creata da un tipografu, induve u tìtulu serif hè a carta di visita di a marca, è tuttu u restu hè discretu
- Face Formula — Un ritrattu editoriale scandinavu. Una diffusione calma, in stile rivista, induve u sguardu di a modella è u titulu, scritti in un carattere serif condensatu, parlanu da sè stessi contr'à un sfondate frescu è nebbiosu.
- Shupatto — Vetrina di museu nantu à marmaru biancu