Shopify
Middernachtsbroeikas - Handelsmerken bloeie tsjin in djip turkooizen eftergrûn, ferljochte troch in inkele fonk munt
It ûntwerpsysteem fan Shopify is in middernachtsworkshop foar hannel: in hast swart doek tint mei in djip turkoois grien, in breed, selsbewust sans-serif lettertype, en in inkele libbene muntaksint dy't ynteraktive mominten aktivearret. De ynterface liket op in tsjustere keamer, dêr't produkten en merken de boarne fan ljocht binne - foto's en winkelpuien gloeie tsjin hast swarte oerflakken, wylst chrome eleminten weromlûke. Komponinten binne geometrysk, mar sêft: kaarten mei in radius fan 12px mei tinne rânen, pilfoarmige knoppen, en in lettertype fan 330 gewicht dat skaal flústeret ynstee fan roppen. In inkele chromatyske leesteken (#36f4a4) wurdt sparjend brûkt op keppelings, tags en fokusstaten, wêrby't kleur reservearre wurdt foar funksjonele mominten om te soargjen dat hannelsferhalen it fisuele fokuspunt bliuwe.
De maksimale breedte is ~1280px, sintraal, mei splash-blokken oer folsleine breedte dy't fierder geane as de fotokontener. It sidenritme wikselt ôf: (1) in donkere splash-side oer folsleine breedte mei in oerlizzende koptekst en call-to-action-knoppen, (2) noflike donkere seksjes mei tekst- en ôfbyldingsblokken oer maksimale breedte yn 2 kolommen of ôfbyldingsrasters yn 3 kolommen, (3) ynteraktive showcase-panielen (produktkaart, ferstjoerrekkenmasine, wrâldkaart) werjûn as ferhege kaarten op in djipper doek. De navigaasje is in fêste boppeste balke mei it logo + 3 navigaasje-eleminten + sekundêre keppelings + de primêre call-to-action-knop, allegear rjochts ôfstimd. It fertikale ritme brûkt gatten fan 80px tusken seksjes mei in glêde oergong - gjin skiedingswanden tusken donkere seksjes, allinich in feroaring yn oerflaktoan.
It fisuele ûntwerp is benammen rjochte op 'e retailer: produktfoto's op folsleine grutte en foto's fan merkeveneminten drage it grutste part fan it fisuele gewicht, faak yn 'e foarm fan grutte eftergrûnen mei oerlizzende wite tekst. De ôfbyldings binne strak bysnien, hawwe in heech kontrast en binne feestlik fan aard (it rinkeljen fan 'e Nasdaq-bel, groepsgroetnis, close-ups fan produkten yn 'e hân). De donkere eftergrûn skept de yndruk dat dizze foto's ferljochte wurde troch spotlights. De yllustraasjes binne minimalistysk - it wichtichste ferklearjende wurk wurdt dien troch ynbêde produktôfbyldings en skermôfbyldings fan winkels. Ikoanen binne monochroom, mei in linebreedte fan 1,5-2px, typysk wyt of #36f4a4 foar aktive steaten.
Palet
Merk
- Shopify Mint
#36f4a4— Aktive navigaasje-yndikatoaren, fokusringen, tag-markeringen en sweefmarkeringen op keppelings binne de ienige chromatyske fonkeling dy't in gefoel fan ynskeakele ynteraktiviteit makket tsjin in donkere eftergrûn.
Neutraal
- Midnight Forest
#02090a— Sidedoek, koptekst eftergrûnôfbyldings, seksje eftergrûnôfbyldings - Deep Lichen
#061a1c— Haadkaartoerflakken, ferhege panielen, ynhâldsblokken. - Shaded Fern
#072720— Navigaasjepaniel, ekstra kaarten, amper merkbere ferheging fan it paniel. - Spruce Border
#1e2c31— Tinne rânen foar kaarten, skiedslinen, omtreklinen fan ynfierfjilden. - Abyss Indigo
#000a1e— Ekstra oerflak foar it ynbêdzjen fan produkten/demonstraasjes, panielen mei beskriuwingen fan funksjes. - Pure White
#ffffff— Haadtekst, knopynfolling, titel, logo's.
Typografy
fan 12 oant 70px · 8 stappen
- Neue Haas Grotesk — ferfanging: Inter · sketsen 330, 400, 500, 550, 600 · It kearntypografyske systeem bestiet út koppen mei in lettertypegewicht fan 70–96px (330–400) dy't subtyl binne ynstee fan lûd; lichemtekst mei in lettertypegewicht fan 16–18px (400–500); en navigaasje en brûkersynterface mei in lettertypegewicht fan 14–16px (500–550). It ultralichte lettertypegewicht fan 330 op grutte skermgrutte is in ûnderskiedend skaaimerk: it straalt fertrouwen út troch beheining ynstee fan bulk.
- Inter Variable — ferfanging: Inter · sketsen 400, 420, 450, 550 · In sekundêr lettertype dat brûkt wurdt yn navigaasje-ynterface-eleminten, lytse notysjes, tabkontrôles en mikrotekst yn fuotteksten. De wat gruttere lytse letters en mear standert letterôfstân meitsje it better lêsber by kompakte formaten. It is ek geskikt foar situaasjes wêr't in lettertype fan 420 gewicht de gat tusken in gewoan en middelgrut lettertype follet.
Yntervallen en foarm
| Doel | Betsjutting |
|---|---|
| Dichtheid | trochsneed |
| Basisstap | 12px |
| Knopradius | 9999px |
| Kaartradius | 12px |
| Skaden | gjin grinzen ynstee fan skaden |
| Tusken seksjes | 80px |
| Sidebreedte | 1280px |
AI sil jo webside bouwe yn Shopify -styl en it folje
- Folje oan mei produkten en berjochten fia de link - Instagram, TikTok, Facebook.
- Oerdrage ynhâld fan jo âlde side - spesifisearje gewoan it adres.
- Modern ûntwerp op 'e bêste motor: React ( Next.js) mei serverrendering en SEO-optimalisaasje direkt út 'e doaze.
- Folslein automatisearre SEO-optimalisaasje foar sykresultaten en oanbefellings foar neurale netwurken.
Ferlykbere stilen
- Retool — In waarme obsidiaanwurkpleats - in oerflak foar presyzje-ark, ferljochte troch smeulende koalen, dêr't alles makke wurdt
- Elektron — It kontrôlepaniel fan 'e apparatuer om middernacht is in hast swart doek, dêr't produktfoto's skine, wylst de ynterface praktysk ûnsichtber bliuwt.
- REKKI — Flechtkontrôlepaniel yn it fotolaboratoarium
- OFFFICE : — in noir-galery omhuld troch in monolitysk lettertype
- Clyde — De showroom, mei syn ienige spotlight, is in hast tsjustere galery dêr't de ienige kleur yn 'e keamer in waarme kleurferrinbal is.
- Channel Studio — In studiofotolaboratoarium mei ien koraal lampeskerm
- Electronic Materials Office — In gloeiende koal yn in galery fersierd mei houtskoal
- ORYZO AI — In foto-essay oer in tsjustere keamer. In iensum objekt dat sweeft yn 'e waarme tsjusternis, mei in crèmekleurige lettertype as ienige dekoraasje.
- Factory — De terminal fan 'e "oarlochskeamer" om middernacht. De "fabryk" is in skerp swart kontrôlepaniel dêr't in inkele wite kaart lânt as in mei in bûselampe ferljochte ferstjoering - it ienige objekt yn 'e keamer is it wurk sels.
- Hungry Tiger — Kurkuma-heldere graffiti op 'e muorre fan 'e tandoor. In ferienige palet fan goud en roestbrún, mei in lettertype sa grut dat it mear liket op in buordsje fan 'e krûdemerk as op in webside.
- Bibliothèque — In swarte kubusfoarmige galery ûnder in spotlight - in iensume ferljochte plaat yn in grutte, tsjustere hal
- Apple (España) — swart teater mei ferljochte armaturen