• dom
  •  > 
  • Internet
  •  > 
  • Podsumowanie lekcji informatyki na temat „Tworzenie animacji GIF za pomocą edytorów graficznych”. Korzystanie z obiektów graficznych

Podsumowanie lekcji informatyki na temat „Tworzenie animacji GIF za pomocą edytorów graficznych”. Korzystanie z obiektów graficznych

Cele Lekcji:

  • edukacyjny: kształtowanie u uczniów idei animacji, jej rodzajów, metod i programów do tworzenia animacji komputerowej; rozwinąć umiejętność korzystania z Internetu w celu wyszukiwania informacji;
  • rozwijanie: rozwinąć umiejętność podkreślania najważniejszych rzeczy i samodzielnego zdobywania wiedzy.
  • edukacyjny: kultywowanie zainteresowań historią informatyki.

Typ lekcji: lekcja uczenia się nowego materiału.

Metody i formy szkolenia: wyjaśniająco-ilustracyjny, heurystyczny.

Środki edukacji: komputery z łączem internetowym, projektor multimedialny.

Lekcji towarzyszy prezentacja: prezentacja (Załącznik nr 1) oraz rysunki lub jej fragmenty.

Plan lekcji:

  1. Org. chwila – 2 min.
  2. Wprowadzenie do tematu lekcji – 3 min.
  3. Nauka nowego materiału – 20 min.
  4. Samodzielna praca w Internecie – 15 min.
  5. Podsumowanie lekcji – 3 min.
  6. Chatka Praca domowa- 2 minuty.

Podczas zajęć

1. Moment organizacyjny.

2. Wprowadzenie do tematu lekcji.

Nauczyciel: Z każdym rokiem wzrasta rola technologii medialnych w przekazie informacji. Nieważne jak ktoś tego chce, ale stopniowo informacje tekstowe ustępuje miejsca grafice i multimediom. Na przykład prezentacje komputerowe w procesie edukacyjnym stały się normą, a wraz ze wzrostem szybkości Internetu wzrasta udział grafiki w treści stron. Jak myślisz, dlaczego tak się dzieje?

Odpowiedź: Powodem tego jest łatwość postrzegania takich informacji. Ponadto rośnie ilość informacji, dlatego powinny pojawić się sposoby na jej szybsze i łatwiejsze przyswojenie.

Nauczyciel: Sugeruję obejrzenie jednego filmu.

Pokaz pierwszej kreskówki komputerowej „Kotek” (do pobrania na stronie „Etiudy Matematyczne”).

Ponad 40 lat temu, 1968... Grupa kierowana przez Nikołaja Nikołajewicza Konstantinowa tworzy model matematyczny ruchy zwierzęcia (kota). Maszyna BESM-4 wykonująca napisany program do rozwiązywania zwykłych problemów (w matematycznym znaczeniu tego słowa) równania różniczkowe, rysuje kreskówkę „Kitty”, która zawiera, nawet jak na współczesne standardy, niesamowitą animację ruchów kota, stworzoną przez komputer. Dokonano tego w ramach tworzenia programów symulujących mechanizmy. Co szczególnie ciekawe, aby stworzyć prawdziwy film z kreskówką, każda klatka została wydrukowana na drukarce, a rolę piksela pełniła litera „Ш”.

Jaki jest zatem temat dzisiejszej lekcji?

Odpowiedź: Animacja komputerowa.

3. Studiowanie nowego materiału.

Najpierw zdefiniujmy termin, czym jest „Animacja” i czym „animacja” różni się od „animacji”?

Zdecydowana większość ludzi ma pojęcie o animacji. Prawdopodobnie wielu natychmiast zaprezentuje jakiś film animowany (coś w rodzaju „Shrek” lub „Kubuś Puchatek”).

Spróbuj to zdefiniować.

Odpowiedź: animacja - jest to ruch ręcznie rysowanych obrazów.

Słowa „animacja” i „kreskówka” oznaczają to samo. W wielu krajach animacja nazywana jest animacją. Trudno powiedzieć, dlaczego tak się stało. W języku łacińskim słowo „multiplikato” oznacza mnożenie. Wiadomo, dlaczego używano go przy wymyślaniu tytułów filmów, w których trzeba je wielokrotnie powtarzać, tj. mnożyć rysunki, aby postacie na ekranie się poruszały. A słowo „animacja” pochodzi od łacińskiego „anima” – animacja. Oznacza to, że wszystko ukazane w kinie wygląda jak prawdziwe, żywe, animowane.

Okazuje się, że oba imiona są odpowiednie, więc ludzie ten moment Użyj obu.

Na „zachodni sposób” skorzystamy z pierwszej opcji.

Który rodzaje animacji czy możesz nazwać?

  1. animacja wolumetryczna (przykład „Wrona z plasteliny”).
  2. animacja obrazkowa (większość kreskówek).
  3. animacja zmiany biegów (przykład „Dobranoc, dzieci!”).
  4. animacja komputerowa (na przykład Shrek).

Sprawozdania studentów dotyczące rodzajów animacji. Wiadomościom towarzyszy przykład tego typu animacji, przedstawiający fragment kreskówki.

Materiał do wiadomości można znaleźć na stronie internetowej dla nauczycieli informatyki prowadzonej przez N.A. Filatovą. .

Nauczyciel: Przejdźmy więc bezpośrednio do animacji komputerowej i rozważmy jej rodzaje. Myślę, że sam podasz definicję.

Odpowiedź: Animacja komputerowa to animacja stworzona przy użyciu komputera.

Lub animacja komputerowa to tworzenie iluzji obiektów poruszających się na ekranie monitora.

Rodzaje animacji komputerowej.

Ponieważ podstawą animacji komputerowej są obrazy graficzne, animację można podzielić na dwa typy:

  • Raster (animacja w prezentacjach, animacja Gif);
  • Wektor (animacja Flash).

