Avatar digital 3D cantando y bailando controlado por los usuarios
Haga clic en el botón redondo central CLICK ME para iniciar la música.
El avatar comenzará a reproducirse. 10 movimientos aleatorios.
• Puede probar con las teclas numéricas de 1 a 10 que encuentras alineado en el lado izquierdo del teclado (encima de las letras) para cambiar los movimientos de baile.
• Con el 4 flechas centrales en el teclado puedes cambiar la posición del avatar.
• Con el + y – tecla que se encuentra en el teclado numérico a la derecha del teclado, puedes acercar y alejar el avatar.
Disfrutar!
Cómo hacer que tu avatar 3D NFT baile con música?
Eres unmono aburrido? Tal vez eres uncriptopunk? No? Tal vez un poco másmeebit queGenio? Independientemente de tu gusto por los avatares de NFT, está claro que está surgiendo un nuevo mundo en torno al arte basado en la personalidad. Algunos de estos avatares ya son 3D y otros requieren la creatividad de una comunidad más amplia para darles vida en 3D.. No importa qué, aunque, estamos viendo el mundo del arte basado en personajes llevado al límite gracias a las NFT.
Hoy, vamos a romper el límite y mostrarte cómo hacer que tus avatares 3D sean más emocionantes, Más diversión, y, con un poco de suerte, uso más viralPiñata como la columna vertebral de todo. Las experiencias digitales actuales requieren la combinación de múltiples archivos multimedia. Una imagen es divertida, pero una imagen puesta en audio es una experiencia. Un video con superposición de texto puede cambiar todo el sentimiento. 3Los modelos D ya están formados por muchos archivos multimedia diferentes. mallas, texturas, sombreadores, y más. ¿Qué pasaría si pudiéramos incluir animaciones y audio en una experiencia unificada??
Hagamos exactamente eso!
Empezando
No necesita saber codificar para seguir este tutorial (#equipo sin código). Pero necesitarás algunas cosas para que todo funcione..
- DescargarLicuadora. es gratis, aplicación de escritorio de código abierto que facilita el trabajo con archivos y animaciones 3D.
- Regístrese para unMixamo cuenta. Mixamo es un producto de Adobe que te permite manipular modelos 3D y animarlos.
- Consíguete un avatar 3D NFT (esto puede ser costoso, así que siéntase libre de tomar un modelo de personaje de Mixamo o Sketchfab o cualquier otro mercado con licencias creative commons si lo prefiere). Voy a usar un recurso de Sketchfab.
- Regístrese para uncuenta piñata.
Independientemente de cómo obtenga finalmente su recurso 3D, deberá determinar cuál debe ser su próximo paso. Queremos manipular el modelo en Mixamo, pero para hacer eso, debemos asegurarnos de que el modelo 3D esté en el formato de archivo adecuado.
Por el bien de este tutorial, Voy a usar Sketchfab. Me aseguraré de descargar un modelo en un formato que deba convertirse para que pueda seguir el proceso..
Conseguir nuestro modelo
De nuevo, Usaré Sketchfab para esto, pero puede omitir esta sección si ya tiene un modelo que le gustaría usar. Sketchfab tiene una buena función de búsqueda, y hay un montón de modelos disponibles para descargar bajo licencias creative commons (solo asegúrese de atribuir al artista original).
Aquí está el enlace que estoy usando en mi búsqueda. Puede modificar esto para cualquier parámetro de búsqueda que desee. Los mejores modelos para esto son los que están en formato t-pose., pero cualquier modelo que sea humanoide y tenga sus extremidades libres del cuerpo (significado no unido a otros objetos y no, decir, en su bolsillo) Deberia trabajar.
encontré un robot que me gusta y mientras no sea en t-pose, me gusta como se ve, así que lo usaré para mi ejemplo.
Dado que Mixamo espera archivos obj y fbx, Me aseguraré de descargar este modelo en un formato que no espera para que podamos recorrer el proceso de conversión en Blender.. Hay un enlace de descarga en el modelo.. Voy a hacer clic en eso. Por supuesto, si desea omitir el paso de conversión, simplemente tome el formato fbx u obj y salte a la sección Mixamo.
Entonces, en el modal que aparece, Voy a descargar el formato glTF.
Eso se descargará a mi computadora en un archivo zip. Todo lo que necesito hacer ahora es descomprimirlo y abrir Blender.
Convertir archivos en Blender
Cuando abres Blender por primera vez, se creará una escena de ejemplo para usted. Queremos eliminar los elementos de la colección en esa escena.. Puedes seleccionarlos todos, botón derecho del ratón, luego elija Eliminar jerarquía.
Con esos elementos de ejemplo desaparecidos, ahora podemos importar nuestro modelo. Haga clic en el menú Archivo, luego elija Importar. Desde que descargué el formato glTF, eso es lo que estaré importando aquí.
Con el modelo importado, podemos experimentar con el zoom de la cámara, dimensionamiento, e iluminación. no tienes que hacerlo, pero quería asegurarme de que el modelo se viera bien. Entonces, me alejé, y elegí nueva iluminación. Esto es lo que veo ahora:
Esto parece listo para exportar! Vamos a exportar el modelo en formato obj muy similar a como lo importamos. En el menú Archivo, haga clic en Exportar. Elija frente de onda (cual es el tipo de archivo obj):
Asegúrese de guardarlo en algún lugar donde pueda encontrarlo fácilmente porque vamos a traer a este tipo a Mixamo en solo un segundo.. Cuando se realiza la exportación, en realidad obtendrás dos archivos: un archivo obj y un archivo mtl. El archivo mtl es el material que hace que nuestro modelo se vea bien. Para asegurarse de que el material se agregue a Mixamo, necesitamos seleccionar ambos archivos y comprimirlos.
Animación en Mixamo
Hemos tomado nuestro modelo 3D, usé Blender para convertirlo en un archivo que podamos usar en Mixamo, y ahora es el momento de agregar algo de animación.
Si aún no lo has hecho, Regístrese para obtener una cuenta enmezclame aqui. Una vez que te hayas registrado, deberías ver una pantalla como esta:
Puede o no tener un modelo que ya se muestra en la vista previa. De cualquier manera, vamos a reemplazarlo. Todo lo que necesita hacer es hacer clic en el botón Cargar personaje.
En el modal que se abre, podrá seleccionar un archivo de su computadora. Aquí es donde vamos a encontrar el archivo zip que creamos del modelo obj combinado y el archivo mtl. Deberá esperar a que se complete la carga y el procesamiento.
Cuando este hecho, será el momento de obtener una vista previa de su modelo y luego manipularlo. El rigging es simplemente el proceso de agregar juntas a su modelo que se pueden usar con fines de animación.. Mixamo tiene un sistema de rigging simple. Puede arrastrar los puntos a su modelo como se especifica. Si tu modelo no está en t-pose, entonces es probable que no sea simétrico. Si ese es el caso, desmarque la casilla de verificación Usar simetría en la parte inferior.
Cuando se completa este proceso, verás una vista previa de tu modelo con una animación básica. Esto debería demostrar que las cosas funcionan como se espera antes de hacer clic en Siguiente y puede agregar su propia animación..
Pero espera!
Antes de agregar una animación, necesitas sacar el modelo amañado de Mixamo. Hará clic en Descargar tan pronto como vea esta pantalla:
Aviso, no se seleccionan animaciones. Necesitamos el modelo amañado para que podamos agregarle la animación en Blender. Una vez que haya descargado el modelo amañado (en formato fbx), abrir un nuevo proyecto de Blender, haga clic en Archivo, luego haga clic en Importar. Elija fbx para su tipo de importación y encuentre el modelo que exportó de Mixamo.
Ahora, dejar la licuadora a un lado. Tenemos algo de animación que hacer en Mixamo.
En la parte superior de la página de Mixamo, asegúrese de tener marcada la pestaña Animaciones y haga clic en el cuadro de búsqueda en la esquina superior izquierda. Puede seleccionar cualquier tipo de animación disponible, pero voy a seleccionar Dance.
Seleccione una animación que le guste y se aplicará automáticamente a su modelo. Algunas animaciones se verán mejor que otras dependiendo de tu modelo. Así que elige el mejor para tu situación.. Porque mi modelo tiene brazos más largos que su cuerpo., Quería elegir una animación en la que los brazos permanecieran por encima de la cabeza tanto como fuera posible.. No quiero que esos brazos atraviesen el suelo.
Elegí una de las muchas animaciones de "Hip Hop Dancing":
Cuando seleccionas tu animación, lo verás aplicado inmediatamente a tu modelo. Muy genial! Ha pasado de un modelo 3D estático a un modelo 3D animado dinámicamente.
si te gusta la animacion, necesitarás exportarlo para que podamos traerlo a Blender.
Breve nota al margen sobre por qué tenemos que hacer las cosas de esta manera. Mixamo no le permite exportar el modelo completamente amañado y animado. Podemos exportar cada uno de estos por separado y luego combinarlos en Blender para el producto terminado..
Al igual que lo hiciste antes, haga clic en el botón Descargar en Mixamo. Esta vez, verás un conjunto diferente de opciones. Solo queremos la animación., así que elige la opción Sin piel:
Ahora que ha descargado tanto su animación como su modelo amañado, es hora de trabajar un poco en Blender.
Agregar animaciones en Blender
Previamente importó el modelo amañado a Blender. Ahora, necesitamos importar la animación. Haga clic en Archivo -> Importar. Elige fbx de nuevo, y luego seleccione el archivo de animación que descargó de Mixamo.
cuando lo haces, deberías ver una especie de esqueleto dentro de tu modelo.
esta es tu animacion. Todavía no hará mucho, pero lo arreglaremos. En el panel del lado derecho, haga clic en el modelo y cámbiele el nombre para facilitar las cosas. Acabo de cambiar el nombre del mío a "Robot".
Haz lo mismo para tu animación.. Luego expanda la animación y verá algo como esto:
Puede cambiar el nombre de ese "Armado" anidado.001|mixamo…” elemento a algo más fácil de recordar como “animación”.
Una vez que hayas hecho eso, querrás abrir la Hoja de Dope. Puede hacer esto cambiando su editor de panel lógico principal a Dope Sheet:
Con la hoja de drogas abierta, ahora tienes opciones adicionales. Vamos a cambiar al Editor de acciones.:
En el panel del lado derecho, haga clic en su modelo. Sabrás que está seleccionado cuando esté resaltado:
Next, de vuelta en el Editor de acciones, encuentre el menú desplegable de animación y cámbielo a su animación importada (recuerda que cambiaste el nombre de esto para que sea más fácil de encontrar):
Cuando seleccionas eso, deberías ver el cambio de pose de tu modelo. Eso significa que la animación se ha aplicado al modelo.. Podemos verificar esto saliendo de la hoja de dopaje y volviendo a la línea de tiempo..
cuando cambias, verás un botón de reproducción. haz clic en eso, y tu modelo ahora debería estar bailando como lo estaba en Mixamo!
Puede que la reproducción sea un poco lenta., pero no te preocupes, no es así como se verá cuando lo subamos a IPFS y lo reproduzcamos a través de nuestro IPFS Gateway 3D Viewer.
En realidad, ya no necesitamos la animación en nuestra ventana del editor de Blender, para que pueda hacer clic con el botón derecho en eso y luego elegir Eliminar jerarquía:
Te quedarás solo con tu modelo. Siéntete libre de guardar tu escena de Blender ahora. Cuando hayas hecho eso, lo último que tenemos que hacer en Blender es exportar nuestro modelo.
Vamos a exportar nuestro modelo en formato glTF. Haga clic en Archivo -> Exportar, luego haga clic en glFT. Asigne un nombre a su archivo y guárdelo en un lugar de fácil acceso.
Llevando su modelo al metaverso
Su modelo vino de (En un mundo perfecto) un NFT que compraste en una cadena de bloques. Deberíamos usar una tecnología similar para almacenar y mostrar nuestra nueva iteración animada de ese modelo..
vamos a usarPiñata para subir el modelo animado a IPFS. Vamos a crear una puerta de enlace dedicada para asegurarnos de que cualquier persona que vea nuestro modelo pueda acceder a él rápidamente y no tenga que esperar los lentos tiempos de carga de las puertas de enlace IPFS públicas.. Y vamos a usar un complemento que también se sirve a través de la puerta de enlace para mostrar nuestro modelo..
Como bono adicional, vamos a añadir algo de música de fondo. Cuando te hayas registrado en tu cuenta de Piñata, Continúe y actualice a un plan pago. Confía en mí, vale la pena. Este puede ser su hogar para alojar todo su contenido y distribuirlo de una manera que le pertenece por completo.. El plan comienza en solo $ 20 / mes.
Una vez que hayas hecho esto, ahora tendrá acceso para crear una puerta de enlace IPFS dedicada. Piense en esto como su propia plataforma de medios personal. Tenemos una gran guía sobre cómo configurar su puerta de enlace dedicada aquí:
Cómo configurar una puerta de enlace dedicada
Si desea marcar la puerta de enlace con su propio dominio personalizado, Tu también puedes hacer eso. Solo sigue esta guía:
Cómo configurar un dominio personalizado en su puerta de enlace
Una vez que hayas hecho esto, solo tiene unos pocos pasos más antes de que su avatar 3D NFT animado esté en vivo y listo para compartir. Dirígete a la página Pin Manager y sube el archivo glTF que exportaste de Blender.
Una vez que hayas hecho eso, es hora de encontrar algo de música para poner el baile a. No queremos infringir ningún derecho de autor., así que busquemos algo de música de dominio público.FreePD es un gran lugar para encontrar esta musica. Una vez que hayas encontrado la música que te gusta, Descargalo. Entonces, súbelo a tu cuenta de Piñata de la misma manera que subiste el modelo.
De acuerdo, así que has subido el modelo y has subido la música. Ahora, solo necesita usar un complemento que creamos para ayudar a mostrar modelos animados a través de una puerta de enlace IPFS. esto sera facil.
En la página del administrador de pines, haga clic en Cargar, luego elija CID:
Se le pedirá que proporcione un CID que esté en la red IPFS. Piñata encontrará el archivo asociado y lo anclará a su cuenta. Aquí está el CID para usar:
QmXypjaBUNuCAAt2eqEhNCGHq9B57eCZV6sqEEBYjFVefn
Dale un nombre que recordarás. Después de hacer esto, es posible que deba actualizar la página varias veces antes de que aparezca. Piñata lo encontrará en la red rápidamente porque este es un complemento oficial que construimos y fijamos.
Cuando el archivo aparece en su Pin Manager, haga clic en el nombre para abrirlo a través de su puerta de enlace. Notarás que carga con un error. Eso es porque no sabe qué modelo 3D cargar.
Arreglemos eso!
En la página que acabas de abrir, vaya al final de la URL y agregue lo siguiente:
?CID=THE_CID_FOR_YOUR_MODEL&audio=THE_CID_FOR_YOUR_MUSIC
Puedes obtenerTHE_CID_FOR_YOUR_MODEL
yTHE_CID_FOR_YOUR_MUSIC
desde tu administrador de pines. Haga clic en el botón copiar al lado de cada uno y agréguelo a la URL. Cuando lo haces y recargas la página, su modelo debería cargarse y escuchará la reproducción de música inmediatamente, o verá un botón de reproducción en la parte superior derecha. haz clic en eso, y tendrás un modelo 3D bailando con audio de fondo.
Aquí está mi robot:
Cargador 3D IPFS de piñata
glTF rápido y ligero 2.0 visor de escenas impulsado por el motor PlayCanvas WebGL y Pinata
La iluminación puede no ser perfecta., pero puede expandir la ventana de la izquierda y hacer ajustes a la iluminación y otras cosas.
Terminando
Esta es la prueba de la posible. Las NFT están cambiando la forma en que pensamos sobre las experiencias, y necesitamos tecnología para mantenernos al día, especialmente en Web3. Espero que a través de este tutorial hayas aprendido algunas formas novedosas de mejorar tus NFT., utilizar IPFS, y extienda lo que es posible gracias a puertas de enlace dedicadas y Pinata. Ahora, ponte a crear.
Feliz fijando y creando!
Escrito por Justin Hunter
https://medium.com/pinata/how-to-make-your-3d-nft-avatar-dance-to-music-38bcd1439cf4