Archivo | Ejemplos RSS for this section

Responsive design imagenes

Continuemos con las tècnicas para implementar la web a diferentes dispositivos , esta ves el tema de las imagenes :

Responsive design, media queries

Diseño de respuesta y media queries una técnica para crear website que se puedan ver adecuadamente en distintos dispositivos tanto tablet, como smartphone ademàs de desktop. Este vídeo tutorial pretende ayudar a aquellos desarrolladores frontend que busquen información para el uso de esta técnica

Ocupado investigando

Hola que tal se que hace algún tiempo no publico y menos aún me es mas dificil responder cada comentario que dejan, prometo darme tiempo para mi querido blog, hoy posteo solo para contarles que he estado investigando sobre 3 temas en particular :

– Aplicaciones móviles basadas en Android

– Detección y seguimiento de luz

– Facebook Graph api

Apenas me desocupe escribiré un tutorial sobre la detección de luz que ando investigando

Probador de ropa virtual con realidad aumentada y detección de movimiento

¡Hola a todos mi nombre es Luis Rodriguez y 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.

Post to Twitter Post to Delicious Post to Digg Post to Facebook Post to Reddit Post to StumbleUpon

Juego detección de movimiento y realidad aumentada

hace algún tiempo hice este juego

Básicamente quería en ese momento mostrar lo facil que era realizar aplicaciones basadas en realidad aumentada, sobre todo utilizando la Librería de detección de movimeinto  Ostrich Flash Web Cam , pero por falta de tiempo no pude hacer un tutorial de ello. Pero como me sentía en deuda y debido a las peticiones que me hicieron llegar ustedes en este blog, he terminado ya el tutorial y se los dejo aquí

Si no quieren ver los 13 minutos de la construción del código, pues les detallo aquí de que va.

Leer más…

Detección de rostro Flash as3

Holami nombre es Luis Rodriguez y hace algún tiempo hice una divertida tarjeta de navidad para mis amigos :

y hoy quiero mostrarles como hacerlo :

La librería la pueden descargar de aquí

Embeber vídeo en HTML 5

Estoy aprendiendo sobre HTML5 y sus bondades y quería compartirlo.
El mayor problema en la actualidad para insertar o embeber un vídeo en la web es que teníamos que considerar si este utilizaría el plugin de flash o Silverligth el plugin de Microsoft, con HTML5  ese problema ha sido resuelto.

Para embeber un vídeo en HTML5 es necesario considerar lo siguiente :

. Los vídeos pueden ser ogg o mp4

. diferenciar entre codec y contenedor

. el codec ogg theora es soportado  por firefox, opera chrome

. el codec  h-264 es soportado  por safari ie9, iphone, opera, ipad , android, chrome

¿ Cual es la diferencia entre Contenedor y codec ?

La diferencia es que «contenedor» es el formato del archivo, es la extensión que nos sirve para comunicar nuestro fichero de video con el reproductor y «codec» es el decodifcador de este contenedor .

Ya sabiendo todo esto vamos ahora a embeber nuestro video en HTML5. con la etiqueta de video

<video></video>

Esta etiqueta es el atractivo visual mas importante en html5, el código completo sería así:

<video src=»movie.ogg» width=»300″ heigth=»300″controls=»controls»>Tu browser no soporta este tag HTML5</video>

como ven primero abrimos y cerramos la etiqueta <video></video> de html5 , luego le decimos la ruta src=»movie.ogg» , luego agregamos el control del reproductor controls=»controls y luego colocamos un mensaje por si el browser no soporta esta etiqueta.

Podrán ver el ejemplo Aquí

Si no cuentan con browser que soporte HTML5 podrán descargar el ejemplo de aquí

EL DATO

– HTML5 esta muy avanzado, asi que diseñadores empiecen a investigar y aprender sobre ello

– Para convertir online los videos pueden utilizar http://tinyogg.com/


Manual Ostrich web cam flash

Hola, esta ves para dejar el manual de uso para novatos como yo de la librería Ostrich Web cam flash, que es la librería en as3  que nos permite hacer la deteccion de movimiento de manera muy sencilla.

Esta librería la pueden descargar de LA WEB DE DANZEN.

Colisiones en as3 «hitTestObject»

Dejaré algo muy útil  para mí, que siempre utilizo y que me ha servido para hacer mis juegos con guitar hero y demás, lo llaman la función de  «colisión»  y sirve básicamente para detectar cuando 2 objetos «colisionan o se topan en el escenario».

objeto1.mc.hitTestObject(objeto2.mc)

Básicamente lo que hace es detectar que si el objeto1.mc colisiono con el objeto2.mc

Sencillo verdad?

Pruébatelo con realidad aumentada y detección de movimiento

hace algún tiempo atrás cuando empece a investigar el tema de realidad aumentada vi este video :

y me gusto tanto porque vi en ello la mejor manera de promocionar ropa por la web y luego llevar a este público a las tiendas a adquirirlas o simplemente comprar por la web . Cuando lo ví me parecio fantástico y quice hacer lo mismo, esa fue una de las motivaciones por las cuales empece a investigar sobre realidad aumentada y la detección de movimiento, despues de investigar durante un tiempo he logrado hacerlo.

En estos días trabajaré el diseño de esta aplicación y la conexión con facebook, para que se prueben virtualmente prendas