Shopify
Ponoćni staklenik - Zaštitni znakovi cvjetaju na dubokoj tirkiznoj pozadini, osvijetljeni jednom iskrom mente
Shopifyjev dizajnerski sustav je ponoćna radionica za trgovinu: gotovo crno platno nijansirano tamno tirkizno zelenom bojom, širok, samouvjeren sans-serif font i jedan živopisni mint naglasak koji aktivira interaktivne trenutke. Sučelje podsjeća na mračnu komoru, gdje su proizvodi i brendovi izvor svjetlosti - fotografije i izlozi sjaje na gotovo crnim površinama, dok se kromirani elementi povlače. Komponente su geometrijske, ali mekane: kartice radijusa 12px s tankim rubovima, gumbi u obliku tableta i font debljine 330 koji šapuće skalu, a ne viče. Jedan kromatski interpunkcijski znak (#36f4a4) koristi se štedljivo na poveznicama, oznakama i stanjima fokusa, rezervirajući boju za funkcionalne trenutke kako bi se osiguralo da priče trgovaca ostanu vizualna središnja točka.
Maksimalna širina je ~1280px, centrirano, s blokovima uvodnih poruka pune širine koji se protežu izvan spremnika za fotografije. Ritam stranice se izmjenjuje: (1) tamna uvodna stranica pune širine s preklopljenim naslovom i gumbima za poziv na akciju, (2) ugodni tamni odjeljci s blokovima teksta i slika maksimalne širine u 2 stupca ili mrežama slika u 3 stupca, (3) interaktivni paneli za izlaganje (kartica proizvoda, kalkulator dostave, karta svijeta) prikazani kao izdignute kartice na dubljem platnu. Navigacija je fiksna gornja traka s logotipom + 3 navigacijska elementa + sekundarne poveznice + primarni gumb za poziv na akciju, sve poravnato udesno. Vertikalni ritam koristi razmake od 80px između odjeljaka s glatkim prijelazom - bez razdjelnika između tamnih odjeljaka, samo promjena u tonu površine.
Vizualni dizajn prvenstveno je usmjeren na trgovca: fotografije proizvoda u punoj veličini i fotografije s događanja brenda nose glavninu vizualne težine, često u obliku velikih pozadina s preklopljenim bijelim tekstom. Slike su usko izrezane, visokog kontrasta i svečane prirode (zvonjava Nasdaqovog zvona, grupni pozdravi, krupni planovi proizvoda u rukama). Tamna pozadina stvara dojam da su ove fotografije osvijetljene reflektorima. Ilustracije su minimalističke - glavni objašnjavajući posao obavljaju ugrađene slike proizvoda i snimke zaslona izloga. Ikone su monokromatske, s širinom linije od 1,5–2px, obično bijele ili #36f4a4 za aktivna stanja.
Paleta
Robna marka
- Shopify Mint
#36f4a4— Aktivni indikatori navigacije, prstenovi za fokusiranje, isticanja oznaka i isticanja pri zadržavanju pokazivača miša na poveznicama jedini su kromatski odsjaj koji stvara osjećaj omogućene interaktivnosti na tamnoj pozadini.
Neutralno
- Midnight Forest
#02090a— Platno stranice, pozadinske slike zaglavlja, pozadinske slike odjeljaka - Deep Lichen
#061a1c— Glavne površine kartica, podignuti paneli, blokovi sadržaja. - Shaded Fern
#072720— Navigacijska ploča, dodatne kartice, jedva primjetno podizanje ploče. - Spruce Border
#1e2c31— Tanki obrubi za kartice, razdjelne linije, obrisi polja za unos. - Abyss Indigo
#000a1e— Dodatna površina za ugradnju proizvoda/demonstracija, panela s opisima funkcija. - Pure White
#ffffff— Glavni tekst, ispuna gumba, naslov, logotipi.
Tipografija
od 12 do 70px · 8 koraka
- Neue Haas Grotesk — zamjena: Inter · obrisi 330, 400, 500, 550, 600 · Osnovni tipografski sustav čine naslovi s debljinom fonta od 70–96px (330–400) koji su suptilni, a ne glomazni; glavni tekst s debljinom fonta od 16–18px (400–500); te navigacija i korisničko sučelje s debljinom fonta od 14–16px (500–550). Ultralagana debljina fonta od 330 na velikim veličinama zaslona je prepoznatljiva značajka: prenosi samopouzdanje kroz suzdržanost, a ne kroz glomaznost.
- Inter Variable — zamjena: Inter · obrisi 400, 420, 450, 550 · Sekundarna vrsta fonta koja se koristi u elementima navigacijskog sučelja, malim bilješkama, kontrolama kartica i mikrotekstu u podnožjima. Njegova nešto veća mala slova i veći standardni razmak između slova čine ga čitljivijim u kompaktnim veličinama. Također je prikladan za situacije u kojima font težine 420 popunjava prazninu između običnog i srednjeg fonta.
Intervali i forma
| Svrha | Značenje |
|---|---|
| Gustoća | prosjek |
| Osnovni korak | 12px |
| Radijus gumba | 9999px |
| Radijus kartice | 12px |
| Sjene | ne - obrubi umjesto sjena |
| Između odjeljaka | 80px |
| Širina stranice | 1280px |
Umjetna inteligencija će izraditi vašu web stranicu u Shopify stilu i ispuniti je
- Popunite proizvodima i objavama putem poveznice - Instagram, TikTok, Facebook.
- Prenesite sadržaj sa svoje stare web-lokacije - samo navedite adresu.
- Moderan dizajn na najboljem engineu: React ( Next.js) s renderiranjem na serveru i SEO optimizacijom odmah po instalaciji.
- Potpuno automatizirana SEO optimizacija za rezultate pretraživanja i preporuke neuronskih mreža.
Slični stilovi
- Retool — Topla radionica od opsidijana - površina za precizne alate, osvijetljena tinjajućim žarom, gdje se sve stvara
- Elektron — Upravljačka ploča opreme u ponoć je gotovo crno platno, gdje fotografije proizvoda sjaje dok sučelje ostaje praktički nevidljivo.
- REKKI — Kontrolna ploča leta u fotolaboratoriju
- OFFFICE : — galerija noir okružena monolitnim fontom
- Clyde — Izložbeni prostor, s jednim reflektorom, gotovo je mračna galerija u kojoj je jedina boja u sobi topla gradijentna kugla.
- Channel Studio — Studijski fotolaboratorij s jednim koraljnim abažurom
- Electronic Materials Office — Užareni žar u galeriji ukrašenoj ugljenom
- ORYZO AI — Foto esej o mračnoj komori. Usamljeni predmet koji lebdi u toplom mraku, krem font jedini ukras.
- Factory — Terminal "ratne sobe" u ponoć. "Tvornica" je potpuno crna kontrolna ploča na koju sleti jedna bijela kartica poput depeše osvijetljene baterijskom lampom - jedini predmet u sobi je sam rad.
- Hungry Tiger — Grafiti jarkih boja kurkume na zidu tandoora. Ujedinjena paleta zlatne i hrđavo smeđe, s fontom toliko velikim da više izgleda kao znak tržnice začina nego web stranica.
- Bibliothèque — Crna galerija u obliku kocke pod reflektorom – usamljena osvijetljena ploča u prostranoj, mračnoj dvorani
- Apple (España) — crno kazalište s osvijetljenim elementima