Zellerfeld
Майстерня скульптора на білому мармурі - монолітні поверхні постаменту, єдина іскра кобальту, шепіт малих літер від підлоги до стелі.
Zellerfeld сприймається як галерея цифрових скульпторів на білому мармурі — торговий майданчик взуття, надрукованого на 3D-принтері, де монохромні поверхні, велика кількість вільного простору та великий шрифт із малими літерами дозволяють кожному продукту поводитися як музейний експонат. Інтерфейс відрізняється граничною стриманістю: ахроматичне полотно з єдиним електричним кобальтовим кольором (#000aff), зарезервованим для термінових моментів - значки, активна навігація "Магазин", стан поточного слайду. Картки ширяють на теплому перлово-сірому фоні, а не на чисто білому, надаючи сітці тактильну, гіпсову виливок. Шрифт залишається єдиним користувальницьким гротескним шрифтом (Roobert) із щільною міжлітерною відстанню, а Space Mono використовується тільки для цін, позицій та технічних метаданих. В результаті, сторінка продукту більше схожа на сайт дизайнерської преси, ніж на касу в роздрібному магазині — об'єкти фотографуються, а не продаються.
Сторінка займає всю ширину сторінки та має 1440px контентну смугу. Головний елемент - це повноекранний фотобанер з плаваючим накладенням інтерфейсу користувача. Розділи товарів використовують 4-колоночну сітку, яка згортається до 2 на планшетах та 1 на мобільних пристроях. Ритм розділів: велика характеристика товару → рейтингова редакційна сітка → сітка нових релізів → панель із контактною інформацією для преси. Кожен розділ товару центрує свій контент усередині смуги та використовує 80px вертикальний простір між розділами. Навігація являє собою фіксовану верхню панель в один ряд із тонкою смугою оголошень над нею. Картки товарів вирівнюються за строгою сіткою — область зображення завжди центрує силует взуття з 40px верхнім/нижнім відступом усередині картки, кластер метаданих прив'язується до нижнього лівого кута з фірмовим знаком 40x40.
Предметна фотографія є домінуючим візуальним елементом — кожний черевик сфотографований на чисто білій або оштукатуреній поверхні під кутом три чверті, заповнюючи всю картку без будь-якого контексту, моделі чи оточення. Головний елемент – це повноцінна лайфстайл-фотографія: обрізані знімки ніг та взуття на піску чи бетонній підлозі, завжди в людському масштабі, ніколи не ідеально студійні. Принцип "об'єкт - це головний елемент" - взуття займає 40% видимої частини кадру навіть у головному елементі редакції. Жодних декоративних графічних елементів, абстрактних візерунків, ілюстрацій. Іконки лінійні, обведені чорним кольором, ніколи не залиті, ніколи не кольорові.
Палітра
Бренд
- Electric Cobalt
#000aff— Нові значки, активна навігаційна панель, індикатор поточного слайду, моменти активації - єдиний хроматичний сигнал у системі, який використовується економно, щоб сприйматися як активація, а не як прикраса.
Нейтральні
- Pale Iris
#e5e7ff— Нова заливка для бейджів, м'який відблиск, тонована поверхня для варіантів позначень - приглушений відтінок кобальту, який натякає на колір, не порушуючи монохромну гаму. - Ink Black
#111111— Основний текст, стандартні межі, обведення значків, тонкі роздільники — домінуючий структурний колір для заголовків, списків і посилань. - Pure White
#ffffff— Нейтральні стани форм, текст значка і стриманий зворотний зв'язок інтерфейсу користувача, де колір повинен залишатися ненав'язливим. Не слід робити його основним кольором заклику до дії. - Plaster
#ecedee— Вторинна поверхня для карток товарів, фон навігаційної панелі, плавний піднятий рівень над полотном. - Slate
#a1a4aa— Відтінок рамки картки, нейтральна заливка кнопки, приглушена рамка кнопки – сірий колір, який підкреслює краї картки, не затемнюючи їх. - Fog
#d7d7d7— Світла рамка картки, розділові лінії, тонування неактивної поверхні.
Друкарня
від 13 до 128px · 7 ступенів
- Roobert — заміна: Inter · зображення 400, 500, 600, 700 · Основний фірмовий шрифт – використовується для всього, від основного тексту до заголовка. Міжрядковий інтервал шрифту однаковий для всіх розмірів, що дозволяє зробити малу літеру логотипу щільною, скульптурною масою. Товщина шрифту збільшується залежно від контексту: 400 для основного тексту та інтерфейсу користувача, 500 для виділених заголовків, 600 для назв продуктів, 700 для великих заголовків.
- Space Mono — заміна: JetBrains Mono · зображення 400, 600 · Технічні метадані — ціни (€189,00), числові значення позицій у топ-10, тикери, назви магазинів. Додаються там, де сторінка має сприйматися швидше як технічна специфікація, ніж рекламний текст.
- Arial — заміна: Inter · зображення 400 · Arial - виявлений у вилучених даних, але не описаний ІІ.
Інтервали та форма
| Призначення | Значення |
|---|---|
| Щільність | середня |
| Базовий крок | 16px |
| Радіус кнопок | 10px |
| Радіус карток | 10px |
| Тіні | мінімальні |
| Між секціями | 80px |
| Ширина сторінки | 1440px |
ІІ збере ваш сайт у стилі Zellerfeld і наповнить його
- Наповнить товарами та постами за посиланням - Instagram, TikTok, Facebook.
- Перенесе контент зі старого сайту – достатньо вказати адресу.
- Сучасний дизайн на кращому движку: React ( Next.js) з серверним рендерингом та SEO-оптимізацією з коробки.
- Повна автоматична SEO-оптимізація під пошукову видачу та рекомендації нейромереж.
Схожі стилі
- Airbnb — Тиха біла стіна галереї з однією коралово-червоною закладкою
- Apple (España) — біла вітрина галереї
- Silencio — Біла кімната з артефактами. Галерейна вітрина з теплого паперу, де кожен елемент займає своє місце на тлі негативного об'єму, а тиша є навмисним дизайнерським рішенням
- Oakâme — Залита сонцем провансальська майстерня, висічена з теплого каменю
- Nike — Монохромна галерея спортивних досягнень — білі стіни, продукт як витвір мистецтва, хром, розчинений у фоні
- Arc — індустріальна біла галерея над опівнічною водою
- Rivian — Електричний моноліт на бетонну стіну галереї. Rivian представляє кожен автомобіль як скульптуру на тлі величезного білого простору, з типографікою настільки великою, що вона стає архітектурним елементом, і одним теплим жовтим кольором, який порушує монохромність, подібно до сонячного світла на матовій поверхні
- Analogue — Чорна галерейна вітрина — товари ширяють у порожнечі
- ddna — тепла музейна вітрина на необробленому лляному полотні
- UY Studio — Монастирська кам'яна галерея — тихий простір із бетонними стінами, де на білих постаментах стоять флакони з парфумами, освітлені одним світильником потужністю 400 Вт та чотирма теплими сірими лампами.
- Basic.Space — кураторська галерея на білому мармурі
- COS — модна галерея з білими стінами