Демонстрационный пример: вымышленные компании, не работы клиентов

Дизайн: логотипы, макеты, баннеры

Два фирменных стиля с нуля: пекарня и инженерная компания

Для каждого бренда: логотип в трёх версиях, мини-гайд, баннеры для сайта и VK, первый экран сайта на компьютере и телефоне, этикетка или визитка. Под каждой работой написано, что это и зачем оно бизнесу.

01 / Пекарня, розница

«Тёплый хлеб»

Задача
Сеть из трёх пекарен на закваске. Нужен узнаваемый стиль для вывески, упаковки, сайта и соцсетей, чтобы люди запомнили: здесь хлеб свежий к утру.
Идея
Каравай с надрезами и пар над ним: знак читается даже на крафт-пакете в 2 см. Антиква в названии даёт ощущение ремесла, цвета взяты у корки, муки и ржи, а не «шаблонный» коричневый.

Логотип: версии

Основная версия логотипа «Тёплый хлеб» на светлом фоне

ОсновнойСайт, вывеска, меню. SVG

Монохромная версия логотипа «Тёплый хлеб» в один цвет

МонохромШтамп, гравировка, печать в один цвет. SVG

Инверсная версия логотипа «Тёплый хлеб»: белый на ржаном фоне

ИнверсияТёмная витрина, фартуки, пакеты.

Знак «Тёплый хлеб»: каравай с тремя надрезами и пар в круге

ЗнакАватар VK, наклейка, иконка сайта. SVG

Мини-гайд

Цвета

Корка#B85C25акцент, кнопки, знак
Рожь#3B2719текст, инверсия
Мука#F4EBDCфон, упаковка
Колос#E0B25Aметки, иллюстрации

Шрифты

Аа

Georgia (антиква)Заголовки и названия хлеба. Курсив для акцента: «к 7 утра».

Аа

Системный гротескТекст, цены, кнопки. Бесплатно и быстро на сайте.

Охранное поле и размеры

xxСхема охранного поля вокруг знака «Тёплый хлеб»
  • x = ¼ диаметра знака, внутрь поля ничего не ставим
  • Логотип от 120 px / 30 мм, знак от 24 px / 8 мм
  • Не растягивать, не менять цвета, не ставить на пёстрое фото

Баннеры

Баннер для сайта пекарни 1200×400: «Хлеб из печи к 7 утра», кнопка «Заказать к утру», иллюстрация каравая, багета и булочек
1200×400Баннер на главную сайта. Один оффер, одна кнопка и время, которое отвечает на вопрос «а успею ли до работы».
Пост для VK 1080×1080: новинка недели, ржаной хлеб с кориандром, вес и цена
1080×1080Пост VK «Новинка недели». Шаблон: меняется название, вес и цена, стиль остаётся. Крупный текст читается в ленте с телефона.
Этикетка на хлеб 100×70 мм с составом, массой и сроком годности и круглая наклейка «Испечено сегодня»
100×70 ммЭтикетка и наклейка. Состав, масса, срок и поле для даты от руки; круглая наклейка закрывает крафт-пакет.

Макет сайта: первый экран

Первый экран сайта пекарни на компьютере: заголовок «Хлеб из печи к 7 утра», две кнопки, карточка «Сегодня из печи» с ценами и шаги заказа
Компьютер. Заголовок-обещание, заказ к утру и выпечка дня с ценами; ниже три шага: заказ до 22:00, печём в 4:30, забираете в 7:00.
Тот же экран сайта пекарни на телефоне: кнопки на всю ширину
Телефон, 390 px

02 / B2B, инженерные системы

«Северный контур»

Задача
Подрядчик по отоплению и вентиляции для складов и производств. Клиенты: инженеры и снабженцы. Стиль должен выглядеть надёжно на тендерной документации, сайте и спецодежде.
Идея
Знак: одна непрерывная линия, как трасса трубопровода, складывается в здание с острой «северной» крышей и заканчивается сигнальной точкой датчика. Графит и лёд с одним тёплым акцентом: тепло внутри холодного здания.

Логотип: версии

Основная версия логотипа «Северный контур»

ОсновнойСайт, КП, документация. SVG

Монохромная версия логотипа «Северный контур»

МонохромПечать на ч/б принтере, штамп, гравировка. SVG

Инверсная версия логотипа «Северный контур»: белый на графите

ИнверсияСпецодежда, борта машин, тёмный сайт.

Знак «Северный контур»: линия-трасса в форме здания с красной точкой

ЗнакАватар, фавикон, шильд на оборудовании. SVG

Мини-гайд

Цвета

Графит#1D2A31текст, знак, фон
Лёд#E6EDF0фон, линии на графите
Сигнал#FF5B2Eкнопки, точки, 1 акцент на экран
Сталь#7D939Cподписи, размеры

Шрифты

Аа

Гротеск: жирный + светлыйЗаголовки: факт жирным, пояснение светлым.

00

МоноширинныйЦифры, метки, размеры на схемах, как в чертеже.

Охранное поле и размеры

xxСхема охранного поля вокруг знака «Северный контур»
  • x = ширина линии ×3 (¼ знака), внутрь поля ничего не ставим
  • Логотип от 140 px / 35 мм, знак от 20 px / 6 мм
  • Сигнальный цвет только в точке и кнопке, не заливать им фон

Баннеры

Баннер для сайта 1200×400 на графитовом фоне: «Отопление и вентиляция для складов и производств», кнопка расчёта и схема склада
1200×400Баннер на главную. Вместо абстрактных «технологий» настоящая схема: план склада с приточкой и контуром отопления. Инженер сразу видит, что здесь разбираются.
Пост для VK 1080×1080: кейс, −30 °C снаружи и +16 °C внутри склада, срок 6 недель и экономия газа
1080×1080Пост VK «Кейс». Одна цифра крупно и два факта: срок и экономия. Шаблон для ленты объектов.
Визитка инженера 90×50 мм: лицевая сторона графитовая с логотипом, оборотная светлая с именем и контактами
90×50 ммВизитка. Лицо узнаётся на столе среди других; на обороте только нужное: имя, должность, телефон, почта.

Макет сайта: первый экран

Первый экран сайта «Северный контур»: заголовок про сдачу в срок, кнопка расчёта, цифры и схема объекта
Компьютер. Оффер про главный страх заказчика (срыв сроков), расчёт за 2 дня, цифры доверия и схема объекта вместо стоковой фотографии.
Тот же экран сайта «Северный контур» на телефоне
Телефон, 390 px

Что входит в работу

Логотип: 3 идеи на выбор

Выбранную идею доводим до финала вместе с вами.

Файлы логотипа

SVG, PDF, PNG: основной, монохром, инверсия, знак; иконка для сайта и аватар.

Мини-гайд

Цвета HEX/RGB/CMYK, шрифты, охранное поле, минимальные размеры, что нельзя делать.

Баннеры

Для сайта, VK, Telegram и маркетплейсов в нужных размерах; шаблоны, чтобы менять текст самим.

Макет первого экрана

Компьютер и телефон, готов к вёрстке или к передаче разработчику.

Печать

Визитка, этикетка, наклейка: макеты в CMYK с вылетами для типографии.

← Все примеры