Substack
redaksiýadaky stoluň üstünde mämişi syýa
Substack köne habar beriş paneline meňzeýär — ak kanwas, ýyly, gara tekst we mazmun döretmegiň her tapgyryny alamatlandyrýan ýeke-täk ýagty mämişi reňkli aksent. Wizual ierarhiýa bezeg däl-de, dykyzlyga esaslanýar: inçe çal çyzyklar lent elementlerini bölýär, awatarlar kiçi, metamaglumatlar sessiz we okyjynyň gözi mämişi reňkli çagyryşa, mämişi reňkli logotipe, mämişi reňkli "Abuna ýazyl" baglanyşygyna we mämişi reňkli "Döret" düwmesine ünsi jemlemek üçin öwredilýär. Ýüzler tekiz we çäklendirilmedik ýagdaýda saklanýar — kart kölegeleri ýok, hrom panel elementleri ýok — tipografiýanyň (özboluşly serif başlyk şrifti bilen utgaşdyrylan ykjam hrom ulgam interfeýsi elementi) redaksiýanyň agramynyň esasy bölegini götermegine mümkinçilik berýär. Gol çekiş stili çäklendirilen hrom elementleri we janly, bir reňkli açyşlardyr: neşir guraly ýaly duýulýan okamak programmasy.
Üç sütünli iş stolunyň düzülişi: üýtgewsiz çep gapdal panel (~200px, nyşanlar we ýazgylar bilen nawigasiýa, ýapyşykly), merkezi lenta (maks. giňlik ~600px, ýazgylaryň dikligine aýlanýan sanawy) we üýtgewsiz sag gapdal panel (~300px, gözleg + maslahatlar + bellige alyş). Merkezi lenta redaksiýanyň esasy bölegi bolup durýar — kartlar ýok, diňe inçe bölüjiler we bölümleriň arasynda 32px aralyklar bilen biri-biriniň üstüne goýlan ýazgylar. Esasy banner lentanyň ýokarsynda ýeke-täk doly giňlikdäki kart hökmünde ýerleşýär. Çep gapdal panelde brend logotipi (üstüne çekilen çyzyklary bolan mämişi reňkli belgi), alty nawigasiýa elementi we aşakda doly giňlikdäki mämişi reňkli "Döret" düwmesi bar. Sag gapdal panelde gözleg meýdany, bellige alyş karty we okamak üçin "Indiki" sanawy bar. Nawigasiýa minimal — ýokarky panel ýok, çörek ownuklary ýok; gapdal panel nawigasiýadyr. Mazmun dykyzlygy ýokary: ýazgylar 12-13px metamaglumatlary we 15-19px esasy teksti ulanýar, bu bolsa bazaryň kart torunyň duýgusyndan has köp gazet ýaly ritm döredýär.
Suratlar ulanyjy tarapyndan döredilen mazmundyr (awtoryň awatarlary, ýazgylaryň kiçi suratlary, ýazgylaryň suratlary) — Substack öz bezeg suratlaryny hödürlemeýär. Esasy kart fon hökmünde abstrakt suratlandyryjy elementler (geometrik şekiller, ruçkalar we bellikler ýaly stilize edilen obýektler) bilen firuze-ýaşyl gradient ulanýar. Sag gapdaldaky ýazgylaryň kiçi suratlary kiçi (64 piksel), 8 piksel radiusda ýerleşýär we okamak sanawynyň deslapky görnüşi hökmünde hyzmat edýär. Umumy wizual dil tekste esaslanýar: interfeýs okamak üçin niýetlenendir we suratlar atmosfera döretmekden has köp kiçi wizual löwherler hökmünde hyzmat edýär.
Palitra
Brend
- Signal Orange
#ff6719— Mämişi reňk bezeg detallary üçin ikinji derejeli aksent hökmünde we seýrek duş gelýän alamatlary nygtamak üçin ulanylýar. Ony herekete çagyryşlar üçin esasy reňk hökmünde ulanmaly däl.
Neýtral
- Ink
#363737— Esasy tekst — esasy tekst, sözbaşylar, habar atlary, wagt möhürleri we awtorlaryň atlary; okamak aňsatlygy üçin arassa #000-iň ýerine ýyly, diýen ýaly gara reňk. - Paper
#ffffff— Sahypanyň kanwasy, kartoçka ýüzleri, giriş meýdançalary we nawigasiýa fony interfeýsiň aglaba bölegini eýeleýän esasy ýüzlerdir. - Charcoal
#232525— Ýokary saýlama derejeleri bolan goşmaça tekst we baglanyşyklar üçin kursory getiriň; kod bloklary we saýlama bloklary üçin "Syýa" režiminden has çuňňur. - Stone
#777777— Ikinji derejeli UI elementleri, bölüjiler we sessiz etiketkalar üçin neýtral reňk goldanylýar. Ol herekete çagyryşlar üçin esasy reňk hökmünde ulanylmaly däl. - Ash
#b6b6b6— Inçe çäk çyzyklary, düwmeleriň konturlary, nyşanlaryň konturlary, öçürilen dolandyryş elementlerinde çäkler. - Mist
#c8c8c8— Bölünýän çyzyklar, nyşanlar üçin göze ilmeýän fon, skelet görnüşinde boş öýjükleri doldurmak.
Tipografiýa
12-den 32 piksele çenli · 5 ädim
- system-ui — çalyşmak: -apple-system · konturlar 400, 500, 600 · Ulanyjy interfeýsi we esasy tekst üçin esasy şrift nawigasiýa bellikleri, düwmeler, habar teksti, metamaglumatlar, giriş meýdanlary we ähli interfeýs elementleri üçin ulanylýar. Metadatalar üçin 12-13 piksel we esasy tekst üçin 15-19 piksel ölçegli kiçijik ölçegler dykyz habar lentasynyň duýgusyny döredýär. Agramy esasy tekst üçin 400, nawigasiýa elementleri we düwme bellikleri üçin 500 we aýratynlandyrylan habar atlary we bölüm sözbaşylary üçin 600.
- Cahuenga — çalyşmak: Charter · konturlar 500 · Önüm derejesindäki sözbaşylar (ýan panel sözbaşylary, hasaba alyş kartynyň sözbaşylary, esasy tekst) üçin resmi bezeg serif şrifti. Orta agramy we azajyk setir beýikligi oňa göwrümli duýulman, tapawutly görnüş berýär; bu mämişi reňkden başga-da, Substack-iň kimligini görkezýän ýeke-täk şriftdir.
- Spectral — çalyşmak: Charter · konturlar 400 · Uzyn ýazgylar üçin serif şrift — okaýyş zallarynda we täzelikler lentasynyň mazmunynda redaksiýa materiallarynyň okalyşyny gowulandyrmak üçin ulanylýar. Setirleriň biraz gysga aralygy (1.20) täzelikler otaglaryna mahsus bolan ykjamlygy saklap, abzaslaryň rahat okalyşyny üpjün edýär.
Aralyklar we görnüş
| Maksat | Manysy |
|---|---|
| Dykyzlyk | dykyz |
| Esasy ädim | 8px |
| Düwme radiusy | 9999px |
| Kart radiusy | 12px |
| Kölegeler | kölegeleriň ýerine serhetler ýok |
| Bölümleriň arasynda | 32px |
| Sahypanyň giňligi | 1200px |
Süni intellekt web sahypaňyzy Substack stilinde gurar we ony doldurar
- Instagram, TikTok, Facebook salgylary arkaly önümler we ýazgylar bilen dolduryň.
- Köne saýtyňyzdan mazmuny göçüriň — diňe salgyny görkeziň.
- Iň gowy motorda döwrebap dizaýn: React ( Next.js) serwer renderi we SEO optimizasiýasy bilen gyssagly ýagdaýda.
- Gözleg netijeleri we neýron tor maslahatlary üçin doly awtomatlaşdyrylan SEO optimizasiýasy.
Meňzeş stiller
- ElevenLabs — Ýumşak krem reňkli we inçe sözbaşyly suratly esse. Bauhaus stilindäki depderçe — ýumurtga gabygy reňkli kagyz, gara syýa we önümi görkezmek üçin ýekeje gyrmyzy we mämişi reňkli bezeg.
- Awesomic — Konfeti ýadyňa salýan mämişi punktuasiýa belgileri bolan redaksiýa sink tor
- Monad — ýyly pergamentde redaksiýa tehniki žurnaly
- Dub — Link-iň mat tüwi kagyzynyň dolandyryş paneli
- Seline Analytics — Ýyly kagyzyň üstünde sessiz analitiki stol
- Notion — Günortan güneşinde ýyly kagyz depder
- Anthropic — Ýyly pergament barada ylmy meýdan žurnaly — pil süňküniň asuda ýüzleri, serif redaksiýa sözbaşylary we diňe hereket gerek bolanda peýda bolýan ýekeje palçyk aksenti.
- Calendly — Sowuk mermeriň üstünde gara gök syýa
- Augen Pro — Apple-iň ak görnüşi monohrom giňişlikde ýeke-täk aksent hökmünde kliniki, agramsyz, elektrik gök reňki öz içine alýar.
- Antimetal — Kremli kagyzdaky redaksiýa hronikasy — ylmy žurnalda asuda ertir, bu ýerde öz-özüňi saklamak ynamy aňladýar, serifler bolsa agyr işleri ýerine ýetirýär.
- Perk — Gyzgyn pergament kagyzynda elektrik laýmy
- Ditto — Gün şöhlesi düşýän ussahanada ýabany gülleriň nusgalaryny döredýär. Ýyly krem reňkli ýüzler, açyk sary esasy reňk, goýy gök reňkli syýalar, eseriň arkasynda açylýan organiki reňkli görnüşler.