Донецкий техникум промышленной автоматики

Анімований банер своїми руками за 5 хвилин

Привіт шановні друзі! У сьогоднішній статті мова піде про виготовлення анімованого рекламного банера своїми руками за лічені хвилини.

Свою роботу в ИнфоБизнес починав з заробітку через Інтернет за допомогою партнерських програм Свою роботу в ИнфоБизнес починав з заробітку через Інтернет за допомогою партнерських програм. Для просування партнерських посилань використовував різні рекламні канали, включаючи біржу банерної реклами Ротабан - про це писалося в статті « Rotaban, рекламний канал блогера «.

Все було добре, якщо до партнерської програми додавалися рекламні банери, але не завжди було так. Часто рекламні банери або були відсутні, або розміри рекламних банерів відрізнялися від тих, що вимагав сервіс Ротабан. Замовляти виготовлення рекламних банерів потрібних розмірів не став, це коштувало грошей, а впевненості в тому, що витрати окупляться, не було. Про те, як зробити банер навіть не замислювався, вважав, що це складно.

Зрештою, вирішив спробувати виготовлення рекламного банера своїми руками і встановити його на сайт. Як виявилося створення рекламного банера є дріб'язковим заняттям і цю роботу може виконати будь-який новачок. Спочатку вирішив виготовити простий статичний банер, все вийшло, виготовлення рекламного банера займає хвилин 10. Про те, як зробити статичний рекламний банер будь-якого розміру за допомогою безкоштовних програм Ви можете прочитати в статті « Виготовлення рекламного банера своїми руками «, Там детально все показано.

Згодом, хочеться чогось більшого, виникло питання - як зробити анімований банер, чому б ні?

Було прийнято рішення про виготовлення анімованих рекламних банерів своїми руками. Для цих цілей була використана програма «Easy GIF Animator», щоб не зв'язуватися з фотошопом. Програма проста у використанні, вона платна, коштує близько 20 $, але якщо пошукати в Інтернеті, то Ви завжди знайдете варіанти безкоштовності.

Програма може створювати анімовані зображення з нуля, дозволяє створювати до трьох змінюються текстів, які можна створити з різними ефектами, тексти виходять рухомі, можна витягати окремі кадри анімації, зберігати анімацію у форматі SWF Flash, експорт GIF анімації в avi формат і багато іншого. За допомогою цієї програми можна створювати анімовані рекламні кнопки.

У даній статті ми розглянемо виготовлення простого (без малюнка) анімованого рекламного банера з допомогою програми «Easy GIF Animator».

Вважаємо, що Ви встановили програму «Easy GIF Animator» на комп'ютер, складно там нічого немає. Відразу скажу, що є два варіанти - англомовна і русифікована. Моя версія програми не русифікована, всі написи англійською мовою, але в принципі все зрозуміло.

Отже, спочатку нам треба визначитися з розміром анімованого банера і підготувати рекламний текст, який ми хочемо відобразити на анімованому банері. Популярним розміром рекламних банерів на біржі Ротабан , Є розмір 468х60, вибираємо його. Оскільки банер маленький, можна обійтися тільки рекламним текстом, розміщувати зображення буде незручно.

Отже, відкриваємо програму «Easy GIF Animator», вибираємо команду «Create Animated Banner», що означає створити анімований банер.

До речі, нижче знаходиться режим створення анімованих кнопок «Create Animated Button». У новому вікні вибираємо стандартний розмір банера 468х60 (дивіться скрін) і натискаємо Next (Далі).

Тепер вибираємо колір фону анімованого банера. Режим «Simple Color» дозволяє вибрати однотонний колір, режим «Gradient Color» дозволяє вибирати градієнт з двох кольорів, а режим «Picture and Texture» дозволяє працювати з картинками і текстурами.

Вибираємо режим градієнта, так анімовані банери краще виглядають. Тепер по черзі вибираємо кольори для створення градієнта, кольору вибираються з спливаючих віконець поруч з полями «Color 1» і «Color 2», якщо запропоновані кольори не підходять, можна викликати режим «More Colors» - більше квітів і вибрати відповідний колір.

Тепер нижче з восьми варіантів вибираємо геометрію градієнта, там візуально все зрозуміло і натискаємо Next.

Відкривається нове вікно, де ми повинні вставити заздалегідь підготовлений текст нашої реклами. Програма дозволяє розташовувати на анімованому банері три різних тексту (можна розмістити і один і два).

Отже, вибираємо функцію «Text 1», вибираємо тип шрифту, його розмір і колір (як в Word) і пишемо «Хочете створити свою першу книгу?», На синьому тлі непогано виглядають літери білого кольору. Далі вибираємо шрифт буде, щоб фраза помістилася в повному обсязі в поле банера. Тепер в полі «Display at once» вибираємо напрям, звідки буде з'являтися текст (справа наліво, падає зверху і т.д.), вибираємо «Slide in from left» - текст буде з'являтися зліва.

В поле «How long to show» - час прокрутки, я вибрав 3 секунди, далі в поле «Hide at once» вибираємо в якій формі буде ховатися текст, вибираю «Slide out to Right», текст буде йти направо.

Тепер по черзі натискаємо «Text 2» і «Text 3», робимо відповідні записи, також підбираємо колір і розмір шрифту. З режимами появи і зникнення тексту можна поекспериментувати, важливо зберегти креативність.

Після завершення роботи з текстом можемо натиснути кнопку «Next» і перейти в режим попередньо перегляду і збереження анімованого рекламного банера. Можна натиснути кнопку «Finish» - завершення і також зберегти анімований банер в папку на комп'ютер. Подивитися процес виготовлення можна також в представленому відео:

Ось таким простим способом за 5 - 10 хвилин Ви можете створити анімований банер, не витративши на його виготовлення ні копійки. Анімований банер являє собою звичайну картинку. Тому, для розміщення анімованого рекламного банера на сайті, Вам потрібно отримати для нього код. Спочатку картинку (банер) завантажуєте на блог (на хостинг) в бібліотеку медіафайлів, а потім отримуєте посилання. Як зробити код для зробленого банера, докладно показано в попередній статті « Виготовлення рекламного банера своїми руками «.

До речі, для розміщення банера на біржі Ротабан, код не потрібен. Ви просто вставляєте картинку потрібного розміру (отриманий банер) і вказуєте посилання, куди цей банер повинен привести.

Тепер Ви будете знати, як зробити анімований банер, зробите його швидко і безкоштовно. Створений анімований банер ми можемо подивитися в шапці блогу зліва.

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

З повагою, Іван Кунпан.

Переглядів: 638

Згодом, хочеться чогось більшого, виникло питання - як зробити анімований банер, чому б ні?
Отже, вибираємо функцію «Text 1», вибираємо тип шрифту, його розмір і колір (як в Word) і пишемо «Хочете створити свою першу книгу?