Videoposts en tintachina

Resumen del post: diseño de una interfaz para videoposts; reseña histórica; cómo crear tus propios videoposts; preguntas frecuentes.

Un día grabé por error un vídeo. Nada importante pero me dije “quiero publicarlo”. El resultado ya lo conocéis, describir el “cómo” es el objetivo de esta nota.

Diseño de la interfaz desde el punto de vista del usuario
La interfaz tenía que ser como un televisor que mostrara una imagen estática. Si el lector decidía ver el vídeo podría pulsar play y, si se cansaba, stop o pause . Y todo sin esperas ni descargas.

Me informé y me explicaron que la mejor opción era usar Flash. Supongo que todos habéis visto Amazon Theater.

Así que puse un anuncio en este weblog buscando diseñador, nos pusimos de acuerdo en la forma de pago y en menos de una semana estaba todo listo. Velocidad internet. Mentalidad blogger.


Estopa a su llegada a la entrega de los premios GQ Hombre del Año 2004

Historia de los videopost en nuestra blogosfera
Los precursores de los videoposts en la blogosfera hispana fueron Obokaman, con su Curs de conducció segura y Algernon, que también publicó algunas reflexiones sobre el experimento.

Una tecnología complementaria es AV Blogger, que te permite crear tu propio show televisivo. Vía Píxel y Díxel.

Blogpocket dedicó uno de sus blogoestilos a los videoblogs.

Videopost “protesta” en tintachina
En el último momento, lo que iba a ser el tema de uno de esos posts tan nuestros de “he cambiado el diseño, ahora no uso tablas etc” o “he incluido anuncios de Google” :-) pasó a un segundo plano para centrarse en el contenido: un evento al que acudes y que, como weblogger, cubres con tus propios recursos y desde tu punto de vista.

Cómo crear un videopost
Si quieres publicar videoposts en tu weblog, primero consúltalo con tu hosting. El mío no me puso ninguna pega. No necesitas servidor de streaming. Unas líneas más abajo incluyo algunos datos sobre los recursos consumidos.

A continuación, bájate el módulo flash con forma de televisor que hemos preparado:

>> Descargar visor (.zip, 28 KB)

Descomprímelo y súbelo a tu servidor. Sólo tendrás que hacerlo una vez aunque publiques más videoposts.

Para convertir los vídeos a formato .flv puedes usar:

Cuando tengas listo el vídeo que hayas grabado, súbelo también a tu servidor.

El código que debes copiar y pegar para insertar el visor con el vídeo en el videopost es:

<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000” codebase=”http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0” width=”345” height=”300”><param name=”movie” value=”http://ruta_al_visor.swf?video=http://ruta_al_video.flv&buffer=6”><param
name=”quality” value=”high”><embed src=”http://ruta_al_visor.swf?video=http://ruta_al_video.flv&buffer=6” quality=”high” pluginspage=”http://www.macromedia.com/go/getflashplayer” type=”application/x-shockwave-flash” width=”345” height=”300”></embed></object>

No olvides cambiar las rutas y los parámetros por los tuyos.

Licencia de uso
Si usas el módulo flash sería un detalle que mencionaras a tintachina y El Hombre que Comía Diccionarios y nos enlazaras :-) Si alguien considera que también serían útiles las fuentes no tiene más que decirlo. Y se haces mejoras (añadir control de sonido, botones avance y retroceso, enlaces directos a distintos vídeos o fragmentos) ¡compártelas!

(Gracias a Jabalí, A.Rivadulla, Obokaman y A.Barranco por sus valiosas aportaciones).

(27/03/2005: Alberto Álvarez-Perea ha escrito un resumen de su experiencia videoposteando la Semana Santa)

¡No te cortes y déjanos la dirección (url) de tu primer videopost en los comentarios para que todos lo podamos ver!