Rozważmy sposoby animacji obiektów.

Animacja klatki kluczowej. Rozmieszczeniem klatek kluczowych zajmuje się animator. Ramki pośrednie generowane są przez specjalny program. Ta metoda jest najbliższa tradycyjnej animacji rysowanej ręcznie.

Wyobraźmy sobie oś czasu (film) jako ścieżkę złożoną z pojedynczych klatek. Załóżmy, że w klatce nr 1 obiekt powinien znajdować się po lewej stronie, a w klatce nr 100 – po prawej stronie. Te dwie klatki są oznaczone jako klatki kluczowe tego obiektu. W nich znajduje się na początku i na końcu ruchu (ryc. 2). Wszystkie pozostałe ramy - pośrednie - nie wymagają mocowania obiektu - obraz w nich zostanie stworzony przez program komputerowy. Ona sama obliczy, gdzie i w jakim momencie powinien znajdować się przedmiot. Oczywiste jest, że jeśli będziemy chcieli przesunąć obiekt po krzywej, to będziemy musieli wykonać więcej klatek kluczowych (lub użyć specjalne środki udostępnianych przez program w celu utworzenia trajektorii).

Nagrywanie ruchu. Dane animacji rejestrowane są za pomocą specjalnego sprzętu z rzeczywistych poruszających się obiektów i przenoszone do ich symulacji na komputerze. Typowym przykładem takiej techniki jest przechwytywanie ruchu. Aktorzy w specjalnych kombinezonach z czujnikami wykonują ruchy, które są rejestrowane przez kamery i analizowane przez specjalne oprogramowanie. Uzyskane dane dotyczące ruchu stawów i kończyn aktorów nanoszone są na trójwymiarowe szkielety wirtualnych postaci, co osiąga się wysoki poziom niezawodność ich ruchu.

Tą samą metodą przenosi się mimikę żywego aktora na jego trójwymiarowy odpowiednik w komputerze.

Animacja proceduralna. Animacja proceduralna jest w całości lub częściowo generowana komputerowo. Można tu uwzględnić następujące typy:

  • Symulacja fizycznego oddziaływania ciał stałych.
  • Symulacja ruchu układów cząstek, cieczy i gazów.
  • Symulacja interakcji ciał miękkich (tkanina, włosy).
  • Obliczanie ruchu struktura hierarchiczna połączenia (szkielet charakteru) pod wpływem czynników zewnętrznych.
  • Imitacja autonomicznego (niezależnego) ruchu postaci.

Programowalna animacja. W Internecie powszechnie używane są dwa języki, za pomocą których programuje się ruchy animowanych obiektów:

  • Java-Script - język przeglądarki
  • Action-Script to język do pracy z aplikacjami Flash

Zaletą animacji programowalnej jest zmniejszenie rozmiaru pliku źródłowego, wadą jest obciążenie procesora klienta.

Oprogramowanie do tworzenia animacji.

Nauczyciel: Nowoczesny mężczyzna musi nie tylko być w stanie dostrzec informacje w „ forma graficzna”, ale także go wyprodukować.

Ponieważ animacja komputerowa jest integralną częścią technologii medialnej, musimy umieć stworzyć przynajmniej najprostsze rodzaje animacji komputerowej. Ale najpierw przyjrzyjmy się programom do tworzenia animacji.

Nauczyciel: Animacja to sekcja tematu „Grafika komputerowa”. Zastanów się, jakich programów można używać do tworzenia animacji?

Odpowiedź: Edytory graficzne.

Nauczyciel: Tak, możesz animować obiekty za pomocą niektórych redaktorzy graficy, ale istnieją również specjalne programy do tworzenia animacji. Nagrajmy niektóre programy.

Umownie możemy wyróżnić dwa lub trzy typy programów do tworzenia animacji:

  1. Programy umożliwiające tworzenie animacji z gotowych obrazów (różne animatory gif, na przykład Microsoft GIF Animator).
  2. Środowiska oprogramowania umożliwiające tworzenie animacji 2D (np. Adobe Flash CS4, Synfig).
  3. Środowiska oprogramowania umożliwiające tworzenie animacji 3D (np. Autodesk 3ds Max, Blender).

Ponadto możesz tworzyć animacje za pomocą edytorów graficznych, takich jak AdobePhotoshop lub GIMP.

Istnieje również programy do tworzenia animacji za pomocą aparatu cyfrowego. Dzisiaj oprogramowanie, który umożliwia wykorzystanie aparatu cyfrowego do kręcenia animacji, jest używany równie często, jak znane już pakiety 3D lub 2D. Dowolny program tego typu umożliwia sterowanie aparatem cyfrowym za pośrednictwem komputera i pracę z powstałymi klatkami.

4. Samodzielna praca w Internecie.

Ćwiczenia: wypełnij tabelę za pomocą Internetu ” Charakterystyka porównawcza oprogramowanie do tworzenia animacji” (Załącznik nr 2).

Techniki animacji stale się rozwijają, a twórcy gier i studia filmowe stale poszukują utalentowanych i kreatywnych osób, które potrafią zastosować te techniki.

Oto główne typy animacji, które można wykorzystać do tworzenia cyfrowych postaci do programów telewizyjnych, zastosowań komercyjnych, logo firm, filmów, plików wideo lub gier.

  • Tradycyjna animacja.
  • Animacja wektorowa 2D.
  • Animacja komputerowa 3D.
  • Animacji.
  • Zatrzymaj ruch.

Tradycyjna animacja

Czy widziałeś kiedyś obrazy, które pojawiają się w krótkich odstępach czasu jako klatki, narysowane na przezroczystych arkuszach papieru za pomocą kolorowych markerów? Ten rodzaj animacji komputerowej nazywany jest tradycyjnym. Służy do wstępnych szkiców postaci.

