¿Cómo darle movimiento al filtro?

Clase 6 de 24 • Curso de Creación de Filtros 3D para Instagram con Spark AR

Moisés Eduardo Gómez Perez

student•

Si les pasa como a mi que pareciera que hace dos efectos diferentes solo hagan un refresh en el Spark (con el boton que esta dos espacios abajo de la pausa en el panel de lado izquierdo) para que la animacion se sincronice y salga como la del profe!

Don Froy

teacher•

En efecto, a veces Spark AR como que se quedá en un estado de caché viejo, y si... el refresh ayuda en lo que mencionas. Gracias por la observación.

Alejandro Ramos

student•

Añadir movimiento a los lentes

Abrimos Patch Editor (Editor de Parches)
Añadimos la rotación del objeto 3D al Patch Editor
Añadimos la animación → Loop Animation
Añadimos la animación → Transition (En Vector 3)
Unimos la salida de Progress con la entrada del mismo nombre del Loop Animation con Transition
Copio la rotación final del objeto 3D y lo pego en el End del Transition
Agrego el valor de Start de Transition
Activo la casilla de Mirrored del Loop Animation
Seleccionando el elemento que contiene todo el objeto 3D, voy a Transformations y agrego el Position al Patch Editor
Agrego un Loop Animation y un Transition, conecto y configuro de la misma manera que los anteriores bloques

Natalia Prada Gaitán

student•

Buenos apuntes XD

Emmanuel Jose Lamprea Florez

student•

Spark AR tiene un cuenta gotas para que puedan seleccionar el color de cada gafa y obtener el tono mas parecido al de la imagen, lo encuentran cuando le dan al cuadro de color que vimos, en la parte de abajo en el recuadro emergente (color picker).

Don Froy

teacher•

Increíble aporte Emmanuel.

Daniel Aguilar

student•

Movimiento correcto lentes.

Yhanka Ortiz

student•

yo igual

Laura Alejandra Díaz Sastoque

student•

Hola! Tengo un problema en la rotación de las gafas. Ya he hecho el ejercicio desde 0 y me sigue sucediendo. En blender al rotar las gafas sí queda perfecto:

Sin embargo, al hacer todo el procedimiento en Spark AR en el momento de la rotación sucede esto:

En la foto se ven las gafas sin material aún por lo que volví a hacer el ejercicio y quería verificar si la rotación ya estaba bien, pero no es así. ¿Qué podría hacer para solucionarlo?

Don Froy

teacher•

Hola Laura, podrías probar creando un nulo desde el Inspector. El nullo es un grupo vacío con un pivote propio; es decir podrías tener un nuevo punto de giro y aplicar todos los efectos a este. Mi consejo sería. Abre una escena limpia de Spark AR e importa las gafas, añade un nullo y ahora usa a este nullo como el pivote para hacer el giro. Una vez que entiendas el concepto aplica eso a tu filtro general. https://sparkar.facebook.com/ar-studio/learn/articles/3D/null-objects/ Te dejo la documentación, y si no lo consigues publica una nueva pregunta para darle seguimiento.

Marlon Brandon Paul Alvarez Can

student•

Si tuvieron problemas con la acomodación de las gafas, y estas siguen topando y/o atravesando el FaceMesh, la solución que logre darle a este problema es cambiar las propiedades de la siguiente manera (hay imagen de referencia);

En vez de colocar -78.4486 en el vector X que esta en “end”, colocamos -85, esto es en el primer bloque de “transición”, hacemos esto porque nos ayudara a disminuir el rebote, sigan viendo :

- Colocamos estos valores en el segundo bloque de transición, que es donde yo tuve problemas;

Colocamos el valor 0.04 en el vector Y en Start, luego colocamos el valor 0.02 en el vector Z también en start.

- Siguiendo en las configuraciones del segundo bloque de transición, cambiamos la “curva” de lineal a “Elastic In-Out”, y gualá, problema solucionado, cambiamos algunas cosas en el primer bloque porque agregar la curva elástica al segundo bloque generaba un rebote exagerado en las gafas.

