Vercel
Terminal i shtypur në letër të bardhë
Sistemi i dizajnit Vercel është një ushtrim në monokromën e disiplinuar: një kanavacë gati e bardhë (#fafafa), shkronja të zeza, kufij të hollë dhe një mungesë e plotë e ngjyrës dekorative. Gjuha vizuale evokon një terminal zhvilluesi të paraqitur në shtyp - Geist Sans është mezi i lexueshëm në shkallën "heroike" me një peshë prej 400-450 dhe një hapësirë shkronjash prej -0.06em, ndërsa Geist Mono aplikon etiketa, meta të dhëna dhe mostra kodi në madhësi të mëdha 11-13px. Butonat janë rreze të mprehta 6px ose drejtkëndësha të zeza të pastra mbi të bardhë ose të bardha mbi të zezë. Sistemi mbështetet në kontrast dhe hierarki tipografike në vend të ngjyrës, duke përdorur shenjën trekëndore (▲) dhe një markë fjalësh me dy rreshta si elementët e vetëm të markës. Sipërfaqet janë të grumbulluara njëra mbi tjetrën në rendin #fafafa → #ebebeb → #171717, duke krijuar thellësi përmes ndryshimit të vlerave tonale në vend të hijes ose ngjyrës. Çdo element është ndërtuar në një rrjetë 4px me një dendësi kompakte, duke rezultuar në një ndërfaqe që të kujton fletoren e një inxhinieri - të saktë, funksionale dhe pa frikë nga hapësira e bardhë.
Kontejneri është 1280px i gjerë, i përqendruar, me mbushje të bollshme horizontale (24-48px). Blloku kryesor përdor një kompozim asimetrik me tre zona: një titull i madh në të majtë, një simbol marke i përqendruar dhe një bllok "vetull" në të djathtë. Poshtë bllokut kryesor, përmbajtja është e rregulluar në vija alternative: një shirit me gjerësi të plotë me logon e klientit, i ndjekur nga një seksion me dy kolona "Krijuesit e Agjentëve" me titullin në të majtë dhe një paraqitje produkti në të djathtë, i ndjekur nga një rrjetë me tre karta me karakteristika. Seksionet ndahen nga ndarje vertikale prej 96-128px pa ndarës ose zhvendosje sfondi. Navigimi është një panel i vetëm fiks 64px me një sfond të turbullt. Rrjetat e kartave përdorin vazhdimisht një paraqitje me dy ose tre kolona me ndarje 16-24px. Dendësia e përgjithshme është kompakte - teksti është i lehtë për t'u lexuar, ka hapësirë të bardhë të mjaftueshme, por madhësia e shkronjave dhe madhësitë e komponentëve e pengojnë faqen të duket e ajrosur.
Imazhet janë të rralla dhe gjithmonë funksionale. Elementi kryesor vizual është trekëndëshi i zi (▲) - një shenjë gjeometrike e markës që shfaqet si një siluetë pezull në shkallën "kapitale". Logot e klientëve në shiritin e provës së konceptit përdorin markat aktuale të secilës markë në shkallë gri. Maketet e produkteve (ndërfaqja e bisedës së Notion, dalja e terminalit CLI, karta e pasaportës) janë të integruara si pamje të ekranit në modalitetin e ndriçuar brenda kartave të kornizuara. Nuk ka fotografi, ilustrime ose elementë 3D - sistemi është tipografi e pastër dhe forma gjeometrike në letër të bardhë.
Paletë
Neutral
- Obsidian
#171717— Titujt kryesorë, kufijtë e navigimit, mbushja e errët e butonave dhe shënuesit e listës janë pothuajse të zinj, duke shmangur ashpërsinë dhe ngopjen e ndezur. - Paper White
#fafafa— Kanavaca e faqes, sipërfaqet e kartave, mbushjet me dritë të butonave - ky është sfondi standard mbi të cilin ndodhet gjithçka tjetër. - Pure White
#ffffff— Sipërfaqe të ngritura të kartave, futje, fusha hyrëse. - Hairline
#ebebeb— Kufijtë 1px në butona, lidhje dhe karta janë të dukshëm në nivele të larta zmadhimi, por të padukshëm në nivele të ulëta zmadhimi. - Ash
#c9c9c9— Tekst i çaktivizuar, etiketa të heshtura, filigrane të markës në logot e klientëve. - Smoke
#a8a8a8— Tekst dytësor, tekst vendmbajtës, mbushje delikate e ikonave.
Tipografi
nga 11 në 64px · 6 hapa
- Geist Sans — zëvendësim: Inter · skica 400, 450, 500 · Fonti kryesor për ndërfaqen dhe titujt është një sans-serif gjeometrik i projektuar me porosi nga Vercel me hapësirë të vogël midis shkronjave në madhësi të mëdha (-0.06em në 56-64px, -0.05em në 30px). Për titujt në krye të faqes, u zgjodh një peshë 450: më i trashë se Light por më i lehtë se Semi-Bold, duke krijuar një ton të sigurt, por jo mbizotërues.
- Geist Mono — zëvendësim: JetBrains Mono · skica 400, 500, 600 · Një font dytësor me hapësirë të vetme për mbishkrime, blloqe kodi, panele dalëse CLI, meta të dhëna dhe tekst me shkronja të mëdha. Kombinimi 8px/600px/me shkronja të mëdha lejon vendosjen e saktë të shenjave të vogla të fjalëve. Hapësira e gjerë midis shkronjave (0.071em) në versionin me hapësirë të vetme ofron hapësirë të mjaftueshme për tekst me shkronja të mëdha.
Intervalet dhe forma
| Qëllimi | Kuptimi |
|---|---|
| Dendësia | i dendur |
| Hapi bazë | 12px |
| Rrezja e butonit | 6px |
| Rrezja e kartës | 6px |
| Hijet | pa kufij në vend të hijeve |
| Midis seksioneve | 96-128px |
| Gjerësia e faqes | 1280px |
IA do ta ndërtojë faqen tuaj të internetit në stilin Vercel dhe do ta mbushë atë
- Plotësoni me produkte dhe postime përmes linkut - Instagram, TikTok, Facebook.
- Transferoni përmbajtje nga faqja juaj e vjetër—thjesht specifikoni adresën.
- Dizajn modern në motorin më të mirë: React ( Next.js) me renderim të serverit dhe optimizim SEO që në fillim.
- Optimizim plotësisht i automatizuar i SEO-s për rezultatet e kërkimit dhe rekomandimet e rrjeteve nervore.
Stile të ngjashme
- Headspace — Një cep i ngrohtë i Wellness-it në letër të ngrohtë
- WHOOP — Laborator performance në mesnatë - tavolina të bardha laboratorike klinike nën një boshllëk të zi teatral, një puls i vetëm vjollcë elektriciteti.
- Together AI — Konsol kërkimi në letër akullnajore
- v0 by Vercel — Vizatim me torno. Preciziteti dhe funksionaliteti janë parësore, me secilin element që shërben një qëllim të qartë në një sipërfaqe të pastër dhe teknikisht të përsosur.
- Dovetail — Një plan nën një hënë të zezë - vija grafike mezi të dukshme, font i bardhë, një shkëlqim vjollcë
- Glideapps — tavolinë vizatimi monokrome me një shkëlqim bruz elektrik
- Timescale — Vizatim inxhinierik në letër milimetrike të ngrohtë
- UGLYCASH — Një fletore e mbuluar me afishe në letër me ngjyrë krem përçon atmosferën e një fintech-u të guximshëm dhe maksimalist që shfaq me krenari kaosin e tij.
- Sprout Social — Një filizë e gjelbër mbi propozoj të zi. Një theks i ndritshëm në një kanavacë të rreptë monokrome, ngjyra e së cilës përdoret vetëm për veprim, me një font gjeometrik të sigurt që shërben si tabelë orientuese.
- Krea — Galeria noir në mesnatë
- Evergreen — Serë diellore në letër liri
- Factory — Terminali i "dhomës së luftës" në mesnatë. "Fabrika" është një panel kontrolli i zi ku një kartë e vetme e bardhë bie si një sinjalizues i ndriçuar nga elektriku dore - i vetmi objekt në dhomë është vetë puna.