О РамблереЛоготипПалитраШрифтыПриёмыИконкиПаттернКомпоненты
Бренд Рамблера —
это больше, чем логотип.
Это визуальная система и графический язык, созданный затем, чтобы объединить множество продуктов и их элементы в единое целое и рассказать пользователям, чем является Рамблер сегодня и куда он стремится в будущем.
Палитра
Описание палитры и правил её использования
Подробнее
Шрифты
Шрифтовые схемы и типографика, работа с текстом
Подробнее
Приемы
Графические приёмы и стили графики
Подробнее
Иконки
Правила и схемы создания иконок и пиктограмм
Подробнее
Паттерн
Фирменный паттерн и работа с фонами
Подробнее
Охранная зона
Логотипу необходим «воздух» – охранная зона вокруг него, в которую не должны попадать другие объекты. Такая охранная зона определяется по высоте знака «слеш». Соблюдение охранной зоны гарантирует правильное восприятие логоблока.
Логотипу необходим «воздух» — охранная зона вокруг него, в которую не должны попадать другие объекты.
Построение
В основе геометрии логотипа заложен угол 70 градусов, аналогичный наклону знака «слеш».
Этот же угол поддержан симметрией букв логотипа.
Логотипы продуктов
Роль логотипа продукта Рамблера выполняет дескриптор, следующий за символом «/».
У дескриптора есть несколько вариантов расположения — горизонтальный и вертикальный.
Горизонтальная композиция
Вертикальная композиция
Палитра бренда
Фундаментом палитры бренда служит сочетание трёх цветов: фирменного синего Rambler blue, глубокого серого Carbone и более лёгкого Aluminium.
Код успешно скопирован
Rambler blue
HEX#315efb
RGBA49 94 251 100
Код успешно скопирован
Carbone
HEX#343b4c
RGBA52 59 76 100
Код успешно скопирован
Aluminium
HEX#eef2f4
RGBA238 242 244 100
Синяя палитра
Purple blue
#7989b5
Dark blue
#274bc8
Rambler blue
#315efb
Alternative blue
#649dff
Sky blue
#9fdfff
Серая палитра
Carbone
#343b4c
Light carbone
#62687f
Cloud gray
#8d96b2
Pearl gray
#c6cad8
Aluminium
#eef2f4
Чёрная палитра
Rambler black
#262626
Black 60%
#7d7d7d
Black 40%
#a8a8a8
Black 20%
#dddddd
Работа с цветом
Работа с цветом построена на использовании нейтральных и фирменных серой и черной палитр в качестве основы и фирменного синего для расстановки акцентов. Из-за объёма аудитории особое внимание уделено считываемости оттенков серого и их правильной интерпретации на максимально большом количестве мониторов.
Акцентная палитра
Red
#ff564e
Green
#28bc00
Yellow
#ffc000
Цветовые схемы
В дизайн-системе Рамблера у любого элемента может быть две цветовых схемы — светлая и инверсивная, тёмная. В качестве основной используется светлая схема.
Тёмная схема
#FFFFFF
#EEF2F4
#D7DBE4
#8D96B2
#315EFB
#262626
Тёмная схема
Вход
Забыли пароль?
Войти
Регистрация
Светлая схема
Вход
Забыли пароль?
Войти
Регистрация
Скачать шрифт
Rambler
Используется для заголовков, рекламных материалов, промо и медийных носителей внутри интерфейсов группы продуктов.
Р
Р
Р
Р
Р
Р
Имеет 6 начертаний, из которых в ежедневной коммуникации мы рекомендуем использовать Semibold и Book.
Georgia
Используется для второстепенных или альтернативных заголовков в работе с подачей медийного контента и медийных носителях внутри интерфейсов группы продуктов.
Р
Р
Р
Р
Имеет 4 начертания, из которых мы рекомендуем использовать только Regular и Italic.
Скачать шрифт
Скачать шрифт
Roboto
Используется в интерфейсных элементах, подписях, таблицах и подаче данных, рекомендован для мелких кеглей.
Р
Р
Р
Р
Р
Р
Имеет более 6 начертаний, из которых в ежедневной коммуникации мы рекомендуем использовать Regular и Light.
Типографика
В работе с типографикой мы придерживаемся размерностей, кратных пяти в значениях высот строк (line-height), делая исключения
в микро-типографике.
Глубина и градиенты там,
где это уместно
Интерактивные фоны
и эффекты
Работа с приёмами
Тенденция работы с графическими приёмами в визуальном языке Рамблера стремится к созданию дополнительной глубины и интерактивности там, где это уместно, чтобы сделать подачу медийного контента более привлекательной.
Различия в работе с формой сервисных и медийных контролов
Работа с микроформой, скругление
углов элементов
Работа с формой
В работе с формой визуальный язык стремится к отсутствию острых углов. При работе с базовыми интерфейсными элементами рекомендовано делать скругление даже небольших углов.
Тёмная схема
Сейчас в кино
Все премьеры
Ла-Ла ЛендКомедия, Мюзикл, Мелодрама
16 +
Меч короля АртураБоевик, Приключение, Драма
16 +
Все премьеры
Светлая схема
Сейчас в кино
Все премьеры
Ла-Ла ЛендКомедия, Мюзикл, Мелодрама
16 +
Меч короля АртураБоевик, Приключение, Драма
16 +
Все премьеры
15x15
20x20
100x100
Иконки и пиктограммы
У каждого проекта Рамблера есть основной символ. Метафора символа может транслироваться на различные носители и при необходимости усложняться.
Пиктограмма может быть размещена на фавиконке проекта, использована в качестве основы для идеи иконки приложения или паттерна.
Тематические иконки
Для погодных виджетов сеты иконок разрабатываются в нескольких размерностях, что позволяет соблюсти визуальное единство во всех виджетах, где показаны погодные данные.
Для сервиса Погоды разработано более 5 сетов иконок, отражающих основные метеорологические события.
Формирование векторного скелета
Работа с финализацией формы
Внимание к деталям
При создании иконки прежде всего разрабатывается её скелет, а не конечная форма. Такой подход позволяет добиться более высокого качества масштабирования.
Иконки приложений
В основе дизайна иконок мобильных приложений лежит слэш, который является основным признаком визуального единства линейки продуктов Рамблера.
В качестве базовой палитры используется гамма акцентного цвета сервиса.
Каждый символ внутри иконки должен быть изображен в псевдотрехмерном виде. Для создания иконки используются фирменные цвета, релевантные тематике приложения. Для создания символа внутри иконки используется белый и тень, основанная на оттенках базы иконки.
Палитра иконки
Dark blue
#274BC8
Rambler blue
#315EFB
Light
#649DFF
Для создания эффекта используется тень с непрозрачностью 25% и размытием x: 2, y: 2, blur: 15, spread: 0.
Паттерн
В качестве основы для генеративного паттерна использован символ «/», который обладает виртуальной осью и вращается относительно неё, в соответствии с динамикой паттерна и его задачами.
Логотип, основа палитры и паттерн бренда были разработаны в сотрудничестве со студией ONY в рамках глобального ребрендинга в 2016 году.
О Рамблере
Рамблер — это медийный портал и сервисы
с аудиторией более 40 миллионов ежемесячно
пользователей по всей России и ближнему
зарубежью.
Вакансии
Работа в Рамблере — это амбициозные задачи,
большая команда, уютный офис и дружелюбная
атмосфера.
Rambler&Co
Rambler&Co — это группа компаний, в которую входят
такие проекты как Афиша, Чемпионат.com, Lenta.ru,
Газета.ru, Рамблер/касса и многие другие.
© Рамблер, 2022ВакансииКонтактыПорталРеклама
Понравился проект? Расскажите друзьям!