3D Avatar che canta e balla controllato dagli utenti

Condividere

Avatar digitale 3D che canta e balla controllato dagli utenti

Fare clic sul pulsante rotondo centrale CLICCA SU 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 della danza.
• Con il 4 Con le frecce centrali della 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 al ritmo della musica?

Sei unScimmia annoiata? Forse sei unCryptoPunk? NO? Forse un po' di piùMeebit diGenio? Indipendentemente dal tuo gusto degli 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 infondere loro vita 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ù emozionanti, Più divertimento, E, fiduciosamente, utilizzo più viralePinata come la spina dorsale di tutto. Le esperienze digitali oggi richiedono la combinazione di più file multimediali. Un'immagine è divertente, ma un'immagine impostata sull'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'unica 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. ScaricamentoMiscelatore. È 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 manipolare modelli 3D e animarli.
  3. Procurati un avatar 3D NFT (questo può essere costoso, quindi sentiti libero di prendere semplicemente un modello di personaggio da Mixamo o Sketchfab o qualsiasi altro mercato con licenze Creative Commons, se preferisci). Utilizzerò una risorsa di Sketchfab.
  4. Iscriviti per unConto Pinata.

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

Per il bene di questo tutorial, Utilizzerò 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, Utilizzerò 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 moltissimi modelli disponibili per il download con licenze Creative Commons (assicurati solo di attribuire l'artista originale).

Ecco il collegamento che sto utilizzando 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 legato ad altri oggetti e non, Dire, in tasca) dovrebbe funzionare.

Ho trovato un robot che mi piace e anche se 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 non previsto in modo da poter seguire il processo di conversione in Blender. C'è un collegamento per il download sul modello. Farò semplicemente clic su quello. Ovviamente, se vuoi ignorare il passaggio di conversione, prendi semplicemente il formato fbx o obj e passa alla sezione Mixamo.

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

Questo 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 nella raccolta in quella scena. Puoi selezionarli tutti, fare clic con il pulsante destro del mouse, quindi scegli Elimina gerarchia.

Con quegli elementi di esempio scomparsi, 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 è necessario, ma volevo assicurarmi che il modello fosse bello. COSÌ, Ho rimpicciolito, e ho scelto una nuova illuminazione. Questo è quello che vedo adesso:

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 da qualche parte dove puoi trovarlo facilmente perché porteremo questo ragazzo in Mixamo tra un secondo. Al termine dell'esportazione, otterrai effettivamente due file: un file obj e un file mtl. Il file mtl è il materiale che rende gradevole 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 avere o meno un modello già mostrato nell'anteprima. In entrambi i casi, lo sostituiremo. Tutto quello che devi fare è fare clic sul pulsante Carica carattere.

Nella 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 truccarlo. 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 posa a T, allora probabilmente non è simmetrico. Se è il caso, deseleziona la casella di controllo Usa simmetria in basso.

Quando questo processo sarà completo, vedrai un'anteprima del tuo modello con un'animazione di base. Ciò dovrebbe dimostrare che le cose funzionano come previsto prima di fare clic su Avanti e aggiungere la propria 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. Una volta 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 alcune animazioni da fare a Mixamo.

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

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 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 l'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 da poterlo importare 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, fare clic sul pulsante Scarica 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 l'animazione che il modello truccato, è ora di lavorare un po' su 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 scaricato da Mixamo.

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

Questa è la tua animazione. Non servirà a molto per ora, ma lo sistemeremo. Nel pannello di destra, fare clic sul modello e rinominarlo 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”.

Dopo averlo fatto, ti consigliamo di aprire il foglio Dope. Puoi farlo cambiando l'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, di nuovo nell'editor delle 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 nella Timeline.

Quando cambi, vedrai un pulsante di riproduzione. Fare clic su quello, e il tuo modello ora dovrebbe ballare proprio come in Mixamo!

La riproduzione potrebbe essere un po' lenta, ma non preoccuparti, non è così che apparirà quando lo caricheremo su IPFS e lo riprodurremo tramite il nostro visualizzatore 3D IPFS Gateway.

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 e quindi scegliere Elimina gerarchia:

Ti verrà lasciato solo il tuo modello. Sentiti libero di salvare la scena di Blender adesso. 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

Da dove proviene il tuo modello (in un mondo perfetto) un NFT acquistato su una blockchain. Dovremmo utilizzare una tecnologia simile per archiviare e visualizzare la nostra nuova iterazione animata di quel modello.

UtilizzeremoPinata per caricare il modello animato su IPFS. Creeremo un gateway dedicato per garantire che chiunque visualizzi il nostro modello possa accedervi rapidamente e non debba attendere i tempi di caricamento lenti dei gateway IPFS pubblici. E utilizzeremo un plugin che viene servito anche 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 fatto questo, ora avrai accesso per creare un gateway IPFS dedicato. Pensa a questa come alla tua piattaforma multimediale personale. Abbiamo un'ottima guida sulla configurazione del tuo gateway dedicato qui:

Come configurare un gateway dedicato

Se desideri marchiare 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 fatto questo, mancano solo pochi passaggi prima che il tuo avatar animato 3D NFT sia live e pronto per essere condiviso. Vai alla pagina Pin Manager e carica il file glTF che hai esportato da Blender.

Dopo averlo fatto, è ora di trovare un po’ di musica su cui impostare la danza. Non vogliamo violare alcun diritto d'autore, quindi troviamo un po’ di musica di pubblico dominio.FreePD è un ottimo posto per trovare questa musica. Una volta che hai trovato la 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 visualizzare modelli animati tramite un gateway IPFS. Sarà facile.

Nella tua pagina Gestione Pin, fare clic su Carica, quindi scegli CID:

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

QmXypjaBUNuCAAt2eqEhNCGHq9B57eCZV6sqEEBYjFVefn

Dategli un nome che ricorderete. Dopo averlo fatto, 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 aggiunto.

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

Risolviamolo!

Nella pagina appena aperta, 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 Gestore Pin. Fai clic sul pulsante Copia accanto a ciascuno e aggiungilo all'URL. Quando lo fai, ricarica la pagina, il tuo modello dovrebbe caricarsi e sentirai immediatamente la riproduzione della musica, oppure vedrai un pulsante di riproduzione in alto a destra. Fare clic su quello, 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 basato sul 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 nel Web3. Spero che attraverso questo tutorial tu abbia imparato alcuni nuovi modi per migliorare i tuoi NFT, utilizzare IPFS, ed estendere ciò che è possibile grazie a gateway dedicati e Pinata. Ora, arrivare a creare.

Buon appuntamento 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


Condividere