Для многих компаний разработка баннеров является головной болью и они отказываются от предоставления этих услуг. Не существует клиентов, которые бы попросили сделать отличный баннер за месяц. В 99% проектов до запуска рекламной кампании остается несколько дней. И каждый день расписан по часам. В статье описан системный подход, который позволяет минимизировать риски и стабильно получать качественный результат.
Ниже мы будем говорить только об интернет-баннерах.
Разработка баннера включает в себя 4 этапа:
Это самая сложная часть. Думаю, что около 5% специалистов могут придумывать качественные идеи. Хорошо, если этим занимаемся копирайтер, понимающий все возможности и тонкости производства. Как научиться придумывать хорошие идеи? На мой взгляд, хорошие идеи не придумываются, они лежат на поверхности. Хорошая идея — это оптимальное решение проблемы.
Раскадровка представляет собой картинку, содержащую ключевые кадры анимации. Она необходима для презентации идеи. Клиенты должны четко понимать, за что платят деньги. Если баннер разрабатывается без предварительного рисования и утверждения раскадровки, то возможен печальный сценарий развития событий, при котором заказчик видит готовый баннер и говорит: «Бог ты мой, что ж вы мне тут надизайнили, надо было все по-другому делать!». Разрабатывать баннеры без утверждения раскадровки можно, если вы продаете баннеры килограммами и вас не беспокоит их внешний вид.
При разработке раскадровки вертикального баннера (например, 240х400), кадры нужно выстраивать в строку. Если их больше 4-х, то допускается перенос кадров во второй и последующие строки. Нельзя показывать раскадровку из 6-ти кадров в 2 столбца и 3 строки, т. к. сложно будет понять последовательность кадров.
Раскадровки горизонтальных баннеров (например, 728х90) нужно делать в столбик при любом количестве кадров.
В случае с нестандартными баннерами (флайскрины, скринглайды и пр.) раскадровку нужно показывать на фоне сайта, где он будет размещен. Каждый ключевой кадр будет содержать подложку-скриншот сайта.
Дизайнер, рисующий раскадровку баннера должен обладать знаниями о композиции, работе с цветом, типографике. Последнее является больным местом 99% баннерной рекламы в России. Дизайнер, приступая к разработке раскадровки, изначально должен учитывать ограничения по весу баннера — размеру в КБ. Можно нарисовать красивую раскадровку с большим объемом качественной графики. Но она не пройдет по весу, графика ужмется до безобразия, и в результате мы получим тихий ужас вместо хорошего баннера. В этом случае дизайнер не может утверждать, что он нарисовал хорошую раскадровку, а во всем виновата площадка с ее жесткими требованиями. Работа дизайнера по разработке раскадровки — это решение задачи воплощения идеи в заранее известных рамках по весу баннера, с учетом требований к оформлению.
Имея на руках медиаплан с техническими требованиями площадок, разработчик должен заранее выбрать способ реализации раскадровки. Если сценарий баннера достаточно длинный, а ограничение по весу равно 25 КБ, возможно, есть смысл использовать только векторную графику, отказавшись от растра.
Если медиаплан содержит много разных размеров баннеров, то можно нарисовать одну раскадровку для вертикальных форматов, одну для горизонтальных.
Эту работу должен выполнять моушн-дизайнер со знанием экшн скрипта. Если требуется глубокое программирование, то в разработке, наряду с флеш-дизайнером, должен участвовать флеш-программист. Ни в коем случае нельзя считать анимацию баннера технической работой и доверять ее флеш-технологам (программистам). Анимация баннера — это творческая работа.
Пример. Представим, что по сценарию баннера точка должна по прямой траектории переместиться из пункта «А» в пункт «Б». Толковый моушн-дизайнер, в отличие от технического специалиста (программиста, технолога) понимает, что сделать это можно бесконечным количеством способов. И выбор способа реализация движения точки зависит от контекста.
5 типов анимаций в качестве примера.
Теперь мы знаем, что прямолинейное движение точки из пункта «А» в пункт «Б» может быть выполнено множеством способов. Важно всегда выбирать именно тот способ анимации, который соответствует контексту, т. е. делать качественную анимацию. Что это значит?
Под качественной анимацией понимается анимация, приятная глазу в случае с объектами, не имеющими аналогов в реальном мире. Возможна стилизация анимации: стоп-моушн и другие эффекты в необходимом контексте.
Если мы анимируем реалистичную графику из реального мира (авто, чайник, дерево) и нам не нужна стилизация, то анимация должна повторять их движения так, как это происходит на самом деле, в реальном мире. Мы знаем, как трогаются автомобили, как они останавливаются, потому что видим это каждый день. Знаем, как колышется листва деревьев при небольшом ветре, как листья отрываются и летят при сильном ветре и т. д. Задача хорошего моушн-дизайнера — избавить пользователя от просмотра анимации. Пользователь должен видеть суть, не обращая внимание на технику реализации: едет автомобиль, падает рояль, взлетает самолет и т. д. В жизни практически невозможно встретить абсолютно равномерное движение, всегда присутствует ускорение или замедление какой-то степени. Об этом не стоит забывать при работе над анимацией.
Вышеописанное справедливо для реалистичной графики и не относится к мультипликации. Для последней более свойственна стилизация анимации, она добавляет ярких эмоций ролику.
В некоторых случаях удобно пользоваться специальными скриптами:
MC Tween: http://hosted.zeh.com.br/mctween/documentation.html
GreenSock: http://www.greensock.com/v11/
По скриптам есть вся документация на сайтах, описывать ее тут не имеет смысла. Не разберется только ленивый.
Первый баннер, который получается в результате вышеописанных этапов (идея, раскадровка, анимация и программирование) принято называть уникальным баннером. Последующие адаптации этого баннера согласно размерам и техническим требованиям площадок называют ресайзами.
Уникальный баннер — это самый презентабельный баннер с наименее жесткими ограничениями по весу. Если медиаплан содержит следующие пункты:
то уникальный баннер нужно делать для sports.ru, до 40 КБ. Немного адаптировать для mail.ru и упрощать для yandex.ru. При таком подходе на больших рекламных кампаниях мы получаем все баннеры максимального качества.
Недобросовестные разработчики применяют другую систему: делают простейший баннер по самым жестким ограничениям веса (в нашем случае это yandex.ru, до 25 КБ), избавляя себя тем самым от сложной работы по оптимизации последующих ресайзов и клиента от качественных баннеров. В то время, как баннер до 40 КБ мог выглядеть эффектно, у них он получится таким же «упрощенным», как и версия до 25 КБ. Такой подход, конечно, неприемлем.
Проведите конкурс среди участников CMS Magazine
Узнайте цены и сроки уже завтра. Это бесплатно и займет ≈5 минут.