Shopify
Tŷ Gwydr Hanner Nos - Mae nodau masnach yn blodeuo yn erbyn cefndir turquoise dwfn, wedi'u goleuo gan un wreichionen o fintys
Mae system ddylunio Shopify yn weithdy hanner nos ar gyfer masnach: cynfas bron yn ddu wedi'i liwio â gwyrdd turquoise dwfn, ffont sans-serif llydan, hyderus, ac un acen mintys bywiog sy'n actifadu eiliadau rhyngweithiol. Mae'r rhyngwyneb yn debyg i ystafell dywyll, lle mae cynhyrchion a brandiau yn ffynhonnell golau—mae lluniau a siopau'n tywynnu yn erbyn arwynebau bron yn ddu, tra bod elfennau crôm yn cilio. Mae cydrannau'n geometrig ond yn feddal: cardiau radiws 12px gyda ffiniau tenau, botymau siâp pilsen, a ffont pwysau 330 sy'n sibrwd graddfa yn hytrach na gweiddi. Defnyddir un marc atalnodi cromatig (#36f4a4) yn gynnil ar ddolenni, tagiau, a chyflyrau ffocws, gan gadw lliw ar gyfer eiliadau swyddogaethol i sicrhau bod straeon masnachwyr yn parhau i fod yn ganolbwynt gweledol.
Y lled mwyaf yw ~1280px, wedi'i ganoli, gyda blociau sblash lled llawn yn ymestyn y tu hwnt i gynhwysydd y llun. Mae rhythm y dudalen yn amrywio: (1) tudalen sblash dywyll lled llawn gyda phennawd a botymau galw-i-weithredu wedi'u gorchuddio, (2) adrannau tywyll cyfforddus gyda thestun a blociau delwedd lled mwyaf mewn 2 golofn neu gridiau delwedd mewn 3 cholofn, (3) paneli arddangos rhyngweithiol (cerdyn cynnyrch, cyfrifiannell cludo, map o'r byd) wedi'u harddangos fel cardiau wedi'u codi ar gynfas dyfnach. Mae'r llywio yn far uchaf sefydlog gyda'r logo + 3 elfen llywio + dolenni eilaidd + y botwm galw-i-weithredu cynradd, i gyd wedi'u halinio i'r dde. Mae'r rhythm fertigol yn defnyddio bylchau 80px rhwng adrannau gyda throsglwyddiad llyfn—dim rhannwyr rhwng adrannau tywyll, dim ond newid yn nôn yr wyneb.
Mae'r dyluniad gweledol yn canolbwyntio'n bennaf ar y manwerthwr: mae lluniau cynnyrch maint llawn a lluniau o ddigwyddiadau brand yn cario'r rhan fwyaf o'r pwysau gweledol, yn aml ar ffurf cefndiroedd mawr gyda thestun gwyn wedi'i orchuddio. Mae'r delweddau wedi'u cnydio'n dynn, â chyferbyniad uchel, ac yn Nadoligaidd eu natur (canu cloch Nasdaq, cyfarchion grŵp, lluniau agos o gynhyrchion yn y llaw). Mae'r cefndir tywyll yn creu'r argraff bod y lluniau hyn wedi'u goleuo gan oleuadau sbot. Mae'r darluniau'n finimalaidd—mae'r prif waith esboniadol yn cael ei wneud gan ddelweddau cynnyrch wedi'u hymgorffori a sgrinluniau o siopau. Mae eiconau'n monocrom, gyda lled llinell o 1.5–2px, fel arfer yn wyn neu #36f4a4 ar gyfer cyflyrau gweithredol.
Palet
Brand
- Shopify Mint
#36f4a4— Dangosyddion llywio gweithredol, cylchoedd ffocws, uchafbwyntiau tag, ac uchafbwyntiau hofran ar ddolenni yw'r unig ddisgleirdeb cromatig sy'n creu ymdeimlad o ryngweithioldeb wedi'i alluogi yn erbyn cefndir tywyll.
Niwtral
- Midnight Forest
#02090a— Canfas tudalen, delweddau cefndir pennawd, delweddau cefndir adran - Deep Lichen
#061a1c— Prif arwynebau cardiau, paneli wedi'u codi, blociau cynnwys. - Shaded Fern
#072720— Panel llywio, cardiau ychwanegol, codiad prin yn amlwg o'r panel. - Spruce Border
#1e2c31— Ffiniau tenau ar gyfer cardiau, llinellau rhannu, amlinelliadau meysydd mewnbwn. - Abyss Indigo
#000a1e— Arwyneb ychwanegol ar gyfer mewnosod cynhyrchion/arddangosiadau, paneli gyda disgrifiadau o swyddogaethau. - Pure White
#ffffff— Prif destun, llenwad botwm, teitl, logos.
Teipograffeg
o 12 i 70px · 8 cam
- Neue Haas Grotesk — amnewid: Inter · amlinelliadau 330, 400, 500, 550, 600 · Y system deipograffig graidd yw penawdau gyda phwysau ffont o 70–96px (330–400) sy'n gynnil yn hytrach nag yn uchel; copi corff gyda phwysau ffont o 16–18px (400–500); a llywio a rhyngwyneb defnyddiwr gyda phwysau ffont o 14–16px (500–550). Mae pwysau ffont ysgafn iawn o 330 ar sgriniau mawr yn nodwedd nodedig: mae'n cyfleu hyder trwy gyfyngiad yn hytrach na swmp.
- Inter Variable — amnewid: Inter · amlinelliadau 400, 420, 450, 550 · Math o ffont eilaidd a ddefnyddir mewn elfennau rhyngwyneb llywio, nodiadau bach, rheolyddion tab, a microdestun mewn troedynnau. Mae ei lythrennau bach ychydig yn fwy a'i fylchau mwy safonol rhwng llythrennau yn ei gwneud yn fwy darllenadwy mewn meintiau cryno. Mae hefyd yn addas ar gyfer sefyllfaoedd lle mae ffont pwysau 420 yn llenwi'r bwlch rhwng ffont rheolaidd a maint canolig.
Cyfnodau a ffurf
| Diben | Ystyr |
|---|---|
| Dwysedd | cyfartaledd |
| Cam sylfaenol | 12px |
| Radiws botwm | 9999px |
| Radiws y cerdyn | 12px |
| Cysgodion | dim ffiniau yn lle cysgodion |
| Rhwng adrannau | 80px |
| Lled y dudalen | 1280px |
Bydd AI yn adeiladu eich gwefan yn null Shopify ac yn ei llenwi
- Llenwch gyda chynhyrchion a phostiadau trwy'r ddolen - Instagram, TikTok, Facebook.
- Trosglwyddo cynnwys o'ch hen wefan—nodwch y cyfeiriad yn unig.
- Dyluniad modern ar yr injan orau: React ( Next.js) gyda rendro gweinydd ac optimeiddio SEO yn syth ar y bocs.
- Optimeiddio SEO cwbl awtomataidd ar gyfer canlyniadau chwilio ac argymhellion rhwydwaith niwral.
Arddulliau tebyg
- Retool — Gweithdy obsidian cynnes - arwyneb ar gyfer offer manwl, wedi'i oleuo gan farwor mudlosgi, lle mae popeth yn cael ei greu
- Elektron — Mae panel rheoli'r offer am hanner nos bron yn gynfas du, lle mae lluniau cynnyrch yn disgleirio tra bod y rhyngwyneb bron yn anweledig.
- REKKI — Panel rheoli hedfan yn y labordy lluniau
- OFFFICE : — oriel noir wedi'i hamgylchynu gan ffont monolithig
- Clyde — Mae'r ystafell arddangos, gyda'i un golau sbot, yn oriel bron yn dywyll lle mae'r unig liw yn yr ystafell yn bêl graddiant cynnes.
- Channel Studio — Labordy lluniau stiwdio gydag un cysgod lamp cwrel
- Electronic Materials Office — Marwor yn tywynnu mewn oriel wedi'i haddurno â siarcol
- ORYZO AI — Traethawd llun am ystafell dywyll. Gwrthrych unig yn hofran yn y tywyllwch cynnes, ffont hufen yr unig addurn.
- Factory — Terfynfa'r "ystafell ryfel" am hanner nos. Panel rheoli du llwm yw'r "ffatri" lle mae un cerdyn gwyn yn glanio fel anfoneb wedi'i goleuo gan fflachlamp—yr unig wrthrych yn yr ystafell yw'r gwaith ei hun.
- Hungry Tiger — Graffiti llachar fel tyrmerig ar wal y tandoor. Palet unedig o aur a brown rhwdlyd, gyda ffont mor fawr fel ei fod yn edrych yn debycach i arwydd marchnad sbeisys nag i wefan.
- Bibliothèque — Oriel ddu siâp ciwb o dan olau haul – plât goleuedig unigol mewn neuadd fawr, dywyll
- Apple (España) — theatr ddu gyda ffitiadau wedi'u goleuo