Lekcja 2: Nasza druga gra, tym razem w 3D

Za nami pierwsza lekcja, która nauczyła cię podstaw. Jeżeli przeczytałeś ją w całości to gratulacje, wykonałeś pierwszy krok w twojej karierze twórcy gier. Jeśli nie wszystko zrozumiałeś, to nie martw się, to jest normalne na początku, z każdą lekcją będzie coraz łatwiej, a kiedy za jakiś czas wrócisz do pierwszej, wyda ci się banalna. Przed tobą jeszcze sporo nauki, jeżeli chcesz tworzyć interesujące gry, dlatego dziś kontynuujemy nasz kurs "Jak zrobić grę od zera".

Dzisiaj zrobimy sobie prostą grę platformową, która pozwoli ci poznać lepiej działanie edytora Unity oraz nauczy cię umiejętności, które potrzebne są przy tworzeniu praktycznie wszystkich gier. Dlatego skup się i do roboty!


Zaczynamy

Stwórz nowy projekt w Unity. Aby to zrobić uruchom edytor, a jeśli jest już uruchomiony, z menu File wybierz opcję New Project. Dalej postępujemy w sposób opisany w pierwszej lekcji, jeżeli nie pamiętasz jak się to robiło, to wróć do poprzedniej lekcji. Pamiętaj tylko, aby wybrać opcję 3D podczas tworzenia nowego projektu. Projekt możesz nazwać Gra Platformowa.

Zrobimy grę platformową, czyli taką, w której postać gracza skacze po platformach. Oczywiście my dopiero zaczynamy, więc wszystko będzie uproszczone, mimo to będzie można się przy tej grze pobawić.

Jak zwykle zaczynamy od zapisania sceny, na której będziemy układali obiekty. Klikamy File i wybieramy Save Project lub naciskamy CTRL + S. Wybieramy nazwę, na przykład Scena Glowna. W naszej grze będzie tylko jedna scena, ale w przyszłości stworzymy gry, korzystające z wielu scen.

Jeśli wszystko poszło dobrze, w panelu Hierarchy powinna pojawić się nowa nazwa sceny.


Pamiętajmy, że za każdym razem gdy dodajemy coś do sceny, powinniśmy scenę zapisać (tak jak zapisuje się plik w edytorze tekstu, gdy doda się do niego nowy tekst).

Nawigacja na scenie

Budowę świata zaczniemy od dodania bohatera, którym w naszej grze będzie kulka. Z menu GameObject na górze okna Unity, wybieramy opcję 3D Object i w kolejnym menu Sphere. Nasz edytor powinien wyglądać teraz tak:


W środkowym panelu pojawiła się kulka. Ten panel pokazuje nam podgląd sceny. W zasadzie są tutaj dwa panele, pomiędzy którymi możemy się przełączać, klikając w ich nazwy na górze:


Obecnie aktywny jest panel Scene, który pokazuje nam podgląd sceny. Będziemy go używali przez większość czasu, pozwala on na układanie i manipulowanie obiektami na scenie. Drugi panel Game, będzie włączał się automatycznie, kiedy uruchomimy grę. Jest to podgląd naszej gry, widzimy to samo co zobaczy gracz, po je uruchomieniu. W panelu Scene, możemy dowolnie się przemieszczać, zmiana pozycji w tym panelu nie wpłynie na to co zobaczy gracz w gotowej grze.

Skierujmy swój wzrok w lewy górny róg okna, tuż nad panel Hierarchy.


Znajduje się tu pięć przycisków, przydatnych w trakcie układania obiektów na scenie. Kliknij kolejno na każdy z nich i spójrz na naszą kulkę w panelu podglądu sceny. Przy kulce pojawiają się dziwne obiekty, zależnie od tego, który przycisk wybierzemy. Za chwilę je omówimy, skupmy się jednak najpierw na pierwszym przycisku od lewej (ikona dłoni). Kiedy go wciśniemy, dziwne elementy znikają z naszej kulki. To normalne, ponieważ nie są teraz potrzebne. Kiedy ten przycisk jest wciśnięty, znajdujemy się w trybie manipulacji widokiem podglądu sceny.

