CursosEmpresasBlogLiveConfPrecios

Agregar fondo

Clase 18 de 27 • Curso de Creación de Filtros Faciales para Instagram con Spark AR

Clase anteriorSiguiente clase

Contenido del curso

Conocer Spark AR
  • 1
    Crea tu primer filtro usando Spark AR

    Crea tu primer filtro usando Spark AR

    00:54
  • 2
    Descarga e instalacion Spark Ar studio

    Descarga e instalacion Spark Ar studio

    06:31
  • 3
    Desplazamientos en el programa

    Desplazamientos en el programa

    04:59
  • 4
    Interfaz y Face mesh

    Interfaz y Face mesh

    07:56
Creando un efecto en los ojos
  • 5
    Crear diseño de ojo en photoshop

    Crear diseño de ojo en photoshop

    04:02
  • 6
    Integrar diseño de ojo en Spark AR

    Integrar diseño de ojo en Spark AR

    14:10
  • 7
    Crear extracción de textura de rostro y retoque facial

    Crear extracción de textura de rostro y retoque facial

    06:10
  • 8
    Descarga de referencias de rostros de Spark AR

    Descarga de referencias de rostros de Spark AR

    02:43
Crea un efecto de maquillaje en realidad aumentada
  • 9
    Creación de  maquillaje en photoshop (boca)

    Creación de maquillaje en photoshop (boca)

    09:24
  • 10
    Creación de maquillaje en photoshop (nariz y ojos)

    Creación de maquillaje en photoshop (nariz y ojos)

    08:26
  • 11
    Integrar maquillaje en spark ar

    Integrar maquillaje en spark ar

    06:52
Publicación de pre diseño del filtro
  • 12
    Vincular cuentas

    Vincular cuentas

    01:20
  • 13
    Cómo subir un filtro a Instagram

    Cómo subir un filtro a Instagram

    13:26
Crear un efecto animado en 2d
  • 14
    Creación de sprite sheet en photoshop

    Creación de sprite sheet en photoshop

    10:53
  • 15
    Integración de sprite sheet en spark ar y creacion de particulas

    Integración de sprite sheet en spark ar y creacion de particulas

    05:05
  • 16
    Interacción de abrir la boca con parches

    Interacción de abrir la boca con parches

    05:46
Personaliza elementos de tu escena
  • 17
    Color de cabello

    Color de cabello

    05:58
  • 18
    Agregar fondo

    Agregar fondo

    06:09
  • 19
    Crear marco o viñeta

    Crear marco o viñeta

    02:14
  • 20
    Imágenes 2D sobre plano

    Imágenes 2D sobre plano

    05:14
  • 21
    Interacción sacudir la cabeza

    Interacción sacudir la cabeza

    04:48
Agregar interacciones al filtro
  • 22
    Agregar sonido

    Agregar sonido

    03:17
  • 23
    Crear instrucciones

    Crear instrucciones

    01:28
Publicación del diseño final de tu filtro
  • 24
    Optimización

    Optimización

    02:06
  • 25
    Cómo asegurarse de que el filtro sea aceptado

    Cómo asegurarse de que el filtro sea aceptado

    04:55
  • 26
    Subir filtro final Instagram

    Subir filtro final Instagram

    07:03
