Custo
Галерея кольору збройової сталі із монолітним шрифтом. Виставковий зал у приглушених сіро-зелених тонах, де єдиний темний об'єкт та шрифт 57px говорять самі за себе
Custo функціонує як галерея промислових товарів: тепле металеве полотно служить тлом для фізичного продукту, а великоформатний друкарський напис — основною візуальною прикрасою. Система строго ахроматична – жодних хроматичних кольорів – дозволяючи темній анодованій поштовій скриньці та геометричній тяжкості одного шрифту без засічок передавати всю індивідуальність бренду. Кожен екран врівноважує великий порожній простір з монументальною друкарською заявою, причому фірмовий знак повторюється як майже архітектурний елемент. Поверхні плоскі та матові; глибина створюється з допомогою власної відбивної здатності продукту, а чи не з допомогою тіней чи градієнтів.
Модель сторінки є вертикально розташовану одноколоночную структуру з максимальною шириною контенту ~1280px, центровану в області перегляду. Головний елемент сторінки займає всю ширину сторінки, виконаний у кольорі Canvas Gunmetal #9ea29f від краю до краю, з фотографією поштової скриньки, розташованої по центру праворуч, та логотипом 57px CUSTO®, що закріплює нижній край. Під головним елементом чергуються розділи: двоколоночний текстовий блок (невеликий підпис зліва, великий заголовок праворуч), за яким слідує горизонтальна сітка з трьох карток із зображеннями товарів, потім двоколонні рядки тексту та зображень, де основний текст чергується по сторонах. Проміжки між розділами становлять 110px, створюючи значний вертикальний простір для дихання. Навігація є єдиною прозорою верхньою панеллю, яка при прокручуванні стає Paper білою. CES – це фіксований плаваючий елемент у правому нижньому кутку. Загальний ритм нагадує галерею: мало елементів у кожному розділі, великий шрифт, широкі проміжки та фотографія товару як візуальний розділовий знак розділу між текстовими смугами.
Зображення є виключно предметною фотозйомкою поштової скриньки Custo, виконаною в трьох режимах: портрет на повний зріст на тлі металевого корпусу, знімки в стилі лайфстайл, що демонструють взаємодію людини з пристроєм, і великі плани інтерфейсу сканування та кільця. Усі фотографії виконані в приглушених, висококонтрастних тонах, а матове чорне оздоблення поштової скриньки служить візуальним якорем. Жодних ілюстрацій, абстрактної графіки, стокових фотографій. Фотографії розміщені на картках радіусом 8px або використовуються у повноекранному режимі за логотипом 57px. Значок CES є єдиним кольоровим зображенням на всьому сайті.
Палітра
Нейтральні
- Canvas Gunmetal
#9ea29f— Фон головного та тематичного розділів - теплий сіро-зелений відтінок відрізняє Custo від стандартних білих шаблонів SaaS і сприймається швидше як архітектурний бетон, ніж цифрова поверхня. - Obsidian
#000000— Основний текст, тонкі межі, штрихи іконок - найконтрастніші чорнила в системі, що використовуються для заголовків і структурних роздільників. - Paper White
#ffffff— Фон зображення частин тіла, інвертований текст на полотні кольору збройової сталі, текст на темному тлі предметної фотографії. - Anodized Graphite
#4b514d— Темна поверхня для предметної фотозйомки, додаткових заголовків та об'ємного тексту — перегукується з обробкою поштової скриньки, тому інтерфейс користувача та продукт виконані з одного матеріалу. - Brushed Steel
#8e9194— Приглушений основний текст, роздільники списків, додаткові контури значків — між кольорами Paper White і Obsidian для вбудованих метаданих і непомітних посилань. - Linen Mist
#a7aaad— Світлий колір рамки та роздільників для заголовків та розділових ліній – ледь помітний відтінок, який ніколи не конкурує із структурними лініями кольору «Обсидіан».
Друкарня
від 15 до 57px · 5 ступенів
- PP Neue Montreal — заміна: Inter · зображення 400 (Medium) · Односімейна друкарська система використовується для всього, від основного тексту до пояснювальних написів - геометрична однорідність по товщині є відмінною рисою, що дозволяє уникнути використання будь-яких вторинних або специфічних для відображення шрифтів, тому словесний знак «CUSTO®», встановлений на рівні 57px, читається як належить форми 15px.
Інтервали та форма
| Призначення | Значення |
|---|---|
| Щільність | простора |
| Базовий крок | 24px |
| Радіус кнопок | 31.35px (pill) for primary action; 8px for secondary |
| Радіус карток | 8px |
| Тіні | ні — межі замість тіней |
| Між секціями | 110px |
| Ширина сторінки | 1280px |
ІІ збере ваш сайт у стилі Custo і наповнить його
- Наповнить товарами та постами за посиланням - Instagram, TikTok, Facebook.
- Перенесе контент зі старого сайту – достатньо вказати адресу.
- Сучасний дизайн на кращому движку: React ( Next.js) з серверним рендерингом та SEO-оптимізацією з коробки.
- Повна автоматична SEO-оптимізація під пошукову видачу та рекомендації нейромереж.
Схожі стилі
- 099 SUPPLY — Стіна галереї, заповнена чорно-білими об'єктами
- Specht Studio — Галерейна стіна, наповнена стриманою цікавістю. Власне хромоване оздоблення студії – це біла площина та чорний шрифт; візуальний феєрверк повністю зосереджений усередині проектної плитки
- Structured — Галерея епохи Відродження на папері, що нагадує пластилін
- Airbnb — Тиха біла стіна галереї з однією коралово-червоною закладкою
- VSCO — Монохромна стіна галереї – виставка чорно-білих фотографій, де єдиний теплий прожектор висвітлює таку дію.
- Apple (España) — Музейна галерея в м'якому денному світлі - це єдине, захоплююче, невагоме біле приміщення, де кожен експонат підсвічений точковим променем на тлі злегка тонованої стіни.
- Peak Design — Стіна галереї, частково освітлена
- Apple (España) — Вітрина обсидіанової галереї — темна виставкова зала, де єдиний титановий об'єкт світиться на тлі абсолютно чорного кольору.
- Apple (España) — біла вітрина галереї
- teenage engineering — Промисловий каталог у студійному освітленні - продукт є єдиним значущим об'єктом на сторінці, а все інше обговорюється навколо
- Apple (España) — Галерейна вітрина у ранковому тумані
- Apple (España) — Біла музейна галерея опівдні