Матеріали до уроку виробничогог навчання

Про матеріал
Тема програми :. Виконання технологічних операцій з обробки анімацій. Тема уроку № 3. Створення графічних об’єктів. Імпортування об’єктів, групування, вирівнювання та їх трансформування.
Перегляд файлу

Інструкційно-технологічна картка 3

Тема програми № 6.10. Виконання технологічних операцій з обробки анімацій.

Тема уроку № 3. Створення графічних обєктів. Імпортування об’єктів, групування, вирівнювання та їх трансформування.

Мета уроку: навчитися •здійснювати транспортування графічних об’єктів, групування та трансформацію об’єктів засобами програми для створення анімації Macromedia Flash MX;

Обладнання: персональний комп’ютер; програмне забезпечення: операційна система – Windows хр, програми створення анімації Macromedia Flash MX

Майстер в/н: Кручак Р.В.

Правила безпеки: виконувати завдання дозволяється з перервами 10 хв. після кожної академічної години, забороняється класти будь-які речі на вузли ПК, торкатися струмопровідних частин, закривати вентиляційні отвори, вести сторонні розмови, займати і залишати робоче місце дозволяється тільки з дозволу майстра.

Короткі теоретичні відомості

Пенель шарів програми Macromedia Flash.


http://easy-code.com.ua/img/040920111200009613.gif

 

1 – шар (їх може бути необмежена), про них докладніше нижче

2 – приховати те що намальовано в шарі

3 – замкнути шар для редагування

4 – відображати лише контури шару

5 – активний фрейм (тому, що на ньому стоїть каретка)

6 – наступний фрейм (кадр)

7 – каретка яка показує фрейм, який зараз відображається в робочій області

8 – створити шар

9 – створити направляючий шар

10 – створити папку, в яку можна поміщати верстви

11 – видалити шар


Хід роботи

Завдання 1. Створити анімоване коло.

Порядок роботи:

Супроводжуючі ілюстрації

Кроки

http://easy-code.com.ua/img/040920111200009607.gif

  1. Створіть новий документ Macromedia Flash
  2. Виберіть з панелі інструментів коло і потягнув покажчик на робочій області в правому нижньому кутку -вправо і одночасно вниз намалюйте круг чи овал. Щоб вийшло коло, то потрібно плюс до всього під час малювання затиснути shift.
  3. Виділимо коло за допомогою інструмента “трансформація”

http://easy-code.com.ua/img/040920111200009611.gif

  1. Тепер давайте заллємо наш круг градієнтом, для цього виберіть інструмент “заливка”. А потім у панелі “властивості” виберемо колір зелений градієнт;

 

http://easy-code.com.ua/img/040920111200009612.gif

  1. Клацнемо в центрі нашого кола.

http://easy-code.com.ua/img/040920111200009612.gif

  1. виділимо його, як на малюнку і перетворимо в об’єкт, натиснемо f8 і з’явитися ось така панелька

http://easy-code.com.ua/img/040920111200009615.gif

  1. Нам же потрібен movie clip, ставимо галочку і тиснемо ОК.(Таким чином ми заносимо його в бібліотеку) Тепер на таймлайн вставляємо ключовий (f6) фрейм на позначці 20

http://easy-code.com.ua/img/040920111200009616.gif

  1. Під фреймі номер двадцять наш круг з правого нижнього кута переміщаємо в лівий верхній кут.
  2. Виділяємо перший фрейм і клацаємо правою кнопкою, вибираємо create motion tween або також виділяємо перший фрейм і в панелі властивості вибираємо Tween – motion. Таймлайн тут же забарвлюється в бузковий колір.

http://easy-code.com.ua/img/040920111200009618.gif Тепер тиснемо Ctrl + Enter і дивимося. Як ти напевно зрозумів Flash за тебе намалював кадри, на яких відбувся рух мяча.

 

Результат роботи збережіть у внутрішньому форматі (Мяч1.fla)

 

Завдання 2. Аналогічно до попереднього, створити анімований мячик, який пригає згори-вниз. Результат роботи збережіть у внутрішньому форматі (Мяч2.fla)

ПІДКАЗКА!  Перейшовши за посиланням: https://www.youtube.com/watch?v=wwvehVp2gao-перегляньте відео.

Завдання 3. Створити анімацію типу рух об’єкта. (Підказка: щоб створити анімацію типу «рух об’єкта» слід задати початковий і кінцевий ключові кадри і вибрати тип побудови проміжних кадрів Motion (Рух) зі спливаючого списку Tween (Побудова проміжних кадрів) панелі Properties (Властивості).)

Порядок виконання:

1. Створити на першому ключовому кадрі прямокутник в лівій частині сцени за допомогою інструмента Прямокутник панелі Tools.

2. Вставити на 20 кадрі ключовий кадр (Insert Keyframe) і перенести цей прямокутник вправо.

3. На будь-якому проміжному кадрі з контекстного меню вибрати команду (Create Moution Tween)- Создать промежуточное отображение- на панели властивостей виберіть необхідні параметри Движение.

4. Програти анімацію (Control - > Test Movie)

5. Розглянути панель властивостей для початкового кадру. Задати 5 обертань за годинниковою стрілкою (Rotate -> CW, у полі times задати 5).

6. Програти анімацію (Control - > Test Movie). Зберегти анімацію з назвою Рух. Fla.

Завдання 4. Створити анімацію «Метелик на галявині»