Proces ten może być dość kosztowny i czasochłonny, ponieważ animatorzy muszą stworzyć serię różnych klatek w oparciu o częstotliwość klatek 24 na sekundę. Ta metoda używany głównie na komputerach PC, a także tabletach przy użyciu specjalnych programów komputerowych, które pozwalają na tworzenie animacji w stylu starych kreskówek Disneya.

Animacja wektorowa 2D

Najczęściej używany styl animacji. Jego ramy powstają na stosunkowo płaskiej powierzchni. Ponadto animacja wektorowa przyjęła pewne tradycyjne techniki animacji. W rzeczywistości jest to to samo, co tradycyjna animacja, z tą różnicą, że do klatek stosowany jest proces znany jako cieniowanie i cieniowanie.

Podczas tego procesu animatorzy umieszczają cienkie, przezroczyste arkusze celuloidu na papierze, na którym rysowane są animowane postacie, a następnie przenoszą je na taśmę filmową. Na koniec ujęcia różnych postaci nakładają się na siebie, co dzięki dużej przezroczystości filmu pozwala na stworzenie kompozycji z różne elementy i postacie.

Animacja komputerowa 3D

Animacja 3D różni się całkowicie od innych rodzajów animacji w grafice komputerowej. Choć posługują się tymi samymi zasadami kompozycji i ruchu, metody techniczne, używane do rozwiązywania różnych problemów, znacznie się różnią. W animacji 3D animator nie musi być grafikiem. To bardziej przypomina zabawę lalkami niż rysowanie.

Nazywa się je również obrazami generowanymi komputerowo ( Grafika komputerowa). Występują, gdy animatorzy komputerowi tworzą strumień obrazów, które są łączone w animację. Połączenie dynamiki i obrazy statyczne wykonywane przy użyciu Grafika komputerowa. Postacie stworzone w 3D, w formacie cyfrowym są wyświetlane na ekranie, a następnie łączone z modelem szkieletowym, dzięki czemu każdy model może być animowany inaczej.

Animacja tworzona jest poprzez tworzenie modeli w poszczególnych klatkach kluczowych, a następnie komputer je mnoży, interpretując animację poprzez dodawanie klatek pośrednich pomiędzy klatkami kluczowymi.

Ponadto dużo czasu poświęca się na pracę z krzywymi reprezentującymi różne części obiektu w różnych okresach czasu. W animacji 3D należy wziąć pod uwagę wszystkie postacie, nawet te, które są pewien moment czas są przez coś blokowane i nie są widoczne.

Główna różnica między tego typu animacjami polega na tym, że w animacji tradycyjnej i 2D artysta pracuje na pojedynczych klatkach, podczas gdy w animacji 3D zawsze następuje ciągły przepływ. Jeśli się zatrzyma, jest to postrzegane jako błąd. Nawet gdy postać pozostaje na miejscu, zawsze następuje ciągły przepływ klatek, który tworzy iluzję rzeczywistości.

Animacji

Czy zastanawiałeś się kiedyś, w jaki sposób powstają filmy promocyjne, animowane logo, napisy początkowe do filmów i reklamy aplikacji? Odbywa się to za pomocą ruchomych tekstów i elementów graficznych, czyli, jak to nazywam, ruchomej grafiki.

Jest to proces wykorzystujący „mnożenie” animowanych klatek w celu zapewnienia płynnego ruchu pomiędzy klatkami. Programy do powielania klatek obsługują skrypty, które automatycznie zmieniają animację, tworząc liczne efekty.

Z nich tworzone są kompozycje 3D elementy płaskie, poruszając się względem siebie, co stwarza iluzję objętości. Mogą im także towarzyszyć efekty dźwiękowe lub muzyka. Obiekty takie często wykorzystywane są w projektach multimedialnych.

Zatrzymaj ruch

Stop motion to rodzaj animacji komputerowej, który bardziej przypomina tradycyjną animację. Wystarczy, że zrobisz zdjęcie obiektu i kiedy obiekt zostanie przesunięty względnie krótki dystans, zrób kolejne zdjęcie. Tej procedury powtarza się wielokrotnie, a gdy obrazy odtwarzane są jeden po drugim, powstaje wrażenie ruchu.

Istnieje wiele form animacji poklatkowej, w tym wycinanki, Claymation i Puppets i inne. Ale chodzi o to, że aby stworzyć animację, obiekty, które muszą się poruszać, są fotografowane sekwencyjnie, wiele razy.

Tłumaczenie artykułu „Rodzaje animacji w grafice komputerowej„został przygotowany przez zaprzyjaźniony zespół projektowy.

Dobry zły










Grafika rastrowa Obraz rastrowy jest bardzo wrażliwy na zmniejszanie i powiększanie. Podczas zmniejszania obrazu rastrowego kilka sąsiadujących punktów jest konwertowanych w jeden, przez co traci się przejrzystość małe części obrazy Obraz rastrowy jest tworzony przy użyciu kropek o różnych kolorach (pikseli), które tworzą wiersze i kolumny. Zestaw linii punktowych tworzących siatkę graficzną (raster)


Grafika wektorowa Grafika wektorowa służy do przechowywania bardzo precyzyjnych obiektów graficznych (rysunków, diagramów), dla których ważne jest zachowanie wyraźnych i jasnych konturów. Obrazy wektorowe powstają z elementów - punktu, linii, okręgu, prostokąta itp. Dla każdego elementu określone są współrzędne i kolor


Grafika fraktalna Grafika fraktalna, podobnie jak grafika wektorowa, jest obliczana, ale różni się od niej tym, że w pamięci komputera nie są przechowywane żadne obiekty. Obraz jest konstruowany przy użyciu równania (lub układu równań), dlatego przechowywane są tylko formuły. Zmieniając współczynniki w równaniu, można uzyskać inny obraz.


