Rysowanie we Flashu

Autor: Grzegorz Róg, dodano: 08-07-2009
Kategoria: Programowanie i tworzenie

Jeśli przyjrzysz się większości animacji Flash publikowanych w internecie dojdziesz zapewne do wniosku, że większość z nich została stworzona za pomocą prostych, nakładających się na siebie kształtów.

Zaletą przy tworzeniu takich animacji jest niewątpliwie dosyć łatwy i szybki sposób tworzenia poszczególnych elementów i etapów animacji, których w kilkuminutowym filmie jest bardzo dużo. Innym, bardziej pracochłonnym sposobem tworzenia rysunków we flashu jest odręczne rysowanie każdego kształtu, bez użycia narzędzi typu Rectangle Tool czy Oval Tool.

 

Doskonałą pomocą w tworzeniu tego typu rysunków jest tablet, jednak jeśli go nie masz, możesz także posługiwać się myszką, co zaowocuje mniejszą precyzją kreski, ale wcale nie oznacza to że wykonany w ten sposób obrazek czy animacja nie będzie równie ciekawa.

 

Przyjrzyj się statycznemu obrazkowi poniżej, którego nauczę Cię tworzyć w trakcie tej lekcji. Wkrótce przekonasz się że to znacznie łatwiejsze niż rysowanie na papierze, jednak radzę uzbroić się w cierpliwość, bowiem w tym przypadku kluczową sprawą do osiągnięcia zadowalającego efektu jest precyzja, skupienie, dokładność i dbałość o szczegóły.

 

Początkowo zapewne tworzenie tego typu obrazka zabierze Ci dużo czasu, stopniowo jednak stanie się to znacznie łatwiejsze i będziesz swoje rysunki tworzył dużo szybciej.

 

 

Wygląda nieźle, ale od czego zacząć? Warto zrobić sobie najpierw wstępny szkic na papierze, ale nie jest to konieczne, ważne jest ogólne wyobrażenie o tym, co chce się narysować Zacznijmy od piłki.

Najprostszą metodą, dopóki nie nabierzesz wprawy w sprawnym posługiwaniu się myszką czy tabletem, jest ją odrysować. Wystarczy więc poszukać odpowiedniego zdjęcia, a następnie zabrać się do rzeczy. Ja znalazłem coś takiego:

 

 

Zdjęcie umieść na niższej warstwie i zablokuj ją. W nowej warstwie, ponad warstwą ze zdjęciem będziesz rysował poszczególne elementy piłki. Zacznij od obrysowania krawędzi piłki. W tym celu posłuż się narzędziem Brush Tool (B), eksperymentuj z rozmiarami pędzla, kształt pozostaw okrągły, kolor wybierz szary.

 

 

 

Po obrysowaniu krawędzi, stwórz nową warstwę pod warstwą z krawędziami, będziesz w niej rysował wypełnienie. poszczególnych fragmentów piłki. W tym celu również użyj narzędzia Brush Tool, możesz eksperymentować z kolorami.

 

 

Gdy wypełnienie będzie już gotowe, zamknij warstwę i stwórz nową na samej górze hierarchii, zrobisz w niej cień. W tym celu wybierz narzędzie Oval Tool (O), ustaw brak koloru obramowania a w kolorze wypełnienia wybierz gradient.

 

 

Następnie w palecie Color Mixer ustaw właściwości gradientu. Kolory w gradiencie ustaw na biały i czarny, dla koloru białego wybierz jednak parametr Alpha 0%, tak jak to jest pokazane na screenie poniżej:

 

 

Dla koloru czarnego także ustaw Alpha na, powiedzmy, 50%, później będziesz mógł z tym eksperymentować. Teraz w nowej warstwie którą stworzyłeś narysuj koło przykrywające naszą piłkę.

 

W celu modyfikacji wielkości kształtu posłuż się narzędziem Free Transform, jeśli natomiast chcesz zmienić zakres krycia gradientu, wybierz narzędzie Paint Bucket Tool (K), następnie kliknij na kształcie i przytrzymując lewy klawisz myszy przeciągnij kursor w odpowiednim kierunku.

 

 

Doskonale, ostatnią rzeczą, która pozostała nam do zrobienia są błyski na piłce. Stwórz je w nowej warstwie na samej górze hierarchii. Błyski możesz narysować pędzlem lub stworzyć je z kształtów. Błyski to po prostu takie kształty:

 

 

Nasza piłka jest gotowa, aby nie przeszkadzała nam przy tworzeniu innych elementów, najlepiej będzie jak zamkniesz ją w obiekcie Graphic lub w Klipie.

 

Tak naprawdę, cala reszta elementów obecnych na scenie została stworzona w bardzo podobny sposób, w mniejszym lub większym stopniu korzystając z odręcznego rysowania, używałem także kształtów, tam gdzie wydawało mi się to lepszym rozwiązaniem.

 

Generalnie, trudniej jest precyzyjnie odręcznie narysować obiekty znajdujące się dalej w perspektywie, bowiem łatwo tu, rysując w powiększeniu, przesadzić z drobnymi elementami i detalami i sprawić że obiekt nie będzie dobrze się prezentował. Dlatego też np. rysując żaglówki posługiwałem się głównie kształtami.

 

 

