
Bpco
Типографический манифест из бетонной плиты. Черно-белый пресс-кит, где увеличенный шрифт Helvetica имитирует фотографию, а единственная текстура — это один лист скомканной бумаги под основным шрифтом
Компания Bigpicture использует монохромную систему редактирования, которая рассматривает веб-страницу как печатный пресс-кит, разложенный на необработанной бумаге. Интерфейс полностью лишен хроматических цветов и полагается исключительно на черные чернила, белое пространство, тонкие линии и единую текстуру мятой бумаги для создания атмосферы. Типографика — это продукт: заголовки достигают 274px шрифта Helvetica Neue 700 с агрессивным отрицательным межбуквенным расстоянием, делая текст доминирующей визуальной массой на каждом экране. Моноширинные подписи ([01-N ВВЕДЕНИЕ], КРЕАТИВ/АГЕНТСТВО) выступают в качестве подписей в печатном стиле, а четырехконечные блестящие значки служат единственным украшением между разделами. Макет щедрый и напоминает самиздат — 72px промежутки между разделами, 144-250px горизонтальные отступы и блоки изображений во всю ширину с 288px углами позволяют странице дышать, как стене галереи, а не как программному продукту.
Максимальная ширина ~1440px, центрированная с горизонтальным отступом 40–144px в зависимости от плотности разделов. Герой — это изображение во всю ширину страницы с наложенным текстом. Под изображением контент чередуется между центрированными текстовыми блоками и типографским оформлением от края до края. Нижняя часть 60% страницы представляет собой длинный прокручиваемый манифест, где крупный шрифт заполняет всю ширину области просмотра построчно, разделенный рядами блестящих разделителей. Навигация представляет собой плавающую панель, центрированную в верхней части области просмотра, а не панель во всю ширину. Нижний колонтитул — это одна полоса с тонкой рамкой.
На главном экране доминирует фотография — крупные архитектурные и наружные рекламные снимки (билборды, облицовка зданий, размещение рекламы на уровне улиц), представленные в полный размер с закругленными углами. Текстура мятой бумаги накладывается на нижние разделы страницы, создавая тактильное ощущение и придавая интерфейсу вид печатного журнала. Небольшая иконка глобуса, нарисованная линиями, является единственным иллюстративным элементом. Никаких 3D-эффектов, никаких абстрактных градиентов, никаких макетов продукции — изображения носят документальный, индустриальный характер и основаны на портфолио агентства в области наружной рекламы.
Палитра
Нейтральные
- Press Ink
#121212— Основной текст, тонкие линии, границы разделов, обводка иконок, текст нижнего колонтитула — единый темный тон, несущий в себе 95% всей информации переднего плана. - Paper White
#ffffff— Холст страницы, картонные поверхности, фон навигационной панели, поверхности с рамками заголовка. - Newsprint
#f1f1f1— Нежная заливка поверхности, мягкие границы, тонкие разделители, тон, скрытый за текстурой мятой бумаги. - Foil Gray
#e1e1e1— Светлые рамки, акценты в виде обводки иконок, дополнительные разделители. - Mute Gray
#c5c5c5— Вторичный текст, состояние инвалидности, низкоконтрастные поверхностные линии
Типографика
от 13 до 274px · 6 ступеней
- Helvetica Neue — замена: Inter · начертания 400, 500, 700 · Универсальный инструмент — основной текст на уровне 17px/1.29, заголовки для отображения на экране на уровне 75–274px с межбуквенным расстоянием -0.04em на самых больших размерах, метки навигации на уровне 15px
- PPSupplyMono — замена: JetBrains Mono · начертания 400 · Метатеги и подписи в скобках, такие как [01-N ВВЕДЕНИЕ], а также теги разделов (РЕКЛАМА, КРЕАТИВ/АГЕНТСТВО, ОФЛАЙН-МАРКЕТИНГ) — это единственные типографические акценты, которые нарушают монотонность шрифта Helvetica.
- PPSupplySans — замена: Inter · начертания 400 · Второстепенная навигация и микротекст в нижнем колонтитуле, где требуется другой шрифт без засечек.
Интервалы и форма
| Назначение | Значение |
|---|---|
| Плотность | средняя |
| Базовый шаг | 50px |
| Радиус кнопок | 8px |
| Радиус карточек | 20px |
| Тени | нет — границы вместо теней |
| Между секциями | 72px |
| Ширина страницы | 1440px |
ИИ соберёт ваш сайт в стиле Bpco и наполнит его
- Наполнит товарами и постами по ссылке — Instagram, TikTok, Facebook.
- Перенесёт контент со старого сайта — достаточно указать адрес.
- Современный дизайн на лучшем движке: React (Next.js) с серверным рендерингом и SEO-оптимизацией из коробки.
- Полная автоматическая SEO-оптимизация под поисковую выдачу и рекомендации нейросетей.
Похожие стили
- Steep — Аналитика шрифтов с засечками на бумаге теплого оттенка
- Newformcap — Редакционная газета в гримерке
- Claude — Отпечатанный на теплом пергаменте артефакт — чернила на костяной бумаге, глина как единственное цветовое дых…
- 11x– Digital workers — Кинематографическая редакционная пустыня — панорамные фотографии местности на фоне монументальных заголовков…
- Revolut — Монохромная редакционная работа, основанная на фотографии облаков — белые чернила, пуговицы-таблетки, одна с…
- Scheduling — Редакционная краска на кремовой бумаге
- Titan — архив в теплых тонах монохром
- Programa — Швейцарская дизайн-студия в полдень. Белая стена галереи освещена единственной желтой настольной лампой — вс…
- Sana Agents — Лаймовая искра на белом фоне в редакционной статье
- Visual — Теплый редакционный самиздат. Кремовая бумага, плакаты с засечками, монохромные заметки на полях, один желты…
- Midday — Редакционная брошюра на пергаменте — заголовок с засечками 72px на фоне теплого каменного фона, основной тек…
- Chat for impact — Клиника лесной зелени с комнатами пастельных тонов