Kształcenie zawodowe EFEKTY WIZUALNE Tworzenie realistycznych lub odwrotnie fantastycznych światów w filmach, ciekawych postaci, spektakularnych zniszczeń, eksplozji, tornad i innych efektów specjalnych – to nie jest pełna lista funkcji specjalistów od efektów wizualnych. Zawód ten wymaga nie tylko umiejętności pracy w opakowaniach trójwymiarowych, ale także znajomości matematyki, fizyki i różnych dyscyplin artystycznych.




Compositing Compositing to jedna z najciekawszych specjalności w postprodukcji. Zadaniem kompozytora jest zebranie materiału filmowego i wszystkiego stworzonego przez specjalistów w jedną scenę (ujęcie). efekty wizualne warstwy grafiki komputerowej, łączymy je kolorystycznie i dynamiką, przeprowadzamy ogromną ilość poprawek i udoskonaleń i tworzymy ostateczną kompozycję. Każda scena z efektami specjalnymi, którą widz widzi w filmie, jest efektem pracy kompozytora.




Projektowanie ruchu Projektant ruchu to jedna z najbardziej kreatywnych i poszukiwanych specjalizacji w grafice komputerowej. Obejmuje tworzenie „opakowania” kanałów telewizyjnych, reklam, klipów wideo, projektowanie sal koncertowych, zasobów medialnych, sztukę mediów i wiele innych. Projektant ruchu jest zawsze wciśnięty w wąskie ramy czasowe procesu produkcyjnego, ale ma wystarczającą swobodę wypowiedzi.




Animacja komputerowa 30 sierpnia 1877 roku opatentowano urządzenie - praksynoskop Emile'a Raynauda.Animacja to proces nadawania możliwości poruszania się i/lub wyglądu życia przedmiotom i martwym ciałom. Prawdziwej rewolucji w świecie animacji dokonał WALT DISNEY (), amerykański reżyser, artysta i producent.


Animacja komputerowa Obecnie istnieje różne technologie tworzenie animacji: animacja klasyczna (tradycyjna); Animacja poklatkowa (lalkowa); Animacja Sprite'a; Morfowanie; Animacja kolorów; animacja 3D; Przechwytywanie ruchu.














Animacja komputerowa Motion Capture to pierwszy kierunek animacji, który pozwala na oddanie naturalnych, realistycznych ruchów w czasie rzeczywistym. Czujniki przyczepia się do żywego aktora w tych miejscach, z którymi zostanie on dostosowany punkty kontrolne model komputerowy do wprowadzania i digitalizacji ruchu. Współrzędne aktora i orientacja w przestrzeni przekazywane są do stacji graficznej, a modele animacji ożywają.


Kształcenie zawodowe Animator Animacji (od łacińskiego anima do animować) to ciekawy i fascynujący zawód, mający zastosowanie nie tylko w animacji, ale także w kinie, reklamie, produkcji gry komputerowe, środowisko medialne. Program kursu ma na celu przygotowanie specjalistów do pracy w dowolnym obszarze współczesnej branży animacji - klasycznej produkcji filmów animowanych, reklamie, grach komputerowych, kinie. Fragmenty kreskówki „Czerwony Kapturek”.
Wykształcenie zawodowe Wizualizacje architektoniczne Wizualizacja architektoniczna trójwymiarowa wyświetlacz graficzny obiekt lub grupa obiektów w architekturze, umożliwiająca najdokładniejsze odwzorowanie zewnętrznych i wewnętrznych cech przyszłej konstrukcji. Archviz jest aktywnie wykorzystywany przy demonstrowaniu projektów konkurencyjnych, tworzeniu prezentacji z zakresu projektowania i budowy, a także reklamy.
Tworzenie gier komputerowych Grafika do gier Grafika do gier to jedna z najmłodszych i najpopularniejszych specjalności w grafice. Do obowiązków artysty branży gier należy tworzenie postaci do gier, lokalizacji, rozwój wizualny gry, projektowanie poziomy gry i inne niesamowite zadania.

Projektowanie gier W branży gier komputerowych projektant gier jest jednocześnie reżyserem, scenarzystą i koordynatorem projektu. Nie tylko wymyśla wirtualne światy, ale także przewodzi grupie artystów i programistów, którzy pracują nad stworzeniem gry, przy której będą spędzać czas miliony ludzi.


Informacja:

Cele Lekcji:

  • Zainteresowanie studentów i ujawnienie perspektyw dalszego studiowania tematu na profilu technologia informacyjna;
  • Zapoznanie studentów ze sposobami tworzenia kreskówek;

Cele Lekcji:

Edukacyjny:

  • zapoznanie studentów ze sposobami tworzenia filmów animowanych;

Edukacyjny:

  • kultywować harmonijną percepcję u uczniów technologia komputerowa;
  • rozwijać zainteresowanie pracą twórczą i badawczą.

Edukacyjny:

  • rozwijać pomysły na temat zasad tworzenia kreskówki;
  • nauczyć się wykorzystywać zdobytą wiedzę w praktyce.

OSP i widoczność:

  • klasa informatyczna;
  • projektor multimedialny;

Wsparcie oprogramowania: Program Macromedia Flash MX.

Podczas zajęć:

Macromedia Flash MX udostępnia kilka sposobów tworzenia sekwencji animacji:

  • efekty animacji - program sam tworzy sekwencję klatek symulującą określony efekt w odniesieniu do określonego obiektu;
  • animacja klatka po klatce - użytkownik tworzy każdą klatkę przyszłej animacji;
  • automatyczna animacja typu tweed, czyli animacja transformacji - użytkownik określa klatkę początkową i końcową, a program sam tworzy klatki pośrednie w oparciu o interpolację programową.

Efekty animacji

Flash MX zawiera gotowe efekty animacji (efekty osi czasu), które umożliwiają tworzenie złożonych animacji w minimalnej liczbie kroków. Możesz skorzystać z funkcji Efekty osi czasu do następujących obiektów:

  • tekst;
  • obiekty graficzne, w tym kształty, obiekty zgrupowane i symbole graficzne;
  • obrazy rastrowe;
  • guziki.

