Shop
Plutajuće trgovačko sazviježđe na bijelom mramoru
Online prodavnica funkcioniše po modelu "bijelog platna", s proizvodima prikazanim kao velike, jako zakrivljene kartice sa slikama, a ne kao mreže sličica. Cijeli interfejs je nevjerovatno gladak: radijusi od 20-28px po cijelom prostoru, kontrole u obliku tablete i kompaktno GT Standard tijelo od 16px s uskim negativnim praćenjem koje tekst čini oštrim i podebljanim. Jedini podebljani akcenat sistema je živahna ljubičasta (#5433eb), koja se pojavljuje u logotipu, kružnom polju rezultata pretrage i kao nijansirana sjena na istom dugmetu. Ostatak palete je topla neutralna: bijele površine, suptilno hladno sivo platno, suptilni okviri i gotovo crni tekst. Gustoća ostaje kompaktna s 12px žljebovima, ali herojske i category pruge dišu zahvaljujući velikodušnom vertikalnom ritmu od 64-80px, čineći da iskustvo kupovine više liči na pregledavanje nego na katalog.
Maksimalna širina je 1200px, centrirana na prozirnom platnu #f2f4f5, s trajnom bočnom trakom širine 64px s lijeve strane koja sadrži samo ikone za navigaciju. Glavni element je traka pune širine, s karticama proizvoda postavljenim iznad centriranog ljubičastog logotipa "prodavnice" i trakom za pretraživanje u obliku tablete direktno ispod nje. Tablete kategorija su raspoređene u jednom centriranom redu ispod trake za pretraživanje. Odjeljci sadržaja (Žene, Muškarci, Ljepota, Dom, Bebe i djeca) slijede kao određene trake, a svaki sadrži mrežu s 4 stupca sa slikama proizvoda ili kompoziciju "glavni element i mreža" s 2 stupca. Vertikalni ritam je velikodušan: 64–80px između glavnih odjeljaka. Podnožje je tamna traka na dnu stranice s grupama linkova u obliku stupaca. Strelice u obliku karusela na desnoj strani horizontalnih panela proizvoda označavaju sadržaj koji se može pomicati bez tačaka paginacije.
Fotografija je dominantan vizualni element: fotografije proizvoda preko cijelog ekrana na bijeloj pozadini, izrezane 1:1, i slike životnog stila s toplim zemljanim tonovima (bež, terakota, kadulja, boja slonovače). Slike proizvoda imaju vlastitu boju - korisnički interfejs ostaje akromatski, što omogućava nijansama proizvoda da pruže vizualnu raznolikost. Logotipi brendova pojavljuju se kao preklapajući tekst na tamnim ili svijetlim glavnim slikama, a ne kao pojedinačne ikone. U glavnoj kompoziciji, kartice proizvoda su pozicionirane kao plutajuća, blago preklapajuća konstelacija iznad oznake proizvoda. Ikone su minimalističke i monokromatske (crni obrisi), s izuzetkom ikona kategorija, koje koriste jednu boju brenda. Nema ilustracija, 3D efekata ili gradijenata na slikama proizvoda.
Paleta
Brend
- Shop Violet
#5433eb— Dugme za slanje, tačkasti tekst i logo brenda su jedini akcenti koji ističu akciju i individualnost na bijeloj pozadini. - Violet Wash
#c0b5f3— Prozirni oreol iza ljubičastog dugmeta za slanje koji održava svoj sjaj bez promjene nijanse.
Neutralno
- Canvas Mist
#f2f4f5— Pozadina stranice i dodatna površinska obrada iza izdignutih kartica. - Pure White
#ffffff— Glavna površina za kartice, polja za unos, plutajuće znakove i dugmad u obliku tableta. - Ink Black
#000000— Glavni tekst, naslovi, ikone, navigacijski simboli i kartice proizvoda u tamnom načinu rada. - Faint Border
#ebebeb— Tanke linije razdvajanja na karticama, obrisi polja za unos i okviri dugmadi u obliku tableta. - Muted Gray
#787574— Sekundarni tekst, oznake za navigaciju, obrisi ikona kada je neaktivno - Cool Stone
#cccccc— Rezervisana mjesta, onemogućena stanja i neaktivne pozadine ikona
Tipografija
od 11 do 16px · 4 koraka
- GT Standard — zamjena: Inter · obrisi 400 · Primarni font u svim veličinama - i za tekst i za naslove. GTStandard-MRegular sa 16px/-0.031em je primarni font za tekst, dugmad i oznake. GTStandard-MSemibold sa 20px/-0.05em se koristi za nekoliko velikih naslova; GTStandard-MMedium sa 11–12px se koristi za mikronaslove. Svaka varijanta fonta se prikazuje sa optičkom težinom od 400 - hijerarhija fonta se postiže suptilnim gradijentima i gustim negativnim razmakom između slova, a ne podebljanim kontrastom. Ovo je prepoznatljiv stil: Shop se ne ističe podebljanim fontovima, već oblikuje tekst kroz razmak između slova.
- Shopify Sans — zamjena: Inter · obrisi 400, 700 · Rezervisano za poruke na nivou sistema kao što su baneri za učitavanje aplikacija i tekst saglasnosti za kolačiće.
Intervali i forma
| Svrha | Značenje |
|---|---|
| Gustoća | prosjek |
| Osnovni korak | 12px |
| Radijus dugmeta | 9999px |
| Radijus kartice | 28px |
| Sjene | meke sjene |
| Između sekcija | 64px |
| Širina stranice | 1200px |
Vještačka inteligencija će izgraditi vašu web stranicu u Shop stilu i popuniti je
- Popunite proizvodima i objavama putem linka - Instagram, TikTok, Facebook.
- Prenesite sadržaj sa vaše stare stranice - samo navedite adresu.
- Moderan dizajn na najboljem engine-u: React ( Next.js) sa serverskim renderovanjem i SEO optimizacijom odmah po instalaciji.
- Potpuno automatizirana SEO optimizacija za rezultate pretrage i preporuke neuronskih mreža.
Slični stilovi
- Cursor — Ugodna radionica za pergament, osvijetljena tinjajućim ugljem
- Slush — Napuhani svemir naljepnica na pastelnom papiru
- MindMarket — Ugodna bajkovita knjiga na krem papiru - prijateljsko uredničko platno gdje veliki naslovi Intera i izrezani likovi od papira koegzistiraju na suncem okupanoj, mekoj površini poput naljepnice.
- Airbnb — Tihi bijeli galerijski zid s jednom koraljno crvenom oznakom stranice
- Superr — Topla školska sveska u mekom popodnevnom svjetlu. Krem stranica, narandžasti marker bez poklopca i hrpa plastificiranih naljepnica s imenima koje čekaju da se odlijepe.
- Apple (España) — Muzejska galerija, okupana blagim dnevnim svjetlom, predstavlja jedinstven, očaravajući, bestežinski bijeli prostor, gdje svaki eksponat osvijetli reflektor naspram lagano zatamnjenog zida.
- Lamborghini — Crna boja karoserije u salonu, pod reflektorima - jedan žuti automobil
- Amplemarket — Suncem okupano radno mjesto posuto konfetima
- Getharvest — Radni sto u zlatnom satu – toplo krem platno, bijele razglednice obješene na platnu i jedan jarko narandžasti plamen
- Agence Foudre — Naslovna stranica časopisa je nježno ružičaste boje koja podsjeća na ruž za usne.
- Drive Capital — Retro poster za putovanje automobilom na toplom papiru
- Apple (España) — bijela vitrina za galeriju