La idea es que vallan experimentando con los valores en start, me acabo de dar cuenta de que los lentes, si se agrega el valor 0.04 en X estando en start, los lentes quedan muy arriba, así que pueden probar con 0.03 o menos.

Don Froy

teacher•

Marlon muchas gracias por traer todos estos datos. La razón por la que Marlon ha atinado tanto acá es porque. precisamente... se ha puesto a experimentar con los valores. Mas que seguir valores numericos, experimenten y traten de entender que hace la herramienta.

Jesus Rafael Robles Colinas

student•

Así vamos!

Oscar Ortega Cabello

student•

IMPORTANTE LUEGO DE HACER ESTOS PATHS: DALE A RESTART

Jesus Rafael Robles Colinas

student•

Gracias por la recomendación!

Yhanka Ortiz

student•

No encontraba ese azul oscuro que me gusta y con estos lapices de colores fue mas facil encontrarlo :)

David Durán

student•

a mi me pasó algo muy raro, en la segunda animacion, los lentes o gafas, mientras caían de la frente hacia los ojos, se desplazaban hacia el frente como si cayeran mas alla de la nariz, y cuando terminaban de caer se desplazan hacia el rostro, total, cuando terminaban de subir estban casi metidos en el cerebro... solucioné eso borrando el loop animation (?) adjunto captura del patch editor, tal vez alguien pueda ayudarme a entender que hice mal o donde esta el error

Don Froy

teacher•

Esto podría ser porque el pivote no fue colocado en la posición correcta, es decir el punto desde donde hace el giro no es el óptimo. Intenta subir la duración del loop animation a 15 segundos para ver en que momento sucede ese cambio, y ver donde está colocado el pivote.

Daniela Castro

student•

Holaa, cuando hago el proceso final para que los lentes no toquen la frente cambia completamente la dirección del movimiento. Seguí paso a paso pero no funciona. Los valores en "barrillas" me aparecen como en la imagen. No sé qué estoy haciendo mal jaja

Don Froy

teacher•

Hola Daniel, no entiendo muy bien cual es el problema. Lograste resolverlo? Qué sucede si en vez de los lentes colocas un cubo? se comporta igual? Si contienes los cubos y o los letnes en otro null adicional, el error persiste?

Don Froy

teacher•

*Daniela. Una disculpa.

Daniela Castro

student•

¿Para seleccionar colores hay forma de copiar y pegar un código de color? Por ejemplo: #F2F230

Mayra Lopez

student•

Si, cuando das clic en el color se abre esta ventana y justa abajo puedes copiar y pegar su valor hexadecimal.

Ari Fernando Paredes Miranda

student•

No pensé aprender tanto con este curso :)

¿Cómo darle movimiento al filtro?

Crear un primer filtro 3D

¿Qué vas a aprender y qué vas a lograr en este curso?

¿Qué es la realidad aumentada?

¿Como diseñar un filtro? Caso de estudio: Don Froy Sun Glasses

¿Como seleccionar modelos de blender?

¿Como hacer que un asset se mueva?

¿Cómo darle movimiento al filtro?

¿Cómo agregar interacción entre elementos del filtro?

¿Cómo hacer una interacción de sonrisa?

¿Cómo añadimos un menú de interacción?

¿Cómo hacer pruebas y publicar el filtro?

Crear máscaras 3D

¿Qué son las máscaras 3D? Caso de estudio: Día de los muertos

¿Qué son las máscaras 3D? Caso de estudio: Día de los muertos Parte 2

¿Cómo hornear un mapa de normales de Blender?

¿Cómo agregar textura y pintura al filtro?

Formatos 3D: Comparación entre FBX y OBJ para Realidad Aumentada

¿Cómo manipular la Iluminación en SparkAR?

¿Cómo generar interacciones con Patch Editor?

¿Cómo publicar tu filtro en SparkHub?

Crear filtros con targets

¿Cómo crear filtros usando Targets para AR?

¿Cómo crear marcadores?

¿Cómo importar modelos para targets?

¿Qué efectos e interacciones avanzadas puedes dar a tu filtro?

Optimización de Assets en Spark AR: Texturas y Modelos 3D

¿Cómo seguir aprendiendo sobre Realidad Aumentada?