Skieruj kursor na zawartość panelu podglądu (na przykład na naszą kulkę), naciśnij lewy przycisk myszy i nie puszczając go zacznij przesuwać kursor w lewo i w prawo. Widok się przesuwa.

Teraz zrób to samo, ale naciśnij prawy przycisk myszy. Kursor powinien się teraz zmienić na obrazek czarnego oka. Zamiast przesuwać widok, tym razem go obracasz. Nadal trzymaj prawy przycisk, a lewą rękę połóż na przyciskach A, S, D, W, zupełnie jak robisz to grając w gry komputerowe. Możesz teraz przemieszczać się po scenie w takim sam sposób, jak robisz to grając w gry. ASDW odpowiada za poruszanie, a myszka za patrzenie i obracanie. Wszystko działa dopóki wciśnięty masz prawy przycisk myszy. Pamiętaj, że przed naciśnięciem klawisza, musisz skierować kursor na zawartość panelu z podglądem, inaczej klikniesz w inny panel i to co tutaj opisaliśmy, nie zadziała.


Manipulacja obiektami

Teraz klikamy w drugi przycisk. Zamiast klikać w przycisk, możesz nacisnąć na klawiaturze W. Pozostałe przyciski również mają swoje skróty, które łatwo zapamiętać, ponieważ odpowiadają jednemu rzędowi liter na klawiaturze: QWERT, wszystkie te pięć klawiszy, uruchamia kolejno każdy z pięciu przycisków.

Skupmy się, interesuje nas drugi przycisk. Wciśnijmy go i upewnijmy się, że w panelu Hierarchy, zaznaczony jest obiekt Sphere czyli nasza kula. Teraz podgląd sceny powinien wyglądać mniej więcej tak:


Jeżeli za daleko odleciałeś bawiąc się poprzednią opcją, to możesz bardzo łatwo wrócić do swojej kuli. Wystarczy zaznaczyć ją w panelu Hierarchy, nakierować kursor na podgląd sceny i wcisnąć przycisk F (od angielskiego słowa focus, czyli skupienie). Widok skupi się na zaznaczonym obiekcie. Jest to kolejny sposób na szybkie przemieszczanie się po scenie, wart zapamiętania.

Co to za kolorowe strzałki? Aby to wyjaśnić, musimy się cofnąć do szkoły podstawowej. Pamiętasz na pewno taki widok:


Jest to dwuwymiarowy układ współrzędnych. Wyobraź sobie czystą kartkę papieru, a na niej punkt. Aby określić położenie punkty na kartce, musimy mieć jakiś punkt odniesienia (czyli musimy mieć coś względem czego podamy położenie).

Zobaczmy to na przykładzie niezwiązanym z tworzeniem gier. Jeśli umówiłeś się ze znajomym i dzwonisz do niego bo nie przychodzi, a on pyta gdzie jesteś bo nie może cię znaleźć, to odpowiesz mu na przykład: stoję dwa metry od czerwonego Ferrari, po jego prawej stronie. W ten oto sposób czerwone Ferrari stało się punktem odniesienia dla twojej pozycji.

Kiedy opisujemy punkt leżący na białej kartce papieru, to naszym punktem odniesienia może być na przykład środek tej kartki. Możemy wtedy narysować dwie takie strzałki (osie), jak te widoczne na rysunku wyżej, a ich punkt przecięcia, będzie naszym puntem odniesienia. W ten sposób, środek kartki stał się punktem o współrzędnych (0, 0). Współrzędne często podaje się w nawisie, oddzielone przecinkiem, pierwsza liczba to odległość od środka na osi x, a druga to odległość od środka na osi y.