Po dodaniu efektów animacji do obiektu Flash automatycznie tworzy odpowiednią warstwę i wszystkie niezbędne transformacje ruchu i kształtu ten efekt, są zaimplementowane w tej warstwie. Nowa warstwa automatycznie otrzymuje tę samą nazwę co efekt.

Jako przykład utwórzmy efekt „eksplozji” na tekście. Aby to zrobić, wpisz frazę lub słowo (rys. 1), zaznacz je za pomocą narzędzia Strzałka i wykonaj polecenie Wstaw → Efekty na osi czasu → Efekty → Rozbij.


Ryż. 1. Wybrany obiekt tekstowy

W rezultacie pojawi się panel o tej samej nazwie (rys. 2), umożliwiający konfigurację szeregu parametrów efektu.



Ryż. 2. Rozbij panel

Obecność okna podglądu pozwala analizować różne warianty efektów bez opuszczania panelu Eksplodować. Po wybraniu wymaganych opcji kliknij przycisk OK i otrzymasz coś takiego jak ta animacja.

Podobne efekty można zastosować do obrazu rastrowego. Rozważmy przykład płynnego zniknięcia obrazu rastrowego. Importowanie mapy bitowej do sceny za pomocą polecenia Plik → Importuj → Importuj na scenę(Rys. 3) i zastosuj efekt Rozmycia na polecenie Wstaw → Efekty osi czasu → Efekty → Rozmycie klip wideo .



Ryż. 3. Bitmapa zaimportowana do sceny

Aby edytować efekt animacji, wybierz obiekt powiązany z efektem na scenie i w wyświetlonym oknie Nieruchomości naciśnij przycisk Edytować(Rys. 4) - w rezultacie pojawi się panel Plama.



Ryż. 4. Przycisk Edytować znajduje się w dolnej części panelu

W panelu Plama możesz ponownie zmienić parametry efektu i zapisać nowe ustawienia (rys. 5).



Ryż. 5. Panel Plama umożliwia zmianę ustawień efektów

Animacja poklatkowa

Rozważmy najprostszy przykład- kartka papieru przemieszcza się z jednego punktu na ekranie do drugiego, obracając się wokół własnej osi.



Ryż. 6. Pierwsza klatka kluczowa animacji

Narysujmy na przykład liść klonu, jak pokazano na ryc. 6, - odpowiednia ramka na panelu Oś czasu zamieni się w szary kolor a wewnątrz niego pojawi się kropka wskazująca, że ​​jest to klatka kluczowa. Klatka kluczowa to klatka, w której umieszczana jest lub zmieniana treść.


Ryż. 7. Utwórz drugą klatkę, przeciągając i przekształcając pierwszą

Następnie kliknij kliknij prawym przyciskiem myszy najedź kursorem na sąsiednią klatkę i wstaw kolejną klatkę kluczową za pomocą polecenia Wstaw klatkę kluczową. W rezultacie w tej ramce pojawi się kopia liścia; przesuń go w dół (używając Narzędzie strzałka) i obróć za pomocą polecenia Modyfikuj → Przekształć → Swobodna transformacja(ryc. 7).

Powtórzmy procedurę, aby w 6. kadrze arkusz zajął swoje ostateczne położenie (ryc. 8).


Ryż. 8. Ostatnia klatka animacji

Zwróć uwagę na panel Nieruchomości(Rys. 8) - typ obiektu wskazany jest po lewej stronie. W każdej ramce liść jest obiektem typu Kształt(forma), inne typy obiektów zostaną omówione nieco później.

Aby wyeksportować film jako plik SEF (natywny format Macromedia dla filmów Flash), uruchom polecenie Plik → Eksportuj → Eksportuj film. W rezultacie otrzymujemy następujący film. Możesz obejrzeć powstały film bez opuszczania programu Flash za pomocą polecenia Sterowanie → Film testowy. Ponadto, aby zobaczyć, ile miejsca zajmują poszczególne klatki filmu, należy uruchomić polecenie. W rezultacie zobaczymy, że każda z sześciu klatek zajmuje około 600 KB (ryc. 9). Zatem rozmiar całego filmu wynosi 3686 bajtów.


Ryż. 9. Oglądanie filmu w Profiler przepustowości

Aby ocenić, czy to dużo, czy mało, zastanówmy się, jak można zrobić podobny film za pomocą animacji automatycznej lub animacji transformacji ruchu.

Automatyczna animacja


Ryż. 10. Obiekt automatycznie zamienia się w symbol graficzny

Przyjrzyjmy się, jak wykonać tę samą animację i uzyskać bardziej kompaktowy plik wynikowy. Wybierz narysowany liść na ekranie za pomocą narzędzia Strzałka i wykonaj polecenie Wstaw → Oś czasu → Utwórz animację ruchu w rezultacie ulotka zostanie umieszczona w ramce i w panelu Nieruchomości pojawi się komunikat, że wybrany obiekt ma właściwości Graficzny(ryc. 10). Oznacza to, że animowany obiekt jest automatycznie konwertowany na symbol graficzny. Teraz nie można już dowolnie edytować go za pomocą narzędzia Strzałka jako obiektu typu Kształt. Użycie symboli jest ważną koncepcją we Flashu. Po utworzeniu symbolu można go używać wielokrotnie w filmie bez zwiększania rozmiaru pliku wynikowego. Symbole dzielą się na symbole graficzne, symbole przycisków i symbole klipów filmowych. W ta lekcja Rozważmy symbol graficzny i wróćmy później do innych typów symboli. Każdy nowy symbol natychmiast staje się częścią biblioteki bieżącego dokumentu (ryc. 11).



Ryż. 11. Każdy nowy symbol staje się częścią biblioteki

