-
data publikacji: 08.12.2007
Kurs Flash cz.2 – pierwsze animacje / motion tween
kategoria: Flash, Tutoriale, Webmaster autor: palmiakWitam ponownie. dzisiaj zajmiemy się pierwszymi animacjami z użyciem Motion Tween Myślałem, ze dzisiaj zrobię jeszcze shape tween i maskowanie, ale jednak nie wyszło.
Motion Tween
-
Zacznijmy od utworzenia nowego dokumentu, size powiedzmy 500x500px, 25 klatek na sekundę.
-
narysujcie kwadrat bez konturu, zauważcie, że nasza klatka zmieniła zmieniła kolor na szary, a kropeczka jest czarna (pełna), to znaczy ze klatka jest teraz jako keyframe (czyli kluczowa - od niej zaczyna się animacja)
-
następnie kliknijcie myszką na kwadrat i naciśnijcie klawisz F8, z menu które wam się pokazało wybierzcie Movie Clip i nazwijcie animacje square_mc..
-
macie teraz pierwszą klatkę animacji, kliknijcie PPM (prawy przycisk myszy) na 15-tą klatkę na timeline i wybierzcie Convert to keyframe lub jak kto woli F6
powinniśmy mieć coś takiego
-
następnie zaznaczamy myszką calą nasza nieruchomą animację, klikamy PPM i wybieramy Create Motion Tween tak jak na obrazku

-
jeśli motion tween jest już "wbudowany" zobaczymy:

wszystkie klatki są jasno granatowe, tylko tutaj na obrazku tak dziwnie widać
jeśli zobaczycie coś takiego:

to znaczy że ma połączenia pomiędzy dwoma keyframe w motion tween, lub też nie ma po prostu końcowej keyframe
-
jeśli wszystko do tej pory jest okey, powinniście mieć coś takiego:

sprawdźcie czy klatki macie takie same. Aha, na każdym obrazku widzicie taki jasno-czerwony prostokącik z czerwona linia, mozecie go sobie chwycić myszką i ruszać w prawo, lub lewo w celu oglądnięcia animacji w polu roboczym "na surowo". Możecie również nacisnąć po prostu "enter" (play).
-
teraz kliknijcie na kwadrat w pierwszej klatce. Na dole uaktywni wam się w properties tabela "color"
ustawcie na przykład brightness na -100 albo alpha na 50%
-
teraz przejdźmy do ostatniej klatki (15) i kliknijmy na kwadrat, nasz squade_mc jest Movie Clipem, wiec możemy korzystać z zakładki Filters.

-
mamy tam teraz aktywny plusik, klikamy na niego i wybieramy jeden z filtrów, powiedzmy blur, ustawcie powiedzmy X - 100% / Y - 0% i quality na HIGH
-
już powinniśmy mieć nasza pierwsza animacje, kliknijcie "Ctrl + Enter" do podglądu. Tak to powinno wyglądać we Flashu:
-
nie wygląda ona zbyt ciekawie, pierwsze co rzuca się w oczy to to że się tak gwałtownie kończy. Zróbmy więc tak aby nasz kwadrat powracał do swojego pierwotnego kształtu.
-
klikamy PPM na pierwsza klatkę animacji, wybieramy Copy Frames, następnie klikamy PPM na 30 klatkę (powiedzmy 30-ta) i Paste Frames

