3D Avatar che canta e balla controllato dagli utenti

Spargi l'amore

Avatar 3D digitale che canta e balla controllato dagli utenti

Fare clic sul pulsante rotondo centrale CLICCAMI per avviare la musica.
L'avatar inizierà a giocare 10 movimenti casuali.
• Puoi provare con i tasti numerici da 1 a 10 che trovi allineato sul lato sinistro della tastiera (sopra le lettere) per cambiare i movimenti di danza.
• Con il 4 frecce centrali sulla tastiera è possibile modificare la posizione dell'avatar.
• Con il + e – tasto che si trova sul tastierino numerico a destra della tastiera, puoi ingrandire e rimpicciolire l'avatar.

Godere! 💃


Come far ballare il tuo avatar 3D NFT con la musica?

Sei unScimmia annoiata? Forse sei unCriptoPunk? NO? Forse un po' di piùMeebit diGenio? Indipendentemente dal tuo gusto per gli avatar NFT, è chiaro che sta emergendo un nuovo mondo attorno all'arte basata sulla persona. Alcuni di questi avatar sono già in 3D e altri richiedono la creatività di una comunità più ampia per dar loro vita in 3D. Non importa cosa, Anche se, stiamo vedendo il mondo dell'arte basata sulla persona spinto ai limiti grazie agli NFT.

Oggi, supereremo il limite e ti mostreremo come rendere i tuoi avatar 3D più eccitanti, Più divertimento, E, fiduciosamente, utilizzo più viralePinata come spina dorsale di tutto. Le esperienze digitali oggi richiedono la combinazione di più file multimediali. Un'immagine è divertente, ma un'immagine impostata su audio è un'esperienza. Un video con sovrapposizione di testo può cambiare l'intera sensazione. 3I modelli D sono già costituiti da molti file multimediali diversi. Maglie, trame, shader, e altro ancora. E se potessimo includere animazioni e audio in un'esperienza unificata??

Facciamo esattamente questo!

Iniziare