Bonus
  • 27
    Cierre y recomendaciones finales

    Cierre y recomendaciones finales

    00:31
    Christian Alejandro Vargas Menchaca

    Christian Alejandro Vargas Menchaca

    student•
    hace 4 años

    Wow son varios procedimientos que definitivamente la única manera de dominarlos es practicando

      Cristhian Ortiz Henao

      Cristhian Ortiz Henao

      student•
      hace 4 años

      si es verdad

      Alejandro Bracho

      Alejandro Bracho

      student•
      hace 4 años

      Totalmente de acuerdo, la practica hace al maestro

    Aura María Villamizar Mendoza

    Aura María Villamizar Mendoza

    student•
    hace 4 años

    debería subir solo un archivo con todo el material de la clase al principio del curso.

      Emmanuel Jose Lamprea Florez

      Emmanuel Jose Lamprea Florez

      student•
      hace 4 años

      Es verdad Aura, en cada clase debemos estar descargando y es un poco molesto, de resto es muy interesante

      Jhon Edward Bedoya

      Jhon Edward Bedoya

      student•
      hace 4 años

      🟢 Hello!

      Es una muy buena recomendación. Será considerada de inmediato. Muchas gracias por tu sugerencia 🤗

      Un abrazo de gol! 🦾

    Omar Sanchez Arambula

    Omar Sanchez Arambula

    student•
    hace 4 años

    Agregar fondo

    1. Scena → focal Distance → canvas→ add object → rectangle1 →propiedades →Width → full width, Height → full Height
    2. Material ➕ → Create New Material → Camera →segmentation ➕ → seleccionar person
    3. Ahora buscar en los Assets→ segmentationMaskTexture1 → seleccionamos el material que creamos → rename a persona → shader type → flat → texture → camaraTextur
    4. Activar alpha ☑️ → texture →segmentationMaskTexture1
    5. Activar alpha test ☑️
    6. advanceRenderOptions → write to depth deshabilitarla ⬛ Esto se hace para que esta segmentación(silueta) siempre quede en la mesa de trabajo
    7. Focal Distance → Add Object → Plane → rename a Fondo → Subir Fondo por encima de canvas y faceTraker → en propiedades en escale cambiar el tamaño / otra forma: si se pone el mouse sobre las 3 líneas en el viewport le damos click y le aumentamos el tamaño
    8. plano → propiedades → materials → Create New Material → assets → rename a Fondo
    9. propiedades del material →shader type → flat → texture →choose file → buscamos la imagen de fondo
      Captura.JPG
      Laura Valentina

      Laura Valentina

      student•
      hace 4 años

      Gracias por el aporte

    Marlon Brandon Paul Alvarez Can

    Marlon Brandon Paul Alvarez Can

    student•
    hace 4 años

    Ya casi están listos...

    captura1..png
    Captura1.0.png
    captura1.00.png

      Daniel Murcia

      Daniel Murcia

      teacher•
      hace 4 años

      😱😱👏🏻👏🏻👏🏻

    Jader Moncayo

    Jader Moncayo

    student•
    hace 4 años

    En mi pantalla el plano me aparece en frente y tapa todo ¿Qué hacer para que aparezca en la parte de atrás el plano?

      Mayra Lopez

      Mayra Lopez

      student•
      hace 4 años

      desde una vista 3D pásalo hacia atrás. Sino te estoy entendiendo pegame aqui una captura de pantalla para poder ayudarte mejor

      Jader Moncayo

      Jader Moncayo

      student•
      hace 4 años

      Listo, solucionado

    Julian Andres Cano Orozco

    Julian Andres Cano Orozco

    student•
    hace 4 años

    Me preguntaba si eran necesarios tantos Face Meshes hehe

      Mayra Lopez

      Mayra Lopez

      student•
      hace 4 años

      Pudiera ser que para manejarlos bien si, pero puedes probar a usar menos y juntar los elementos

      Alejandro Ramos

      Alejandro Ramos

      student•
      hace 4 años

      En lo que he probado, no es necesario! 😀

      Usa los que requieras.

    Oscar Ortega Cabello

    Oscar Ortega Cabello

    student•
    hace 4 años

    ASÍ VAMOS, UNA COMBINACIÓN CON LA CLASE ANTERIOR EN EL CANVAS EL QUITADO DE LA SILUETA DE LA PERSONA DEBE ESTAR ARRIBA DEL COLOR DEL CABELLO

    Z23213.JPG

      Thomas Gonzalez Revilla

      Thomas Gonzalez Revilla

      student•
      hace 3 años

      MUCHAS GRACIAS ! Seguia avanzando sin el cambio de color de cabello.

      Maria Abetti

      Maria Abetti

      student•
      hace 2 años

      En mi caso si hago eso se ve solo el pelo, el maquillaje y el fondo. Desaparece la persona

    Andrés David Loaiza Zamudio

    Andrés David Loaiza Zamudio

    student•
    hace 4 años

    Por qué hacer el background en un plano y no en un rectángulo?

      Carlos José González Juan

      Carlos José González Juan

      student•
      hace 4 años

      Pienso que porque el plano se mueve conla cara, y lo que nos interesa es que se quede fijo

      Emmanuel Jose Lamprea Florez

      Emmanuel Jose Lamprea Florez

      student•
      hace 4 años

      Yo creo igual que con Carlos, debe ser que el rectángulo es para el objeto persona y el plano es para ser estático o similar

    Jaime Alejandro Torres Ocon

    Jaime Alejandro Torres Ocon

    student•
    hace 4 años

    Cada que voy avanzando en los cursos voy imaginando las posibilidades y con cada nueva herramienta, estas aumentan

    Sofía Dellamea

    Sofía Dellamea

    student•
    hace 4 años

    ¿Qué puedo hacer si toda mi piel se vuelve luminosa y blanca? tengo este problema de que cuando intento ponerle fondo el maquillaje me queda por encima y todo mi cuerpo se pone blanco y difuminado.

      Daniel Murcia

      Daniel Murcia

      teacher•
      hace 4 años

      Hola, puedes porfa adjuntar una foto para entender un poco mejor tu pregunta

    Carlos Iván Ochoa Gómez

    Carlos Iván Ochoa Gómez

    student•
    hace 4 años

    Mire que la imagen de fondo pesa 30mb, y la verdad se me hace mucho. y quisiera saber ¿Cual es el tamaño maximo recomendado para el proyecto?

      Mayra Lopez

      Mayra Lopez

      student•
      hace 4 años

      para poder subir un proyecto, el filtro completo debe pesar menos de 4 Mb, entonces un optimo seria menos de 1Mb

      Daniel Murcia

      Daniel Murcia

      teacher•
      hace 4 años

      Hola, puedes bajarle tamaño usando https://tinypng.com/

    Daniel Alejandro Vargas Yacuma

    Daniel Alejandro Vargas Yacuma

    student•
    hace 4 años

    Hola, lo que pasa es que a la hora de poner el fondo y probarlo me doy de cuenta que en en simulador hay unos personajes que no les aparecen la mascara y hay otros que se les ve un poco, cuando yo huso mi cámara si se ve bien pero alejo la cara y se quita, no se como poder arreglar ese problema y lo que no aparece es el color de pelo no se porque no se pondrá.

      Daniel Murcia

      Daniel Murcia

      teacher•
      hace 4 años

      Hola, puedes intentar en le material del fondo, en las propiedades, buscar la opcion Advanced render options, desplegar esa opcion y desmarcar la opcion que dice write to depth buffer, esa opcion lo que hace es que el material seleccionado quede en la parte de atras

    Jader Moncayo

    Jader Moncayo

    student•
    hace 4 años

    Cuando voy a subir el filtro me aparece que la segmentación debo borrarla pero si la borro borro el fondo ¿Qué hacer?

    enviar.jpg

      Mayra Lopez

      Mayra Lopez

      student•
      hace 4 años

      específicamente no te dice que la borres, dice que nos todos podran verla, esto es porque hay celulares gama baja que podrían no ser capaces de reproducirlo.

    Hyrunm nefi Lloclla Garcia

    Hyrunm nefi Lloclla Garcia

    student•
    hace 2 años

    al poner el fondo desaparece el color de cabello, cómo haria para que aparezca el color de cabello sin perser el fondo

    Vicente García Pérez

    Vicente García Pérez

    student•
    hace 3 años

    Hola, ¿me pueden ayudar?

    No sé que hice mal que la persona se ve como en canal alfa y ya no sé corregirlo.

    David Durán

    David Durán

    student•
    hace 3 años

    Hola, como puedo hacer para que le plano transparente cuadrado de los ojos, desaparezca. Gracias

      Daniel Murcia

      Daniel Murcia

      teacher•
      hace 3 años

      hola, en el material del ojo, debes seleccionar la parte que dice alpha test, eso te quita parte transparente

      David Durán

      David Durán

      student•
      hace 3 años

      muchas gracias profe

    Sergio Valadez

    Sergio Valadez

    student•
    hace 4 años

    ¿Soy el único que le pasa que el FaceMesh le sale detrás del viewport? cuando le pongo un rectangule me pasa que tapa mi rastreo de rostro...

      Daniel Murcia

      Daniel Murcia

      teacher•
      hace 4 años

      Hola, aquí te damos dos formas de solucionarlo, con este video puedes solucionar eso 👌🏻 https://youtu.be/X_NrLRsW7r4

      Sergio Valadez

      Sergio Valadez

      student•
      hace 4 años

      Gracias, desactivar el checkbox de deeptest funcionó perfecto.

    Edwin Salazar

    Edwin Salazar

    student•
    hace 4 años

    Hola, no me sale la opción de " cameraTexture0" dentro de Textura en Shader Properties y cuando selecciono el archivo del fondo tapa todo menos el filtro, alguna solución?

    pantalla  .png
      Daniel Murcia

      Daniel Murcia

      teacher•
      hace 4 años

      Hola, con este video quizas te pueda ayudar para solucionarlo

    Jose Luis

    Jose Luis

    student•
    hace 4 años

    Alguien me puede ayudar, mi facemesh se mezcla con mi fondo y no esta independiente como en el video y la lo hice muchas veces y sigue así

    Sin título.png

      Emmanuel Jose Lamprea Florez

      Emmanuel Jose Lamprea Florez

      student•
      hace 4 años

      Hola Jose 👋🏻 Intente que el FaceMesh quede sobre el plano y no quede detrás, ya que se va poniendo más pequeño o más grande el filtro, puede que sea eso.

      Que quede mas al frente del video de prueba, en el Viewport.

      Trate de acomodar que el filtro o la mascara quede sobre la cara, alineado

      Oscar Ortega Cabello

      Oscar Ortega Cabello

      student•
      hace 4 años

      SOLUCIÓN: SELECCIONA CANVAS > PROPIEDADES > MODO > WORLD SPACE , UBICA ESE PLANO UN POCO ALEJADO Y DETRÁS Y YA ESTARÍA.

    Ilai Guevara

    Ilai Guevara

    student•
    hace 4 años

    ¿Cuándo se aplica el fondo se pierde el color del cabello? Porque ya no lo tiene y solo está un aura de color verde

      Daniel Murcia

      Daniel Murcia

      teacher•
      hace 4 años

      hola, hay tres formas de hacerlo.

      1. en el materia de la segmentacion de cabello, buscar la opcion "Advance render options" desmarcar la casilla que sice "use depth test"

      2. Verificar que en la escena elfondo este arrriba de la segmentacion de cabello.

      3. Usar las capas "layers" al seleccionar cada objeto en las propiedades puedes crearle una nueva capa, pordefecto vienen todas en layer 0, creale una capa nueva a la segmentacion de cabello y prueba las pestañas de capas al lado de la pestaña de escena para que quede la segmentacion de cabello adelante del fondo.

      Prueba con cualquier de estas opciones

      David Alejandro Medina Ruiz

      David Alejandro Medina Ruiz

      student•
      hace 4 años

      Profe, intenté de las tres formas que comentas pero en ninguna funcionó; lo único que me permite ver el color del cabello es desactivando el segmento de persona 😔 hay alguna otra forma para solucionarlo?

