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ż, we’re seeing the world of persona-based art pushed to the limits thanks to NFTs.
Today, we’re going to break through the limit and show you how to make your 3D avatars more exciting, more fun, oraz, hopefully, more viral usingPinata as the backbone for it all. Digital experiences today require the combination of multiple media files. An image is fun, but an image set to audio is an experience. A video with text overlay can change the entire feeling. 3D models are already made up of many different media files. Meshes, textures, shaders, and more. What if we could include animations and audio in one unified experience?
Let’s do exactly that!
Getting Started
You don’t need to know how to code to follow along with this tutorial (#TeamNoCode). But you will need some things to make it all work.
- PobieraćMikser. To jest bezpłatne, aplikacja komputerowa typu open source, która ułatwia pracę z plikami 3D i animacjami.
- Zarejestruj się naMixamo konto. Mixamo to produkt Adobe, który umożliwia tworzenie modeli 3D i animowanie ich.
- 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.
- 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. We want to delete the items under the collection in that scene. You can select them all, right-click, then choose Delete Hierarchy.
With those example items gone, we can now import our model. Click the File menu, then choose Import. Since I download the glTF format, that’s what I’ll be importing here.
With the model imported, we can experiment with the camera zoom, sizing, and lighting. You don’t have to, but I wanted to make sure the model looked good. Więc, I zoomed out, and I chose new lighting. This is what I see now:
This looks ready to export! We’re going to export the model in obj format very similar to how we imported it. In the File menu, click Export. Choose Wavefront (which is the obj file type):
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ćPinata 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
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!
Napisane przez Justina Huntera
https://medium.com/pinata/how-to-make-your-3d-nft-avatar-dance-to-music-38bcd1439cf4
