Superhuman
paneli editorial i orës së artë
Superhuman shtrihet në kryqëzimin e fotografisë editoriale dhe ndërfaqes së përdoruesit të softuerit - një kanavacë e ngrohtë, si pergamenë (kurrë e bardhë e pastër) kornizon elementët e markës ngjyrë gështenjë dhe thekse të gjalla vjollcë. Titujt, të vendosur me font 460, pëshpërisin në vend që të bërtasin, duke lejuar që fotografia kinematografike e një faqeje të plotë të bëjë punën e rëndë, ndërsa kartat e tejdukshme të ndërfaqes së përdoruesit të produktit notojnë si xham mbi imazhe. Paleta mbetet e qetë dhe editoriale shumicën e kohës: sipërfaqe krem, tekst me ngjyrë qymyri, kufij delikatë gri të ngrohtë dhe hapësira të bollshme midis elementëve, me ngjyrë të rezervuar për pikësim të qëllimshëm të markës - një thirrje e vetme për veprim ngjyrë gështenjë, lidhje vjollcë, një buton shtesë ngjyrë vjollcë e çelët. Sistemi shmang qëllimisht hijet dhe gradientët e fortë në sipërfaqet e ndërfaqes së përdoruesit; Thellësia arrihet përmes fotografisë së shtresuar dhe turbullimit delikat të sfondit në titull, në vend të një efekti grumbullimi.
Elementi kryesor është një fotografi me gjerësi të plotë me një titull të qendrës (48-64px/460) dhe një thirrje e vetme për veprim e mbushur me një imazh vere, me karta ndërfaqeje përdoruesi të produktit transparente lundruese të mbivendosura në skajet majtas dhe djathtas. Poshtë elementit kryesor është një shirit logoje me vija të bardha (6 qeliza për rresht, gjerësia maksimale e kufizuar), pastaj një seksion skedash me sipërfaqe kartash të bardha në kanavacë pergamene. Një shirit ngjyrë bruz i errët thyen ritmin rreth dy të tretat e faqes - gjerësi e plotë, dy kolona (imazhi në të majtë, teksti në të djathtë) - duke krijuar të vetmin kontrast tonal ndërsa lëvizni. Një shirit atmosferik gradient vijon. Hapësira vertikale midis seksioneve është 64-96px. Gjerësia maksimale e përmbajtjes është ~1200px e qendrës, me elementin kryesor dhe shiritin e errët që përfshin gjerësinë e plotë të dritares së shikimit. Navigimi është një kokë e vetme fikse me një sfond të turbullt; pa shirit anësor, pa mega menu. Fundi i faqes është një faqe burgundy me gjerësi të plotë me një paraqitje shumëkolonëshe të lidhjeve. Ritmi i përgjithshëm është: korniza kryesore → përmbajtja e qetë e bardhë/krem → vija e errët me imazhin kryesor → gradient atmosferik → fundi i faqes ngjyrë burgundy, vija të çelëta dhe të errëta që alternohen për të krijuar një tempo editorial.
Elementi kryesor vizual është fotografia kinematografike: një portret me gjerësi të plotë kundër një qielli të hapur shërben si pikë qendrore, me një vijë të dytë atmosferike të pozicionuar më poshtë faqes. Imazhi është me nuanca të ngrohta, i zbehtë lehtë dhe i fotografuar në profil, duke kujtuar një orë të artë, duke krijuar një ndjesi më shumë editoriale sesa korporative. Një vijë e errët me drejtkëndësha gjeometrikë të tejdukshëm dhe mbishkrime të shkruara me dorë është mbivendosur mbi një fotografi të një burri të humbur në mendime - një kolazh sipërfaqesh në vend të një imazhi të vetëm. Ndërfaqja e përdoruesit paraqitet si karta qelqi lundruese të mbivendosura direkt në fotografi, në vend që të jenë pamje të veçanta të ekranit. Nuk ka ilustrime të gatshme, nuk ka renderime 3D dhe nuk ka forma dekorative abstrakte, përveç vijës atmosferike gradient. Ikonat janë ikona minimaliste monokrome të vijave, ~16-20px të gjera, me një gjerësi të vetme që korrespondon me peshën e tekstit prej 460 pikësh.
Paletë
Markë
- Midnight Wine
#421d24— Butonat kryesorë të veprimit, banderola e reklamës dhe fundi i faqes janë një ngjyrë bordo e ngrohtë, pothuajse e zezë, që ndihet më shumë si bojë sesa si e kuqe, duke e ankoruar paletën e ngjyrave pa qenë shumë mbizotëruese. - Royal Violet
#714cb6— Vjollca përdoret për të nxjerrë në pah lidhjet, etiketat dhe frazat e shkurtra. Nuk duhet të përdoret si ngjyra kryesore për thirrjet për veprim.
Neutral
- Lilac Mist
#d4c7ff— Mbushja e sipërfaqes dytësore, ikonat e ndriçuara dhe sfondet e butonave fantazmë kanë të gjitha një ngjyrë vjollcë të zbehtë që lë të kuptohet stili i markës pa tërhequr vëmendje të tepërt. - Deep Lagoon
#0c4243— Sfondi i errët për shiritin, i përdorur si elementi kryesor narrativ, është e vetmja sipërfaqe e errët në sistem, e kombinuar me një model gjeometrik të mbivendosur. - Warm Parchment
#f2f0eb— Sipërfaqja e punës e faqes është elementi dominues; një ngjyrë e ngrohtë krem zëvendëson të bardhën si bazë, duke i dhënë të gjithë sistemit një ngrohtësi editoriale. - Soft Mist
#e3e3e2— Bordura të holla, skica kartonash, vija ndarëse - një gri e ngrohtë, e çelët që përzihet me pergamenën, por përcakton qartë skajet. - Ink Charcoal
#292827— Teksti i trupit, titujt, konturet e ikonave - një ngjyrë e ngrohtë, pothuajse e zezë, me mjaftueshëm kafe sa të ndihet si bojë në letër, kurrë e ftohtë #000 - Stone Gray
#666666— Kopje dytësore e trupit, tekste mbështetëse, përshkrime diskrete - një ngjyrë e vetme gri e mesme, e përdorur me kursim në mënyrë që të mos konkurrojë kurrë me tekstin kryesor.
Tipografi
nga 12 në 64px · 8 hapa
- Super Sans VF — zëvendësim: Inter (closest open equivalent for variable weight range) · skica 460, 500, 540, 600, 700 · Një font i vetëm në të gjithë sistemin. Variablat e boshtit përfshijnë diapazonin nga 460 (një font karakteristik, pak i prerë për të gjithë tekstin e madh të titujve) në 540 (tekst i theksuar i trupit) dhe 700 (mbishkrime të vogla dhe të trasha). Një VF i projektuar posaçërisht bën që titujt me peshë 460 të duken më të qëllimshëm sesa të rastësishëm - me 48-64px me hapësirë të ngushtë midis shkronjave, efekti "pak i prerë" perceptohet si i sigurt sesa i hollë.
Intervalet dhe forma
| Qëllimi | Kuptimi |
|---|---|
| Dendësia | i dendur |
| Hapi bazë | 8px |
| Rrezja e butonit | 16px |
| Rrezja e kartës | 16px |
| Hijet | pa kufij në vend të hijeve |
| Midis seksioneve | 64-96px |
| Gjerësia e faqes | 1200px |
IA do ta ndërtojë faqen tuaj të internetit në stilin Superhuman dhe do ta mbushë atë
- Plotësoni me produkte dhe postime përmes linkut - Instagram, TikTok, Facebook.
- Transferoni përmbajtje nga faqja juaj e vjetër—thjesht specifikoni adresën.
- Dizajn modern në motorin më të mirë: React ( Next.js) me renderim të serverit dhe optimizim SEO që në fillim.
- Optimizim plotësisht i automatizuar i SEO-s për rezultatet e kërkimit dhe rekomandimet e rrjeteve nervore.
Stile të ngjashme
- AI for Business — Sallë ekspozite editoriale brutaliste në tone të ngrohta gri
- Jeton — Një editorial rreth fintech në mermer të ngrohtë
- Airtable — Një seminar komod me kapituj të shënuar me ngjyra të ndryshme
- Osmo — Muzeu i Zhvilluesve në Beton Gri
- Linktr — Posterat editorialë janë të vendosur si karamele. Uebsajti është projektuar në blloqe ngjyrash, me tituj të gjelbër të ndritshëm të vendosur kundër mureve blu kobalti dhe elementë navigimi në formë pilule të bardhë që qëndrojnë mbi fushat ngjyrë burgundy.
- Outsource Consultants — Një fletë arkitekturore me format të madh mbi letër kocke. Një estetikë monografike, ku një copë e vetme e ndritshme indigoje ndërpret rrjetën përndryshe të ngrohtë, tipografikisht maksimaliste.
- Streamtime — Tabela e Gjendjes Kreative Taktike - Tavolinë për Scrapbooking të Dizajnuar
- Switch-Lit — Rrjetë editoriale e shtypur me bojë mbi letër krem
- HubSpot — Një letër me ngjyrë të ngrohtë krem me një theks të vetëm portokalli. HubSpot i ngjan një reviste stilistësh të shtypur në letër të trashë - tituj me serif, faqe të ngrohta krem dhe një theks i vetëm portokalli i ndezur që nxjerr në pah vetëm pikat më të rëndësishme.
- Granola — Shënime në pergamenë të ngrohtë—Granola lexohet si një fletore Moleskine e konsumuar mirë e hapur mbi një tavolinë të ndriçuar nga dielli: titujt me serif japin një ndjesi soliditeti, thekse organike jeshile si bojë me bazë bimore dhe vija të holla në margjinat e kartave që ngjajnë me shënime të shkruara me dorë.
- Secure — Një bisedë në një kafene evropiane në dritën e butë të ditës është një interpretim i ngrohtë dhe elegant i video-thirrjeve, ku titujt serif lexohen si një artikull i menduar mirë reviste dhe jo si një faqe produkti teknologjik.
- Mockups made easy — Studio e dizajnit editorial në letër të bardhë