Shop
Ак мәрмәрдә йөзеп йөрүче сәүдә йолдызлыгы
Онлайн кибет "ак холст" моделендә эшли, продуктлар миниатюралар челтәре урынына зур, нык бөгелгән рәсем карталары рәвешендә күрсәтелә. Интерфейс гаҗәеп шома: 20-28 пиксель радиуслы, таблетка формасындагы идарә итү элементлары һәм текстны ачык һәм калын итә торган тыгыз негатив күзәтү белән компакт 16 пиксель GT Standard корпусы. Системаның бердәнбер калын акценты - якты шәмәхә төс (#5433eb), ул логотипта, түгәрәк эзләү нәтиҗәләре кырында һәм шул ук төймәдә төсле күләгә буларак күренә. Палитраның калган өлеше җылы нейтраль: ак өслекләр, нечкә салкын соры холст, нечкә чикләр һәм кара төскә якын текст. Тыгызлык 12 пиксельле суүткәргечләр белән компакт булып кала, ләкин герой һәм категория полосалары 64-80 пиксель киң вертикаль ритм аркасында сулыш ала, бу сәүдә тәҗрибәсен каталогтан күбрәк карау кебек хис иттерә.
Максималь киңлек - 1200 пиксель, ул #f2f4f5 формасындагы үтә күренмәле полотнога урнашкан, сул якта 64 пиксель киңлектәге ян панельдә бары тик навигация иконкалары гына бар. Төп элемент - тулы киңлектәге полоса, анда продукт карталары үзәктәге шәмәхә төстәге "кибет" логотибы өстендә урнашкан, ә аның астында таблетка формасындагы эзләү юлы урнашкан. Категория таблеткалары эзләү юлы астында бер үзәк рәттә урнаштырылган. Эчтәлек бүлекләре (Хатын-кызлар, Ир-атлар, Матурлык, Өй, Бала һәм Балалар) билгеләнгән полосалар рәвешендә бара, һәрберсендә продукт рәсемнәре булган 4 баганалы челтәр яки 2 баганалы "төп элемент һәм челтәр" композициясе бар. Вертикаль ритм киң: төп бүлекләр арасында 64–80 пиксель. Аскы колонтитул - битнең аскы өлешендәге кара полоса, багана формасындагы сылтама төркемнәре белән. Горизонталь продукт панельләренең уң ягындагы карусель уклары битләү нокталары булмаган әйләндереп була торган эчтәлекне күрсәтә.
Фотография - доминант визуаль элемент: ак фонда тулы экранлы продукт фотолары, 1:1 киселгән, һәм җылы туфрак төсмерләре (беже, терракота, шалфей, фил сөяге) белән тормыш рәвеше рәсемнәре. Продукция рәсемнәренең үз төсе бар - кулланучы интерфейсы ахроматик булып кала, бу продукт төсмерләренә визуаль төрлелек бирергә мөмкинлек бирә. Бренд логотиплары аерым иконалар буларак түгел, ә караңгы яки ачык төп рәсемнәрдә өстәмә текст буларак күренә. Төп композициядә продукт карточкалары сүз билгесе өстендә йөзеп йөрүче, бераз капланган йолдызлык буларак урнаштырыла. Иконалар минималист һәм монохром (кара контурлар), категория иконкаларыннан кала, алар бер бренд төсен кулланалар. Продукция рәсемнәрендә иллюстрацияләр, 3D эффектлар яки градиентлар юк.
Палитра
Бренд
- Shop Violet
#5433eb— "Җибәрү" төймәсе, нокталы текст билгесе һәм бренд логотибы - ак фонда хәрәкәтне һәм индивидуальлекне ассызыклый торган бердәнбер акцентлар. - Violet Wash
#c0b5f3— Шәмәхә төстәге җибәрү төймәсе артындагы үтә күренмәле гало төсен үзгәртмичә балкышын саклый.
Нейтраль
- Canvas Mist
#f2f4f5— Бит фоны һәм күтәрелгән карточкалар артындагы өстәмә өслек эшкәртүе. - Pure White
#ffffff— Карталар, кертү кырлары, йөзүче билгеләр һәм таблетка формасындагы төймәләр өчен төп өслек. - Ink Black
#000000— Караңгы режимда төп текст, башлыклар, иконалар, навигация символлары һәм продукт карталары. - Faint Border
#ebebeb— Карточкалардагы нечкә бүлгеч сызыклар, кертү кыры контурлары һәм таблетка формасындагы төймә рамнары. - Muted Gray
#787574— Актив булмаганда икенчел текст, навигация ярлыклары, иконка контурлары - Cool Stone
#cccccc— Урын тотучылар, сүндерелгән халәтләр һәм актив булмаган иконка фоннары
Типография
11 дән 16 пиксельгә кадәр · 4 адым
- GT Standard — алыштыру: Inter · контурлар 400 · Барлык зурлыктагы төп шрифт - төп текст һәм башлыклар өчен дә. 16px/-0.031em зурлыгындагы GTStandard-MRegular төп текст, төймәләр һәм ярлыклар өчен төп шрифт. 20px/-0.05em зурлыгындагы GTStandard-MSemibold берничә зур башлык өчен кулланыла; 11–12px зурлыгындагы GTStandard-MMedium микроязмалар өчен кулланыла. Һәр шрифт варианты 400 оптик авырлык белән күрсәтелә - шрифт иерархиясенә калын контраст урынына нечкә градиентлар һәм тыгыз тискәре хәрефләр аралыгы аша ирешелә. Бу - үзенчәлекле стиль: Shop калын шрифтлар белән кычкырмый, ә текстны хәрефләр аралыгы аша формалаштыра.
- Shopify Sans — алыштыру: Inter · контурлар 400, 700 · Кушымта йөкләү баннерлары һәм cookie ризалыгы тексты кебек система дәрәҗәсендәге хәбәрләр өчен сакланган.
Интерваллар һәм форма
| Максат | Мәгънәсе |
|---|---|
| Тыгызлык | уртача |
| Төп адым | 12px |
| Төймә радиусы | 9999px |
| Карта радиусы | 28px |
| Күләгәләр | йомшак күләгәләр |
| Бүлекләр арасында | 64px |
| Бит киңлеге | 1200px |
Ясалма интеллект сезнең сайтны Shop стилендә төзер һәм аны тутырыр
- Продуктлар һәм постлар белән Instagram, TikTok, Facebook сылтамасы аша тутырыгыз.
- Иске сайтыгыздан контентны күчерегез — адресны күрсәтегез генә.
- Иң яхшы двигательдә заманча дизайн: сервер рендерингы һәм SEO оптимизациясе белән React ( Next.js).
- Эзләү нәтиҗәләре һәм нейрон челтәр тәкъдимнәре өчен тулысынча автоматик SEO оптимизациясе.
Охшаш стильләр
- Cursor — Янып торган күмер белән яктыртылган уңайлы пергамент остаханәсе
- Slush — пастель кәгазьдәге стикерларның җилләтелә торган дөньясы
- MindMarket — Ак кәгазьдән ясалган уңайлы әкият китабы - кояшта кыздырылган, стикер кебек йомшак өслектә зур "Интер" баш язмалары һәм киселгән кәгазь персонажлар бергә урнашкан дустанә редакция холсты.
- Airbnb — Тыныч ак галерея стенасы, анда бер генә мәрҗән-кызыл төстәге кыстыргыч бар
- Superr — Көндезге йомшак яктылыкта җылы мәктәп дәфтәре. Ак каймак төсендәге бит, капкачсыз кызгылт сары маркер һәм ашыгыч рәвештә салына торган исем стикерлары өеме.
- Apple (España) — Йомшак көндезге яктылыкта музей галереясе - бер, җәлеп итүче, авырлыксыз ак киңлек, һәр экспонат җиңел төстәге диварга фонарь белән яктыртылган.
- Lamborghini — Күргәзмә залында кара кузов, прожекторлар астында - бер сары машина
- Amplemarket — Кояш нурлары белән тулган эш урыны конфетти белән тулган
- Getharvest — Алтын сәгатьтәге өстәл – җылы каймак төстәге киндер, киндердә эленгән ак открыткалар һәм бер генә ачык кызгылт сары ялкын.
- Agence Foudre — Журналның тышлык бите помаданы хәтерләткән йомшак алсу төстә.
- Drive Capital — Җылы кәгазьдә ретро юл сәяхәте плакаты
- Apple (España) — ак галерея витрина