Teraz mogę już powiedzieć ci, gdzie znajduje się opisywany punkt, a ty powinieneś móc łatwo go znaleźć, otóż punktu szukaj w miejscu oznaczonym przez współrzędne (3, 7):


Proste. Pora przejść z przestrzeni dwuwymiarowej do trójwymiarowej. Zamiast dwóch osi, będziemy mieli trzy. Niestety na płaskim ekranie monitora, nie da się dobrze odwzorować trzech wymiarów, bo ekran jest dwuwymiarowy. Z tego powodu możemy na obrazku pokazać te trzy osie tylko z jednego ujęcia, na szczęście twój mózg jest przyzwyczajony do oglądania obrazów trójwymiarowych na płaskich ekranach i zrozumie jakie jest rzeczywiste położenie trzeciej osi w trójwymiarowej przestrzeni.


Teraz możemy opisać pozycję dowolnego punktu w trójwymiarowej przestrzeni, za pomocą trzech współrzędnych (x, y, z). Można powiedzieć, że x opisuje położenie w poziomie, y w pionie, a z mówi jak głęboko znajduje się punkt.

Każdy obiekt, jaki dodamy do sceny również posiada współrzędne, które określają jego położenie w trójwymiarowej przestrzeni. Kolorowe strzałki widoczne przy naszej kuli, skierowane są w te same strony, w które kierują osie x, y i z. Można powiedzieć, że jest to miniaturowy układ współrzędnych.

Możemy kliknąć lewym przyciskiem myszy na dowolną ze strzałek i przeciągnąć kursor, zmieniając tym samym pozycje naszej kuli w osi, wskazywanej przez klikniętą strzałkę. Strzałki służą zatem do przemieszczania obiektów na scenie. Pobaw się teraz i poprzemieszczaj kulę w różne miejsca. Nie przejmuj się w jakie, później zmienimy jej pozycję na właściwą.

Spróbuj kliknąć na strzałkę prawym przyciskiem myszy. Nie uda się, bo kursor zmienił się na ten, który już znasz (przemieszczanie klawiszami ASDW jak w grach). Okazuje się więc, że nie musimy mieć zaznaczonego pierwszego przycisku z listy, aby korzystać z tego trybu. Przy okazji spróbuj użyć rolki oraz środkowego przycisku myszy (jeżeli taki posiadasz), one również ułatwiają przemieszczanie po scenie (pamięta, aby kursor znajdował się w obrębie podglądu sceny, inaczej żadne podane tu klawisze ani skróty nie będą działać tak jak powinny).

Przejdźmy teraz do trzeciego przycisku (skrót klawiszowy E). Strzałki wokół naszej kuli zniknęły i zamieniły się w okręgi. Ich działanie jest analogiczne do strzałek, ale odpowiadają za obracanie obiektu. Pobaw się nimi (akurat obracanie białej kuli nie ma sensu, bo z każdej strony jest taka sama).

Kolejny przycisk odpowiada za zmianę skali. A ostatni, piąty, przydatny jest gdy robimy gry 2D i zajmiemy się nim w innej lekcji, teraz nie będziemy go używali.

Budujemy świat

Potrafisz już nawigować po scenie i manipulować obiektami, pora wykorzystać tą wiedzę i zbudować świat naszej gry.

Najpierw jednak przeniesiemy naszego bohatera (kulkę) na środek sceny, w miejsce, w którym będzie zaczynał grę. Zaznaczamy naszą kulę (o nazwie Sphere) w Hierarchy i kierujemy wzrok na prawo w kierunku panelu Inspector.


Możemy tutaj modyfikować te same rzeczy, które przed chwilę zmienialiśmy w podglądzie sceny (pozycję, rotację i skalę czyli rozmiar obiektu). Zmieńmy współrzędne z pola Positions na trzy zera. Kulka wróciła na środek sceny do punktu (0, 0, 0).

