[Videotutorial] Probador Virtual con Realidad Aumentada y Detección de Movimiento

8 de febrero de 2011 · Videotutoriales · 39012 Visitas ·

¡Hola a todos nuevamente!

Hace algún tiempo vengo investigando sobre la librería Ostrich Flash WebCam y en mis inicios logré hacer esto:

Hoy quiero compartir con ustedes cómo lo hice, ya que me inquieta la gente que viene investigando y quemando pestañas en aprender sobre Realidad Aumentada y Detección de Movimiento.

Para ello hice un pequeño tutorial de cómo hacer su propio probador virtual con Realidad Aumentada que espero disfruten:

Dejo el enlace de descarga del ejemplo.

Recuerden que cualquier duda puede ser dejada en los comentarios o en el foro ;)



Tags:


Comentarios

53 Comentarios para “[Videotutorial] Probador Virtual con Realidad Aumentada y Detección de Movimiento”


  1. Héctor dice:

    Genial aplicación que haz logrado, y gracias por compartir el código con la comunidad.

    • emedesing dice:

      Pues como decía en el foro, espero que sirva de base para que hagan cosas grandiosas y agradezcan también a danzen el inventor de la librería “libre” ostrich flash web cam.

      Ya cuando hagan algo con esa librería espero también la compartan :)

      • pepetorres dice:

        una pregunta, la toma de tu video es lateral, esto lo pones asi pues el polo no cuadra si la toma la haces frontal. ya manejaste eso?. en otro por experiencia sé que es inestable como lo has manejado, si me permites claro el comenatrio…todo por la mejoria

  2. daniel d dice:

    Excelente muchisimas gracias, cada dia me interesa mas el tema inclusive quiero hacer una tesis sobre esto pero voy necesitar mucha ayuda espero me la puedas brindar saludos

  3. maria antonieta dice:

    Excelente trabajo y tutorial… Gracias… ;)

  4. Francisco dice:

    Realmente increíble, muchas felicitaciones y gracias por compartir el código, lo estudiaré enseguida!

  5. jhon dice:

    ey men muchas gracias me ha servido mucho..pero tengo una duda..como creo otros botones?…..no tengo mucha experiencia en esto apenas empiezo y me serviria mucho su ayuda..gracias

    • emedesing dice:

      Hola pues te puedo decir que si se puede crear cuantos botones quieras, te recomiendo cojas algo de experiencia leyendo e informándote mas sobre as3 eso te ayudara mucho

      • jhon dice:

        es la idea….pero lo necesito para el jueves..:Sfinales de la universidad..:$

        • emedesing dice:

          Pues si no conoces amenos la base con la que fué hecha no creo que lo tengas para el jueves, pero no es complejo eh, solo cheka el código ubica la línea donde se ha creado el botón y analiza como interactua con lo demás, si ves el primer video que deje aquí estoy usando varios botones, así que si es posible :)

        • jhon dice:

          es que lo que no ocmprendo es donde esta l boton.??..en el fla no veo ni el boton ni el cursor..:$….yo modifiqué en cursor del archivo fairy…pero con este no e podido por que no los veo..:$

        • emedesing dice:

          Esta en el archivo .as, como digo para entenderlo un poco deberías almenos tener una pequeña base de as3

        • jhon dice:

          ..comprendo…igual me ha ayudado bastante viejo..espero en un futuro no lejano compartir lo aprendido

  6. Francisco dice:

    Me quedo con una duda Luis, porque se ve tan pixelado siempre?

  7. jhonD dice:

    ..comprendo…igual me ha ayudado bastante viejo..espero en un futuro no lejano compartir lo aprendido,..

  8. Renzo dice:

    muchachos me quede antes de crear el movieclip, por el minuto 3:55 del tutorial. no se que procedimiento hace, pero aparece “saving” y después de tener varios frames aparece solo uno.
    Les agradeceria muchisimo la ayuda.

  9. Ernesto dice:

    Hola emedesing, estoy por probar el demo que hiciste, yo estaba en eso mismo del probador virtual, pero los resultados eran muy inestables, veré como lo resuelves. Un saludo para todos.

  10. Juan dice:

    Interesante el tutorial que preparaste; y se vería mucho mejor, si quitas la bolita negra para que los efectos sean notorios solo con el cambio de botones.
    Saludos

  11. Jesús dice:

    Hola amigo =), me interesa muchoo tu proyectooo… espero y me puedas ayudar con unas dudas que tengo.. Cómo puedo agregar otro botón en dicha pelicula aparte del q viene por defecto veo q tienes varios borones con diferentes opciones …Por favor me podrias dar una pista de cómo agregaste más botones?? Estoy muy interesadooo ..Bueno hermano te agradezco te antemano y espero q verdaderamente puedas decirm te lo agradeceria mucho =)…Nos vemos y que Dios te bendiga

  12. Jesús dice:

    Tengo bases de AS3 y ya he revisado las líneas de código donde se crea el botón declaré otra variable con otro nombre tmb de tipo OstrichButton pro al parecer la la libreria no me reconoce la segunda variable del botón y me manda un error a la hora de hacer onOver en la pelicula por favor no quiero q me digas sólo dame algunas pistas de cómo crearlo.. es decir… se tiene q e3ditar la libreria en alguna instancia? o cómo se debe declara el segundo botón, en vdd te lo agradeceria mucho… :(

  13. Jesús Ramírez Nava dice:

    Muchas gracias luis =) jeje Solo se tiene que declarar otra varible similar a como la q está ahi… private var myButton2:OstrichButton; y despues agregar sus escuchadores

    declarar primero asi:

    myButton2 = new OstrichButton (myCursor, button2);
    donde button2 es un boton agregado a la pelicula ya sea dibujado por codigo o por diseño…(si es por diseño se debe definir a la hora de crear el clip en una clase para AS3)

    myButton2.addEventListener(MOTION_OVER, onOver);
    y asi tmb para los tres eventos es decir MOTION_OUT, y MOTION_HOLD..

    • Tyler dice:

      amigo….hice lo q tu dices arriba, reviamente declaré las variables…pero mi película en flash se cicla y no permite mostrar incluso el botón original…podrías mostrarme de que forma dibujaste el segundo botón???

      • Tyler dice:

        el error se situa en la sentencia addChild

        • Jesús dice:

          Para cada escuchador de cada boton se tiene q nombrar de forma diferente la funcion, es decir si el primer escuchador de myButtton es:
          myButtton.addEventListener(MOTION_OVER, onOver);
          (MOTION_out, onOut) y asi para los tres
          entonces las funciones del segundo boton seria por ejemplo así:
          myButton2.addEventListener(MOTION_OVER,onOver2); y asi para los tres eventos; se te cicla porq tiene declaradas las mismas funciones para diferente boton entonces flash no sabe a que boton asignarle esa funcion

          Espero y te haya servido, cualquier cosaa aqui estamos… Saludos desde Misantla, Veracruz, Mexico.

    • Tyler dice:

      ok, lo haré de esa manera, muchísimas gracias por tu tiempo!!!!, todo sea por el desarrollo de software. Saludos desde Colima!

    • Tyler dice:

      Jesus, perdón por mi insistencia, gracias a tu ayuda ahora he avanzado más en mi aplicación, para retroceder un fotograma utilizo prevFreame(). No marca ningún error y corre perfecto, solo que no retrocede al momento de colocarme en el botón, no funciona…alguna idea?
      gracias,

      • Jesús dice:

        Claro hermano primero q nada es un gusto ser apoyo, mi e-mail es jesus_reki@hotmail.es.
        Yo enfrenté el mismo problema que tú, y tal vez esto te sirva, simplemente debes cambiar esa sentencia hasta arriba de tu función, ejemplo:
        Supongamos que tienes

        function onOver (e:Event){
        e.target.boton2.alpha = .8;
        prendas.prevFrame();
        }

        lo unico q tendrias hacer es: ponerlo así:
        function onOver (e:Event) {
        prendas.prevFrame();
        e.target.boton2.alpha = .8;
        }
        En realidad no sé el motivo del porq pero ami me funcionó, si no es esa tu duda o no te la supe resolver claramente, no dudes en agregarme bro… que ami tambien me gustaria establecer comunicación con futuros desarrolladores. Espero tu respuesta para q me digas como va tu aplicación hermano.

        • Tyler dice:

          muchísimas gracias amigo!! ahora funciona a la perfección, tan solo unos pocos detalles de diseño y estará lista!!
          Se te agradece de sobremanera!.. igual te agrego al msn para futuros contactos.

  14. Raquel dice:

    Si os interesa la información sobre realidad aumentada os invito a que echéis un vistazo a las nuevas aplicaciones que están saliendo relacionadas con ésta tecnología.

    Un saludo,

    Raquel

    http://blog.fraileyblanco.com/2011/04/la-puesta-en-practica-%E2%80%93-realidad-aumentada-del-papel-al-hipermedia/

  15. LeoNardo dice:

    Hola Luis, excelente su blog Loko, tambien soy un apasionado de la programacion, enamorado del flash y action script, hasta ahora me estoy metiendo en esto de la realidad aumentada, gracias a Dios di con su blog buenisimo… El Perú es increible yo vivi por alla, yo tambien tengo un blog pero de referencias ahi lo comparto http://www.guarnicom.com/blog/

    Saludos…

  16. Miguel dice:

    Me parece muy interesante este tema de realidad aumentada y actualmente realizo un trabajo sobre esto, desafortunadamente no tengo muchos conocimientos en Action script , por favor necesito saber como colocar otro botón , de antemano gracias por la ayuda que me puedan prestar

  17. Lucas dice:

    Hola, muy bueno lo tuyo la verdad que me sirvio mucho, pero te queria preguntar, tuve un problema, el cursor me sige mucho el movimiento de la cara en vez de las manos, no importa cuanto mueva las manos se queda en la cabeza, es como que quiere ir para las manos pero vuelve a la cabeza, tenes alguna idea de como solucionar esto? o al menos de por que lo hace… muchas gracias

  18. Lucas dice:

    Hola, muy bueno lo tuyo la verdad que me sirvio mucho, pero te queria preguntar, tuve un problema, el cursor me sige mucho el movimiento de la cara en vez de las manos, no importa cuanto mueva las manos se queda en la cabeza, es como que quiere ir para las manos pero vuelve a la cabeza, tenes alguna idea de como solucionar esto? o al menos de por que lo hace. espero tu respuesta, muchas gracias por el aporte =D

  19. maricela dice:

    al abrir el samplebutton.fla me sale formato inesperado porque???? :(

  20. Rodrigo dice:

    lá, sou novato nessa area, estudo design de produto
    e achei muito interessante realidade aumentada.
    sou do Brasil, estou com umas duvidas, como sei pouco
    de actionscript não estou conseguindo acrescentar mais botões !
    como eu faço?
    outra pergunta é como troco a imagem do botao quadrado para outra figura?
    SE ALGUEM PUDER ME AJUDAR!
    muito obrigado desde já amigos!!!

  21. Daniela dice:

    hola, necesito una ayuda..lo que pasa es que realice una experiencia de realidad aumentada con el programa Buildar, y quisiera saber cómo puedo hacer para publicar o subir dicha experiencia de realidad aumentada en una pagina web; de tal forma que el usuario pueda realizar la misma experiencia al colocar frente a la webcam el marcador.

    Gracias!!

  22. Gustavo dice:

    Gracias hermano. Esto me sirve muchísimo para una investigación que estoy haciendo sobre RA. Por favor te pido q nos avises sobre novedades. Saludos cordiales

  23. edison dice:

    Luis me tramo quisiera preguntar que camara utilizas para que se vea muy bien la realidad aumentada, uso la del portatil pero ve muy prixelado muchas gracias.

  24. Jorge Torrecilla dice:

    Hola soy Jorge Torrecilla de México, antes que nada gracias por compartir el código de tan grande y útil conocimientos, se aprecia muchísimo.

    Tengo una duda relevante, sucede que la empresa Zugara.com tiene un producto llamado WebCam Social Shopper, que es como te imaginarás un SWF para probarse la ropa, muy desarrollado, y el problema es que abajo dice en una leyenda “Pendiente de patente (en Inglés)”, entonces mi pregunta es ¿realmente ellos pueden patentar eso, y si lo hacen lo que tu nos estás enseñando en este tutorial queda inutilizable para probarse la ropa?, se que está medio rara la pregunta pero quisiera saber tu opinión, gracias :D

    • emedesing dice:

      Hola, pues en gringolandia se puede patentar todo, hay patentes hasta para la barra inferior de windows. si hablamos de esos temas “legales” pues digamos que no sabría que responderte ya que las patentes son respetadas legalmente dependiendo de en que país te encuentres y los acuerdos entre naciones que se tengan.

      Si alguien patenta la forma en que la gente se prueba ropa virtualmente imagino que tendría valides dependiendo del tipo de patente, en realidad es por eso que me gusta tanto el softlibre porque no limita a la gente a seguir haciendo cosas sin inventar la rueda y solo reutilizandola.

      Por cierto hace tiempo que no vengo por este blog pero quiero contarte que el probador virtual evoluciono , tanto así que en Perú la gente se divirtio en una tienda por departamento que puso a disposición de sus usuarios el probador virtual.

      Yo ultimamente he hecho el probador virtual kinect y de el puedes encontrar información aquí.

      http://emedesing.wordpress.com/2012/05/19/probador-virtual-kinect/

  25. Morgan dice:

    Muchas gracias amigo, hace mucho tiempo que estaba buscando un ejemplo asi, porque apartir de ello, se puede acomplejar el programa muchas gracias

  26. Rafael dice:

    Hola
    Excelente trabajo que estas realizando, estoy iniciando mi proyecto pero no tengo mayor conocimiento en sistemas pero me gustaría aprender, como puedo iniciar para que las imágenes queden como muestras en el vídeo o que programas debo descargar a mi laptop,

    vi un vídeo donde tienes varias camisetas pero dice que se maneja con kinect no lo tengo, pero se puede manejar con webcam de mi laptop, y tengo otra duda se puede subir a una pagina web.

  27. Paulino dice:

    Hola! que tal excelente tutorial me sirvió mucho y aprendí mucho pero tengo un problema al crear la película no me funciona la aplicación solo pasan las remeras una al lado de la otra infinitamente pero dentro del flash me funciona como debo publicarlo para que me funcione desde ya espero tu respuestas muchas gracias.


Deja tu Comentario