Jeśli uruchomisz polecenie Okno → Biblioteka, możesz wtedy upewnić się, że symbol pojawił się w bibliotece i domyślnie ma przypisaną nazwę Tween 1. Aby nadać symbolowi inną nazwę wystarczy dwukrotnie kliknąć na nazwę i zastąpić ją żądaną. Po uformowaniu symbolu graficznego przejdźmy do ostatniej klatki naszej animacji (niech będzie to 15-ta klatka) i wstawmy klatkę kluczową (za pomocą polecenia Wstaw Klatka kluczowa). W tej ramce pojawi się kopia symbolu, którą będziemy przesuwać i obracać wokół własnej osi (za pomocą polecenia Modyfikuj Transformacja → Swobodna Transformacja), jak w poprzednim przykładzie. Jak widać z rys. 12 wszystkie klatki pomiędzy dwiema klatkami kluczowymi mają kolor niebieski, a strzałka rozciąga się od pierwszej do ostatniej klatki kluczowej, co wskazuje na utworzenie animacji Animacja ruchu.



Ryż. 12. Strzałka na niebieskim tle wskazuje utworzenie animacji

Animacja ruchu

Wykonując polecenie Sterowanie → Film testowy, otrzymujemy informację przedstawioną na ryc. 13.



Ryż. 13. Oglądanie filmu w trybie Bandwidth Profiler

Pomimo tego, że w tym przykładzie mamy 15, a nie sześć klatek jak w poprzednim, a animacja jest płynniejsza, rozmiar pliku wynikowego jest mniejszy - tylko 900 bajtów. Jak widać ze schematu (rys. 13), informacja o obiekcie przechowywana jest tylko w pierwszej klatce, a w każdej nowej ramce należy pamiętać jedynie o nowych pozycjach arkusza. Zajmuje to średnio tylko 20 bajtów.

Aby zilustrować opadanie arkusza wraz z obrotem wokół płaszczyzny arkusza powtarzamy poprzedni przykład, jedynie modyfikując ostatnią klatkę kluczową dodajemy polecenie Modyfikuj → Przekształć → Odwróć Poziomy. W rezultacie otrzymujemy następujący film.

Spójrzmy teraz na przykład, gdy liść zbliża się do widza. Aby to zrobić, zamiast tego w ostatniej klatce lustrzane odbicie (Odwróć w poziomie) zwiększymy rozmiar arkusza. Aby uniknąć uczucia spowolnienia, gdy obiekt zbliża się do widza, należy zwiększyć prędkość jego ruchu. Aby uzyskać taki efekt należy kliknąć na pierwszą klatkę i zapoznać się z sekcją Łatwość w panelu Nieruchomości. Dodatnie wartości parametru Łatwość powodują spowolnienie ruchu, natomiast wartości ujemne powodują przyspieszenie ruchu. Wybierzmy maksymalne przyspieszenie obiektu.



Ryż. 14. Wybierz maksymalne przyspieszenie obiektu Ease = –100

W tym celu należy ustawić wartość parametru Łatwość równy –100 (ryc. 14). Rezultatem jest film. Należy pamiętać, że pierwszą klatkę można także umieścić za sceną, wtedy otrzymamy film, w którym liść wleci w kadr i przesunie się w stronę widza. Można symulować obrót arkusza wokół przesuniętego środka symetrii. Mam nadzieję, że czytelnik sam będzie mógł poeksperymentować, utrudniając modyfikację ostatecznego kadru i tym samym zmieniając charakter ruchu arkusza.

Z przedstawionych przykładów widać, że automatyczna animacja ruchu jest skuteczna, gdy określono transformację obiektu w trakcie jego ruchu proste funkcje(obrót, skalowanie itp.). Jeśli konieczne jest animowanie skomplikowanych ruchów (na przykład ruchu ręki postaci z kreskówki), animacja transformacji ruchu nie ma zastosowania. Każdą klatkę trzeba narysować ręcznie, czyli stosuje się animację klatka po klatce, składającą się z zestawu klatek kluczowych. Zatem animacja klatka po klatce jest najbardziej wszechstronnym, ale jednocześnie najbardziej pracochłonnym rodzajem animacji, a ponadto tworzy najbardziej „ciężkie” pliki. Jeśli istnieje możliwość zastąpienia animacji klatka po klatce animacją automatyczną, jest to preferowane. Przyjrzyjmy się kilku przykładom, które pozwalają na wykorzystanie automatycznej animacji ruchu podczas symulacji lotu.

Ruch po zadanej trajektorii

Flash pozwala ustawić ruch obiektu wzdłuż zadaną trajektorię. Aby ustawić tę trajektorię, uruchom polecenie Wstaw → Oś czasu → Przewodnik po ruchu.

W efekcie koniec bieżąca warstwa pojawi się specjalna warstwa, który domyślnie będzie miał nazwę Przewodnik po warstwie 1.

Kliknijmy warstwę trajektorii i za pomocą narzędzia Ołówek narysuj linię, po której planujemy przesuwać arkusz (ryc. 15).



Ryż. 15. Przykład określenia trajektorii ruchu

Przejdźmy teraz do pierwszej klatki (kliknij ją myszką) i do panelu, który się pojawi Nieruchomości Sprawdź pudełko Pstryknąć(ustawia sposób powiązania z trajektorią ruchu) - rys. 16.


Ryż. 16. Parametr Pstryknąć ustawia tryb przyciągania do trajektorii ruchu

Po zaznaczeniu pola Pstryknąć, środek arkusza zrówna się z trajektorią ruchu. Za pomocą narzędzia Strzałka możesz przesuwać liść wzdłuż ścieżki ruchu, ale jeśli spróbujesz oderwać arkusz od ścieżki i położyć go obok, zostanie on odciągnięty i ponownie „przyklejony” do ścieżki ruchu (ryc. 17).


Ryż. 17. Obiekt wydaje się trzymać swoim środkiem tor ruchu

