Substack

wino wa chungwa kwenye dawati katika ofisi ya uhariri

Substack inaonekana kama dashibodi ya chumba cha habari iliyochakaa sana—turubai nyeupe, maandishi ya joto, karibu meusi, na lafudhi moja angavu ya chungwa inayoashiria kila hatua ya uundaji wa maudhui. Mpangilio wa taswira umejengwa juu ya msongamano badala ya mapambo: mistari nyembamba ya kijivu hutenganisha vipengele vya mlisho, avatar ni ndogo, metadata hunyamazishwa, na jicho la msomaji limefunzwa kuzingatia mwito wa chungwa wa kuchukua hatua, nembo ya chungwa, kiungo cha chungwa cha "Jisajili", na kitufe cha chungwa cha "Unda". Nyuso huwekwa tambarare na bila vikwazo—hakuna vivuli vya kadi, hakuna vipengele vya paneli ya chrome—kuruhusu uchapaji (kipengele kidogo cha UI cha mfumo wa chrome kilichounganishwa na fonti maalum ya serif) kubeba mzigo mkubwa wa uzito wa uhariri. Mtindo wa kipekee ni vipengele vya chrome vilivyozuiliwa na milipuko ya rangi moja inayong'aa: programu ya kusoma inayohisi kama zana ya kuchapisha.

Mpangilio wa eneo-kazi lenye safu tatu: upau wa pembeni usiobadilika wa kushoto (~pikseli 200, urambazaji wenye aikoni na lebo, unanata), mlisho wa katikati (upana wa juu ~pikseli 600, orodha ya machapisho ya kusogeza wima), na upau wa pembeni wa kulia usiobadilika (~pikseli 300, utafutaji + mapendekezo + usajili). Mlisho wa katikati ndio kiini cha uhariri—hakuna kadi, machapisho tu yamepangwa juu ya mengine yenye vigawanyio vyembamba na nafasi za pikseli 32 kati ya sehemu. Bango kuu liko juu ya mlisho kama kadi moja ya upana kamili. Upau wa pembeni wa kushoto una nembo ya chapa (bango la rangi ya chungwa lenye mistari iliyofunikwa), vipengee sita vya urambazaji, na kitufe cha rangi ya chungwa cha upana kamili chini. Upau wa pembeni wa kulia una sehemu ya utafutaji, kadi ya usajili, na orodha ya "Inayofuata" ya kusoma. Urambazaji ni mdogo—hakuna upau wa juu, hakuna mikate ya mkate; upau wa pembeni NDIO urambazaji. Msongamano wa maudhui ni mkubwa: machapisho hutumia metadata ya pikseli 12-13 na maandishi ya mwili ya pikseli 15-19, na kuunda mdundo kama wa gazeti badala ya hisia ya gridi ya kadi ya soko.

Picha ni maudhui yanayotokana na mtumiaji (avatar za mwandishi, vijipicha vya machapisho, picha za machapisho)—Substack haitoi picha zake za mapambo. Kadi kuu hutumia mng'ao wa rangi ya samawati hadi kijani kibichi pamoja na vipengele vya kielelezo dhahania (maumbo ya kijiometri, vitu vilivyochorwa kama kalamu na maelezo) kama mandharinyuma. Vijipicha vya machapisho kwenye upau wa pembeni kulia ni vidogo (pikseli 64), vimefungwa kwenye kipenyo cha pikseli 8, na hufanya kazi kama hakikisho la orodha ya usomaji. Lugha ya jumla ya kuona inategemea maandishi: kiolesura ni turubai ya usomaji, na picha hutumika kama nanga ndogo za kuona badala ya kuunda mazingira.

Unyenyekevu SaaS Safi Tahariri

https://substack.com

Paleti

Chapa

Signal Orange #ff6719 — Chungwa hutumika kama lafudhi ya pili kwa maelezo ya mapambo na kuangazia ishara zisizo za kawaida. Haipaswi kutumika kama rangi kuu ya wito wa kuchukua hatua.

Isiyoegemea upande wowote

Ink #363737 — Maandishi ya mwili—maandishi makuu, vichwa vya habari, vichwa vya habari vya machapisho, mihuri ya muda, na majina ya waandishi; rangi ya joto, karibu nyeusi badala ya #000 safi kwa usomaji rahisi.
Paper #ffffff — Turubai ya ukurasa, nyuso za kadi, sehemu za kuingiza data, na mandharinyuma ya urambazaji ni nyuso kuu zinazochukua sehemu kubwa ya kiolesura.
Charcoal #232525 — Hali ya kuelea kwa maandishi ya ziada na viungo vyenye viwango vya juu vya uteuzi; zaidi ya hali ya Wino kwa vizuizi vya msimbo na vizuizi vya uteuzi.
Stone #777777 — Rangi isiyo na upande wowote inatumika kwa vipengele vya pili vya UI, vigawanyi, na lebo zilizozimwa. Haipaswi kutumika kama rangi kuu ya wito wa kuchukua hatua.
Ash #b6b6b6 — Mistari nyembamba ya mpaka, mihtasari ya vitufe, mihtasari ya aikoni, mipaka kwenye vidhibiti vilivyozimwa.
Mist #c8c8c8 — Kugawanya mistari, mandharinyuma isiyoonekana kwa aikoni, kujaza seli tupu katika umbo la mifupa.

