3D Śpiew i taniec awatara kontrolowane przez użytkowników

Udział

Cyfrowy śpiew i taniec awatara 3D kontrolowany przez użytkowników

Kliknij środkowy okrągły przycisk KLIKNIJ MNIE, aby włączyć muzykę.
Awatar zacznie grać 10 przypadkowe ruchy.
• Możesz spróbować za pomocą klawiszy numerycznych z 1 do 10 które znajdziesz po lewej stronie klawiatury (nad literami) zmienić ruchy taneczne.
• Z 4 środkowymi strzałkami na klawiaturze możesz zmienić położenie awatara.
• Z + oraz – klawisz znajdujący się na klawiaturze numerycznej po prawej stronie klawiatury, możesz powiększać i pomniejszać awatar.

Cieszyć się! 💃


Jak sprawić, by Twój awatar 3D NFT tańczył do muzyki?

Czy jesteśZnudzona małpa? Może jesteśKryptoPunk? NIE? Może trochę więcejSpotkaj się niżDżin? Niezależnie od tego, jaki masz gust awatarów NFT, jasne jest, że wokół sztuki opartej na osobie wyłania się nowy świat. Niektóre z tych awatarów są już trójwymiarowe, inne wymagają kreatywności szerszej społeczności, aby tchnąć w nie trójwymiarowe życie. Nieważne co, chociaż, widzimy, jak świat sztuki opartej na osobach zostaje doprowadzony do granic dzięki NFT.

Dzisiaj, przełamiemy tę granicę i pokażemy, jak sprawić, by Twoje awatary 3D były bardziej ekscytujące, więcej zabawy, oraz, miejmy nadzieję, bardziej wirusowe użyciePiniata jako kręgosłup tego wszystkiego. Doświadczenia cyfrowe wymagają dziś połączenia wielu plików multimedialnych. Obraz to zabawa, ale obraz z dźwiękiem to przeżycie. Film z nakładką tekstową może zmienić całe wrażenie. 3Modele D składają się już z wielu różnych plików multimedialnych. Siatki, tekstury, shadery, i więcej. A co by było, gdybyśmy mogli uwzględnić animacje i dźwięk w jednym, ujednoliconym doświadczeniu?

Zróbmy dokładnie to!

Pierwsze kroki