Do stworzenia większości elementów jak fale, cienie na piasku, posługiwałem się gradientami, często nie rysując każdego z nich od nowa, ale powielając i odpowiednio przekształcając za pomocą Free Transform.

 

Myślę że poszczególne elementy tej grafiki nie wymagają dalszego dokładnego omówienia, jako że wszystko to, co zostało zrobione jest wynikiem powielania jednego z dwóch schematów, których Cię nauczyłem.

 

Dosyć trudne będzie na pewno rysowanie parasola, jednak jest to w zasadzie proces identyczny jak z piłką, wszystkie niezbędne elementy znajdują się na osobnych warstwach w załączonym do tej lekcji pliku .fla, tak więc radzę zaglądać do niego, w ten sposób wiele się nauczysz.

 

Poszczególne elementy parasola, a także leżak zamknąłem w osobnych obiektach dzięki czemu mogłem je potem w prosty sposób powielić, po prostu przemieszczając je z biblioteki na scenę i modyfikując za pomocą free transform.

 

 

Cień leżaka i parasola wykonałem oczywiście za pomocą narzędzia Brush Tool (B). Myślę, że po tej krótkiej lekcji umiesz już wystarczająco dużo, żeby stworzyć własny rysunek od podstaw. Jak zapewne zauważyłeś, rysowanie we Flashu jest zadziwiająco proste a stworzone rysunki są proste w edycji. Pamiętaj aby jak najwięcej elementów trzymać na osobnych warstwach, bowiem unikniesz w ten sposób kłopotliwego nakładania się na siebie obiektów.

 

Dobrze zorganizowany rysunek, z podziałem na odpowiednie elementy - obiekty typu Graphic lub Movie Clip, a także wewnętrznej strukturze wielowarstwowej będzie doskonałym punktem wyjścia do stworzenia Flashowej animacji. Pragnę na koniec przypomnieć Ci o najważniejszych rzeczach, które musi być podstawą przy tworzeniu rysunków - są nimi skupienie i cierpliwość.

 

Twoim największym wrogiem będzie natomiast niedbalstwo, tworzenie wszystkiego w tej samej warstwie, brak systematyzacji elementów, a także rozpraszanie uwagi. Jeden z największych animatorów naszej epoki, Milt Kahl, zwykł mawiać:

"Animation is concentration", wtórował m.in. Richard Williams, który w pierwszej lekcji swej doskonałej książki "The Animator's Survival Kit" (nawiasem mówiąc, gorąco polecam!), pisał: "Unplug! Take off your headphones! Turn off the radio, Switch off the CD! Turn off the tape! Close the door."

Grzegorz Róg

Grzesiek jest autorem Video Kursu Tworzenia Stron WWW we Flashu.

Ocena 2.67/5 (53.46%) (569 głosów)

Komentarze:

  • Porady
    Dodał: Gość data: 2009-10-26
    ja jestem w tym nowy i dopiero uczę sie robić animacji w tym programie i jakoś ( jak dla mnie) nie jest to do końca zrobumiałe. Lepiej by było opisane jak stworzyć tą 2 warstwe, jak schowac do tego liku itp. Ja narazie nauczyłem sie tego tworzenia błysku oraz przerysowania z obrazu. Robie wsztko na 1 warstwie ponieważ nie widze sensu robić następnych. Poradnik może być
  • porady
    Dodał: halotech_pl data: 2009-11-11
    No ok, dopóki robisz grafiki jednoelementowe, będzie ci łatwiej. Ale pamiętaj że w ten sposób nabierasz złych nawyków. Ucz się od razu robić na warstwach. Gdy dojdziesz do tworzenia bardziej skomplikowanych prac, docenisz tę prostą umiejętność :-)
  • porada
    Dodał: Gość data: 2009-12-22
    mam ten program na informatyce ale chciałbym miec w domy .Chce sie dowiedzieć jak na zywa sie ten program
  • Porada
    Dodał: Drakalen data: 2009-12-26
    Domyśl się rysujemy we flashu... Ja mam Marcomedia Flash 8.

    Dzięki za poradnik,
    Pozdrawiam

  • Dodał: Anhonime data: 2009-12-26
    A ja używam Adobe Flash CS4
    Swoją drogą ja już w wieku 12 lat potrafiłem robić proste animacje flash i może miałem pecha, ale w szkole nigdy nie miałem flasha :/ ani żadnego tworzenia stron php, flash, css wszystko sam... szczęście jak komuś się to trafi w szkole :P

  • Dodał: Gość data: 2010-01-02
    róbcie tylko na wielu warstwach, robienie na 1 warstwie zawsze predzej czy pozniej prowadzi do błedów i trzeba sie naklakac ctrl+z :P
  • Rysowanie
    Dodał: Gość przelotny data: 2010-11-04
    Czy wiesz może jak skryptowo wymazać fragment narysowanego skryptowo obrazka? Rysujemy metoda "Drawing Metod" ale czym i jak usuwać narysowane linie - fragmenty obrazka. AS 2.0 Flash 8 Pro


Dodaj komentarz:


Temat:
Twój nick:
Komentarz:
 

Prosimy o kulturę wypowiedzi. Komentarze zawierające niecenzuralne zwroty, bądź obrażające inne osoby będą usuwane. Kod HTML w wypowiedziach jest niedozwolony. Wydawca nie odpowiada za treść komentarzy.