Przejdź do ostatniej klatki i w podobny sposób połącz liść z punkt końcowy trajektorie ruchu. Aby nadać filmowi objętość, dodaj transformację Odwróć w poziomie, - w rezultacie otrzymujemy film .

Kiedy arkusz porusza się po trajektorii, nie ma dla nas znaczenia, w jaki sposób zostanie obrócony w kierunku ruchu. Jeśli jednak w podobny sposób ustalimy tor lotu ptaka, to w niektórych fragmentach krzywej okazuje się, że ptak najpierw puszcza ogon.

Oczywiście, jeśli chcemy animować lot samolotu lub ptaka, to potrzebujemy, aby cały czas poruszał nosem do przodu. We Flashu ten rodzaj ruchu jest bardzo łatwy do ustawienia (ryc. 18).


Ryż. 18. Jeśli zaznaczysz to pole Orientuj się na ścieżkę, ptak poleci głową jako pierwszy

Wymagane pole wyboru Orientuj się na ścieżkę, a ruch ptaka zmieni się na całkiem normalny.



Ryż. 19. Dodanie jednokolorowego tła

Jeśli chcesz dodać gładkie tło, kliknij tło i w wyświetlonym panelu Nieruchomości(ryc. 19) w terenie Tło wybierz żądany kolor tła.

Jeśli chcemy dodać obraz tła, potrzebujemy do tego osobna warstwa. Zasadniczo, Program Flash oferuje możliwość stworzenia układu warstw podobnego do stosowanego w klasycznej animacji, w którym tło i różne poruszające się obiekty rysowane są każdy na własnej warstwie przezroczystej folii.

Przez umieszczenie zdjęcie w tle i każdy animowany obiekt na osobnej warstwie, znacznie łatwiej jest uzyskać nad nimi kontrolę. Aby więc dodać obraz tła, utwórzmy go Nowa warstwa. Aby to zrobić, kliknij prawym przyciskiem myszy warstwę pokazaną na ryc. 19 jest oznaczona jako warstwa 1 i z rozwijanego menu wybierz linię Wstaw warstwę. W dodanej warstwie narysuj słońce. Aby nie pomylić numerów warstw, nadajmy warstwie nazwę „tło”. W tym celu należy kliknąć na aktualną nazwę i wpisać wymagane imię(ryc. 20).



Ryż. 20. Na nowej warstwie utwórz nieruchomy obiekt tła

Jak widać z rys. 20, ptak jest za słońcem, co jest sprzeczne ze zdrowym rozsądkiem. Aby zamienić warstwy, po prostu użyj trybu przeciągnij i upuść i przeciągnij warstwę o nazwie „tło” w dół.

Edytujmy obiekty filmu (aby ptak krążył na tle słońca, zmienimy trajektorię jego lotu i zmienimy stosunek wielkości słońca i ptaka).



Ryż. 21. Aby animować chmurę, utwórz osobną warstwę

Dodajmy teraz do naszej animacji poruszające się obiekty, na przykład chmurę. W przypadku chmury utwórz nową warstwę i ustaw na niej animację transformacji ruchu. Aby chmura wleciała na scenę, ustawimy ją tak, jak pokazano na ryc. 21. W rezultacie otrzymujemy, co następuje

Autonomia Miejska instytucja edukacyjna dla dzieci

Włodzimierz

„Miejski Międzyszkolny Ośrodek Szkoleniowy nr 2”

Metodyczne opracowanie lekcji

w tym temacie " kreacjaGIF-y– animacja z wykorzystaniem edytorów graficznych»

Opracowany przez

nauczyciel przyuczenia do pracy

BICHURENKO Paweł Andriejewicz

Włodzimierz 2014

NOTATKA WYJAŚNIAJĄCA

Ten rozwój metodologiczny przeznaczony na 2 lekcje. Podczas zajęć sprawdzana jest wiedza na temat „obrazów rastrowych i wektorowych” zdobyta przez uczniów na poprzednich lekcjach. Jedna lekcja przeznaczona jest na wykonanie zadania praktycznego. Forma tej lekcji jest lekcją praktyczną.

Treść tego opracowania obejmuje badanie rodzajów animacji, ich zalet i wad oraz technologii tworzenia animacji. W trakcie zajęć studenci zdobywają umiejętności tworzenia obrazów i ich animacji przy użyciu edytorów graficznych, a także nabywają umiejętność konwersji obrazów wektorowych na rastrowe. Zdobytą wiedzę można zastosować przy projektowaniu interaktywnych prezentacji i stron internetowych.

LEKCJA NA TEMAT: KREACJAGIF-y– ANIMACJE Z WYKORZYSTANIEM EDYTORÓW GRAFICZNYCH

Cel:Rozwijanie umiejętności uczniów w zakresie tworzenia animacji GIF.

Zadania:

Edukacyjny: Pogłębienie wiedzy na temat metod tworzenia animacji i rodzajów animacji. Podaj pojęcie animacji.

Edukacyjny: Wychowanie kultura informacyjna uczniowie, uważność, dyscyplina, wytrwałość.

Rozwojowy: Rozwój zainteresowań poznawczych, zdolności twórczych, samodzielnej pracy i umiejętności robienia notatek.

Osobisty:

Okazywanie zainteresowania poznawczego procesem uczenia się;

Manifestacja emocjonalnego i opartego na wartościach podejścia do badanego tematu.

Metatemat:

Kognitywny:

Naucz się wykorzystywać zdobytą wiedzę w praktyce;

Naucz się podsumowywać otrzymane informacje;

Oceń swoje działania, oceń wyniki;

Znajdź odpowiedzi na pytania, korzystając ze swojego doświadczenia życiowego i informacji uzyskanych na zajęciach.

Przepisy:

Pracuj według planu zaproponowanego przez nauczyciela, po wypełnieniu zadania praktyczne;