Uchapaji

kutoka pikseli 12 hadi 32 · hatua 5

system-ui — mbadala: -apple-system · mihtasari 400, 500, 600 · Fonti kuu ya kiolesura cha mtumiaji na maandishi ya mwili hutumika kwa lebo za urambazaji, vitufe, maandishi ya ujumbe, metadata, sehemu za kuingiza, na vipengele vyote vya kiolesura. Ukubwa mdogo wa pikseli 12-13 kwa metadata na pikseli 15-19 kwa maandishi ya mwili huunda hisia ya mlisho mzito wa habari. Uzito ni 400 kwa maandishi ya mwili, 500 kwa vipengele vya urambazaji na lebo za vitufe, na 600 kwa vichwa vya ujumbe vilivyoangaziwa na vichwa vya sehemu.
Cahuenga — mbadala: Charter · mihtasari 500 · Fonti ya serif ya mapambo yenye umbo la kipekee kwa vichwa vya habari vya kiwango cha bidhaa (vichwa vya pembeni, vichwa vya habari vya kadi za usajili, maandishi kuu). Uzito wake wa wastani na urefu mdogo wa mstari huipa mwonekano wa kipekee bila kuhisi kuwa mkubwa; ni fonti pekee ambayo, mbali na rangi ya chungwa, huashiria utambulisho wa Substack.
Spectral — mbadala: Charter · mihtasari 400 · Fonti ya serif kwa machapisho marefu—inayotumika katika vyumba vya kusoma na katika maudhui ya habari ili kuboresha usomaji wa nyenzo za uhariri. Nafasi ya mistari iliyobana kidogo (1.20) huhakikisha usomaji mzuri wa aya huku ikidumisha ufupi wa kawaida wa vyumba vya habari.

Vipindi na umbo

Kusudi	Maana
Uzito	mnene
Hatua ya msingi	8px
Kipenyo cha kitufe	9999px
Redi ya kadi	12px
Vivuli	hapana - mipaka badala ya vivuli
Kati ya sehemu	32px
Upana wa ukurasa	1200px

AI itaunda tovuti yako kwa mtindo wa Substack na kuijaza

Jaza bidhaa na machapisho kupitia kiungo - Instagram, TikTok, Facebook.
Hamisha maudhui kutoka kwa tovuti yako ya zamani—taja tu anwani.
Muundo wa kisasa kwenye injini bora: React ( Next.js) yenye utoaji wa seva na uboreshaji wa SEO bila kuchelewa.
Uboreshaji wa SEO kiotomatiki kikamilifu kwa matokeo ya utafutaji na mapendekezo ya mtandao wa neva.

Unda tovuti katika mtindo huu

Mitindo inayofanana

ElevenLabs — Insha ya picha katika rangi ya krimu yenye umbo la kuvutia na vichwa vya habari hafifu. Daftari la mtindo wa Bauhaus—karatasi yenye rangi ya ganda la yai, wino mweusi, na lafudhi moja ya zambarau na chungwa kwa ajili ya kuonyesha bidhaa.
Awesomic — Matundu ya zinki ya uhariri yenye alama za uakifishaji za rangi ya chungwa zinazokumbusha confetti
Monad — jarida la kiufundi la uhariri kuhusu ngozi ya joto
Dub — Paneli ya kudhibiti karatasi ya mchele isiyong'aa ya Link
Seline Analytics — Jedwali la uchanganuzi tulivu kwenye karatasi ya joto
Notion — Daftari la karatasi lenye joto kwenye jua la mchana
Anthropic — Jarida la kisayansi kuhusu vellum yenye joto—nyuso tulivu za pembe za ndovu, vichwa vya habari vya uhariri vilivyoandikwa kwa ufupi, na lafudhi moja ya udongo inayoonekana tu wakati hatua inahitajika.
Calendly — Wino wa bluu nyeusi kwenye marumaru baridi
Augen Pro — Uwasilishaji mweupe wa Apple una rangi ya bluu ya umeme isiyo na uzito kama lafudhi pekee katika nafasi ya monochrome.
Antimetal — Hadithi ya uhariri kwenye karatasi ya krimu—asubuhi tulivu katika jarida la kisayansi, ambapo kujizuia huonyesha kujiamini na masheikh hufanya kazi nzito
Perk — Chokaa cha umeme kwenye karatasi ya ngozi yenye joto
Ditto — Warsha yenye mwanga wa jua inayounda sampuli za maua ya porini. Nyuso zenye joto za krimu, rangi ya msingi ya manjano inayong'aa, wino wa bluu ya bluu iliyokolea, maumbo ya rangi ya kikaboni yakichanua nyuma ya kipande hicho.