Aby skorzystać z tego samouczka, nie musisz wiedzieć, jak kodować (#ZespółNoCode). Ale będziesz potrzebować kilku rzeczy, aby to wszystko zadziałało.

  1. PobieraćMikser. To jest bezpłatne, aplikacja komputerowa typu open source, która ułatwia pracę z plikami 3D i animacjami.
  2. Zarejestruj się naMixamo konto. Mixamo to produkt Adobe, który umożliwia tworzenie modeli 3D i animowanie ich.
  3. Zdobądź awatar 3D NFT (to może być drogie, więc jeśli wolisz, możesz po prostu pobrać model postaci z Mixamo, Sketchfab lub dowolnego innego rynku z licencją Creative Commons). Zamierzam użyć zasobu ze Sketchfab.
  4. Zarejestruj się naKonto Pinaty.

Niezależnie od tego, w jaki sposób ostatecznie uzyskasz zasób 3D, musisz określić, jaki powinien być Twój następny krok. Chcemy rigować model w Mixamo, ale żeby to zrobić, musimy się upewnić, że model 3D jest w odpowiednim formacie pliku.

Na potrzeby tego tutoriala, Będę korzystać ze Sketchfaba. Na pewno pobiorę model w formacie, który należy przekonwertować, aby można było śledzić proces.

Uzyskiwanie naszego modelu

Ponownie, Użyję do tego Sketchfaba, ale możesz pominąć tę sekcję, jeśli masz już model, którego chcesz użyć. Sketchfab ma fajną funkcję wyszukiwania, istnieje także wiele modeli dostępnych do pobrania na licencjach Creative Commons (pamiętaj tylko o podaniu oryginalnego artysty).

Oto link, którego używam podczas wyszukiwania. Możesz to zmienić dla dowolnych parametrów wyszukiwania. Najlepsze modele do tego to te w formacie t-pose, ale każdy model, który jest humanoidalny i ma kończyny wolne od ciała (co oznacza, że ​​nie jest przywiązany do innych obiektów i nie, mowić, w ich kieszeni) powinno działać.

Znalazłem robota które mi się podobają i choć nie jest w pozycji T, Podoba mi się sposób, w jaki to wygląda, więc użyję go w moim przykładzie.

Ponieważ Mixamo oczekuje plików obj i fbx, Postaram się pobrać ten model w formacie, którego się nie spodziewa, abyśmy mogli przejść przez proces konwersji w Blenderze. Na modelu znajduje się link do pobrania. Po prostu to kliknę. Oczywiście, jeśli chcesz ominąć etap konwersji, po prostu chwyć format fbx lub obj i przejdź do sekcji Mixamo.

Następnie, w wyskakującym oknie modalnym, Pobiorę format glTF.

Zostanie to pobrane na mój komputer w pliku ZIP. Wszystko, co muszę teraz zrobić, to rozpakować plik i otworzyć Blendera.

Konwersja plików w Blenderze

Kiedy po raz pierwszy otwierasz Blendera, zostanie dla Ciebie utworzona przykładowa scena. Chcemy usunąć elementy z kolekcji w tej scenie. Możesz wybrać je wszystkie, kliknij prawym przyciskiem myszy, następnie wybierz opcję Usuń hierarchię.

Po zniknięciu tych przykładowych przedmiotów, możemy teraz zaimportować nasz model. Kliknij menu Plik, następnie wybierz opcję Importuj. Ponieważ pobieram format glTF, to właśnie będę tutaj importować.

Z importowanym modelem, możemy poeksperymentować z zoomem aparatu, rozmiar, i oświetlenie. Nie musisz, ale chciałem się upewnić, że model wygląda dobrze. Więc, Pomniejszyłem, i wybrałem nowe oświetlenie. To jest to, co teraz widzę:

Wygląda na gotowy do eksportu! Wyeksportujemy model w formacie obj, bardzo podobnym do tego, w jaki go zaimportowaliśmy. W menu Plik, kliknij Eksportuj. Wybierz Wavefront (który jest typem pliku obj):

Pamiętaj, aby zapisać go w miejscu, w którym będziesz mógł go łatwo znaleźć, ponieważ za sekundę wprowadzimy tego gościa do Mixamo. Po zakończeniu eksportu, tak naprawdę otrzymasz dwa pliki: plik obj i plik mtl. Plik mtl to materiał, który sprawia, że ​​nasz model wygląda ładnie. Aby mieć pewność, że materiał zostanie dodany do Mixamo, musimy wybrać oba pliki i spakować je.

Animowanie w Mixamo

Wzięliśmy nasz model 3D, użyłem Blendera do konwersji go do pliku, którego możemy użyć w Mixamo, a teraz czas dodać animację.

Jeśli jeszcze tego nie zrobiłeś, załóż konto naMixamo tutaj. Po zarejestrowaniu się, powinieneś zobaczyć taki ekran:

Model może być już wyświetlany w podglądzie lub nie. Tak i tak, zastąpimy go. Wszystko, co musisz zrobić, to kliknąć przycisk Prześlij postać.

W modalu, który się otwiera, będziesz mógł wybrać plik ze swojego komputera. Tutaj znajdziemy plik ZIP, który utworzyliśmy z połączonego modelu obj i pliku mtl. Musisz poczekać na zakończenie przesyłania i zakończenie przetwarzania.

Kiedy to się skończy, nadejdzie czas, aby wyświetlić podgląd modelu, a następnie go zmontować. Olinowanie to po prostu proces dodawania połączeń do modelu, które można wykorzystać do celów animacji. Mixamo posiada prosty system olinowania. Możesz przeciągnąć punkty na swój model zgodnie z opisem. Jeśli Twój model nie jest w pozycji T, to prawdopodobnie nie jest symetryczny. Jeśli tak jest, odznacz pole wyboru Użyj symetrii na dole.

Kiedy ten proces się zakończy, zobaczysz podgląd swojego modelu z podstawową animacją. To powinno udowodnić, że wszystko działa zgodnie z oczekiwaniami, zanim klikniesz Dalej i będziesz mógł dodać własną animację.

Ale poczekaj!

Zanim dodasz animację, musisz pobrać sfałszowany model z Mixamo. Kliknij Pobierz, gdy tylko zobaczysz ten ekran:

Ogłoszenie, nie wybrano żadnych animacji. Potrzebujemy sfałszowanego modelu, abyśmy mogli dodać do niego animację w Blenderze. Po pobraniu sfałszowanego modelu (w formacie fbx), otwórz nowy projekt Blendera, kliknij Plik, następnie kliknij Importuj. Wybierz fbx jako typ importu i znajdź model wyeksportowany z Mixamo.

Teraz, odłóż Blendera na bok. Mamy trochę animacji do zrobienia w Mixamo.

Na górze strony Mixamo, upewnij się, że masz zaznaczoną kartę Animacje i kliknij pole wyszukiwania w lewym górnym rogu. Możesz wybrać dowolny dostępny typ animacji, ale wybiorę Dance.

Wybierz animację, która Ci się podoba, a zostanie ona automatycznie zastosowana do Twojego modelu. Niektóre animacje będą wyglądać lepiej niż inne, w zależności od modelu. Wybierz więc najlepszy w swojej sytuacji. Ponieważ mój model ma ramiona dłuższe niż jego tułów, Chciałem wybrać animację, w której ramiona pozostają jak najwyżej nad głową. Nie chcę, żeby te ramiona przechodziły przez podłogę.

Wybrałem jedną z wielu animacji „Hip Hop Dancing”.:

Po wybraniu animacji, zobaczysz, że zostanie natychmiast zastosowany do Twojego modelu. Całkiem fajne! Przeszedłeś od statycznego modelu 3D do dynamicznie animowanego modelu 3D.

Jeśli podoba Ci się animacja, musisz go wyeksportować, abyśmy mogli przenieść go do Blendera.

Krótka notatka na temat tego, dlaczego musimy robić rzeczy w ten sposób. Mixamo nie pozwala na eksport w pełni wyposażonego i animowanego modelu. Możemy wyeksportować każdy z nich osobno, a następnie połączyć je w Blenderze w celu uzyskania gotowego produktu.

Tak jak to zrobiłeś wcześniej, kliknij przycisk Pobierz w Mixamo. Tym razem, zobaczysz inny zestaw opcji. Chcemy tylko animacji, więc wybierz opcję Bez skóry:

Teraz, gdy masz już pobraną animację i sfałszowany model, czas popracować trochę w Blenderze.

Dodawanie animacji w Blenderze

Wcześniej zaimportowałeś sfałszowany model do Blendera. Teraz, musimy zaimportować animację. Kliknij Plik —> Import. Wybierz ponownie fbx, a następnie wybierz plik animacji pobrany z Mixamo.

Kiedy to zrobisz, wewnątrz modelu powinieneś zobaczyć coś w rodzaju szkieletu.

To jest twoja animacja. To jeszcze niewiele da, ale naprawimy to. W prawym panelu, kliknij model i zmień jego nazwę, aby było łatwiej. Właśnie zmieniłem nazwę na „Robot”.

Zrób to samo dla swojej animacji. Następnie rozwiń animację, a zobaczysz coś takiego:

Możesz zmienić nazwę zagnieżdżonego pliku „Armature.001|mixamo…” element czegoś łatwiejszego do zapamiętania, np. „animacja”.

Kiedy już to zrobisz, będziesz chciał otworzyć Arkusz Dope. Możesz to zrobić, przełączając główny edytor panelu logicznego na Dope Sheet:

Z otwartym arkuszem narkotyków, masz teraz dodatkowe opcje. Zamierzamy przejść do Edytora akcji:

W prawym panelu, kliknij swój model. Będziesz wiedzieć, że jest wybrany, gdy zostanie podświetlony:

Następny, ponownie w Edytorze akcji, znajdź menu animacji i zmień je na zaimportowaną animację (pamiętaj, że zmieniłeś nazwę, aby ułatwić znalezienie):

Kiedy to wybierzesz, powinieneś zobaczyć zmianę pozycji swojego modela. Oznacza to, że animacja została zastosowana do modelu. Możemy to zweryfikować, wychodząc z arkusza narkotyków i z powrotem na oś czasu.

Kiedy się przełączysz, zobaczysz przycisk odtwarzania. Kliknij to, a Twój model powinien teraz tańczyć tak samo, jak w Mixamo!

Może odtwarzać trochę wolno, ale nie martw się, nie tak to będzie wyglądać, gdy prześlemy go do IPFS i odtworzymy za pomocą naszej przeglądarki 3D IPFS Gateway.

Właściwie nie potrzebujemy już animacji w naszym oknie edytora Blendera, abyś mógł kliknąć to prawym przyciskiem myszy, a następnie wybrać Usuń hierarchię:

Zostanie Ci tylko Twój model. Możesz teraz zapisać swoją scenę Blendera. Kiedy to zrobiłeś, ostatnią rzeczą, którą musimy zrobić w Blenderze, jest eksport naszego modelu.

Zamierzamy wyeksportować nasz model w formacie glTF. Kliknij Plik —> Eksport, następnie kliknij glFT. Nadaj swojemu plikowi nazwę i zapisz go w łatwo dostępnym miejscu.

Przenieś swój model do Metaverse

Twój model pochodzi z (w idealnym świecie) NFT zakupiony na blockchainie. Powinniśmy użyć podobnej technologii do przechowywania i wyświetlania naszej nowej animowanej wersji tego modelu.

Będziemy korzystaćPiniata aby przesłać animowany model do IPFS. Zamierzamy stworzyć dedykowaną bramę, aby mieć pewność, że każdy przeglądający nasz model będzie miał do niego szybki dostęp i nie będzie musiał czekać na długi czas ładowania publicznych bram IPFS. Do wyświetlenia naszego modelu użyjemy wtyczki, która jest również obsługiwana przez bramę.

Jako dodatkowy bonus, Dodamy trochę muzyki w tle. Po zarejestrowaniu konta Pinata, śmiało i przejdź na plan płatny. Zaufaj mi, warto. Może to być Twój dom, w którym możesz przechowywać wszystkie swoje treści i dystrybuować je w sposób, który całkowicie Ci odpowiada. Plan zaczyna się od zaledwie 20 USD miesięcznie.

Gdy już to zrobisz, będziesz mieć teraz możliwość utworzenia dedykowanej bramy IPFS. Pomyśl o tym jak o swojej osobistej platformie medialnej. Mamy tutaj świetny przewodnik na temat konfigurowania dedykowanej bramy:

Jak skonfigurować dedykowaną bramę

Jeśli chcesz oznaczyć bramę własną domeną niestandardową, ty też możesz to zrobić. Postępuj zgodnie z tym przewodnikiem:

Jak skonfigurować domenę niestandardową w bramie

Gdy już to zrobisz, masz jeszcze tylko kilka kroków, zanim Twój animowany awatar 3D NFT będzie dostępny i gotowy do udostępnienia. Przejdź na stronę Pin Manager i prześlij plik glTF wyeksportowany z Blendera.

Kiedy już to zrobisz, czas znaleźć muzykę do tańca. Nie chcemy naruszać żadnych praw autorskich, więc znajdźmy muzykę należącą do domeny publicznej.BezpłatnyPD to świetne miejsce, aby znaleźć tę muzykę. Gdy już znajdziesz muzykę, która Ci się podoba, pobierz to. Następnie, prześlij go na swoje konto Pinata w ten sam sposób, w jaki przesłałeś model.

Ok, więc przesłałeś model i muzykę. Teraz, wystarczy skorzystać z wtyczki, którą stworzyliśmy, aby pomóc w wyświetlaniu animowanych modeli za pośrednictwem bramy IPFS. To będzie łatwe.

Na stronie Menedżera Pinów, kliknij Prześlij, następnie wybierz CID:

Zostaniesz poproszony o podanie identyfikatora CID znajdującego się w sieci IPFS. Pinata znajdzie powiązany plik i przypnie go do Twojego konta. Oto identyfikator CID, którego należy użyć:

QmXypjaBUNuCAAt2eqEhNCGHq9B57eCZV6sqEEBYjFVefn

Nadaj mu nazwę, którą zapamiętasz. Po tym jak to zrobisz, może być konieczne kilkakrotne odświeżenie strony, zanim się pojawi. Pinata szybko znajdzie ją w sieci, ponieważ jest to oficjalna wtyczka, którą zbudowaliśmy i przypięliśmy.

Gdy plik pojawi się w Menedżerze Pinów, kliknij nazwę, aby otworzyć ją za pośrednictwem bramy. Zauważysz, że ładuje się z błędem. Dzieje się tak, ponieważ nie wie, jaki model 3D załadować.

Naprawmy to!

Na stronie, którą właśnie otworzyłeś, przejdź na koniec adresu URL i dodaj następujący wpis:

?CID=THE_CID_FOR_YOUR_MODEL&audio=THE_CID_FOR_YOUR_MUSIC

Możesz dostaćTHE_CID_FOR_YOUR_MODEL orazTHE_CID_FOR_YOUR_MUSIC z Menedżera Pinów. Kliknij przycisk kopiowania obok każdego z nich i dodaj go do adresu URL. Kiedy to zrobisz i ponownie załaduj stronę, Twój model powinien się załadować i natychmiast usłyszysz muzykę, lub w prawym górnym rogu zobaczysz przycisk odtwarzania. Kliknij to, a będziesz mieć tańczący model 3D z dźwiękiem w tle.

Oto mój robot:

Program ładujący Pinata IPFS 3D

Szybki i lekki glTF 2.0 przeglądarka scen obsługiwana przez silnik PlayCanvas WebGL i Pinata

pinnie.mypinata.cloud

Oświetlenie może nie być idealne, ale możesz rozszerzyć okno po lewej stronie i dostosować oświetlenie i inne rzeczy.

Podsumowanie

To dowód na to, że jest to możliwe. NFT zmieniają sposób, w jaki myślimy o doświadczeniach, i potrzebujemy technologii, aby dotrzymać kroku, zwłaszcza w Web3. Mam nadzieję, że dzięki temu samouczkowi nauczyłeś się kilku nowatorskich sposobów na ulepszenie swoich NFT, użyj IPFS, i rozszerz możliwości dzięki dedykowanym bramkom i Pinacie. Teraz, zabrać się za tworzenie.

Miłego przypinania i tworzenia!


Nft

3D

Ipfs

Sketchfab

Mikser


Napisane przez Justina Huntera

https://medium.com/pinata/how-to-make-your-3d-nft-avatar-dance-to-music-38bcd1439cf4


Udział