Порядок виконання:

  1. Імпортувати фонове зображення (Файл→ Импортировать) або намалювати за допомогою інструментів малювання. В якості фонового зображення використовуємо квітку. Імпортована квітка потрапить на єдиний шар, що маємо. Підправимо її розміри і положення інструментом «Трансформация».

  1.    Дамо назву першому шару «Квітка».   Заблокувати цей шар (це робиться для того, щоб  уникнути випадкових змін фонового зображення).

                      

  1. Додати другий шар https://naurok.com.ua/uploads/files/126038/60717/65149_html/images/var-www-user-data-www-naurok-com-ua-web-uploads-files-126038.004.png , назвати його «метелик» та імпортувати (або намалювати) зображення, яке буде анімовано (метелик);
  2. Перетворити зображення в бібліотечний символ типу Графіка (F8);

  1. Розмістити метелика у лівий нижній кут;
  2. На шкалі часу виділити кінцевий кадр ( 25) в обох шарах і перетворити їх в ключові (F6);

  1. У будь-якому кадрі шару «Метелик» між 1 та 25 визвемо контекстне меню та виберемо команду «Создать промежуточное отображение».

  1. Якщо все зроблено правильно проміжні кадри повинні зафарбуватися в бузковий колір, а 1-й і 25-й кадр з’єднатися стрілкою. Це означає, що програма згенерувала проміжні кадри між 1-м та 25-м ключовими кадрами. У випадку помилки стрілка малюється пунктиром.

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

  1. Зберегти файл (Файл – Сохранить как);
  2.  Протестувати анімацію (Ctrl+Enter).

Завдання 5. Створіть за допомогою програми Macromedia Flash анімацію руху кількох об'єктів.

Порядок виконання:

  1. Імпортувати фонове зображення (Файл→ Импортировать). В якості фонового зображення використовуємо дерево або галявину.
  2. Додаємо зображення, яке буде анімовано (2-3 метелика). Не забуваємо, що кожного метелика треба імпортувати на окремий шар. Анімацію руху кожному метелику робимо на свій розсуд.

Завдання 6*. Створіть анімований ролик, який реалізує рух кулі. Результат роботи збережіть у внутрішньому форматі (Шар.fla)

Порядок виконання роботи:

Супроводжуючі ілюстрації

Кроки

  1. Создайте новый документ Macromedia Flash
  2. На первом кадре нарисуйте круг и овал. Круг заполните градиентной заливкой (это будет мяч), а овал однородным серым цветом (это будет тень которую отбрасывает мяч). Каждый объект сгруппируем отдельно друг от друга.

  1. Создадим второй ключевой кадр анимации. Для этого щелкнем правой кнопкой мыши на первом ключевом кадре и в появившемся меню выберем пункт Insert Keyframe  На временной шкале появится второй ключевой кадр. Нарисуем звёздочку, сгруппируем (Modify/Group) её и поместим на изображение мяча.
  2. Так же как и второй, создадим третий ключевой кадр и поместим на изображение мяча ещё одну звёздочку.

  1. Один за другим создайте ещё 12 ключевых кадров, помещая всякий раз на изображение по одному объекту.
  2. Теперь зададим вращения мячу. Для того, чтобы световой блик при вращении оставался на месте, сгруппируем все звёзды и месяцы (Shift+ объект и выбрать команду Modify/Group). Для создания иллюзии вращения вполне достаточно придать вращение размещённым на изображении объектам, при этом сам мяч может оставаться неподвижным. Поскольку вращение у нас будет неравномерным то в первом кадре, в котором мяч начнёт вращаться он должен будет повернуться, например на 10°. В следующем кадре – на 30°, потом – на 50° и так далее пока угол поворота за 1 кадр не составит 190°

  1. Создайте очередной ключевой кадр и выполните команду Modify/Transform/Scale and Rotate. В диалоговом окне параметр Scale оставьте без изменения, а в поле Rotate введите значение 10 (При этом выделенными должны быть объекты на шаре).
  2. Далее, создавая каждый последующий кадр, увеличивайте угол поворота на 20. Всё это создаст иллюзию вращения.

  1. Теперь будем создавать разлёт звёзд и месяцев с поверхности мяча, который должен напоминать взрыв. Разгруппируйте объекты и снова сгруппируйте теперь только центральные объекты.
  2. Создадим очередной ключевой кадр, переместим периферийные объекты от изображения мяча, а для центральной группы применим команду Scale and Rotate. В поле параметра Scale введём значение 150, а поле Rotate оставим прежнее значение.

  1. Используем для анимации удаления объектов от мяча 5 кадров, в каждом из них будем сдвигать одни объекты и используя команду Scale and Rotate, увеличивать и вращать группу других до тех пор, пока периферийные объекты на покинут пространство кадра.
  2. Два раза щелкните по кнопке Frame Rate  и установите цвет фона голубой
  3. Создадим последний кадр, удалив все звёзды и полумесяцы, запустим анимацию (Ctrl + Enter).

Норми часу та критерії оцінювання завдань до уроку

№ завдання

Час на виконання завдання, хв.

Кількість балів за виконане завдання

Дотримання технологічного процесу

1

25

1

1

2

25

1

3

25

2

4

25

2

5

24

1

6

24

2

 

1

 

docx
Додано
31 березня 2020
Переглядів
744
Оцінка розробки
Відгуки відсутні
Безкоштовний сертифікат
про публікацію авторської розробки
Щоб отримати, додайте розробку

Додати розробку