Non è necessario sapere come programmare per seguire questo tutorial (#TeamNoCode). Ma avrai bisogno di alcune cose per far funzionare tutto.

  1. DownloadMiscelatore. È gratuito, applicazione desktop open source che semplifica il lavoro con file e animazioni 3D.
  2. Iscriviti per unMixamo account. Mixamo è un prodotto Adobe che ti consente di attrezzare modelli 3D e animarli.
  3. Procurati un avatar 3D NFT (questo può essere costoso, quindi sentiti libero di prendere un modello di personaggio da Mixamo o Sketchfab o qualsiasi altro mercato con licenza Creative Commons se preferisci). Utilizzerò una risorsa di Sketchfab.
  4. Iscriviti per unConto Pinata.

Indipendentemente da come alla fine ottieni la tua risorsa 3D, dovrai determinare quale dovrebbe essere il tuo prossimo passo. Vogliamo attrezzare il modello in Mixamo, ma per farlo, dobbiamo assicurarci che il modello 3D sia nel formato di file appropriato.

Per il bene di questo tutorial, Userò Sketchfab. Mi assicurerò di scaricare un modello in un formato che deve essere convertito in modo che tu possa seguire il processo.

Ottenere il nostro modello

Ancora, Userò Sketchfab per questo, ma puoi saltare questa sezione se hai già un modello che desideri utilizzare. Sketchfab ha una bella funzione di ricerca, e ci sono molti modelli disponibili per il download con licenze creative commons (assicurati solo di attribuire l'artista originale).

Ecco il link che sto usando nella mia ricerca. Puoi modificarlo per qualsiasi parametro di ricerca desideri. I migliori modelli per questo sono quelli nel formato t-pose, ma qualsiasi modello che sia umanoide e abbia gli arti liberi dal corpo (significato non attaccato ad altri oggetti e non, Dire, in tasca) dovrebbe funzionare.

Ho trovato un robot che mi piace e mentre non è in una posa a T, Mi piace il suo aspetto, quindi lo userò per il mio esempio.

Poiché Mixamo si aspetta file obj e fbx, Mi assicurerò di scaricare questo modello in un formato che non si aspetta in modo da poter seguire il processo di conversione in Blender. C'è un link per il download sul modello. Farò semplicemente clic su quello. Ovviamente, se vuoi saltare il passaggio di conversione, prendi il formato fbx o obj e passa alla sezione Mixamo.

Poi, nel modale che si apre, Scaricherò il formato glTF.

Verrà scaricato sul mio computer in un file zip. Tutto quello che devo fare ora è decomprimerlo e aprire Blender.

Conversione di file in Blender

Quando apri Blender per la prima volta, verrà creata una scena di esempio per te. Vogliamo eliminare gli elementi sotto la raccolta in quella scena. Puoi selezionarli tutti, fare clic con il pulsante destro del mouse, quindi scegliere Elimina gerarchia.

Con quegli elementi di esempio andati, ora possiamo importare il nostro modello. Fare clic sul menu File, quindi scegli Importa. Da quando ho scaricato il formato glTF, questo è ciò che importerò qui.

Con il modello importato, possiamo sperimentare con lo zoom della fotocamera, dimensionamento, e illuminazione. Non devi, ma volevo assicurarmi che il modello avesse un bell'aspetto. COSÌ, Ho rimpicciolito, e ho scelto una nuova illuminazione. Questo è quello che vedo ora:

Sembra pronto per l'esportazione! Esporteremo il modello in formato obj molto simile a come lo abbiamo importato. Nel menu File, fare clic su Esporta. Scegli Fronte d'onda (che è il tipo di file obj):

Assicurati di salvarlo in un posto dove puoi trovarlo facilmente perché porteremo questo ragazzo in Mixamo tra un secondo. Al termine dell'esportazione, in realtà otterrai due file: un file obj e un file mtl. Il file mtl è il materiale che rende bello il nostro modello. Per garantire che il materiale venga aggiunto a Mixamo, dobbiamo selezionare entrambi i file e comprimerli.

Animazione in Mixamo

Abbiamo preso il nostro modello 3D, usato Blender per convertirlo in un file che possiamo usare in Mixamo, e ora è il momento di aggiungere qualche animazione.

Se non l'hai già fatto, registrati per un account suMixamo qui. Una volta che ti sei registrato, dovresti vedere una schermata come questa:

Potresti o meno avere un modello mostrato già nell'anteprima. In entrambi i casi, lo sostituiremo. Tutto quello che devi fare è fare clic sul pulsante Carica personaggio.

Nel modale che si apre, sarai in grado di selezionare un file dal tuo computer. Qui è dove troveremo il file zip che abbiamo creato del modello obj combinato e del file mtl. Dovrai attendere il completamento del caricamento e il completamento dell'elaborazione.

Quando è finito, sarà il momento di visualizzare in anteprima il tuo modello e poi montarlo. Il rigging è semplicemente il processo di aggiunta di giunti al modello che possono essere utilizzati per scopi di animazione. Mixamo ha un semplice sistema di rigging. Puoi trascinare i punti sul tuo modello come specificato. Se il tuo modello non è in t-pose, allora probabilmente non è simmetrico. Se è il caso, deseleziona la casella di controllo Usa simmetria in basso.

Quando questo processo è completo, vedrai un'anteprima del tuo modello con un'animazione di base. Questo dovrebbe dimostrare che le cose stanno funzionando come previsto prima di fare clic su Avanti e puoi aggiungere la tua animazione.

Ma aspetta!

Prima di aggiungere un'animazione, devi estrarre il modello truccato da Mixamo. Farai clic su Scarica non appena vedrai questa schermata:

Avviso, nessuna animazione è selezionata. Abbiamo bisogno del modello truccato in modo da potervi aggiungere l'animazione in Blender. Dopo aver scaricato il modello truccato (in formato fbx), aprire un nuovo progetto Blender, fare clic su File, quindi fare clic su Importa. Scegli fbx per il tuo tipo di importazione e trova il modello che hai esportato da Mixamo.

Ora, metti da parte il frullatore. Abbiamo dell'animazione da fare in Mixamo.

Nella parte superiore della pagina Mixamo, assicurati di aver selezionato la scheda Animazioni e fai clic nella casella di ricerca in alto a sinistra. Puoi selezionare qualsiasi tipo di animazione disponibile, ma selezionerò Dance.

Seleziona un'animazione che ti piace e verrà automaticamente applicata al tuo modello. Alcune animazioni avranno un aspetto migliore di altre a seconda del modello. Quindi scegli quello migliore per la tua situazione. Perché il mio modello ha le braccia più lunghe del suo corpo, Volevo scegliere un'animazione in cui le braccia rimanessero il più possibile sopra la testa. Non voglio che quelle braccia attraversino il pavimento.

Ho scelto una delle tante animazioni "Hip Hop Dancing".:

Quando selezioni la tua animazione, lo vedrai applicato immediatamente al tuo modello. Abbastanza bello! Sei passato da un modello 3D statico a un modello 3D animato dinamicamente.

Se ti piace l'animazione, dovrai esportarlo in modo che possiamo portarlo in Blender.

Breve nota a margine sul perché dobbiamo fare le cose in questo modo. Mixamo non ti consente di esportare il modello completamente truccato e animato. Possiamo esportare ciascuno di questi separatamente e poi combinarli in Blender per il prodotto finito.

Proprio come hai fatto prima, fai clic sul pulsante Download in Mixamo. Questa volta, vedrai un diverso set di opzioni. Vogliamo solo l'animazione, quindi scegli l'opzione Senza pelle:

Ora che hai scaricato sia la tua animazione che il tuo modello truccato, è ora di fare un po' di lavoro in Blender.

Aggiunta di animazioni in Blender

Hai precedentemente importato il modello truccato in Blender. Ora, dobbiamo importare l'animazione. Fare clic su File -> Importare. Scegli di nuovo fbx, e quindi seleziona il file di animazione che hai scaricato da Mixamo.

Quando lo fai, dovresti vedere una sorta di scheletro all'interno del tuo modello.

Questa è la tua animazione. Non farà ancora molto, ma lo risolveremo. Nel pannello di destra, clicca sul modello e rinominalo per semplificare le cose. Ho appena rinominato il mio in "Robot".

Fai la stessa cosa per la tua animazione. Quindi espandi l'animazione e vedrai qualcosa di simile:

Puoi cambiare il nome di quel file "Armature.001|mixamo…” a qualcosa di più facile da ricordare come “animazione”.

Una volta che l'hai fatto, ti consigliamo di aprire il Dope Sheet. Puoi farlo cambiando il tuo editor del pannello logico principale in Dope Sheet:

Con il foglio della droga aperto, ora hai opzioni extra. Passeremo all'editor di azioni:

Nel pannello di destra, clicca sul tuo modello. Saprai che è selezionato quando è evidenziato:

Prossimo, nuovamente nell'editor di azioni, trova il menu a discesa dell'animazione e modificalo nell'animazione importata (ricorda che l'hai rinominato per renderlo più facile da trovare):

Quando lo selezioni, dovresti vedere la posa del tuo modello cambiare. Ciò significa che l'animazione è stata applicata al modello. Possiamo verificarlo uscendo dal Dope Sheet e tornando alla Timeline.

Quando cambi, vedrai un pulsante di riproduzione. Clicca qui, e il tuo modello ora dovrebbe ballare proprio come era in Mixamo!

La riproduzione potrebbe essere un po' lenta, ma non preoccuparti, non è così che apparirà quando lo carichiamo su IPFS e lo riproduciamo attraverso il nostro IPFS Gateway 3D Viewer.

In realtà non abbiamo più bisogno dell'animazione nella nostra finestra dell'editor di Blender, quindi puoi fare clic con il pulsante destro del mouse, quindi scegliere Elimina gerarchia:

Rimarrai solo con il tuo modello. Sentiti libero di salvare la tua scena Blender ora. Quando l'hai fatto, l'ultima cosa che dobbiamo fare in Blender è esportare il nostro modello.

Esporteremo il nostro modello in formato glTF. Fare clic su File -> Esportare, quindi fare clic su glFT. Dai un nome al tuo file e salvalo in un posto facilmente accessibile.

Portare il tuo modello nel metaverso

Il tuo modello è venuto da (in un mondo perfetto) un NFT che hai acquistato su una blockchain. Dovremmo utilizzare una tecnologia simile per archiviare e visualizzare la nostra nuova iterazione animata di quel modello.

UseremoPinata per caricare il modello animato su IPFS. Creeremo un gateway dedicato per assicurarci che chiunque visualizzi il nostro modello possa accedervi rapidamente e non debba attendere i lenti tempi di caricamento dei gateway IPFS pubblici. E useremo un plug-in che viene anche servito attraverso il gateway per visualizzare il nostro modello.

Come bonus aggiuntivo, aggiungeremo un po' di musica in sottofondo. Quando ti sei registrato per il tuo account Pinata, vai avanti e passa a un piano a pagamento. Fidati di me, ne vale la pena. Questa può essere la tua casa per ospitare tutti i tuoi contenuti e distribuirli in un modo che possiedi completamente. Il piano parte da soli $ 20 al mese.

Una volta che hai fatto questo, ora avrai accesso per creare un gateway IPFS dedicato. Pensa a questa come alla tua piattaforma multimediale personale. Abbiamo un'ottima guida su come configurare il tuo gateway dedicato qui:

Come configurare un gateway dedicato

Se desideri contrassegnare il gateway con il tuo dominio personalizzato, puoi farlo anche tu. Basta seguire questa guida:

Come impostare un dominio personalizzato sul tuo gateway

Una volta che hai fatto questo, hai ancora pochi passaggi prima che il tuo avatar 3D NFT animato sia attivo e pronto per essere condiviso. Vai alla pagina Pin Manager e carica il file glTF che hai esportato da Blender.

Una volta che l'hai fatto, è ora di trovare della musica su cui ballare. Non vogliamo violare alcun copyright, quindi troviamo della musica di dominio pubblico.FreePD è un ottimo posto per trovare questa musica. Una volta che hai trovato della musica che ti piace, scaricalo. Poi, caricalo sul tuo account Pinata nello stesso modo in cui hai caricato il modello.

Ok, quindi hai caricato il modello e hai caricato la musica. Ora, devi solo utilizzare un plug-in che abbiamo creato per aiutare a visualizzare modelli animati attraverso un gateway IPFS. Sarà facile.

Sulla tua pagina Pin Manager, fare clic su Carica, quindi scegli CID:

Ti verrà chiesto di fornire un CID che si trova sulla rete IPFS. Pinata troverà il file associato e lo aggiungerà al tuo account. Ecco il CID da utilizzare:

QmXypjaBUNuCAAt2eqEhNCGHq9B57eCZV6sqEEBYjFVefn

Dagli un nome che ricorderai. Dopo aver fatto questo, potrebbe essere necessario aggiornare la pagina alcune volte prima che venga visualizzata. Pinata lo troverà rapidamente sulla rete perché si tratta di un plug-in ufficiale che abbiamo creato e bloccato.

Quando il file viene visualizzato nel tuo Pin Manager, fai clic sul nome per aprirlo tramite il tuo gateway. Noterai che si carica con un errore. Questo perché non sa quale modello 3D caricare.

Risolviamolo!

Nella pagina che hai appena aperto, vai alla fine dell'URL e aggiungi quanto segue:

?CID=THE_CID_FOR_YOUR_MODEL&audio=THE_CID_FOR_YOUR_MUSIC

Puoi prendereTHE_CID_FOR_YOUR_MODEL ETHE_CID_FOR_YOUR_MUSIC dal tuo Pin Manager. Fai clic sul pulsante Copia accanto a ciascuno e aggiungilo all'URL. Quando lo fai e ricarica la pagina, il tuo modello dovrebbe essere caricato e sentirai immediatamente la riproduzione della musica, o vedrai un pulsante di riproduzione in alto a destra. Clicca qui, e avrai un modello 3D danzante con audio in sottofondo.

Ecco il mio robot:

Caricatore 3D Pinata IPFS

GLTF veloce e leggero 2.0 visualizzatore di scene alimentato dal motore PlayCanvas WebGL e Pinata

pinnie.mypinata.cloud

L'illuminazione potrebbe non essere perfetta, ma puoi espandere la finestra a sinistra e apportare modifiche all'illuminazione e ad altre cose.

Avvolgendo

Questa è la prova del possibile. Gli NFT stanno cambiando il modo in cui pensiamo alle esperienze, e abbiamo bisogno della tecnologia per stare al passo, soprattutto in Web3. Spero che attraverso questo tutorial tu abbia imparato alcuni nuovi modi per migliorare i tuoi NFT, usa IPFS, ed estendi ciò che è possibile grazie a gateway dedicati e Pinata. Ora, arrivare a creare.

Felice pinning e creazione!


Nft

3D

Ipfs

Sketchfab

Miscelatore


Scritto da Justin Hunter

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


Spargi l'amore