
Ventriloc
Редакційна обсерваторія даних на теплому папері - єдиний помаранчевий куточок, що підкреслює монохромну точність.
Ventriloc говорить тихим, редакторським голосом: тепле, біле полотно, моноширинні картки даних з високою точністю і єдиний помаранчевий куточок, який виділяє монохромність, немов маркер на друкованому звіті. Система поєднує в собі спеціально розроблений неогротескний шрифт (PolySans) товщиною 400 для заголовків - незвичайна стриманість, яка жертвує авторитетом за рахунок об'єму для авторитету за рахунок точності - зі шрифтом Inter для основного тексту та елементів інтерфейсу. Поверхні виконані в теплих сірих і кремових тонах, а не в холодному технологічно-синьому, картки мають асиметричні округлення кутів (гострий верхній правий кут, м'який в інших місцях), а інтерактивні елементи розділені на два чіткі діалекти: кнопки з гострими кутами в стилі текст. Кольори дозовані: сторінки мають бути оформлені в ахроматичному стилі 95%, а помаранчевий колір використовується лише як функціональна пунктуація для виділення, підкреслення посилань та декоративних акцентів даних.
Контейнер максимальної ширини 1200px, центрований по центру, з великими проміжками між секціями 80px. Головний елемент розділений на дві колонки: зліва знаходиться заголовок, підтекст та набір із двох кнопок заклику до дії; праворуч відображається група з трьох карток, що перекриваються, з даними (фінансова діаграма, статистика виручки, кільце прибутковості), що плавають на білому полотні. Під головним елементом розташована смуга логотипу партнера на всю ширину на білому тлі. Наступні розділи чергуються між смугами кольору Ash (#efefef) та білими смугами. Навігація є плаваючим контейнером у вигляді таблетки, центрованим у заголовку, з логотипом бренду, вирівняним по лівому краю, і темною кнопкою «Зв'язатися з нами», вирівняною з правого краю. Загальний ритм просторий і редакційний — широкі поля, високі розділи, а картки з даними є єдиним візуальним розділовим розділом, крім типографіки.
Візуальне оформлення практично повністю ґрунтується на даних: віджети з діаграмами (лінійні графіки, кругові індикатори прогресу, картки статистики) виконані у плоскому, мінімалістичному стилі з тонкими лініями оранжевого та латунного кольорів на білих картонних поверхнях. Жодних фотографій у стилі лайфстайл, жодних стічних зображень, жодних ілюстрацій на головній сторінці. Єдиний фотографічний контент – логотипи партнерів/клієнтів, представлені у монохромному графітовому кольорі. Візуальна мова ближче до друкованого річного звіту, ніж до типового сайту SaaS - діаграми І Є зображення. Іконки тонкі, монолінійні, графітового кольору, з'являються ощадливо в навігаційній панелі та заголовках карток.
Палітра
Бренд
- Ember Orange
#ff682c— Помаранчевий колір використовується для виділення посилань, тегів та коротких фраз. Не слід виділяти його як основний колір заклику до дії.
Нейтральні
- Graphite
#202020— Основний текст, заголовки, навігаційні посилання, контури іконок є типографічною основою кожного елемента інтерфейсу. - Canvas White
#ffffff— Фон сторінки, піднесення картки, заливка іконок - найяскравіша поверхня в системі. - Ash
#efefef— Основне тло картки та розділу, контейнер навігаційної панелі — переважна тепла сіра поверхня. - Fog
#f5f5f5— Ніжний фоновий тон для вкладених поверхонь та вторинних контейнерів. - Ivory
#ebe6dd— Тепле акцентне тло для основних блоків — відчуття паперу. - Steel
#4d4d4d— Другий основний текст, довгий абзацний текст
Друкарня
від 14 до 66px · 5 ступенів
- PolySans — заміна: Inter Tight or Space Grotesk at weight 400 · зображення 400 · Заголовки та декоративний текст — спеціально розроблений неогротескний шрифт, що використовується виключно з товщиною 400 і міжлітерним інтервалом -0.02em, створює ледве вловимий редакційний авторитет, який не зміг би відтворити жоден заголовок, виділений жирним шрифтом.
- Inter — заміна: system-ui or Roboto · зображення 400, 500, 600 · Основний текст, підписи до елементів інтерфейсу користувача, текст кнопок, заголовки, метадані - універсальний шрифт без засічок для всього, що не є заголовком.
Інтервали та форма
| Призначення | Значення |
|---|---|
| Щільність | середня |
| Базовий крок | 20px |
| Радіус кнопок | 0px |
| Радіус карток | 8px |
| Тіні | ні — межі замість тіней |
| Між секціями | 80px |
| Ширина сторінки | 1200px |
ІІ збере ваш сайт у стилі Ventriloc і наповнить його
- Наповнить товарами та постами за посиланням - Instagram, TikTok, Facebook.
- Перенесе контент зі старого сайту – достатньо вказати адресу.
- Сучасний дизайн на кращому движку: React ( Next.js) з серверним рендерингом та SEO-оптимізацією з коробки.
- Повна автоматична SEO-оптимізація під пошукову видачу та рекомендації нейромереж.
Схожі стилі
- Ui — клінічний план на матовому папері
- Geniestudio — Блокнот з м'яким денним світлом — такий, із широкими полями та одним товстим штрихом пера
- xAI — лабораторія теплих вершків із чорною таблеткою
- Cal — Монохромна практичність, людяний підхід. Система, у якій пріоритет віддається ясності та функціональності завдяки суворій чорно-білій палітрі, але пом'якшується доброзичливою друкаркою та округлими формами
- Scale — Високоякісна фотолабораторія музейного рівня у поєднанні з технічним проектом
- Contractbook — контракти з кремового паперу під ультрамариновим небом
- AutoSend — Затишна кам'яна майстерня з єдиним фіолетовим вогником — де заголовки із засічками та заклики до дії яскраво-індигового кольору є сусідами в одному тихому, майже білому приміщенні
- Air — скульптура «Опівнічне небо крізь скло»
- SpatialChat — фіолетовий пульс на білому пергаменті
- Squarespace — Кінематографічна монохромна галерея
- Giga — Опівнічний обрій над матовим обсидіаном
- Supabase — Редактор коду опівночі з фосфоресційною зеленою точкою — одиночний хроматичний імпульс на морі вугільного пилу