Superhuman
redaksjepaniel gouden oere
Superhuman sit op it krúspunt fan redaksjonele fotografy en software-UI - in waarm, perkamentachtich doek (nea suver wyt) omfiemet kastanjebrune branding-eleminten en libbene pearse aksinten. Koppen, ynsteld yn lettertype 460, flústerje ynstee fan te roppen, wêrtroch side-folsleine filmfotografy it swiere wurk dwaan kin, wylst trochsichtige produkt-UI-kaarten as glês boppe de bylden sweve. It palet bliuwt it measte fan 'e tiid kalm en redaksjoneel: crèmekleurige oerflakken, houtskoaltekst, subtile waarmgrize rânen en romme ôfstân tusken eleminten, mei kleur reservearre foar bewuste merk-ynterpunksje - in inkele kastanjebrune oprop ta aksje, pearse keppelings, in ljochtlila tafoegingsknop. It systeem foarkomt bewust sterke skaden en gradiënten op UI-oerflakken; De djipte wurdt berikt troch laachfotografy en subtile eftergrûnwazige eftergrûn yn 'e titel, ynstee fan troch in stapeleffekt.
It haadelemint is in foto oer folsleine breedte mei in sintraal koptekst (48-64px/460) en in inkele oprop ta aksje fol mei in ôfbylding fan wyn, mei driuwende trochsichtige produkt UI-kaarten dy't oer de linker- en rjochterkanten lein binne. Under it haadelemint is in wite stripe logo strip (6 sellen per rige, maksimale breedte beheind), dan in tab seksje mei wite kaartoerflakken op perkamint doek. In donkere turquoise stripe ûnderbrekt it ritme sawat twa tredde fan 'e wei troch de pagina - folsleine breedte, twa kolommen (ôfbylding oan 'e lofterkant, tekst oan' e rjochterkant) - wêrtroch it ienige toankontrast ûntstiet as jo scrolle. In gradiënt atmosfearyske stripe folget. De fertikale ôfstân tusken seksjes is 64-96px. De maksimale ynhâldsbreedte is ~1200px sintraal, mei it haadelemint en de donkere stripe dy't de folsleine breedte fan it viewport omfetsje. De navigaasje is in inkele fêste koptekst mei in wazige eftergrûn; gjin sydbalke, gjin megamenu. De fuottekst is in burgundy pagina oer folsleine breedte mei in yndieling mei meardere kolommen fan keppelings. It algemiene ritme is: haadframe → kalme wyt/crèmekleurige ynhâld → donkere stripe mei de haadôfbylding → atmosfearyske gradiënt → burgundy fuottekst, ôfwikseljend ljochte en donkere strepen om in redaksjoneel tempo te meitsjen.
It primêre fisuele elemint is filmfotografy: in portret oer de folsleine breedte tsjin in iepen loft tsjinnet as it fokuspunt, mei in twadde sfearfolle stripe leger op 'e pagina. De ôfbylding is waarm toand, subtyl gedempt, en yn profyl opnommen, wat tinken docht oan in gouden oere, wêrtroch't in mear redaksjonele as bedriuwsgefoel ûntstiet. In donkere stripe mei trochskinende geometryske rjochthoeken en mei de hân skreaune ynskripsjes wurdt oer in foto fan in man ferdjippe yn gedachten pleatst - in kollaazje fan oerflakken ynstee fan ien ôfbylding. De brûkersynterface wurdt presintearre as driuwende glêzen kaarten dy't direkt op 'e foto pleatst binne, ynstee fan as aparte skermôfbyldings. Der binne gjin stock-yllustraasjes, gjin 3D-renderings, en gjin abstrakte dekorative foarmen, útsein de gradiënt-sfearfolle stripe. De ikoanen binne minimalistyske monochrome line-ikoanen, ~16-20px breed, mei in inkele breedte dy't oerienkomt mei it tekstgewicht fan 460 punten.
Palet
Merk
- Midnight Wine
#421d24— De wichtichste aksjeknoppen, advertinsjebanner en fuottekst binne in waarm, hast swart burgundy dat mear as inket fielt as read, wêrtroch it kleurenpalet ferankere wurdt sûnder oerweldigjend te wêzen. - Royal Violet
#714cb6— Pears wurdt brûkt om keppelings, tags en koarte frases te markearjen. It moat net brûkt wurde as de primêre kleur foar oprop ta aksje.
Neutraal
- Lilac Mist
#d4c7ff— De sekundêre oerflakopfolling, ljochte ikoanen en spoekknopeftergrûnen hawwe allegear in gedempte pearse kleur dy't hint nei de styl fan it merk sûnder ûnnedige oandacht te lûken. - Deep Lagoon
#0c4243— De donkere eftergrûn foar de strip, brûkt as it wichtichste ferhaalelemint, is it ienige donkere oerflak yn it systeem, kombinearre mei in oerlaapjend geometrysk patroan. - Warm Parchment
#f2f0eb— It wurkoerflak fan 'e side is it dominante elemint; in waarme crèmekleur ferfangt wyt as basis, wêrtroch it heule systeem in redaksjonele waarmte krijt. - Soft Mist
#e3e3e2— Fine rânen, kaartkonturen, skiedslinen - in waarm, ljochtgriis dat oergiet mei it perkament, mar de rânen dúdlik definiearret. - Ink Charcoal
#292827— Lidtekst, kopteksten, ikoanomtrekken - in waarme, hast swarte kleur mei genôch brún om te fielen as inket op papier, nea kâld #000 - Stone Gray
#666666— Sekundêre lichemstekst, stypjende teksten, diskrete beskriuwingen - ien middelgriis, sparjend brûkt om nea te konkurrearjen mei de haadtekst.
Typografy
fan 12 oant 64px · 8 stappen
- Super Sans VF — ferfanging: Inter (closest open equivalent for variable weight range) · sketsen 460, 500, 540, 600, 700 · Ien lettertype yn it hiele systeem. Asfariabelen omfetsje it berik fan 460 (in hantekening, wat bysnien lettertype foar alle grutte koptekst) oant 540 (beklamme lichemstekst) en 700 (lytse, fetgedrukte ûnderskriften). In spesjaal ûntworpen VF makket kopteksten mei in gewicht fan 460 mear bewust as willekeurich - by 48-64px mei krappe letterôfstân wurdt it "wat bysnien" effekt waarnommen as selsbetrouwen ynstee fan tin.
Yntervallen en foarm
| Doel | Betsjutting |
|---|---|
| Dichtheid | ticht |
| Basisstap | 8px |
| Knopradius | 16px |
| Kaartradius | 16px |
| Skaden | gjin grinzen ynstee fan skaden |
| Tusken seksjes | 64-96px |
| Sidebreedte | 1200px |
AI sil jo webside bouwe yn Superhuman -styl en it folje
- Folje oan mei produkten en berjochten fia de link - Instagram, TikTok, Facebook.
- Oerdrage ynhâld fan jo âlde side - spesifisearje gewoan it adres.
- Modern ûntwerp op 'e bêste motor: React ( Next.js) mei serverrendering en SEO-optimalisaasje direkt út 'e doaze.
- Folslein automatisearre SEO-optimalisaasje foar sykresultaten en oanbefellings foar neurale netwurken.
Ferlykbere stilen
- AI for Business — Brutalistyske redaksjeshowroom yn waarme grize toanen
- Jeton — In redaksje oer fintech op waarm moarmer
- Airtable — In noflik seminar mei haadstikken markearre yn ferskate kleuren
- Osmo — It ûntwikkeldersmuseum op griis beton
- Linktr — Redaksjonele posters binne as snobbersguod opsteapele. De webside is ûntwurpen yn kleurblokken, mei heldergriene koppen tsjin kobaltblauwe muorren, en wite pilfoarmige navigaasje-eleminten dy't boppe burgundyfjilden sweve.
- Outsource Consultants — In grutformaat arsjitektoanysk blêd op bonkepapier. In monografyske estetyk, dêr't in inkele heldere plak indigo it oars waarme, typografysk maksimalistyske raster ûnderbrekt.
- Streamtime — Taktile Kreatyf Moodboard - Untwerper Scrapbookingtafel
- Switch-Lit — Redaksjoneel raster printe yn inket op crèmekleurich papier
- HubSpot — In waarme crèmekleurige papierkleur mei in inkele oranje aksint. HubSpot liket op in ûntwerperstydskrift printe op swier papier - serif-koppen, waarme crèmekleurige siden en in inkele fûle oranje aksint dy't allinich de wichtichste punten markearret.
- Granola — Fjildnotysjes op waarm vellum - Granola lêst as in fersliten Moleskine-notebook iepene op in sinneljochte buro: serif-kopteksten jouwe in gefoel fan soliditeit, organyske griene aksinten lykas plantaardige inket, en fijne linen yn 'e marzjes fan' e kaarten dy't lykje op mei de hân skreaune notysjes.
- Secure — In petear yn in Jeropeesk kafee yn sêft deiljocht is in waarme, stijlvolle ynterpretaasje fan fideoproppen, wêr't serif-koppen lêze as in neitocht tydskriftartikel ynstee fan in tech-produktpagina.
- Mockups made easy — Redaksjoneel ûntwerpstudio op wyt papier