Hoy tenemos un nuevo video de Spark AR muy especial. Usaremos un error hecho arte como son los glitch. Los glitch se popularizaron tremendamente hace algunos años y te mostraré como pasarlos cuando están en formato gif a sprite sheet; y además usaremos dos face tracker para mostrarlo. Siéntate cómodo, mira todo el video y pon en práctica lo aprendido que el video tutorial de Spark AR Gif to Sprite Sheet comienza ahora:
Tutorial
Abrimos nuestra herramienta Spark AR. Lo primero que debemos entender es que sprite sheet es una composición visual de animaciones hechas imágenes. Es como descomponer un gif o video en imágenes secuenciales, fotograma por fotograma. Por ello debemos agregar en assets, el elemento llamado animation sequence.
Si vamos a sus propiedades veremos que existe para incluir textura. Eso es lo que vamos hacer, pero más adelante. Lo que vamos hacer ahora es buscar un glitch interesante en google. Uuna vez encontrado lo descargaremos y usaremos esta herramienta https://ezgif.com/gif-to-sprite
Esta plataforma nos permite cambiar de formato glitch a sprite sheet de manera simple. Existen varias herramientas pero elegí esta por su simplicidad. Una vez que subas el archivo gif, debes hacer ajustes sobre todo en tamaño, pues para una mejor experiencia es optimizar el archivo a menos de 500kb.
Descargamos el archivo y lo guardamos como glitch sprite.jpg
Regresemos a Spark AR. Vamos a agregar un elemento necesario que sería el material. Le cambiamos de nombre a dicho elemento y luego mencionaremos que su textura es “el animation sequence” que creeamos al inicio. Por último, dentro de animation sequence agregaremos el archivo glitch sprite.jpg.
Si se dan cuenta aún no pasa nada. Obviamente es porque aun no uso un tracker que pueda conectar toda la experiencia que vamos trabajando. Por ello creamos un Face Tracker que es el elemento principal para nuestro rostro sea un marcador; y luego agregamos un face mesh.
Dentro de face mesh conectaremos el material que creamos anteriamente llamado glitch. Ahora por fin, se ve la experiencia.
¿Cómo hacer que mi filtro se vea en dos rostros?
Esto es realmente sencillo. Se deben incluir dos face trackers. En nuestro caso podemos duplicar el primer face tracker. Si se dan cuenta mi primer face tracker está designado como número 1. Por lo tanto, el otro face tracker lo mencionamos como numero 2.
Genial! Ahora sí está todo listo. ¿Qué te pareció el tutorial de Spark AR GIF to Sprite Sheet?
¿Te gustó mi contenido? Se ha realizado con mucho esfuerzo. Apóyame via patreon y podrás tener acceso exclusivo. No te arrepentirás, dejo los archivos del tutorial allí 😉
