Superhuman
redakčný panel zlatej hodinky
Superhuman sa nachádza na rozhraní redakčnej fotografie a softvérového používateľského rozhrania – teplé, pergamenovité plátno (nikdy nie čisto biele) rámuje gaštanovo hnedé prvky značky a žiarivé fialové akcenty. Nadpisy, nastavené písmom 460, skôr šepkajú ako kričia, čo umožňuje celostránkovej filmovej fotografii vykonávať ťažkú prácu, zatiaľ čo priesvitné karty používateľského rozhrania produktov sa vznášajú ako sklo nad obrázkami. Paleta zostáva väčšinou pokojná a redakčná: krémové povrchy, uhľový text, jemné teplosivé okraje a veľkorysé rozstupy medzi prvkami, pričom farba je vyhradená pre zámernú interpunkciu značky – jedna gaštanovo hnedá výzva na akciu, fialové odkazy, svetlofialové doplnkové tlačidlo. Systém sa zámerne vyhýba silným tieňom a prechodom na povrchoch používateľského rozhrania; Hĺbka sa dosahuje vrstvením fotografie a jemným rozmazaním pozadia v názve, a nie efektom stohovania.
Hlavným prvkom je fotografia na celú šírku s vycentrovaným nadpisom (48 – 64 px/460) a jedinou výzvou na akciu vyplnenou obrázkom vína, s plávajúcimi priesvitnými kartami používateľského rozhrania produktu prekrytými na ľavom a pravom okraji. Pod hlavným prvkom sa nachádza biely pruh loga (6 buniek na riadok, maximálna šírka obmedzená), potom sekcia s kartami s bielymi povrchmi kariet na pergamenovom plátne. Tmavo tyrkysový pruh prerušuje rytmus približne v dvoch tretinách stránky – na celú šírku, dva stĺpce (obrázok vľavo, text vpravo) – čím vytvára jediný tónový kontrast pri rolovaní. Nasleduje gradientný atmosférický pruh. Vertikálne rozstupy medzi sekciami sú 64 – 96 px. Maximálna šírka obsahu je ~1200 px vycentrovaná, pričom hlavný prvok a tmavý pruh sa rozprestierajú po celej šírke zobrazovacej oblasti. Navigácia je jedna pevná hlavička s rozmazaným pozadím; žiadny bočný panel, žiadne mega menu. Päta je bordová stránka na celú šírku s viacstĺpcovým rozložením odkazov. Celkový rytmus je: hlavný záber → pokojný biely/krémový obsah → tmavý pruh s hlavným obrázkom → atmosférický gradient → bordová päta, striedajúce sa svetlé a tmavé pruhy pre vytvorenie redakčného tempa.
Primárnym vizuálnym prvkom je filmová fotografia: portrét v plnej šírke proti otvorenej oblohe slúži ako ústredný bod s druhým atmosférickým pruhom umiestneným nižšie na stránke. Obrázok je teple tónovaný, jemne tlmený a nasnímaný z profilu, pripomínajúci zlatú hodinu, čím vytvára skôr redakčný než firemný dojem. Tmavý pruh s priesvitnými geometrickými obdĺžnikmi a ručne písanými nápismi je prekrytý fotografiou muža strateného v myšlienkach – koláž povrchov, nie jeden obrázok. Používateľské rozhranie je prezentované ako plávajúce sklenené karty umiestnené priamo na fotografii, a nie ako samostatné snímky obrazovky. Nie sú k dispozícii žiadne ilustrácie, 3D rendery ani abstraktné dekoratívne formy, okrem gradientného atmosférického pruhu. Ikony sú minimalistické monochromatické čiarové ikony, široké ~16-20px, s jednou šírkou zodpovedajúcou hrúbke textu 460 bodov.
Paleta
Značka
- Midnight Wine
#421d24— Hlavné akčné tlačidlá, reklamný banner a päta stránky sú v teplej, takmer čiernej bordovej farbe, ktorá pripomína skôr atrament ako červenú, čím ukotvuje farebnú paletu bez toho, aby bola príliš výrazná. - Royal Violet
#714cb6— Fialová sa používa na zvýraznenie odkazov, značiek a krátkych fráz. Nemala by sa používať ako primárna farba pre výzvy na akciu.
Neutrálny
- Lilac Mist
#d4c7ff— Výplň sekundárneho povrchu, svetelné ikony a pozadia tlačidiel duchov majú tlmenú fialovú farbu, ktorá naznačuje štýl značky bez toho, aby na seba pútala neprimeranú pozornosť. - Deep Lagoon
#0c4243— Tmavé pozadie pásu, použité ako hlavný naratívny prvok, je jediným tmavým povrchom v systéme, kombinovaným s prekrývajúcim sa geometrickým vzorom. - Warm Parchment
#f2f0eb— Pracovná plocha stránky je dominantným prvkom; teplá krémová farba nahrádza bielu ako základ, čím celému systému dodáva redakčný nádych. - Soft Mist
#e3e3e2— Jemné okraje, obrysy kariet, deliace čiary – teplá, svetlosivá farba, ktorá splýva s pergamenom, ale jasne definuje okraje. - Ink Charcoal
#292827— Hlavný text, nadpisy, obrysy ikon - teplá, takmer čierna farba s dostatkom hnedej, ktorá pôsobí ako atrament na papieri, nikdy nie studená #000 - Stone Gray
#666666— Sekundárny text tela, podporné texty, diskrétne popisy – jedna stredne sivá farba, použitá striedmo, aby nikdy nekonkurovala hlavnému textu.
Typografia
od 12 do 64px · 8 krokov
- Super Sans VF — náhrada: Inter (closest open equivalent for variable weight range) · obrysy 460, 500, 540, 600, 700 · Jedno písmo v celom systéme. Premenné osi pokrývajú rozsah od 460 (typické, mierne orezané písmo pre všetky veľké nadpisy) až po 540 (zvýraznený text tela) a 700 (malé, tučné titulky). Špeciálne navrhnutá vizuálna fraktálna grafika spôsobuje, že nadpisy s hrúbkou 460 pôsobia zámernejšie ako náhodnejšie – pri veľkosti 48 – 64 pixelov s malým rozstupom písmen sa „mierne orezaný“ efekt vníma skôr sebavedomo ako tenký než riedko.
Intervaly a forma
| Účel | Význam |
|---|---|
| Hustota | hustý |
| Základný krok | 8px |
| Polomer tlačidla | 16px |
| Polomer karty | 16px |
| Tiene | nie - okraje namiesto tieňov |
| Medzi sekciami | 64-96px |
| Šírka stránky | 1200px |
Umelá inteligencia vytvorí vašu webovú stránku v štýle Superhuman a naplní ju
- Doplňte produktmi a príspevkami cez odkaz - Instagram, TikTok, Facebook.
- Preneste obsah zo svojej starej stránky – stačí zadať adresu.
- Moderný dizajn na najlepšom engine: React ( Next.js) s vykresľovaním servera a SEO optimalizáciou hneď po vybalení.
- Plne automatizovaná SEO optimalizácia pre výsledky vyhľadávania a odporúčania neurónových sietí.
Podobné štýly
- AI for Business — Brutalistická redakčná showroom v teplých sivých tónoch
- Jeton — Úvodník o fintech na teplom mramore
- Airtable — Útulný seminár s kapitolami označenými rôznymi farbami
- Osmo — Múzeum vývojárov na sivom betóne
- Linktr — Redakčné plagáty sú naukladané ako cukríky. Webová stránka je navrhnutá vo farebných blokoch s jasne zelenými titulkami na kobaltovo modrých stenách a bielymi navigačnými prvkami v tvare tabletiek, ktoré sa vznášajú nad bordovými poľami.
- Outsource Consultants — Veľkoformátový architektonický list na kostnom papieri. Monografická estetika, kde jediná jasná škvrna indigovej farby prerušuje inak teplú, typograficky maximalistickú mriežku.
- Streamtime — Hmatová kreatívna nástenka nálady - Dizajnérsky scrapbookový stolík
- Switch-Lit — Redakčná mriežka vytlačená atramentom na krémovom papieri
- HubSpot — Teplá krémová farba papiera s jedným oranžovým akcentom. HubSpot pripomína dizajnérsky časopis vytlačený na ťažkom papieri – pätkové titulky, teplé krémové strany a jeden ohnivo oranžový akcent zvýrazňujúci iba tie najdôležitejšie body.
- Granola — Poznámky z terénu na teplom pergamene – Granola sa číta ako ošúchaný zápisník Moleskine otvorený na slnečnom stole: pätkové nadpisy dodávajú pocit solídnosti, organické zelené akcenty ako rastlinný atrament a jemné linky na okrajoch kariet pripomínajú ručne písané poznámky.
- Secure — Konverzácia v európskej kaviarni za jemného denného svetla je teplým a štýlovým pohľadom na videohovory, kde pätkové titulky pôsobia skôr ako premyslený článok v časopise než ako stránka technologického produktu.
- Mockups made easy — Štúdio redakčného dizajnu na bielom papieri