Naucz się formułować pytanie, problem, trudność, z jaką spotykają się uczniowie.

Rozmowny:

Naucz się wyrażać swój punkt widzenia, formułuj oświadczenie;

Naucz się przedstawiać innym przebieg pracy i jej rezultaty, słuchaj opinii innych;

Aby omówić i uzasadnić swoje stanowisko, stosuj odpowiednie środki werbalne.

Temat:

Opanuj technologię tworzeniaGIF-y-animacja;

Zdobądź umiejętność tworzenia animacji;

Typ lekcji: nauka nowego materiału

Według formy organizacji: Lekcja warsztatowa.

Sprzęt:komputery osobiste, projektor, ekran, notatki z lekcji, mapy technologiczne, magazyn, oprogramowanie (Inkscape, Farba. INTERNET, UnFREEz).

Plan lekcji:

    Organizacja czasu;

    Aktualizowanie wiedzy;

    Wyznaczanie celów lekcji;

    Pracuj nad tematem lekcji;

    Praktyczna praca„Tworzenie animacji”;

    Badanie czołowe;

Podczas zajęć:

    Organizowanie czasu.

- Powitanie studentów.

Krótki opis tego, czego nauczysz się na lekcji.

2. Aktualizowanie wiedzy.

Jakie są rodzaje grafiki? (raster, wektor, fraktal, animacja, 3D).

Na czym opiera się konstrukcja obrazów graficznych rastrowych i wektorowych? (na pikselach - wiersze i kolumny; na elementach graficznych).

3. Ustalanie celów lekcji.

Co to jest animacja?

W jakich programach jest tworzony?

Dzisiaj na lekcji przyjrzymy się tworzeniu animacji za pomocą edytorów graficznych.

4. Pracuj nad tematem lekcji.

Użyj wersji demonstracyjnej animacji, aby ją pokazać różne przykłady animacje i ich tworzenie.

Animacja- to tworzenie iluzji ruchu obiektów na ekranie monitora. Wykorzystuje animację komputerową szybka zmiana ramki na ekranie monitora. Im więcej klatek zmienia się w ciągu jednej sekundy, tym płynniejszy jest ruch obiektu.

W czym programy komputerowe czy spotkałeś się z efektami animacji? (w prezentacjach komputerowych).

Jakiego rodzaju animacji użyłeś? (zmiana slajdów, umieszczanie obiektów na slajdach, efekty animacji przy pojawianiu się tekstu).

Zapisz definicję w zeszycieGIF-y-animacje.

Animacja GIF –to sekwencja grafiki rastrowej zapisana w jednym pliku w formacie.gif. Tworząc animację GIF, możesz ustawić wielkość opóźnienia dla każdej klatki; im jest mniejszy, tym lepsza jakość animacja. Można ustawić liczbę powtórzeń sekwencji klatek. Duża liczba klatek prowadzi do poprawy jakości animacji, ale jednocześnie zwiększa się rozmiar pliku GIF.

Innym rodzajem animacji jestbłysk-animacja.

Animacja Flashjest sekwencją rysunków wektorowych. Jego ogromną zaletą jest to, że nie trzeba rysować każdej klatki. Wystarczy narysować klatki kluczowe i ustawić rodzaj przejścia pomiędzy nimi, a edytor automatycznie zbuduje klatki pośrednie. Jeśli klatek jest dużo, animacja jest płynna, jeśli jest ich niewiele, to jest szybka. Dlatego możesz ustawić liczbę klatek pojawiających się na sekundę. Im ich więcej, tym lepsza jakość animacji. Inny punkt pozytywny Problem polega na tym, że pliki animacji Flash zajmują mało miejsca, dlatego są szeroko stosowane na stronach internetowych w Internecie.

5. Praca praktyczna „TworzenieGIF-y-animacja z wykorzystaniem edytorów graficznych” (Mapa technologiczna).

Najpierw demonstruję proces tworzenia animacji na ekranie, następnie uczniowie siadają przy swoich komputerach i wykonują zadanie. Jeśli pojawią się problemy, rozwiązujemy je indywidualnie.

6. Badanie czołowe.

    Co to jest piksel? Piksel– minimalny obszar obrazu, dla którego kolor jest niezależnie ustawiany.

    Jaka jest rozdzielczość obrazu rastrowego? RezolucjaObraz rastrowy jest określany na podstawie liczby pikseli w poziomie i pionie na jednostkę długości obrazu.

    Czym jest głębia kolorów? Nazywa się ilość informacji użytej do zakodowania obrazugłębia koloru.

    Wymień 3 palety kolorów w systemach oddawania barw? (RGB, CMYK, HSB). Które odwzorowanie kolorów jest najczęściej stosowane i gdzie? (RGB – do wyświetlania na monitorze)

    Co to jest obraz rastrowy? Obrazy rastroweutworzone są z kropek o różnych kolorach, które tworzą rzędy i kolumny.

    Co się stało Grafika wektorowa? Rysunki wektorowetworzone są z podstawowych obiektów graficznych, dla każdego z nich określone są współrzędne punktów odniesienia, wzory rysowania obiektu, a także kolor, grubość i styl linii jego konturu.

    Nazwij wektor i obrazy rastrowe. (Jkołek,gif, png, svg, wmfitp.)

    Podaj przykłady edytorów grafiki rastrowej i wektorowej (Farba. INTERNET, GIMP-ie, Photoshopie,Inkscape, CorelaRysowaćitd.).

    Jakie trzy podstawowe kolory tworzą obraz? (czerwony, zielony, niebieski)

    Podsumowanie lekcji. Odbicie.

Cieniowanie.

Pytania do refleksji:

Jakich zalet i wad animacji GIF nauczyłeś się na zajęciach?

Jakie trudności napotkałeś podczas konwersji? obraz wektorowy do rastra?

Czy znasz łatwiejszy sposób tworzenia animacji? Który?