Мы — СберМаркет. Компания с духом стартапа и правильным отношением к делу. Перед вами самое простое руководство по работе с визуальной частью.

СберМаркет гайд

Цвет и градиент

Клеверный Сбер


RGB: 49/194/167
HEX: #31C2A7
CMYK: 69/0/45/0
Pantone: 7465 C
Скопировать код

Зелёный Сбер


RGB: 33/160/56
HEX: #21A038
CMYK: 78/0/95/5
Pantone: 7739 C
Скопировать код

Золотой Сбер


RGB: 255/204/0
HEX: #FFCC00
CMYK: 0/19/100/0
Pantone: 116 C
Скопировать код

Оранжевый Сбер


RGB: 255/128/0
HEX: #FF8000
CMYK: 0/60/94/0
Pantone: 151 C
Скопировать код

Розовый Сбер


RGB: 255/0/102
HEX: #FF0066
CMYK: 0/95/31/0
Pantone: 191 C
Скопировать код

Пять основных цветов формируют насыщенную палитру и яркий градиент, который является одним из наиболее весомых элементов айдентики. Мы разработали и адаптировали градиент для веб-шаблонов и печатных материалов. Рекомендуем использовать профильный градиент в зависимости от носителя.

.ai .pdf

Мы оставили возможность редактирования градиента, это необходимо для того, чтобы повышать считываемость текста распологая его на более тёмной зелной части.

Локатор

Многосоставной, редактируемый эллемент брендинга.

Движение происходит строго по часовой стрелке. Минимальный допустимый угол сектора Локатора — 135°. При соблюдении этого размера пропорции цветов в макете будут сохраняться и узнаваться. Максимально допустимый угол сектора Локатора — 270°.

Динамические фигуры Adobe Illustrator® позволяют быстро и точно задавать угол элементов Локатора.

Для скачивания доступны:
редактируемый формат и заранее
подготовленные основные углы
раскрытия локатора

.ai .pdf

Стрелка

Угол элемента
строго зафиксирован

Сектор

Угол элемента
меняется по сетке

Шлейф

Угол изменяется
вместе с углом сектора

Круг

Статичный элемент

Как самостоятельный графический элемент используется локатор со световым бликом. Однако, если вы используете локатор как подложку под текст или располагаете другие элементы на нем, блик можно убрать.

минимальный угол
локатора (135°)

максимальный угол
локатора (270°)

Иконка

Основная версия иконки
используется в большинстве
случаев.

Веб-формат
используется в диджитал
каналах.

.pdf .png .ai
стиль

Сочный

Ретейл

Шаблоны

Мы разработали основные форматы шаблонов для различных типов макетов.

Они формализуют соотношения объектов в макете и основные графические константы включая, положение логотипов, соотношение заголовка к подзаголовку и расположение дополнительных графических эллементов.

i
В макетах любой графический эллемент строго закреплен за своей функцией и не может быть изменен. Например поле с ценой может быть только полем с ценой.

Поля макета определяются высотой знака. Текст в макете выравнивается по левому полю макета или относительно текстовой части логотипа.

Размер логотипа может быть изменен в зависимости от контента и размера макета. Принцип построения полей макета должен соблюдаться всегда.

Основные
типы макетов

01

Вариант макета с экстримальным
кадрированием Локатора.

Можно использовать для размещения ключевых сообщений, если изображение имеет сложную композицию и детализацию. и когда требуется хорошая читабельность.

Всегда следите за чётким разделением между изображением и графическим элементом, направление стрелы может быть любым. Избегайте деления макета на равные части.

02

Локатор взаимодействующий
с изображением

Центральная точка локатора находится в центре основного объекта или композиционного центра изображения.

Следите за соблюдением охранных полей, локатор не должен сливатся с фоновым изображением и градиент иглы должен полностью входить в формат.

03

Полная градиентная заливка

Формат с градиентной заливкой фона, можно добавлять цветные тени под объекты для придания дополнительного объема.

Во всех типах макета следует следить за достаточным уровнем контрастности текста к фону и распологать сообщение на тёмных участках градиента.

Типографика

КРУПНЫЙ
ЗАГОЛОВОК
В ЧЕТЫРЕ
СТРОКИ

SB Sans Display Bold | SB Sans Display Semibold

Высота прописной буквы заголовка должна быть не больше высоты знака в макете. Интерлиньяж — 100% или 120% от размера шрифта.

Подзаголовок в две
или три строки

SB Sans Display Regular

Размер шрифта подзаголовка — 1/2 от размера шрифта заголовка. Интерлиньяж — 120% от размера шрифта.

SB Sans Display

Сток

Мы собрали локальную базу имиджей для создания контента с продуктами. Все объекты имеют общую перспективу и работают как конструктор.

скачать

Фотокоррекция
продуктов

Каждый имидж уже обтравлен — к нему необходимо применить фильтр Raw и скорректировать его при необходимости.

При работе с CMYK накладывайте фильтр в RGB и далее смартобъектом переносите в нужный проект.






Тень накладывается в режиме Multiply
с 80% прозрачностью.





.tif

Ниже представлены
основные настройки







Эти настройки очень гибки — вы можете менять их в зависимости от продукта. Основная задача — получение резкого и очень контрастного изображения.

Фото
Продуктов

Органичными в нашем стиле будут многоцветные изображения с яркими фонами. Не используйте 3D изображения продуктов питания. Старайтесь искать изображения с контрастными тенями и интересными стилистическими решениями.

Обработка изображений происходит для достижения высокого контраста между светом и тенью, для усиления цветовой насыщенности и увеличения резкости.

Сервисные
изображения

Минималистичные 3D иллюстрации в ярких открытых цветах. Обычно в макетах используется принцип отсутствия гравитации — объекты будто парят.

Универсальные
изображения

Ниже приведены основные имиджи, которые можно использовать в любых сервисных коммуникациях.

.psd
.psd
.psd
.psd
.psd
.psd
.psd

Кобрендинг и дизайн
оборудования

В этом разделе закреплены принципы создания макетов в партнерстве с другим брендом.

Все партнеры разделяются на два типа в зависимости от стилеобразующих элементов в их собственной графике: остроугольные и округлые.

Такая система хорошо перекликается со стилем СберМаркета и хорошо рифмуется с локатором.



web print


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





Что такое
СберМаркет

СберМаркет — это cервис доставки продуктов за 2 часа из супермаркетов. У нас нет собственного склада — мы покупаем для вас товары прямо с полок торговых сетей.

подробнее

Copyright © 2021 СберМаркет