Телеграм, WhatsApp +380637610482
Валерий Данюк
Валерий ДанюкразработчикРазработка ИИ‑инструментов для бизнеса. Качественно. Недорого.Написать в Telegram
Creative Giants — превью сайта в этом стиле

Creative Giants

Крупноформатный редакционный постер на кремовой бумаге

Creative Giants выглядит как увеличенный разворот артбука, созданный с помощью кода: тёплый кремовый холст, тонкие поля и настолько крупный шрифт, что он больше похож на плакат, чем на заголовок. Вся система работает на негативном пространстве и одном лёгком размере (300) — заголовки едва слышны при размере 64–84px, а не резко выделяются жирным шрифтом, а межбуквенное расстояние резко уменьшается (-0.04em) по мере увеличения размера шрифта, так что слова кажутся высеченными, а не отслоенными. Цветовая гамма распределена на небольшие насыщенные мазки: яркий пурпурный, глубокий бирюзовый, светло-голубой, ярко-розовый, мятный и тёмно-синий появляются в качестве поверхностей карточек или акцентов, а не в качестве фоновых заливок. Интерактивные элементы представляют собой чёрные на кремовом фоне фигуры с полностью закруглёнными (1440px) радиусами, а хромированные элементы почти незаметны — единственный круглый логотип и кнопка «Меню» парят в белом пространстве. Визуальная концепция — это контактный лист производственной студии: один огромный заголовок, одна фотография во всю ширину страницы, одна тихая строка метатекста. Каждая вторая страница должна быть выдержана в том же лаконичном стиле.

Модель страницы с полным заполнением: нет контейнера максимальной ширины, контент занимает всю ширину страницы с одинаковыми отступами слева и справа (16–32px на мобильных устройствах, 32px+ на настольных компьютерах). Главный заголовок — это один крупный заголовок («CREATIVE GIANTS» на 84px), занимающий примерно 40% области просмотра, за которым сразу следует фотография с полным заполнением, метатегом в левом нижнем углу и наложением заголовка. Ритм разделов монолитный: каждый новый раздел начинается с небольшого текста, написанного заглавными буквами, и пояснения, разделенного пустым пространством в 48–64px — нет чередующихся темных/светлых полос, за исключением одной инвертированной акцентной карточки Navy Ink. Контент выравнивается по левому краю; нет центрированных блоков, за исключением главного заголовка. В разделе новостей/тематических исследований используется трехколоночная сетка из карточек с плавающим справа блоком стрелок. Навигация осуществляется через единый верхний заголовок — без боковой панели и каких-либо закрепленных элементов за пределами самого заголовка. Общая плотность размещения элементов просторна и соответствует редакционному стилю: каждый раздел «дышит», а пустое пространство является основным структурным элементом.

В оформлении преобладает редакционная фотография: изображение занимает всю ширину страницы, имеет острые углы, без наложений или закругленных масок. Стиль тяготеет к документальному и атмосферному — морщинистые руки, общественные инсталляции, непринужденные кадры с людьми — никогда не используются постановочные фотографии продукции. Изображения всегда представлены в большом масштабе (на всю ширину области просмотра или заполняя всю карточку), поэтому дизайн-единицей является фотография, а не пользовательский интерфейс. Никаких иллюстраций, 3D-моделей, макетов продукции. Иконография минимальна: один небольшой круглый логотип, контурные шевроны на элементах управления карусели и легкие иконки пользовательского интерфейса с обводкой 1px. Плотность изображения определяется самим изображением, а текст служит в качестве незаметного слоя аннотаций под или поверх фотографии.

Палитра

Бренд

  • Magenta Bloom #8a0467 — Розовый цвет используется в качестве вспомогательного акцента для декоративных деталей и акцентирования внимания на нечастых запросах. Не следует выделять его как основной цвет призыва к действию.
  • Forest Teal #03624c — Насыщенный акцентный цвет бренда для рамок открыток и декоративных штрихов; сочетается с оттенком Magenta Bloom для двухцветной обработки.

