Почему я делаю баннеры только при полной предоплате

Предоплата по баннерам Баннеры — слишком мелкие заказы с большой долей подготовительной и согласовательной работы. Изготавливать их, в отличии от изготовления сайтов, не особо выгодно. На первый взгляд работы нам не много. Но практика показывает, что клиент редко знает, чего он хочет. Или определяется со своими пожеланиями уже после того, как баннер сделан. Вот тут и заказчика и начинает распирать от креативных идей, доплачивать за реализацию которых он не видит причин. В результате – потеря времени и нервов для обеих сторон.

Писать полноценные технические задания, договора, календарные планы, сметы и акты приема-передачи работы – это долго. Но, к сожалению, необходимо. Иначе виноватым останется именно дизайнер, который почему-то не обладает способностью телепатически улавливать вкусы, настроения и требования своего драгоценного клиента. Потому – только 100%-я предоплата.

Чаще всего flash-баннеры в нашей веб-студии делаются как подарок заказчикам крупных и сложных сайтов. Хороший сложный баннер стоит у нас 40-100 долларов, а при составлении договора, 50% предоплате и посещении офиса клиента (как мы делаем при разработке сайтов) стоимость баннера будет около 150 долларов за счет существенного увеличения затрачиваемого на работу времени. Такая цена уже не устраивает заказчика.
(далее…)

Релиз Adobe Creative Suite 5 (Photoshop, Flash, Illustrator и др.)

Очередная версия пакета программ по обработке графики Adobe Creative Suite 5 поступила в продажу в начале мая 2010 года. Поставки локализованных версий начались со средины мая, но на данный момент на официальном сайте компании Adobe.com русскоязычной версии Adobe CS5 еще нет. Зато традиционно после регистрации можно скачать бесплатно Adobe CS5 с официального сайта компании Адоб на пробный 30-дневный период. Версия для Windows весит 2.84 Гб.

Adobe Creative Suite 5

(далее…)

Как отредактировать анимированную картинку (аватарку, баннер, смайлик)

Чаще всего непрофессиональные дизайнеры сталкиваются с проблемой редактирования анимации в формате gif. Это самый старый, довольно простой и очень популярный формат для создания движущихся картинок. Есть, конечно, и другие виды анимации: flash, silverlight, анимация с помощью css или javascript т.п., но эти темы мы оставим пока на будущее.

Анимированные аватарки, смайлики – это почти всегда формат gif. Чтобы отличить анимацию gif от flash, нужно кликнуть правой кнопкой мыши по этой анимации. Если в последней строчке написано что-то про Adobe Flash Player, значит, это флэш-анимация:

Как отличить flash от gif

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

(далее…)

Учимся писать грамотное техническое задание (ТЗ) на разработку баннера

Для того чтобы написать грамотное техническое задание (ТЗ) не нужно быть профессиональным веб-дизайнером. Достаточно посмотреть на баннеры на любом раскрученном портале, на рекламу конкурентов или партнеров, чтобы придумать описание своего будущего баннера. А несколько советов с подробными описаниями того, как составлять ТЗ на разработку сайта, предложенные в этой статье, помогут вам лучше понять, что нужно делать. Поверьте, усилия, потраченные на составление технического задания с правильным описанием баннера, помогут вам не только получить качественный баннер в кратчайшие сроки, но и рассчитывать на скидку. Профессиональные разработчики баннеров заинтересованы поощрять вменяемых заказчиков более выгодными предложениями, т.к. берегут свои нервные клетки.

Классическая иллюстрация работы над проектом

Также вы можете скачать бесплатно реальный пример технического задания на создание баннера в формате .doc:

Скачать бесплатно пример ТЗ на разработку баннера flash

(далее…)

Баннеры какого размера стоит заказывать

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

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

По мнению разработчиков популярной программы Ulead GIF Animator 5, которая чаще всего используется для создания анимированных gif-баннеров, пользователями востребованы баннеры следующих размеров:

Популярные размеры баннеров в Ulead GIF Animator

Если это внутренний акционный баннер для собственного сайта, тогда формат этого баннера вы можете легко определить по ширине колонки, в которой он будет размещаться. Для этого сделайте принтскрин своего сайта, вставьте его в Фотошоп, вырежьте на скрине фрагмент колонки размером с будущий баннер и посмотрите размер этого фрагмента. Аналогично можно узнать размер любого баннера, в т.ч. flash, на любом сайте. Конечно, если баннер – это статическая нефлэшевая картинка или gif-анимация, его размер можно узнать проще и быстрее: кликните по картинке правой кнопкой мыши и выберите Свойства.

(далее…)

Плохой эффектный flash-сайт

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

Вчера я совершенно случайно наткнулся на 2 эффектных flash-сайта. Первый, сайт нового фильма «2012», является ярким примером того, как дизайном пытаются заменить отсутствие контента. Или нежелание этот контент переводить.

Пример плохого flash-сайта

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

(далее…)

Как читать информацию с текстового файла в Flash с помощью ActionScript

Достаточно часто при создании баннеров на Flash требуется, чтобы текст баннера менялся время от времени. Например, можно сделать универсальный акционный flash-баннер, который рекламирует обучающие семинары компании и менять в них дату проведения мероприятия и его тему. Или же баннер, который демонстрирует хиты продаж с ценами, которые тоже время от времени меняются. Конечно, можно сделать базу данных и читать информацию из нее, но если нужно менять 1-2 параметра в баннере, морочиться с базой необязательно. Можно читать параметры для flash-ролика из текстового файла с расширением .txt с помощью кода ActionScript. И сделать это совсем не сложно.

