Glossier
Saulėta fotosesija – baltas popierius, juodas rašalas, vienas ryškiai geltonas akcentas
„Glossier“ veikia kaip skaitmeninis grožio žurnalas: beveik monochrominė baltos ir juodos spalvos drobė, kurią paryškina vienas ryškus geltonas akcentas, kuris kartu yra ir prekės ženklo logotipas, ir vienintelis raginimas veikti. Sistema yra redakciškai santūri – per didelės „Apercu“ antraštės, daug teksto vietos, viso puslapio gyvenimo būdo fotografija, kuri perima didžiąją dalį emocinio svorio, – ir utilitarinė įgyvendinimo prasme: plokščios produktų kortelės, ploni rėmeliai ir visiškas puošmenų trūkumas. Geltona nėra antrinė prekės ženklo spalva; tai YRA prekės ženklas, naudojamas saikingai, kad kiekvienas pasirodymas atrodytų kaip fotoaparato blykstė. Visa kita turėtų išnykti fone: neutralios spalvos yra šilti pilki atspalviai su subtiliu rausvu atspalviu, rėmeliai yra subtilūs, o šriftas tankus ir suspaustas. Rezultatas – vitrina, kuri atrodo užtikrintai, santūriai ir bekompromisiškai moderniai.
Puslapyje pateikiama vertikaliai išdėstyta viso ekrano sekcijų serija, kurių kiekviena sukurta kaip atskiras redakcinis išklotinis. Pagrindinė sekcija yra viso pločio nuotrauka su plaukiojančiu baltu perdengimu (viršuje kairėje) ir dideliu geltonu logotipu, užimančiu visą puslapio apačią. Po pagrindine sekcija sekcijos kaitaliojasi tarp viso ekrano vaizdų ir atskirų kortelių tinklelių. Kategorijos (odos priežiūra / makiažas) suskirstytos į du stulpelius su vienodu vaizdų santykiu (50/50) be matomos ribos – jas skiria tik linija, jungianti vaizdus. Produktų kataloge naudojama keturių stulpelių kvadratinių kortelių tinklelis ant #f7f7f7 drobės. Navigacija yra minimalistinė viršutinė juosta su antrine reklamos juostele virš jos. Tarpai tarp sekcijų yra gana dideli (64 pikseliai), tačiau perėjimai tarp sekcijų yra sklandūs – be skirtukų ar besikeičiančių fono spalvų, išskyrus šiltą poraštę. Bendras ritmas yra: nuotrauka, tekstas, nuotrauka, tinklelis, nuotrauka – tarsi vartant mados žurnalą.
Fotografija yra dominuojanti vizualinė kalba. Visą žiūrėjimo plotą užpildo gyvenimo būdo vaizdai ir portretai – šiltas auksinės valandos apšvietimas, švelnūs odos stambūs planai, rankos, laikančios produktų buteliukus saulės spindesio fone. Fotografijų spalvų paletė yra šilta ir nesodri: persikinis dangus, terakotos odos atspalviai, gili vandenyno mėlyna. Vaizdai visada užima visą puslapio paviršių, be užapvalintų kampų, rėmelių ar perdengimų, išskyrus baltas teksto korteles arba geltoną logotipą. Produktų nuotraukos katalogo kortelėse darytos grynai baltame vientisame fone su lygiu, tolygiu apšvietimu. Vaizdo ir teksto santykis yra maždaug 70/30 – vaizdai perteikia emocijas, tekstas, funkcija. Jokių iliustracijų, abstrakčios grafikos, jokių 3D vizualizacijų.
Paletė
Prekės ženklas
- Glossier Yellow
#fff116— Geltona spalva naudojama kaip antrinis akcentas dekoratyvinėms detalėms ir rečiau naudojamoms paieškos užklausoms paryškinti. Ji neturėtų būti naudojama kaip pagrindinė spalva raginimui veikti.
Neutralus
- Ink
#000000— Pagrindinis tekstas, naršymo nuorodos, pagrindinis tekstas, poraštės tekstas, piktogramų kontūrai, plonos rėmeliai; dominuojanti tipografinė ir struktūrinė spalva. - Paper
#ffffff— Produkto kortelės paviršiai, užpildymo sritys, iškilios plokštės; ryškiausias paviršiaus lygis krūvoje. - Fog
#f7f7f7— Puslapio drobė, skyrių fonai, perėjimai tarp vaizdų puslapyje; pagrindinis paviršius, ant kurio yra visa svetainė. - Blush
#faf2f4— Poraštės fonas, švelnios šiltos sekcijų pertvaros; subtilus rausvai baltas atspalvis suteikia šilumos puslapių apačiai. - Mist
#f0f0f0— Šviesus atraminis paviršius, skirtas sukurti nepastebimą foną ir atskirti dalis. Jis neturėtų būti naudojamas kaip pagrindinė raginimo veikti spalva. - Ash
#e8e8e8— Įvesties lauko rėmeliai, piktogramų fonai, plonos skiriamosios linijos; struktūrinė kortelių ir formos elementų rėmelių spalva.
Tipografija
nuo 12 iki 32 pikselių · 5 žingsniai
- Apercu — pakeitimas: Inter · kontūrai 400, 500, 700 · Pagrindinis šriftas naudojamas visoje vartotojo sąsajoje – tekstas – 16 pikselių / 400, navigacija ir antraštės – 12–14 pikselių / 500, paantraštės – 20 pikselių / 500, o redakcinės antraštės – 32 pikselių / 700. Geometrinis, humanistinis „Apercu“ dizainas suteikia prekės ženklui glaustą, modernų stilių; beveik nulinis raidžių tarpas (0,002–0,003em) šriftą daro kompaktišką ir panašų į žurnalą, o ne per daug erdvų ar draugišką. 700 storio šriftas skirtas redakcinių straipsnių ekrano elementams, o ne vartotojo sąsajos elementams.
- Apercu Mono — pakeitimas: JetBrains Mono or IBM Plex Mono · kontūrai 400 · Mikroutilitarinė tipografija užsakymo metaduomenims, sekimo numeriams ir etiketėms šalia kodo; vienodo tarpo versija sukuria techninę tekstūrą proporcingo kūno tipo fone.
- GTStandard-M — pakeitimas: Inter · kontūrai 400 · GTStandard-M – rastas išgautuose duomenyse, bet dirbtinis intelektas jo neaprašė.
Intervalai ir forma
| Tikslas | Reikšmė |
|---|---|
| Tankis | vidutinis |
| Pagrindinis žingsnis | 8px |
| Mygtuko spindulys | 0px |
| Kortelės spindulys | 0px |
| Šešėliai | ne – rėmeliai vietoj šešėlių |
| Tarp sekcijų | 64px |
| Puslapio plotis | 1440px |
Dirbtinis intelektas sukurs jūsų svetainę Glossier stiliumi ir ją užpildys
- Užpildykite produktais ir įrašais per nuorodą – Instagram, TikTok, Facebook.
- Perkelkite turinį iš senos svetainės – tiesiog nurodykite adresą.
- Modernus dizainas geriausiame variklyje: React ( Next.js) su serverio atvaizdavimu ir SEO optimizavimu iš karto.
- Visiškai automatizuotas SEO optimizavimas paieškos rezultatams ir neuroninių tinklų rekomendacijoms.
Panašūs stiliai
- Lightship — Kinematografiška atviro kelio diorama. Šiltos kreminės spalvos galerijos sienas puošė didelės peizažų nuotraukos, išdėstytos nedideliu atstumu, ant kadrų vos matomas plonas juodas šriftas ir vienas ryškiai oranžinis akcentas, pertraukiantis monochromiją tarsi laužas pievoje.
- Faire ES — Didmeninis šilto kremo katalogas
- Adanola — Redakcinė stiliaus knyga ant balto popieriaus. Mados fotosesija, kurioje tipografija ir fotografija kvėpuoja ant švarių baltų paviršių, naudojant juodą rašalą šriftui ir subtilų firminį be serifų šriftą („Favorit“), atspindintį bendrą prekės ženklo stilių.
- Oura Ring — Jaukios avižinių dribsnių gamybos dirbtuvės, apšviestos švelnia dienos šviesa
- Stykka — Skandinaviškos dirbtuvės baltoje šviesoje – tylus, rankų darbo salonas, kuriame skamba tik fotografija
- DJI — juoda drobė su vienu elektrinės mėlynos spalvos akcentu
- Altitude Beverages — Monochrominis žurnalo puslapis. Įsivaizduokite mados žurnalo puslapį, kuriame nėra jokių spalvų, išskyrus nuotraukas – tekstas ir balta erdvė pasakoja visą istoriją.
- AATHER — Atviras delnas, viena liepsna – tyli prabanga, slypinti ramybėje
- Cowboy — Belgijos dviračių galerija sniego baltumo porceliano aplinkoje. Parodų salė, kurioje matiniai paviršiai, dideli šriftai, naudojami redakcinėje medžiagoje, ir praktiškai jokių dekoracijų traukia akį į dviratį ir jo turinį.
- Refero — Redakcinis maketas ant balto marmuro – tipografo sukurtas produkto puslapis, kuriame serifinė antraštė yra prekės ženklo vizitinė kortelė, o visa kita yra nepastebima.
- Face Formula — Skandinaviško stiliaus portretas. Ramus, žurnalo stiliaus paveikslas, kuriame modelio žvilgsnis ir antraštė, parašyta glaustu serifiniu šriftu, kalba patys už save vėsiame, miglotame fone.
- Shupatto — Muziejaus vitrina ant balto marmuro