Kościujemy postać 2D w Unity

Opublikowano 10 stycznia 202024 stycznia 2020 przez Artur

Przygotowanie poletka

System operacyjny

Zadziała wszędzie gdzie działa Unity. Ponieważ mam znowu ostrą fazę na Linuksa to wszystkie zrzuty będą z Ubuntu 19.10. Na Windowsie będzie tak samo tylko mniej wygodnie, na Mac OS X będzie tak samo tylko drożej 🙂 Tu jest info o moim systemie:

Unity

Korzystam z Unity 2019.3.0f3. To co tu pokazuję będzie działało w każdej wersji Unity od 2018.1, jednak import warstw z pliku *.psb będzie działał (o ile dobrze pamiętam) dopiero od Unity 2019.3 i pakietu 2D Animation w wersji 3.0.0.

Pakiety

Instalujemy potrzebne pakiety. Wybieramy z menu Window->Package Manager i w otwartym okienku wybieramy do instalacji pakiety: 2D Animation i 2D PSD Importer. Pakiet 2D Common powinien sie zainstalować sam jako wymagany przez 2D Animation. Pakiet 2D IK zostawimy sobie na kolejny wpis 😉

Grafika

Potrzebujemy jakąś grafikę postaci do animacji. Mój Anatol jeszcze nie gotowy więc skorzystam z postaci kupionej za niecałe 12 złotych tutaj. W paczce dostajemy „rozczłonkowaną” postać, pliki Spritera, i kilka obrazków z klatkami animacji. Dziś będą nas interesowały tylko obrazki członków, jakkolwiek by to nie zabrzmiało 🙂

Musimy teraz obrazki poszczególnych części ciała zaimportować do programu graficznego, poustawiać i wyeksportować całość do pliku *.psb.

Najbardziej oczywista ścieżka to wczytać to wszystko do Photoshopa, poustawiać i zapisać do pliku *.psb. I tak zróbcie.

Ja jestem na Linuksie i nie mam Photoshopa – wybieram więc ścieżkę bardziej krętą i zarośniętą. Za to z lepszymi widokami 🙂

Uruchamiamy GIMPa. Wybieramy Plik -> Otwórz jako warstwy.... Wybieramy nasze pliki z częściami ciała i Otwórz. Dostajemy niewąski śmietnik:

Na szczęście jedna z warstw przedstawia poskładaną postać. Trzeba to wszystko teraz uporządkować – pozmieniać nazwy warstw, poprzesuwać je i poobracać.

Po chwili powinniśmy mieć coś w ten deseń:

Eksportujemy tak przygotowany plik z GIMPa jako caveman.psd.

Póki co GIMP nie obsługuje eksportu do formatu PSB więc musimy skorzystać z polecenia convert z pakietu ImageMagick.

Listing 1.

convert caveman.psd caveman.psb

To do roboty!

Import grafiki

Tak przygotowany plik wrzucamy do naszego projektu pod Unity. Opcje importu ustawiamy tak:

Texture Type na Sprite(2D and UI)

Sprite Mode na Multiple.

Zaznaczamy ptaszka przy Mosaic (powinien być domyślnie)

Zaznaczamy ptaszka przy Character Rig (też powinien być domyślnie)

Klikamy Apply i odpalamy Sprite Editor.

I znowu bałagan 🙂 Nie przejmujemy się nim i w lewym górnym rogu wybieramy Skinning Editor.

Od razu lepiej:

Ekstra – mamy zaimportowaną postać gotową do „kościowania”.

Dodawanie szkieletu

Root bone i od czego zacząć

Mam jeszcze przyzerowe doświadczenie z pakietem 2D Animation ale najlepiej mi się sprawdza ustawienie pierwszej kości na dole między nogami postaci. To nasza kość główna – „root bone”.

W sekcji Bones klikamy na Create bone i „rysujemy” pierwszą kość między nogami postaci. Domyślnie Unity zacznie rysować nową kość od końca poprzedniej. Możemy to anulować prawym przyciskiem myszki i zacząć w dowolnym miejscu.

Dodajemy bioderka, tłów, głowę. Potem prawy przycisk myszki żeby się „odpiąć”. Potem lewym możemy wybrać kość od której chcemy zacząć kolejną. I tak dalej, dalej. Generalnie to chyba nie ma co tłumaczyć – trzeba poklikać i to poczuć.

Klikamy, klikamy i uzyskujemy coś takiego:

Przy okazji warto nadać kościom jakieś nazwy – żeby się potem niepotrzebnie nie motać.

Ok, mamy narysowany szkielet. Teraz ten szkielet musimy „przypiąć” do naszej postaci.

Geometria

Klikamy Auto Geometry w sekcji Geometry. Po prawej na dole pokaże się okienko z parametrami. Możemy tam ustalić dokładność naszej geometrii – ale na początku radziłbym po prostu kliknąć Generate For All Visible z domyślnymi parametrami. To wygeneruje siatkę na naszych spritach – punkty siatki pozwolą nam potem ustalić która kość wpływa na który fragment obrazka.

W sekcji Geometry mamy narzędzia pozwalajace zmodyfikować wygenerowaną siatkę – dodać punkty i linie, a także podzielić linię.

Wagi

Waga to paramter który określa jak bardzo dana kość wpływa na dany fragment naszej siatki. Ona określa jak bardzo wygnie się np. tłów przy poruszaniu głową.

Na początku kliknijmy Auto Weights w sekcji Weights i po lewj na dole Generate All.

I w sumie z grubsza to już 😉 Możemy teraz złapać i przesunąć dowolną kość i zobaczyć jak odkształca się nasza postać.

Raczej nie będzie ślicznie ale będzie solidna baza do dalszej pracy.

Teraz to już tylko kwestia poświęconego czasu. Podwójnym kliknięciem wybieramy poszczególne części ciała i ustawiamy. Mamy do dyspozycji Weight Slider gdzie możemy suwaczkiem ustawić jak bardzo poszczególne kości wpływają na wybranego sprita. Jednak najwygodniejsze chyba będzie skorzystanie z Weight Brush. Wybieramy sprita i kość a potem „malujemy” po siatce i określamy jak bardzo dana kość na nią wpływa. Tu możemy sobie obrócić kość i potem malować żle odkształconą siatkę aż będzie dobra.

W każdym momencie możemy na górze kliknąć Reset pose żeby ustawić kości w pozycji początkowej.

Po dłużej chwili powinniśmy mieć działającą postać:

Aaa, jeżeli coś poplączecie z zależnościami rodzic-dziecko w szkielecie to klikamy u góry po prawej na „Visibility”.

Pokaże się okienko w którym możemy przeciągać kości i tak zmieniać zależności między nimi.

Animacja

I już. Mamy to!

Klikamy w prawym górnym rogu na Apply i zamykamy okno Sprite Editor.

Teraz to już normalnie: dodajemy Animację, ustawiamy kości, dodajemy klucze, ustawiamy kości, dodajemy klucze i tak w kółko aż będziemy zadowoleni.

U mnie działa:

W kolejnej części pokazuję jak skonfigurować odwrotną kinematykę.