Нейтральные

  • Bone White #fffef7 — Холст страницы, поверхности картона, текст на темных акцентах — теплый кремовый оттенок, который заменяет чистый #ffffff и придает всей системе ощущение бумаги и печатного текста.
  • Ink Black #000000 — Темный цвет дополняет нейтральный цвет текста, значков и создает сильный контраст. Не следует использовать его в качестве основного цвета для призывов к действию.
  • Graphite #666666 — Второстепенный основной текст, подписи, метаданные, вспомогательный текст — отступают на второй план, чтобы доминировать основной текст.
  • Ash #aaaaaa — Границы полей ввода, цвет неактивных ссылок, третичные разделители — мягкий структурный серый цвет, который исчезает, когда не нужен.
  • Charcoal Scale #4d4c4a — Средне-нейтральный оттенок для границ списков, едва заметное повышение контраста на темной градиентной дорожке — теплый серый, а не сине-серый.
  • Powder Blue #a5c8eb — Мягкий цветовой акцент — фоны для открыток, размытые фоны, приглушенная заливка иллюстраций; охлаждает теплый фон, не создавая конкуренций.

Типографика

от 12 до 84px · 7 ступеней

  • Switzer — замена: Inter (300 · начертания 300, 400 · Система с одним шрифтом: толщина 300 для всех элементов отображения и заголовков (12–84px), толщина 400 для основного текста, метаданных и элементов управления пользовательского интерфейса. Наиболее предпочтительный вариант – использование толщины 300 при размере 64–84px — в большинстве систем здесь используется жирный шрифт 700–800; шрифт Switzer светлого оттенка сохраняет тонкие линии, создавая ощущение, будто шрифт нанесен аэрографом на кремовый холст. Более плотное межбуквенное расстояние по мере увеличения размера (-0.04em при 84px, -0.018em при 14px) сохраняет внутренние пространства открытыми, не создавая ощущения разреженности.

Интервалы и форма

НазначениеЗначение
Плотностьсредняя
Базовый шаг8px
Радиус кнопок1440px
Радиус карточек0px
Тенинет — границы вместо теней
Между секциями64px

ИИ соберёт ваш сайт в стиле Creative Giants и наполнит его

  • Наполнит товарами и постами по ссылке — Instagram, TikTok, Facebook.
  • Перенесёт контент со старого сайта — достаточно указать адрес.
  • Современный дизайн на лучшем движке: React (Next.js) с серверным рендерингом и SEO-оптимизацией из коробки.
  • Полная автоматическая SEO-оптимизация под поисковую выдачу и рекомендации нейросетей.

Похожие стили

  • ElevenLabs — Фоторепортаж в теплых кремовых тонах с ненавязчивыми заголовками. Блокнот в стиле Баухаус — бумага цвета яич…
  • monopo saigon — Жидкое переливающееся сияние за редакционной тишиной — монохромная редакционная галерея, парящая на расплавл…
  • Awesomic — Редакционная цинковая сетка с оранжевыми знаками препинания, напоминающими конфетти
  • Monad — редакционный технический журнал на теплом пергаменте
  • Dub — матовая панель управления Link на рисовой бумаге
  • Seline Analytics — Тихий аналитический стол на тёплой бумаге
  • Notion — Теплый бумажный блокнот под полуденным солнцем
  • Hyer Aviation — Сумерки в кабине пилота над пергаментом. Бледное рассветное небо встречается с логотипом с засечками размеро…
  • Anthropic — Научный полевой журнал на теплом пергаменте — спокойные поверхности цвета слоновой кости, редакционные загол…
  • Calendly — Темно-синие чернила на холодном мраморе
  • Augen Pro — Презентация Apple на белом фоне — клинический, невесомый, электрический синий как единственный акцент в моно…
  • OFF+BRAND. — Переливающаяся сфера на теплом пергаменте