Preguntas que te estarás haciendo
Por último, os comento algunos datos de tráfico. En tres días, el vídeo sobre el escritor Javier Marías, que pesa 1,15 MB, ha sido visto 1000 veces. El ancho de banda consumido de un día normal (100 MB) se multiplicó por cinco, hasta los 500 MB, el día de mayor número de visitas. No todos vuestros usuarios van a ver los vídeos, así que el cálculo no es: “número de visitas”x”peso del vídeo”.


Comentarios




Jabalí:

Gracias por el recurso Gemma, vamos a echarle un tiento.


obokaman:

¡Interesante! De hecho recuerdo haber hecho pruebas con videos en algunos posts, usando interfaces en flash, antes del post de “La Cosa Húmeda”, allá por diciembre del 2003 (http://www.obokaman.com/mensaje.php?post=117 y http://www.obokaman.com/mensaje.php?post=116), pero que no podríamos considerar “videoposts” en el sentido estricto, sólamente ilustraban parte del contenido. Esas veces incrusté directamente los videos en el propio swf que generaba. Ahora estoy probando con algo parecido a lo que comentais, una especie de “reproductor” que carga con el método loadmovie la imagen, el video o la canción que sea, adaptándose el interfaz al tipo de archivo que sea. Mucho más práctico, sobretodo en términos de transferencia (sólo se dercarga entero si al lector le interesa), y ofrece la posibilidad de gestionarlo todo desde el propio CMS que se use incluso.

Algún lugar donde comprobar la lista completa de formatos que es capaz de leer Flash? Hay posibilidad de ampliar sus posibilidades? Si pudiera usar/importar OGG… :P


jp:

disculpen..como genero el fichero .fvl???

ya que el flash solo me deja guardar en .fla

desde ya muchas gracias


Jabalí:

jp, me encontré con ese mismo problema. La solución está en convertir el audio con un conversor como Riva (convierte directamente .avi o .mov a .fvl, funciona perfectamente y es gratuíto)


Alejandro Rivadula:

Ya lo he probado y la verdad es que es muy sencillo. He puesto en mi página una prueba y un pequeño tutorial que ayude un poco más a la gente, por si interesa


Alejandro Rivadula:

ups, la url de mi prueba es: http://rivadulla.info/archivos/videoposts/videopost_i.php


Leonel:

Espectacular, me gustaría conversar más acerca del tema en el futuro


tintachina:

Me alegro mucho de que os hayáis decidido a probar los videoposts :-)


obokaman:

Hola, Gemma,

ya conseguí hacer algunas pruebas con el reproductor de archivos de audio. Supongo que aplicar la barra de progreso y los botones de FFW y REW al reproductor de videoposts no sería complicado. Podeis ver la prueba en http://www.obokaman.com/mensaje.php?post=442

Sigo a la busca de un conversor al vuelo de mpg o avi a flv!

Un saludo!


Antonio Barranco:

En mi empresa hemos hecho reproductores corporativos con tecnología Flash y me permito daros algunos consejos.

Flash no es el único producto que genera archivos FLV. Puede resultar más cómodo, sencillo y sobre todo barato generarlos con “Sorenson Squeeze” o con “QuickTime” usando el componente “Macromedia Flash Video Exporter”.