1. Открываем среду разработки flash. В уроке используется Adobe Flash CS3 Professional, но не обязательно использовать именно ее. Adobe Flash 8 тоже подойдет, исходник .fla в скачанном архиве к этому уроку сохранен для Flash 8. Более ранние версии Flash проект .fla не откроют, хотя код ActionScript урока в них работать будет.

2. Создаем новый проект Flash. Он обязательно должен использовать ActionScript 2.0, для ActionScript 3.0 нужны совсем другие действия.
(далее…)

Простая анимация CSS (спрайты)

Никого не удивляют акционные баннеры, иконки или графические меню, сделанные с помощью JavaScript, которые могут слегка меняться при наведении на них указателя мыши. Интерактивная анимация, которая состоит всего из двух кадров (активно/неактивно), имеет ряд преимуществ: она недорогая, легко создается, быстро загружается и при этом заметно оживляет сайт, делая его более дружественным для посетителя. Чаще всего такая двухкадровая css-анимация (также известная как спрайты css), реагирующая на действия пользователя, создается с помощью JavaScript или CSS. В этом уроке мы рассмотрим второй способ, т.к. анимация с помощью каскадных стилей имеет ряд преимуществ перед скриптовой анимацией.

Ярким примером использования возможностей CSS для реализации интерактивной двухкадровой анимации является сайт украинской художницы Елены Миросединой:

Пример анимации css

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

Бесплатно скачать коды урока интерактивной CSS-анимации

(далее…)

Код ActionScript 3, который позволяет сделать flash баннер ссылкой

В этом уроке я хотел бы подробно описать, как с помощью ActionScript 3 баннер на flash можно сделать ссылкой.

Вы можете совершенно бесплатно скачать архив .rar с исходником flash-баннера в формате .fla, который иллюстрирует этот урок (10 Кб):

Скачать бесплатно архив с исходником .fla баннера flash

В своей статье Как баннер на Flash сделать ссылкой я подробно описывал, как с помощью встроенного в Adobe Flash языка ActionScript 2.0 можно сделать флэш-ролик кликабельным. Суть урока в том, что нужно в самый верхний отдельный слой ролика flash вставить прозрачный объект button, размер которого совпадает с размером всего баннера. А далее к этой прозрачной кнопке цеплялся простенький код перехода, написанный на ActionScript 2. Все просто, все работает, все счастливы.

Судя по комментариям после этого урока, счастливы оказались не все. Предложенный стандартный способ сделать баннер flash кликабельным не работал, если баннер разрабатывался с использованием более новой версии языка ActionScript 3.0. Дело в том, что 3-я версия ActionScript существенно переработана и код ActionScript 2 не всегда понимается средой разработки и проигрывателем. Среда разработки Adobe Flash CS4, как и предыдущая версия Adobe Flash CS3, при создании нового флэш-клипа предлагает по умолчанию использовать новую версию встроенного языка ActionScript 3.0. Новички, которые при создании своего баннера решили, что более новая версия лучше, столкнулись с тем, что описанный в статье способ добавления ссылки в баннер на flash, не работал.

Лично я не сторонник использования всего самого нового. Предпочитаю подождать, пока другие помучаются с несоответствиями, потратят время на написание книг и уроков. Если старый способ работает – зачем искать себе лишнюю работу? Впрочем, сколько людей, столько и мнений.

На самом деле сделать ссылкой баннер, разработанный в Adobe Flash CS4 с выбранным языком ActionScript 3 не сложнее, чем более старых версиях Флэша на ActionScript 2. Просто это немного по-другому выглядит.
(далее…)

С чего начать изучение веб-дизайна

Adobe Photoshop CS3

Пролог

Хотел бы рассказать небольшую историю, которая подойдет как эпиграф к этой статье. Года два назад я искал DVD диск на раскладках. Нужен был сборник дизайнерских программ, в котором, помимо Adobe Photoshop, Adobe Flash, Adobe Dreamweaver и Adobe Illustrator, были бы и CorelDraw, и несколько программ для создания иконок и скриншотов… Лень было искать и скачивать все по отдельности из интернета, а затем записывать на диск.

Объяснив продавцу, что мне нужен диск для веб-дизайнера, я получил несколько сборников DVD. Списки программ в описании дисков повторяли друг друга, наклейки только были разные. Составляли сборники далекие от веб-дизайна люди, потому ничего подходящего не было. Отдав продавцу диски и сказав «спасибо», я собирался уходить, но парень меня остановил. Вероятно, он подумал, что я просто компостирую ему мозги и решил вывести меня на чистую воду. Он спросил, что именно меня не устраивает во всех его дисках. На что я ему терпеливо объяснил, что на каждом диске есть только часть нужных мне программ, а «на этом нет даже Фотошопа».

И тут парень засиял. С чувством собственного достоинства и с высоты своего дизайнерского опыта, он мне объяснил, что профессионалы сайты делают в Дримвивере. А остальные программы нужны для понторезов вроде меня. Он был так счастлив от переполнявших его знаний, что мне даже жаль было его прерывать и сообщать, что HTML-верстка сайта в Dreamweaver’е – это всего лишь один из этапов разработки сайта, далеко не первый и не последний.

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

Но вернемся к теме статьи. Итак, с чего начать изучение дизайна для веб, какие программы должен знать веб-дизайнер, что лучше учить углублено, стоит ли идти на курсы. Обо всем по порядку.

(далее…)