Як створити простий анімований банер в flash cs3

Якщо ви хочете створити анімований банер з допомогою застарілих технологій, це керівництво покаже вам, як використовувати Adobe Flash і ActionScript 2.0. Зауважимо, що це можна виконати набагато простіше за допомогою HTML і j&# 097; vascript.

кроки

Зображення з назвою Make a Simple Animated Banner in Flash CS3 Step 1

Відео: Як зробити анімований банер # 3

1
Відкрийте Adobe Flash і створіть новий документ. Змініть документ, натиснувши Ctrl + J для Mac, Ctrl + J для ПК. В опціях задайте розмір для банера: 468 х 60 (ширина х висота. Це стандартний розмір банера в Інтернеті). Потім задайте будь-який колір для фону, який ви хочете, і натисніть кнопку ОК. Для цього уроку - це буде чорний колір.
  • Зображення з назвою Make a Simple Animated Banner in Flash CS3 Step 2
    2
    `Перейдіть до своїх верствам і назвіть перший так, який ви хочете, щоб була перша анімація. У цьому уроці це буде коло, так що сам шар буде називатися ‘circle’ (Коло). Наведіть курсор на інструмент Rectangular (Прямокутник), натисніть його і потім утримуйте його, щоб викликати меню. Далі виберіть інструмент Oval (Овал), потім відпустіть кнопку миші. Перейдіть до банера і створіть коло будь-якого розміру. У цьому уроці розмір досить великий, так що тільки невелика частина кола буде видно всередині банера, і розміри такі: 175.5 x 175.5.
  • Зображення з назвою Make a Simple Animated Banner in Flash CS3 Step 3
    3
    Тепер, коли у вас є створений коло, натисніть F8 (Mac і PC) для того, щоб вивести вікно конвертації (перетворення) в символ. Натисніть зображення, далі назвіть символ "circle", Потім натисніть OK. Ви зараз створили символ, який можна "оживити". Перейдіть до своєї області шарів і перемістіть курсор до 5-го кадру і натисніть F6 (Mac і PC). Це створить ключовий кадр, який має коло в тому ж місці. Натисніть тому в 1-му кадрі, потім перейдіть до свого кола і натисніть його. Тепер ми зробимо його зникаючим в плані анімації.
  • Зображення з назвою Make a Simple Animated Banner in Flash CS3 Step 4
    4
    Спустіться до панелі властивостей внизу і перейдіть до палітри кольорів. Натисніть на неї і перемістіть повзунок в позицію "Alpha", А потім встановіть значення відсотка в "0". Це змусить ваш коло зникати. Але не хвилюйтеся, тому що він все ще там, просто в даний час він прихований.
  • Зображення з назвою Make a Simple Animated Banner in Flash CS3 Step 5
    5
    Поверніться до вашої області Layers, клацніть правою кнопкою миші на ключовому кадрі, який знаходиться між 1-м і останнім ключовим кадром, і натисніть на кнопку "Create Motion Tween". Якщо все зроблено правильно, то значить ви успішно створили першу частину анімації. Далі ми додамо текст.
  • Зображення з назвою Make a Simple Animated Banner in Flash CS3 Step 6
    6
    Створіть новий шар, назвіть його "text" (Текст), так як це те, що буде там поміщатися. Перейдіть до 6-го кадру в шарі "text", Клацніть правою кнопкою миші, потім виберіть "Insert New Keyframe" (Вставити новий ключовий кадр) - це дасть вам порожній ключовий кадр, щоб працювати. Перейдіть до палітри інструментів, натисніть на "T", Щоб вибрати інструмент text tool (Текст). Перейдіть до свій банер, а потім введіть слова, які ви хочете. Для цього уроку це буде слово "banner". І з ще виділеним текстом натисніть клавішу F8, щоб зробити його зображенням (Graphic). Введіть "text" для імені, потім натисніть кнопку ОК. Тепер ваш текст може бути анімований також.
  • Зображення з назвою Make a Simple Animated Banner in Flash CS3 Step 7
    7
    Тепер перейдіть до шару "circle", Натисніть на шостий кадр, потім натисніть і утримуйте кадр і переміщайте його до 16-го ключового кадру. Це зробить коло видатним через всю анімацію. Перенесіть текст в область, яка в колі, але переконайтеся, що знаходиться не на біт лівіше за коло. Перейдіть до своїх верствам, натисніть і утримуйте шар "text" і перемістіть його вниз, щоб бути нижче шару "circle". Це змусить частину тексту зникнути для перегляду-то є те, що нам потрібно в даний момент.
  • Зображення з назвою Make a Simple Animated Banner in Flash CS3 Step 8
    8
    Зафіксуйте шар кола і сховайте его` також. Щоб ми могли переконатися, що нічого не буде "зіпсовано" і щоб ми могли бачити, що ми робимо, натисніть на 15-й кадр на шарі з текстом, і створіть ключовий кадр, натиснувши клавішу F6. Натисніть на текст в 16-м кадрі і перемістіть його в те місце розташування, де ви хочете, щоб текст перебував на банері. Але переконайтеся, що остання буква знаходиться лівіше за сам коло. Ви можете натиснути, щоб зробити коло видимим, якщо ви не впевнені, де є коло.

    Відео: Як зробити HTML5 банер на Flash

  • Зображення з назвою Make a Simple Animated Banner in Flash CS3 Step 9
    9
    Якщо у вас він позиціонується саме там, де ви хочете, переходите до шару "text". Потім між двома ключовими кадрами створіть анімацію його руху, клацнувши правою кнопкою, потім вибравши "Create Motion Tween". Як тільки це закінчиться, створіть третій шар і назвіть його ActionScript. Перейдіть до останнього кадру (16-кадр) і створіть новий ключовий кадр, натиснувши клавішу F6. Перейдіть в Window --gt; Actions і введіть stop () - потім закрийте вікно.

    Відео: Як зробити простий анімований банер

  • Зображення з назвою Make a Simple Animated Banner in Flash CS3 Step 10

    Відео: Анімований текст. Анімація. Adobe Flash. / VideoForMe - відео уроки

    10
    Перейдіть туди, де ви хочете зберегти анімацію, і назвіть анімацію "banner". Перейдіть вниз до Export As: (Експортувати як): і натисніть на частину " .swf", Відкриваючи меню для всіх варіантів. Перейдіть до пункту "animated gif (.jpg)" і клацніть по ньому, так що анімація стає малюнком (.jpg image), потім натисніть кнопку ОК.
  • Зображення з назвою Make a Simple Animated Banner in Flash CS3 Step 11
    11
    Вітаємо! Ви успішно створили спрощену версію банера, щоб трохи "повипендріваться"!
  • Поради

    • Розгляньте можливість використання сучасного стандарту, наприклад HTML5.

    попередження

    • Цей метод не буде сумісний з iOS або іншими мобільними операційними системами.
    Поділитися в соц мережах:

    Увага, тільки СЬОГОДНІ!
    Схожі

    Увага, тільки СЬОГОДНІ!
    » » Як створити простий анімований банер в flash cs3