El formato FLV usa compresion Sorenson (al igual que “QuickTime” para el vídeo y MP3 (si no recuerdo mal) para el audio.

A mi parecer esos dos productos son mejores compresores que el propio Flash, muestran mas opciones de encoding y es mas sencillo obtener resultados de mayor calidad y tamaños de archivo significativamente menores.

Así que si unimos que dichas licencias son mas económicas que la de “Flash”, y que la posible reducción de tamaño de los ficheros generados puede abaratar el coste de nuestro hosting en base a una reducción de la cantidad de transferencia utilizada, puede que sea bastante interesante prestar atención a dichas alternativas.


tintachina:

Muchs gracias Antonio, lo voy a probar.


Gurusblog:

Simplemente muchas gracias por el recurso. Francamente interesante.


tintachina:

Gracias a ti por hacer que llegue a más gente.


Stormy Mondays:

Muchas gracias por la idea… Gracias a tu videopost me decidí a implantar un reproductor mp3 hecho en flash en la web de Stormy Mondays (recurrí a uno de pago, bastante asequible). Es la primera vez que me parece que la tecnología Flash es realmente útil, apropiada, necesaria e incluso la mejor opción desde el punto de vista de la usabilidad!!!

Ahora tengo que tener un poco de paciencia para convertir los videoclips…


RoninRojo:

guau!! no tenía ni idea de los videoposts! me parece alucinante!! y en flash, me encanta! A mi me gustaría que me pudieras pasar las fuentes, si no hay problema, o las publicases, para poder estudiar el código y modificar la apariencia para adaptarlo a la imagen del blog de cada uno. Excelente iniciativa!


RoninRojo:

Vale veo que el código está en el .zip, jeje gracias!


tintachina:

RoninRojo, no dejes de avisarnos si mejoras el visor!


oscar:

Hola Tintachina: Un buen amigo y escritor navegante( http://elforastero.blogalia.com/) me recomendó tu página, en especial, los esfuerzos realizados por muchos ustedes para hacer más interactivas las weblogs. Me he tomado la libertad de bajarme el player y seguir tus consejos para visionar algunos videos en mi bitácora. Me gustaría que le eches un vistazo cuando puedas y se animen todas a verlas. Desde ya muchas gracias. Un saludo caníbal. (http://geometriacanibal.blogspot.com/)


obokaman:

Hola de nuevo, Gemma. Como ya te comentaba, he intentado añadir la opción de avanzar-retroceder a la idea original del reproductor de video. Puedes, finalmente, ver el resultado en http://www.obokaman.com/mensaje/458. Así como en el reproductor de MP3 (http://www.obokaman.com/mensaje/442 y http://www.obokaman.com/mensaje/443) funcionaba el tema de la barra de progreso, en el video, al usar un método de streaming, no sabemos a priori la duración total, y seria un poco complicado intentar extraerla a partir del tamaño del archivo , un dato que sí conocemos de inicio.
He puesto el enlace para descargar el código de ambos, así que si alguien consigue añadir la barra de progreso, o incorpora cualquier mejora a cualquiera de ellos… Adelante, y que avise! ;D


absurnauta:

Gracias por todo a todos.Me costo pero ya lo consegui. Ya solo tengo que encontrar algo util que colgar en el video, por el momento solo se me ocurren cosas absurdas. http://absurnauteces.blogspot.com


oriol:

Pues llevo una horita intentándolo y no hay manera, al entrar en mi post me dice que necesito el playes, en cambio puedo ver vuestros videoposts sim problemas…
La url de test:

http://www.estamosdeacuerdo.net/testestamos/archives/videopost.html


tintachina:

Oriol, ¿es posible que al copiar y pegar el fragmento de código hayas incluido algún retorno de carro? Elimínalo y prueba de nuevo.


oriol:

Ya funciona, era por culpa de unos caracteres (mayusculas) que el Mac me ha añadido en los archivos ;-)

http://www.estamosdeacuerdo.net/archives/como_desplegar_una_brompton.html


alexqk:

¡Videofrasco!
http://www.elfrascodelodio.com/?p=520

Muchas gracias :)


Elías:

Aquí tenéis otro videopost: la primera vez que nieva en Melilla (España, ¡África!) en unos treinta años.

http://lalengua.blogspot.com/2005/01/nieve-y-palmeras.html

Un saludazo (gracias Gemma por sugerirme que anunciase mi videopost en tus comentarios).

Elías - La Lengua


minaya:

Hola, en primer lugar muchas gracias por aportar el programa a todo el mundo. Pongo aquí mi primer experimento, con calidad pésima porque está grabado con la cámara del móvil:

