Общие рекомендации по проектированию баннеров
Шаблоны
Подготовка к разработке
Площадки
Виды сервисных баннеров
Виды рекламных баннеров
Шаблоны
Шаблоны баннеров можно посмотреть здесь.
Подготовка к разработке
Все баннеры передаются в разработку в формате jpg без теней и скруглений в прямоугольном слайсе. Необходимые размеры:
Большой баннер на главной (Web_Main)
— х1 — 280×400px;
— х2 — 560×800px;
— х3 — 840×1200px.
Маленький баннер на главной (Web_Main)
— х1 — 280×144px;
— х2 — 560×288px;
— х3 — 840×432px.
Постоплатный баннер (Web_PostPay)
— х1— 680×280pх;
— х2— 1360×560pх;
— х3— 2040×840pх.
Важно!
Если вам нужно приготовить баннер для площадки Web_Main и Web_PostPay, исходники стоит передавать в двух одноименных папках Web_Main и Web_PostPay. Название файлов должно четко соответствовать размеру баннеров. Пример формата передачи на скрине ниже:
Вес баннера не должен превышать 800Кб.
Следите за тем, чтобы текстовый блок не выходил за границы охранных отступов и не пересекался с картинкой.
Площадки
Виды сервисных баннеров
Сервисные баннеры
Сервисные баннеры предлагают воспользоваться новым функционалом и рассказывают о возможностях QIWI Кошелька.
Места для размещения
Сервисные баннеры размещаются на главном экране авторизованной зоны между разделами Избранное и История.
Размеры и отступы
Высота сервисных баннеров зависит от количества контента — высота текста и иллюстрации суммируется с отступами сверху/снизу. Отступы составляют 48px.
Ширина баннера — 880px.
Боковые отступы — 48px. Внутренние отступы от текста до кнопки и от текста до иллюстрации — 24px.
Структура баннера
На сервисном баннере всегда присутствует иллюстрация, текст, кнопка и крестик для закрытия баннера. Также на баннере может находиться поле ввода, виджет для оценки сервиса и вторая кнопка.
Иллюстрация всегда размещается слева.
Brand Button Normal размещается справа или снизу. Может использоваться в сочетании с Simple Button.
Фон
Сервисные баннеры всегда размещаются на белом фоне.
Желательно выбирать четные размеры для текста.
| Тип текста | Шрифт Museo Sans | Размер текста, px | Высота строки, px |
| Заголовок | 900 | от 20 до 24 | от 24 до 28 |
| Основной текст | 500 | от 16 до 20 | от 20 до 24 |
Онбординги
Онбординг — это вид сервисных баннеров, который используется для обучения пользователей. Онбординги помогают пользователям как можно быстрее познакомиться с новым функционалом.
Места для размещения
Онбординги размещаются на главном экране авторизованной зоны под шапкой.
Размер
Размер баннера — 880×546px.
Структура баннеров
Для онбордингов предусмотрено несколько типов компоновки.
Фон
Онбординги всегда располагаются на белом фоне.
Типографика
| Тип текста | Шрифт Museo Sans | Размер текста, px | Высота строки, px |
| Заголовок | 900 | 30 | 36 |
| Основной | 300 | 18 | 24 |
| Заголовок пункта | 500 | 16 | 24 |
| Основной текст пункта | 300 | 14 | 20 |
| Примечание | 300 | 16 | 24 |
Виды рекламных баннеров
Собственные баннеры QIWI
Места для размещения
1. Большой баннер справа на главной авторизованной зоны (Web_Main)
Фон собственных баннеров QIWI выполняется в фирменных цветах. Лучше отдавать предпочтение белому фону и помещать на баннерах фирменную кнопку в размере Normal для повышения CTR.
| Тип текста | Шрифт Museo Sans | Возможные размеры, px | Высота строки, px |
| Заголовок | 900 | от 20 до 32 | от 24 до 36 |
| Основной текст | 500 | от 16 до 24 | от 20 до 28 |
Желательно использовать для текста четные размеры.
2. Маленький баннер справа на главной (Web_Main)
Фон собственных баннеров QIWI выполняется в фирменных цветах.
| Тип текста | Шрифт Museo Sans | Возможные размеры, px | Высота строки, px |
| Заголовок | 900 | от 14 до 20 | от 18 до 24 |
| Основной текст | 500 | от 14 до 16 | от 18 до 24 |
Охранные отступы до текста на маленьких и больших баннерах на qiwi.com.
3. Большой и маленький баннер в разделах Вывести и Перевести
Размеры баннеров, цвет фона и типографика совпадают с параметрами больших и маленьких баннеров на главной странице.
4. Постоплатный баннер (Web_PostPay)
Охранные отступы до текста.
Фон собственных баннеров QIWI выполняется в фирменных цветах.
| Тип текста | Шрифт Museo Sans | Возможные размеры, px | Высота строки, px |
| Заголовок | 900 | от 20 до 32 | от 24 до 36 |
| Основной текст | 500 | от 16 до 24 | от 20 до 28 |
Партнерские баннеры
Места для размещения
1. Большой баннер справа на главной авторизованной зоны (Web_Main)
Размер баннера — 280×400px. С подробным описанием партнерских баннеров можно познакомиться здесь.
2. Баннер на постоплатном экране (Web_PostPay)
Размер баннера — 680×280px.
Важно: На главной странице авторизованной зоны на партнерских баннерах используются фирменные шрифты QIWI. На постоплатном экране также желательно использовать те же шрифты, что и на собственных баннерах QIWI.