odrazu powinno wam się połączyć Motion Tween, jeśli nie to zaznaczamy wszystkie szare klatki i wybieramy PPM Create Motion Tween. Powinniśmy mieć coś takiego:
Na dzisiaj koniec, zapraszam ponownie w sobotę/niedziele wieczorem
-
-
2 Responses to “Kurs Flash cz.2 – pierwsze animacje / motion tween”
Leave a Reply
Komentarze
Kategorie
Top 10
JaRo: Halu!?
Adi: Halu!?
rokicza: Menu akordeonowe z odrobiną CSS3
Marcin Lewandowski: Portfolio graficzne oparte o Wordpress przy użyciu Custom Fields
Agressiva: Portfolio graficzne oparte o Wordpress przy użyciu Custom Fields
Marcin: Portfolio graficzne oparte o Wordpress przy użyciu Custom Fields
rokicza: Menu akordeonowe z odrobiną CSS3
rokicza: Menu akordeonowe z odrobiną CSS3
Gerard: Tutorial na stronę domową
malachm: Adobe Kuler – wejdź w kulerowy świat
- CMSy Artykuły dotyczące różnego rodzaju systemów zarządzania treścią CMS.
- Flash Podstawowe informacje pomocne przy tworzeniu animacji w Adobe Flash.
- Fotografia Samouczki dotyczące nie tylko robienia zdjęć ale też ich cyfrowej obróbki.
- Grafika Ogólnie pojęta grafika komputerowa, od inspiracji, po tworzenie layoutów oraz mniejszych form graficznych.
- Inne tutoriale wordpressowe Wszystkie inne zagadnienia dotyczące WordPressa.
- Inspiracje Inspirujące materiały graficzne z dziedziny projektowania stron www, projektów DTP, digital painting, itp.
- Obróbka zdjęć Techniki retuszu fotografii cyfrowych.
- Rysunek Tworzenie rysowanych ilustracji w Adobe Photoshop.
- Skóry do Wordpressa Darmowe oraz płatne – najlepsze skóry do WordPressa.
- Skrypty client-side
- Skrypty server-side
- Tutoriale
- Webdesign Tutoriale z zakresu projektowania stron www i grafiki użytkowej na rzecz internetu.
- Wordpress Ulubieniec naszej publiczności CMS WordPress: nowości, tricki, wtyczki, skóry i wszystko to co może przydać się przy korzystaniu z tego systemu.
- Wtyczki do Wordpressa Recenzje oraz instrukcje najbardziej popularnych i najbardziej niezbędnych pluginów do WordPressa.
- XHTML/CSS Ciekawostki z dziedziny kodowania stron www: XHTML, CSS, jQuery.
- Grafika do strony salonu samochodowego
- Zastosowanie jQuery lightBox plugin
- Kurs Flash cz.1 - podstawy
- Galeria z powiększanymi miniaturami
- FadeIn, fadeOut, fadeTo - czyli o pojawianiu się i znikaniu
- Hover - kompletny poradnik
- Oryginalny blog na Wordpressie? Zrób go sam! cz.1
- Kurs Flash cz.2 - pierwsze animacje / motion tween
- Oryginalny blog na Wordpressie? Zrób go sam! cz.2
- Zastosowanie Ajax Navigation
Najnowsze newsy
Zapraszamy na forum graficzne Graffika.pl
Każda osoba interesująca się grafiką komputerową ma czasami ochotę porozmawiać o swoich pracach, posłuchać rad, krytyki i pochwał innych osób. Idealnym miejscem na realizowanie takich potrzeb jest forum graficzne Graffika.pl.
Czytaj dalej
Przypominamy o Konkursie Noworocznym
Wraz z nowym, 2010 rokiem ogłosiliśmy konkurs na tutorial o tematyce CMS-owej.
Mamy nadzieję, że jakieś prace zostaną nadesłane do końca terminu i znajdzie się zwycięzca w pierwszym naszym oficjalnym konkursie z nagrodami.
Zachęcamy wszystkich do spróbowania swoich sił.
Szczegóły dostępne są pod tym adresem: http://vivee.info/2010/01/01/konkurs-noworoczny/
Zareklamuj nas :)
Jako, że pojawiła się na vivee.info nowa skóra przygotowałam nasze firmowe banerki reklamowe. Osoby, które wyrażą chęć wsparcia nas reklamą u siebie na blogach lub innych serwisach mogą pobrać je poniżej. Czytaj dalej
Polecane strony
- WordPress Theme from Scratch – Day 1: PSD
- 20 Tutorials For Creating HDR Images
- Ask the Expert – Using Wordpress to Build Large Scale Websites with Derek Herman
- Making an Interactive Picture with jQuery
- Create a Horizontal Scrolling Website
- 800 Most Wanted Free RSS Icons for Bloggers
- 45 Most Wanted Beautiful Free Hand Drawn Fonts
- Caffe-Break Themed Blog Layout Photoshop Tutorial
- Create a nature inspired layout in photoshop
- Coding a Web Design for Speed and Quality
- Beautiful Hand Drawn Websites | Abduzeedo | Graphic Design Inspiration and Photoshop Tutorials
- 40 Fresh Creative and Inspiring Photographs
- Wordpress portfolio layout | Grafpedia
- Simple Facial Photo Retouching | Grafpedia
- Create a beauty layout in 10 steps | Grafpedia
























[...] Witam ponownie. dzisiaj zajmiemy się pierwszymi animacjami z użyciem Motion Tween Myślałem, ze dzisiaj zrobię jeszcze shape tween i maskowanie, ale jednak nie wyszło. (more…) [...]
Bardzo pomocny kurs.