http://www.multiuso.com/multiuso.php?id=189

El único problema que tengo es que al hacer el flv con el Riva FLV Encoder el sonido se desincroniza bastante con la imagen. ¿Le pasa a alguien más? ¿Aconsejais alguna configuración? (Aunque probé bastantes…) ¿O será mejor que pruebe otro de los codificadores?

Un Saludo!


Lestat:

Pues yo también lo he probado y también funciona (más o menos) bien. Resulta que he colgado dos videoposts:

Uno sin sonido:

http://quepasapues.blogspot.com/2005/02/y-esto-un-videopost.html

y otro con sonido:

http://quepasapues.blogspot.com/2005/02/y-otro-videopost-esta-vez-de-un.html

El único problemilla que he observado es que en el primero, unas veces el video se visualiza bien, pero otras veces se ve a cámara rápida. ¿A qué se deberá? El segundo (el que lleva sonido) va de cine.

En cuanto a la pregunta de minaya, a mi el RIVA FLV ENCODER me va bien. ¿Has comprabado que el archivo original este sincronizado?


minaya:

Gracias a Lestat por la respuesta. Veo que el Riva funciona bien, por lo tanto algo haré mal. Los vídeos originales están sincronizados pero están en formato 3gpp. Quizá tenga problemas con este formato. Haré más pruebas cuando tenga tiempo, e informaré por aquí.

Por cierto, el primer post de Lestat no consigo verlo con el Firefox (sí con IE, aunque a veces a cámara rápida como dice). Con el segundo videopost no hay ningún problema. Qué cosas…


Roberto:

Help !!!
Me tira el siguiente error: “Error: archivo .flv no disponible”
Probe cambiar las rutas pero nada, espero a mi salvador..


Alberto A-P:

¡Hola!

Ya he puesto mi primer videopost. El programita me parece genial, no había tenido opción de probarlo hasta hoy, pero creo que repetiré en el futuro. Sólo le encuentro un “pero”, estaría bien que se pudiese redimensionar el reproductor. Y una barra de progreso sería idílico.

Mi primer videopost: http://www.alvarezperea.com/alberto/weblog/?p=171


Virgulilla:

Llevo dos horas intentando poner un videopost y estoy, ya, desquiziado. ¿Esto es sólo pra Mac o también para PC? Utilizo Movable Type y cuando le doy a PREVIEW no me sale nada, ¿es normal?

Saludos!


Virgulilla:

Solucionado…. http://www.e-dazibao.com/criterio/archivos/000391.html

Saludos a todos!!!!


juanjosearri:

Hola a todos,

Muchos de mis videos tienen formato vertical. Al editar con Riva se me convierten en horizontal, deformando la imagen… cuando me lo convierto con el propio Flash el sonido se me de sincroniza muchísimo… alguna solución a uno u otro problema??

( ; entre que escribo esto y lo publico hallo algunas soluciones, las publico por si pudiesen servir. La solución al sonido de sincronizado la encontré poniendo antes el documento de flash a 25 fps. Los fotogramas por segundo deberán coincidir con los del video que pretendas importar… supongo ; )

Riva es un programita encantador, me encantaría saber si es posible la edición en formato vertical, para no dejar nunca de usarlo… pero mucho me temo que no será posible, las opciones son las que hay y no parece que se pueda indagar en él
Me encantan éstos tipos de software tan limpios y sencillos… todo funcionalidad… la sensación de uso mola… muy flash… muy mac…

Porqué no puedo controlar el “streaming” en el Riva player cuando abro un archivpo flv???.

He publicado el video haciendo la arquitectura en Dreamweaver, pero me gustaría saber si se puede montar en flash… sobre todo porque en flash, más o menos sé poner una progressbar. Cosa que encuentro de vital importancia a la hora de intentar visionar un video de 5 Mb.