Zaczynamy od podłogi. Zrobimy ją z ogromnego, spłaszczonego sześcianu. W tym celu kierujemy się ponownie do górnego menu i wybieramy GameObject->3D Object->Cube. Do sceny został dodany sześcian, jest on też automatycznie zaznaczony. Zmień jego nazwę na Podloga (polskie znaki i spacje są tutaj dozwolone, unikajmy ich tylko w przypadku nazw skryptów, ja unikam ich wszędzie z przyzwyczajenia i lekkiej paranoi, ponieważ kiedyś stosowanie takich znaków w nazwach na przykład plików, wywoływało problemy).

Przechodzimy do panelu Inspector po prawej i modyfikujemy skalę naszej podłogi tak, aby była wielka i płaska. Zmieniamy też jej pozycję. Wszystko ustaw tak jak na obrazku poniżej.


Zmieniając skalę obiektu sprawiliśmy, że sześcian zamienił się w płaski prostopadłościan:


Nieźle, ale stać nas na więcej. Akcja naszej gry nie będzie się działa na Antarktydzie, dlatego ten biały kolor przydałoby się zmienić na coś bardziej przyjaznego.

I tak zrobimy. Moglibyśmy zmienić tylko kolor obiektu, ale jesteśmy bardziej ambitni, dlatego ustawimy również teksturę. Tekstura to nic innego jak płaski obraz, który zostaje nałożony na trójwymiarowy obiekt. Nie można jednak dodać tekstury bezpośrednio do obiektu, można ją dodać do tak zwanego materiału, a dopiero ten materiał dodaje się do obiektu.

Materiał to coś w rodzaju właściwości wizualnych obiektu, do którego go przypiszemy. Określa w jaki sposób światło rozchodzi się na obiekcie, jakie tekstury i kolory są do niego przypisane, może też określać inne rzeczy, o których powiemy sobie w kolejnych lekcjach.

Stwórzmy teraz nasz pierwszy materiał. Skieruj swoją uwagę w dolną część edytora do panelu Project. Po lewej stronie znajduje się przycisk Create, kliknij i z menu wybierz opcję Material. Utworzy się nowy plik z materiałem, zmień jego nazwę na Material1 (lub inną jeśli wolisz, spacje i polskie znaki są dozwolone).

Zanim przejdziemy do dalszego omawiania materiału, przypominam, że po dodaniu obiektu do sceny (czyli do panelu Hierarchy), należy ją zapisać. Jeżeli natomiast dodajemy coś do panelu Project, to wszystko jest zapisane automatycznie, ponieważ każdy element w tym panelu jest fizycznym plikiem na dysku. Podobnie wszelkie modyfikacje dokonywane na assetach z panelu Project, są automatycznie zapisywane, gdyż zawartość tego panelu nie należy do sceny, a do całego projektu (w Unity nie ma opcji zapisywania projektu, więc zmiany te muszą zapisywać się automatycznie).

Dobra, wracamy do materiałów. Kliknijmy na utworzony materiał w panelu Project, aby go zaznaczyć (chyba, że już jest zaznaczony). Teraz spójrzmy na prawo, do panelu Inspector.


Sporo tego co? W rzeczywistości nie ma się czego bać, zresztą na początku będziemy używali tylko ułamka widocznych tu opcji, resztę poznamy później. Grając w gry komputerowe na pewno słyszałeś o takich terminach jak shader, tekstura, bump mapping. Tuta właśnie ustawiamy te i kilka innych rzeczy. Nas dziś interesowała będzie główna tekstura. Ustawia się ją klikając na lewo od opcji Albedo.

Dlaczego do diabła nazywa się to albedo? Co to znaczy? Albedo po przetłumaczeniu na język polski, to nadal albedo. Słowo to oznacza stosunek ilości promieniowania odbitego do padającego. W świecie rzeczywistym, każdy przedmiot ma odmienne właściwości odbijania światła. Jedne odbijają je bardziej inne mniej. Niektóre odbijają równomiernie promieniowanie o różnych częstotliwościach (wtedy taki obiekt jest biały lub szary), inne odbijają nierównomiernie (np. odbijają tylko fale, które nasze oko widzi jako kolor czerwony, wtedy taki przedmiot jest przez nas postrzegany jako czerwony).

