Substack
oranžno črnilo na mizi v uredništvu
Substack je videti kot obrabljena nadzorna plošča redakcije – belo platno, toplo, skoraj črno besedilo in en sam svetlo oranžen poudarek, ki označuje vsako fazo ustvarjanja vsebine. Vizualna hierarhija je zgrajena na gostoti in ne na dekoraciji: tanke sive črte ločujejo elemente vira, avatarji so majhni, metapodatki so utišani, bralčevo oko pa je navajeno, da se osredotoči na oranžen poziv k dejanju, oranžen logotip, oranžno povezavo»Naroči se« in oranžen gumb»Ustvari«. Površine so ravne in neomejene – brez senc kartic, brez kromiranih elementov plošče – tipografija (kompakten element uporabniškega vmesnika kromiranega sistema, združen s pisavo za naslov po meri s serifi) nosi glavnino uredniške teže. Značilen slog so zadržani kromirani elementi in živahni, enobarvni poudarki: aplikacija za branje, ki se zdi kot orodje za objavljanje.
Tristolpčna postavitev namizja: fiksna leva stranska vrstica (~200px, navigacija z ikonami in oznakami, lepljivo), sredinski vir (največja širina ~600px, navpično pomikajoč se seznam objav) in fiksna desna stranska vrstica (~300px, iskanje + priporočila + registracija). Sredinski vir je uredniško jedro – brez kartic, le objave, zložene druga na drugo s tankimi razdelilniki in 32px vrzeli med razdelki. Glavna pasica je na vrhu vira kot ena sama kartica polne širine. Leva stranska vrstica vsebuje logotip blagovne znamke (oranžen znak s prekrivajočimi se črtami), šest navigacijskih elementov in oranžen gumb»Ustvari« polne širine na dnu. Desna stranska vrstica vsebuje iskalno polje, kartico za registracijo in seznam»Naprej« za branje. Navigacija je minimalna – brez zgornje vrstice, brez drobtin; stranska vrstica JE navigacija. Gostota vsebine je visoka: objave uporabljajo metapodatke velikosti 12–13px in besedilo telesa velikosti 15–19px, kar ustvarja ritem, podoben časopisu, namesto občutka mreže kartic na tržnici.
Fotografije so vsebina, ki jo ustvarijo uporabniki (avtorjevi avatarji, sličice objav, slike objav) – Substack ne ponuja lastnih dekorativnih fotografij. Glavna kartica uporablja turkizno-zelen preliv z abstraktnimi ilustrativnimi elementi (geometrijske oblike, stilizirani predmeti, kot so pisala in zapiski) kot ozadje. Sličice objav v desni stranski vrstici so majhne (64 slikovnih pik), obdane s polmerom 8 slikovnih pik in služijo kot predogled seznama za branje. Celoten vizualni jezik temelji na besedilu: vmesnik je bralno platno, slike pa služijo kot majhna vizualna sidra in ne kot ustvarjanje vzdušja.
Paleta
Blagovna znamka
- Signal Orange
#ff6719— Oranžna se uporablja kot sekundarni poudarek za dekorativne detajle in za poudarjanje redkih znakov. Ne sme se uporabljati kot primarna barva za pozive k dejanju.
Nevtralno
- Ink
#363737— Telo besedila – glavno besedilo, naslovi, naslovi objav, časovni žigi in imena avtorjev; topla, skoraj črna barva namesto čiste #000 za lažje branje. - Paper
#ffffff— Platno strani, površine kartic, vnosna polja in navigacijsko ozadje so prevladujoče površine, ki zasedajo veliko večino vmesnika. - Charcoal
#232525— Stanje lebdenja za dodatno besedilo in povezave z visokimi ravnmi izbire; globlje od načina s črnilom za bloke kode in bloke izbire. - Stone
#777777— Za sekundarne elemente uporabniškega vmesnika, razdelilnike in utišane oznake je podprta nevtralna barva. Ne sme se uporabljati kot primarna barva za pozive k dejanju. - Ash
#b6b6b6— Tanke obrobe, obrisi gumbov, obrisi ikon, obrobe na onemogočenih kontrolnikih. - Mist
#c8c8c8— Ločilne črte, nevsiljivo ozadje za ikone, zapolnjevanje praznih celic v obliki okostja.
Tipografija
od 12 do 32 slikovnih pik · 5 korakov
- system-ui — zamenjava: -apple-system · obrisi 400, 500, 600 · Primarna pisava za uporabniški vmesnik in besedilo telesa se uporablja za navigacijske oznake, gumbe, besedilo sporočil, metapodatke, vnosna polja in vse elemente vmesnika. Kompaktne velikosti 12–13 slikovnih pik za metapodatke in 15–19 slikovnih pik za besedilo telesa ustvarjajo občutek gostega vira novic. Teža je 400 za besedilo telesa, 500 za navigacijske elemente in oznake gumbov ter 600 za označene naslove sporočil in razdelkov.
- Cahuenga — zamenjava: Charter · obrisi 500 · Prepoznavna dekorativna serifna pisava za naslove na ravni izdelkov (naslovi stranskih vrstic, naslovi registracijskih kartic, glavno besedilo). Zaradi srednje debeline in majhne višine vrstice ima prepoznaven videz, ne da bi se zdela okorna; je edina pisava, ki poleg oranžne barve signalizira identiteto Substacka.
- Spectral — zamenjava: Charter · obrisi 400 · Serifna pisava za dolge objave – uporablja se v čitalnicah in v vsebini novic za izboljšanje berljivosti uredniških gradiv. Nekoliko manjši razmik med vrsticami (1,20) zagotavlja udobno branje odstavkov, hkrati pa ohranja kompaktnost, značilno za redakcije.
Intervali in oblika
| Namen | Pomen |
|---|---|
| Gostota | gosta |
| Osnovni korak | 8px |
| Polmer gumba | 9999px |
| Polmer kartice | 12px |
| Sence | ne - obrobe namesto senc |
| Med odseki | 32px |
| Širina strani | 1200px |
Umetna inteligenca bo zgradila vašo spletno stran v slogu Substack in jo napolnila
- Polnite z izdelki in objavami prek povezave - Instagram, TikTok, Facebook.
- Prenesite vsebino s starega spletnega mesta – samo navedite naslov.
- Sodoben dizajn na najboljšem iskalniku: React ( Next.js) z vnaprej pripravljenim upodabljanjem na strežniku in optimizacijo za SEO.
- Popolnoma avtomatizirana SEO optimizacija za rezultate iskanja in priporočila nevronskih mrež.
Podobni slogi
- ElevenLabs — Foto esej v toplih kremnih tonih z nežnimi naslovi. Zvezek v slogu Bauhausa – papir barve jajčne lupine, črno črnilo in en sam vijolično-oranžen poudarek za predstavitev izdelka.
- Awesomic — Uredniška cinkova mreža z oranžnimi ločili, ki spominjajo na konfete
- Monad — uredniška tehnična revija na toplem pergamentu
- Dub — Linkova nadzorna plošča z mat riževim papirjem
- Seline Analytics — Tiha analitična miza na toplem papirju
- Notion — Topel papirnat zvezek na opoldanskem soncu
- Anthropic — Znanstvena terenska revija o toplem pergamentu – mirne slonokoščene površine, serifirani uvodniški naslovi in en sam glineni naglas, ki se pojavi le, ko je potrebno ukrepanje.
- Calendly — Temno modro črnilo na hladnem marmorju
- Augen Pro — Applova bela predstavitev ima klinično, breztežno, električno modro barvo kot edini poudarek v enobarvnem prostoru.
- Antimetal — Uredniška kronika na krem papirju – mirno jutro v znanstveni reviji, kjer zadržanost izraža samozavest, serifi pa opravljajo težko delo.
- Perk — Električna apna na toplem pergamentnem papirju
- Ditto — S soncem obsijana delavnica ustvarjanja vzorcev divjih rož. Tople kremne površine, živahna rumena osnovna barva, temno temno modra črnila, organske barvne oblike, ki cvetijo za delom.