Al player que habeis diseñado (muy minimalista y muy digno él) una barra de “streaming” y un control de volumen sería muy adecuado no? Con la imposición de tragarse el video completo y tener que empezar desde el principio queda un poco Tercer Reich (no sé si lo escribo bien)
Yo soy incapaz de hacerlo… de verdad.

A que puede ser debido que, en un html con dos reproductores, uno empiece vacío y otro aparece con el primer fotograma del video???

Alguna manera de incrustar un html en un flash??? Reconozco que algunas cosas se hacen muy bien en Dreamweaver, pero se me dá mejor el flash para casi todo, poder incrustar el uno en el otro al igual que incrustas el otro en el uno… estaría bien.

A ver si veo como vá lo de publicar en blogs, así puedo acompañar mis palabras con imágenes.

Muchas gracias a todos por todo, seguiré peleando duro… duro….


juanjosearri:

A quedado muy largo, lo siento…


juanjosearri:

para Alberto A-P:

yo he conseguido redimensionar el player. Es muy facil: en flash, te desbloqueas/bloqueas con cuidado las capas de fondo, video y máscara. En propiedades cambia el tamaño de cada capa y… no olvides redimensionar también el documento, guardalo con otro nombre, en otra carpeta (a mi se me redimensionó automáticamente otro que ya tenía editado) y ya está…


Alberto A-P:

juanjosearri:

Muchas gracias. Le echaré un vistazo.

Por cierto, que estoy haciendo un uso masivo de videoposts en mi blog para retransmitir la Semana Santa. Por si queréis verlo.


dsfs:

¿Has leído esto?

http://www.ibarretxe.com/about/software


tintachina:

No sabía nada. De hecho aún no me lo creo:

El visor de vídeo es obra de Gemma Ferreres, de Tintachina , que distribuyó el producto libremente en su blog, simplemente pidiendo un enlace al mismo y a El Hombre que comía diccionarios , detalle con el que cumplimos gustosos.

:)


Alfredo:

Hola te escribo desde Cordoba,Argentina,quisiera datos de tu servidor o como conectarme con el.Tu nota me resuelve un problema enorme. Agradecere tu respuesta


tintachina:

Alfredo, dirígete a http://phihosting.com/


ylek:

yo que llego directo desde el enlace de ibarretxe.com/about/software y leo por ahí que vos no sabías de el.
no hay caso, cuando uno hace las cosas porque le viene en gana y no busca ningún provecho, en algún momento llegan los reconocimientos.
por mi parte, te agradezco esta herramienta que nos regalás a todos.
saludos!


Javier:

Otro más para el bote:

http://www.catorze.com/blog/articulos/videocast.php

Saludos y gracias.


Javier:

Sorry, es
http://www.catorze.com/blog/articulos/videopost.php


Rodri:

Me ha gustado mucho el recurso de videopost además de ser muy práctico. He puesto un video corto de prueba en mi blog… http://eldiaridunrodriguez.blogspot.com


glipto29:

Gracias por esta noticia y por permitirnos descargar el visor. He llegado aqui gracias a un post de Ylek ( http://todolosolido.com.ar/weblog/ ) Experimentaré hoy con algun archivo .mov de mi nueva camarita. … y veremos que sale…


ylek:

aquí está el producto http://todolosolido.com.ar/weblog/?p=536

gracias nuevamente


redactor:

Gracias por explicar lo del videopost y felicidades por el dip. Por cierto, que hosting contrataste? Es muy caro para un particular que no pretende sacarle ningun beneficio económico?


tintachina:

¿Cómo ves 9,95 dólares al mes?

El mío es phihosting.com pero también es muy popular dreamhost.com


Sonia Blanco:

Muchas gracias Gemma por tu paciencia.

He aquí mi prueba :)

Videopost 1


Sonia Blanco:

Perdón que antes no funcionó el enlace, ahora lo dejo aquí :

http://www.filmica.com/sonia_blanco/archivos/001397.html


Escribe un comentario







¿Recordar información personal?