Escuelas

  • Desarrollo Web
    • Fundamentos del Desarrollo Web Profesional
    • Diseño y Desarrollo Frontend
    • Desarrollo Frontend con JavaScript
    • Desarrollo Frontend con Vue.js
    • Desarrollo Frontend con Angular
    • Desarrollo Frontend con React.js
    • Desarrollo Backend con Node.js
    • Desarrollo Backend con Python
    • Desarrollo Backend con Java
    • Desarrollo Backend con PHP
    • Desarrollo Backend con Ruby
    • Bases de Datos para Web
    • Seguridad Web & API
    • Testing Automatizado y QA para Web
    • Arquitecturas Web Modernas y Escalabilidad
    • DevOps y Cloud para Desarrolladores Web
  • English Academy
    • Inglés Básico A1
    • Inglés Básico A2
    • Inglés Intermedio B1
    • Inglés Intermedio Alto B2
    • Inglés Avanzado C1
    • Inglés para Propósitos Específicos
    • Inglés de Negocios
  • Marketing Digital
    • Fundamentos de Marketing Digital
    • Marketing de Contenidos y Redacción Persuasiva
    • SEO y Posicionamiento Web
    • Social Media Marketing y Community Management
    • Publicidad Digital y Paid Media
    • Analítica Digital y Optimización (CRO)
    • Estrategia de Marketing y Growth
    • Marketing de Marca y Comunicación Estratégica
    • Marketing para E-commerce
    • Marketing B2B
    • Inteligencia Artificial Aplicada al Marketing
    • Automatización del Marketing
    • Marca Personal y Marketing Freelance
    • Ventas y Experiencia del Cliente
    • Creación de Contenido para Redes Sociales
  • Inteligencia Artificial y Data Science
    • Fundamentos de Data Science y AI
    • Análisis y Visualización de Datos
    • Machine Learning y Deep Learning
    • Data Engineer
    • Inteligencia Artificial para la Productividad
    • Desarrollo de Aplicaciones con IA
    • AI Software Engineer
  • Ciberseguridad
    • Fundamentos de Ciberseguridad
    • Hacking Ético y Pentesting (Red Team)
    • Análisis de Malware e Ingeniería Forense
    • Seguridad Defensiva y Cumplimiento (Blue Team)
    • Ciberseguridad Estratégica
  • Liderazgo y Habilidades Blandas
    • Fundamentos de Habilidades Profesionales
    • Liderazgo y Gestión de Equipos
    • Comunicación Avanzada y Oratoria
    • Negociación y Resolución de Conflictos
    • Inteligencia Emocional y Autogestión
    • Productividad y Herramientas Digitales
    • Gestión de Proyectos y Metodologías Ágiles
    • Desarrollo de Carrera y Marca Personal
    • Diversidad, Inclusión y Entorno Laboral Saludable
    • Filosofía y Estrategia para Líderes
  • Diseño de Producto y UX
    • Fundamentos de Diseño UX/UI
    • Investigación de Usuarios (UX Research)
    • Arquitectura de Información y Usabilidad
    • Diseño de Interfaces y Prototipado (UI Design)
    • Sistemas de Diseño y DesignOps
    • Redacción UX (UX Writing)
    • Creatividad e Innovación en Diseño
    • Diseño Accesible e Inclusivo
    • Diseño Asistido por Inteligencia Artificial
    • Gestión de Producto y Liderazgo en Diseño
    • Diseño de Interacciones Emergentes (VUI/VR)
    • Desarrollo Web para Diseñadores
    • Diseño y Prototipado No-Code
  • Contenido Audiovisual
    • Fundamentos de Producción Audiovisual
    • Producción de Video para Plataformas Digitales
    • Producción de Audio y Podcast
    • Fotografía y Diseño Gráfico para Contenido Digital
    • Motion Graphics y Animación
    • Contenido Interactivo y Realidad Aumentada
    • Estrategia, Marketing y Monetización de Contenidos
  • Desarrollo Móvil
    • Fundamentos de Desarrollo Móvil
    • Desarrollo Nativo Android con Kotlin
    • Desarrollo Nativo iOS con Swift
    • Desarrollo Multiplataforma con React Native
    • Desarrollo Multiplataforma con Flutter
    • Arquitectura y Patrones de Diseño Móvil
    • Integración de APIs y Persistencia Móvil
    • Testing y Despliegue en Móvil
    • Diseño UX/UI para Móviles
  • Diseño Gráfico y Arte Digital
    • Fundamentos del Diseño Gráfico y Digital
    • Diseño de Identidad Visual y Branding
    • Ilustración Digital y Arte Conceptual
    • Diseño Editorial y de Empaques
    • Motion Graphics y Animación 3D
    • Diseño Gráfico Asistido por Inteligencia Artificial
    • Creatividad e Innovación en Diseño
  • Programación
    • Fundamentos de Programación e Ingeniería de Software
    • Herramientas de IA para el trabajo
    • Matemáticas para Programación
    • Programación con Python
    • Programación con JavaScript
    • Programación con TypeScript
    • Programación Orientada a Objetos con Java
    • Desarrollo con C# y .NET
    • Programación con PHP
    • Programación con Go y Rust
    • Programación Móvil con Swift y Kotlin
    • Programación con C y C++
    • Administración Básica de Servidores Linux
  • Negocios
    • Fundamentos de Negocios y Emprendimiento
    • Estrategia y Crecimiento Empresarial
    • Finanzas Personales y Corporativas
    • Inversión en Mercados Financieros
    • Ventas, CRM y Experiencia del Cliente
    • Operaciones, Logística y E-commerce
    • Gestión de Proyectos y Metodologías Ágiles
    • Aspectos Legales y Cumplimiento
    • Habilidades Directivas y Crecimiento Profesional
    • Diversidad e Inclusión en el Entorno Laboral
    • Herramientas Digitales y Automatización para Negocios
  • Blockchain y Web3
    • Fundamentos de Blockchain y Web3
    • Desarrollo de Smart Contracts y dApps
    • Finanzas Descentralizadas (DeFi)
    • NFTs y Economía de Creadores
    • Seguridad Blockchain
    • Ecosistemas Blockchain Alternativos (No-EVM)
    • Producto, Marketing y Legal en Web3
  • Recursos Humanos
    • Fundamentos y Cultura Organizacional en RRHH
    • Atracción y Selección de Talento
    • Cultura y Employee Experience
    • Gestión y Desarrollo de Talento
    • Desarrollo y Evaluación de Liderazgo
    • Diversidad, Equidad e Inclusión
    • AI y Automatización en Recursos Humanos
    • Tecnología y Automatización en RRHH
  • Finanzas e Inversiones
    • Fundamentos de Finanzas Personales y Corporativas
    • Análisis y Valoración Financiera
    • Inversión y Mercados de Capitales
    • Finanzas Descentralizadas (DeFi) y Criptoactivos
    • Finanzas y Estrategia para Startups
    • Inteligencia Artificial Aplicada a Finanzas
    • Domina Excel
    • Financial Analyst
    • Conseguir trabajo en Finanzas e Inversiones
  • Startups
    • Fundamentos y Validación de Ideas
    • Estrategia de Negocio y Product-Market Fit
    • Desarrollo de Producto y Operaciones Lean
    • Finanzas, Legal y Fundraising
    • Marketing, Ventas y Growth para Startups
    • Cultura, Talento y Liderazgo
    • Finanzas y Operaciones en Ecommerce
    • Startups Web3 y Blockchain
    • Startups con Impacto Social
    • Expansión y Ecosistema Startup
  • Cloud Computing y DevOps
    • Fundamentos de Cloud y DevOps
    • Administración de Servidores Linux
    • Contenerización y Orquestación
    • Infraestructura como Código (IaC) y CI/CD
    • Amazon Web Services
    • Microsoft Azure
    • Serverless y Observabilidad
    • Certificaciones Cloud (Preparación)
    • Plataforma Cloud GCP

Platzi y comunidad

  • Platzi Business
  • Live Classes
  • Lanzamientos
  • Executive Program
  • Trabaja con nosotros
  • Podcast

Recursos

  • Manual de Marca

Soporte

  • Preguntas Frecuentes
  • Contáctanos

Legal

  • Términos y Condiciones
  • Privacidad
  • Tyc promociones
Reconocimientos
Reconocimientos
Logo reconocimientoTop 40 Mejores EdTech del mundo · 2024
Logo reconocimientoPrimera Startup Latina admitida en YC · 2014
Logo reconocimientoPrimera Startup EdTech · 2018
Logo reconocimientoCEO Ganador Medalla por la Educación T4 & HP · 2024
Logo reconocimientoCEO Mejor Emprendedor del año · 2024
De LATAM conpara el mundo
YoutubeInstagramLinkedInTikTokFacebookX (Twitter)Threads