I tu dochodzimy do wyjaśnienia zagadki. Tekstura przechowuje informacje o tym, jak dany fragment obiektu odbija światło, dlatego ta opcja nosi nazwę Albedo. Nazwanie jej Tekstura, nie miałoby sensu, ponieważ w materiale jest jeszcze 7 parametrów, dla których można ustawić teksturę (ale tam nie będzie ona opisywała tego w jaki sposób materiał odbija światło, będzie opisywała coś innego, np. wypukłość w przypadku bump mappingu).

Jeśli czegoś nie rozumiesz, to nie zaprzątaj sobie tym teraz głowy. Chcę po prostu, żebyś miał ogólny pogląd na sprawę.

Mamy materiał i co teraz? Trzeba go dodać do sceny, ale podobnie jak w pierwszej lekcji nie mogliśmy dodać skryptu bezpośrednio do sceny, tak samo nie możemy dodać materiału. Musimy dodać go do jednego z obiektów na scenie. Dodajmy go do naszej podłogi. Z pierwszej lekcji powinieneś już wiedzieć jak to zrobić (możesz na przykład przeciągnąć materiał na obiekt).

Materiał po dodaniu do obiektu staje się jednym z jego komponentów. Zaznaczamy obiekt Podloga w panelu Hierarchy i przechodzimy na prawo, do panelu Inspector.


Klikając w czarny trójkącik po lewej stronie w komponencie Material1, możemy rozwinąć jego parametry (działa to zresztą tak samo we wszystkich komponentach). Na screenie widzisz więcej komponentów. Ich znaczenie poznamy w przyszłości, póki co tylko wyjaśnię. Box Collider odpowiada za to, że podłoga jest obiektem, przez który inny obiekt nie będzie mógł przeniknąć (bo zajdzie kolizja). Mesh Renderer to komponent odpowiedzialny za to, że nasz obiekt jest wyświetlany (renderowany) przez kartę graficzną.

Dodaliśmy materiał do obiektu i nic się nie zmieniło, nadal biało. Dlaczego? Ano dlatego, że dodany materiał też jest biały. Zanim ustawimy dla niego główną teksturę (parametr Albedo), spróbujmy zmienić jego kolor. Służy do tego specjalne pole widoczne na prawo od parametru Albedo we właściwościach materiału w panelu Inspector (jeśli go nie widzisz, to zaznacz albo materiał w panelu Project, albo obiekt Podloga w panelu Hierarchy).


Ja zmieniłem kolor na czerwony. Na scenie od razu zrobiło się ciekawiej.


Moglibyśmy na tym poprzestać, ale my chcemy dodać teksturę. Klikamy więc w kółeczko na lewo od opcji Albedo (we właściwościach materiału). Na liście, która się pojawi, zobaczysz kilka opcji, są to obrazki dostępne aktualnie dla twojego projektu. Ponieważ nie dodaliśmy żadnych obrazków, widocznych jest tylko kilka dodanych domyślnie przez twórców edytora Unity (głównie są to obrazki związane z graficznym interfejsem użytkownika). Obrazki te nie za bardzo nadają się, aby użyć ich jako albedo naszego obiektu. Spróbuj klikać po kolei na każdy z nich i zobacz jak słabo to wygląda na podglądzie.


Potrzebujemy prawdziwych tekstur. Tylko skąd je wziąć? Polecam ci stronę https://www.textures.com/, na której zaopatrzysz się w tekstury zupełnie za darmo (jest tam pewien limit ściąganych tekstur dziennie, ale trudno go przekroczyć). Trzeba założyć konto, ale jest ono darmowe i warto to zrobić. Spójrz tylko na to bogactwo kategorii:



