Shop
Плаващо търговско съзвездие върху бял мрамор
Онлайн магазинът работи по модел „бяло платно“, като продуктите се показват като големи, силно извити карти с изображения, а не като решетки от миниатюри. Целият интерфейс е невероятно гладък: радиуси 20-28px навсякъде, контроли с форма на хапче и компактно 16px GT Standard тяло с плътно негативно проследяване, което прави текста ясен и удебелен. Единственият удебелен акцент на системата е ярко лилаво (#5433eb), което се появява в логото, кръглото поле с резултати от търсенето и като тонирана сянка на същия бутон. Останалата част от палитрата е топла неутрална: бели повърхности, фино хладно сиво платно, фини рамки и почти черен текст. Плътността остава компактна с 12px канавки, но ивиците на героите и категориите „дишат“ благодарение на щедрия вертикален ритъм от 64-80px, което прави търговското изживяване по-скоро като разглеждане, отколкото като каталог.
Максималната ширина е 1200px, центрирана върху полупрозрачно платно #f2f4f5, с постоянна странична лента с ширина 64px отляво, съдържаща само икони за навигация. Основният елемент е лента с пълна ширина, с карти на продукти, разположени над центрирано лилаво лого на „магазин“, и лента за търсене във формата на хапче, директно под нея. Хапчетата с категории са подредени в един центриран ред под лентата за търсене. Секциите със съдържание (Жени, Мъже, Красота, Дом, Бебе и деца) следват като обозначени ленти, всяка от които съдържа 4-колонна мрежа с изображения на продукти или 2-колонна композиция „основен елемент и мрежа“. Вертикалният ритъм е щедър: 64–80px между основните секции. Долният колонтитул е тъмна лента в долната част на страницата с групи връзки във формата на колони. Стрелките на въртележката от дясната страна на хоризонталните продуктови панели показват съдържание, което може да се превърта, без точки за номериране.
Фотографията е доминиращият визуален елемент: снимки на продукти на цял екран на бял фон, изрязани 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 до 16px · 4 стъпки
- GT Standard — замяна: Inter · очертания 400 · Основният шрифт във всички размери – както за текста на документа, така и за заглавията. GTStandard-MRegular с размери 16px/-0.031em е основният шрифт за текста на документа, бутоните и етикетите. GTStandard-MSemibold с размери 20px/-0.05em се използва за няколко големи заглавия; GTStandard-MMedium с размери 11–12px се използва за микронадписи. Всеки вариант на шрифта се показва с оптична тежест 400 – йерархията на шрифтовете се постига чрез фини градиенти и плътно отрицателно разстояние между буквите, а не чрез удебелен контраст. Това е отличителен стил: Shop не крещи с удебелени шрифтове, а по-скоро оформя текста чрез разстояние между буквите.
- Shopify Sans — замяна: Inter · очертания 400, 700 · Запазено за съобщения на системно ниво, като например банери за зареждане на приложения и текст за съгласие за бисквитки.
Интервали и форма
| Цел | Стойност |
|---|---|
| Плътност | средно |
| Основна стъпка | 12px |
| Радиус на бутона | 9999px |
| Радиус на картата | 28px |
| Сенки | меки сенки |
| Между секциите | 64px |
| Ширина на страницата | 1200px |
Изкуственият интелект ще изгради вашия уебсайт в стил Shop и ще го запълни
- Попълнете с продукти и публикации чрез линка - Instagram, TikTok, Facebook.
- Прехвърлете съдържание от стария си сайт – просто посочете адреса.
- Модерен дизайн на най-добрия енджин: React ( Next.js) със сървърно рендериране и SEO оптимизация веднага щом е готов.
- Напълно автоматизирана SEO оптимизация за резултати от търсенето и препоръки от невронни мрежи.
Подобни стилове
- Cursor — Уютна работилница за пергамент, осветена от тлеещи въглени
- Slush — надуваема вселена от стикери върху пастелна хартия
- MindMarket — Уютна книжка с приказки върху кремава хартия - приветливо редакционно платно, където големи заглавия на Интер и изрязани хартиени герои съжителстват върху обляна от слънце, мека като стикер повърхност.
- Airbnb — Тиха бяла галерийна стена с един кораловочервен отметчик
- Superr — Топла ученическа тетрадка в меката следобедна светлина. Кремава страница, оранжев маркер без капачка и купчина ламинирани стикери с имена, чакащи да бъдат отлепени.
- Apple (España) — Галерията на музея, осветена от мека дневна светлина, е едно-единствено, завладяващо, безтегловно бяло пространство, като всеки експонат е осветен от прожектор на фона на леко тонирана стена.
- Lamborghini — Черен цвят на каросерията в шоурума, под прожекторите - една жълта кола
- Amplemarket — Огрено от слънце работно място, обсипано с конфети
- Getharvest — Бюро в златния час – топло кремаво платно, бели пощенски картички, окачени върху платното, и един-единствен яркооранжев пламък
- Agence Foudre — Корицата на списанието е в нежно розов цвят, напомнящ червило.
- Drive Capital — Ретро плакат за пътуване с кола върху топла хартия
- Apple (España) — бяла витрина за галерия