Robi wrażenie prawda? Wybierz sobie dowolną teksturę z tej strony i zapisz ją na dysku. Aby pojawiła się ona w naszym projekcie w edytorze Unity, musi znaleźć się w katalogu Assets naszego projektu. Możesz ją tam od razu zapisać albo zapisać gdzie indziej, a później przeciągnąć z katalogu systemowego do panelu Project w edytorze.

Zawsze kiedy wgrywasz coś do katalogu Assets, zostanie to wykryte przez Unity w momencie kiedy okno edytora stanie się ponownie aktywne.

Jeśli wszystko zrobiliśmy dobrze, nasza tekstura powinna pojawić się w panelu Project. Możemy ją w końcu ustawić jako Albedo naszego materiału.


Jeżeli teraz spojrzysz w okno podglądu, powinieneś zobaczyć oteksturowaną podłogę. Jest tylko jeden problem, jest ona czerwona. Powodem jest to, co zrobiliśmy wcześniej, czyli ustawienie koloru obok opcji Albedo. Przywróćmy biały kolor.


Wow, zaczyna to przypominać grę komputerową. Dokończymy ją już w następnej lekcji, a teraz mam dla ciebie zadanie domowe.

Korzystając z wiedzy jaką zdobyłeś w tej lekcji, dodaj do sceny jeszcze około 20 sześcianów, pozmieniaj ich skalę, rotację i pozycję. Stwórz kilka materiałów i przypisz je do tych obiektów (nie twórz 20 materiałów, niektóre obiekty mogą mieć ten sam materiał i różnić się tylko kształtem). Jeśli jakiś materiał przypiszesz do kilku obiektów, to każda zmiana parametru (np. tekstury lub koloru) w tym materiale, wpłynie na wygląd każdego z obiektów, do jakich jest przypisany.

Przydatna wskazówka: zamiast używać opcji Create za każdym razem, gdy chcesz stworzyć nowy obiekt, zaznacz już istniejący, kliknij na niego prawym przyciskiem myszy i wybierz opcję Duplicate. Dzięki temu utworzony zostanie nowy obiekt, identyczny z tym, który duplikowałeś i znajdujący się w tym samym miejscu. Wystarczy go teraz przesunąć, obrócić, przeskalować i ewentualnie zmienić jego materiał i nazwę. Podobnie klonować można materiały i wszystkie inne piki z panelu Project.

Poeksperymentuj, stwórz jakiś ciekawy świat, po którym nasza kulka będzie mogła sobie poskakać (pamiętaj, że będzie ona skakała na około trzykrotność swojej średnicy, układaj więc obiekty tak, aby mogła się na nie dostać). I najważniejsze: pamiętaj o zapisywaniu sceny CTRL + S!


Komentarze

  1. Odpowiedzi
    1. Nie znam dokładnej daty, postaram się jak najszybciej wrzucić.

      Usuń
    2. Super sprawa dzięki oby jak najszybciej

      Usuń
  2. W następnej lekcji najprawdopodobniej będzie system poruszania. Może mógłbyś zrobić kilka wariantów np. zwykłe poruszanie się w dowolnym kierunku albo tetrisowe przemieszczenie obiektu co X czasu w X kierunku

    OdpowiedzUsuń
    Odpowiedzi
    1. Dzięki za sugestię, ale tetrisowe poruszanie w żaden sposób tutaj nie pasuje, a dodanie go według mnie tylko niepotrzebnie namieszałoby w głowach czytających. Tetrisa zostawmy sobie na inną lekcję.

      Usuń
  3. Piszesz bardzo przyjemnym i przystępnym językiem, całokształt jest bardzo zachęcający do pracy. Zacząłem kilka dni temu poznawać Unity właśnie z Twoim poradnikiem. Mam nadzieję, że wkrótce pokaże się trzecia lekcja.


    Pozdrawiam.

    OdpowiedzUsuń

Prześlij komentarz

Popularne posty z tego bloga

Lekcja 1: Nasza pierwsza gra

Jak zrobić grę?