He creado animaciones, creo que fue con imagemagick. Tuve que convertir todas mis imágenes a gif, nombrarlas archivo00.gif, archivo01.gif, etc., luego tuve que escribir un comando. Debería haberlo escrito...
Uno de los parámetros fue la duración de cada cuadro. Todos tuvieron la misma duración.
Ahora me gustaría hacer lo mismo pero con un tiempo personalizado para cada imagen.
file00.gif debe mostrarse durante 5,25 segundos, file01.gif debe mostrarse durante 3,8 segundos, etc.
Me gustaría que vaya con algo de música. Usando Audacity, pude enumerar los momentos precisos en los que la imagen debería cambiar.
Pensé en duplicar las imágenes, hacer 525 copias del archivo 00.gif y establecer la duración de cada una en 0,05 segundos, pero esto crearía un archivo enorme.
¿Cómo puedo hacer esto, por favor?
¿Y cómo puedo agregar la música? Supongo que tendré que convertir mi gif animado a algún otro formato, pero ¿cuál?
Respuesta1
Encontré otra manera. Aparentemente, todos los cuadros en gif animados se muestran durante el mismo período de tiempo.
Escribí un poco de javascript para mostrar mis imágenes y reproducir música al mismo tiempo. Aquí está el código completo, si alguien está interesado.
<HTML>
<head>
<title>FuzzyWuzzy</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
table {
border: 1px solid black;
border-collapse: collapse;
}
</style>
</head>
<body>
<audio id="SONG">
<source src="Fuzzy_Wuzzy_Was_A_Bear_10sec.ogg" type="audio/ogg">
<source src="Fuzzy_Wuzzy_Was_A_Bear_10sec.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<table style="width:100%" id="table" name="table">
<tr>
<div> <img src="PNG/bear1_vid.png" id="pic" style="height:80%"></div>
</tr>
<tr>
<div id="text"><div>
</tr>
<tr>
<button onclick="openFullscreen();">Open Video in Fullscreen Mode</button>
</tr>
</table>
<script>
document.getElementById("text").innerHTML = " ";
video();
function video() {
var x = document.getElementById("SONG");
x.play();
setTimeout(function () {
document.getElementById("pic").src = "PNG/bear1_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/bear2_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/bear3_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/bear4_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/bear5_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/bear6_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/worm1_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/worm2_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/worm3_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/worm4_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/mouse1_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/mouse2_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/mouse3_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/mouse4_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/mouse5_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/mouse6_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/bear2_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/bear3_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/bear4_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/bear5_vid.png";
setTimeout(function () {
document.getElementById("pic").src = "PNG/bear6_vid.png";
}, 2400); // Bear
}, 2350);
}, 2450);
}, 2400);
}, 4800);
}, 2450); // Mouse
}, 2350);
}, 2450);
}, 2350);
}, 4800);
}, 9600);
}, 4800); // Worm
}, 4900);
}, 4300);
}, 10000);
}, 2450); // Bear
}, 2350);
}, 2450);
}, 2300);
}, 5250);
}, 10000);
}
var elem = document.getElementById("pic");
function openFullscreen() {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) { /* Safari */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE11 */
elem.msRequestFullscreen();
}
}
</script>
</body>
</HTML>
Debería funcionar si tiene imágenes png en un subdirectorio llamado PNG, con los mismos nombres (por ejemplo: oso1_vid.png). Las duraciones están en milisegundos y se escriben en orden inverso (debido al setTimeout anidado). Luego lo adaptas como quieras. Guarda el archivo en "algo.html" y lo abre con un navegador. (Yo uso Firefox).
Entonces podría reproducirlo en pantalla completa. Agregué 10 segundos de silencio al comienzo de mi archivo de audio e hice que la primera imagen se mostrara durante 10 segundos adicionales. Para la imagen, puedes verlo en el código. Para agregar el silencio en el audio utilicé Audacity (coloque el cursor al comienzo del archivo y seleccione "Generar/Silencio").
Tuve que agregar estos segundos para grabar la pantalla completa, que es la opción más sencilla. Utilicé SimpleScreenRecorder, que es fácil de usar. Sólo tienes que acordarte de desmarcar la casilla "grabar cursor". Al comienzo de mi grabación, vi que Firefox se abría y este mensaje tonto "Este video ahora está en pantalla completa", que no encontré cómo eliminarlo (¿todavía?). Como si no supiéramos que el vídeo estaba en pantalla completa.
De todos modos, terminé con un vídeo .mkv y pensé: "Casi estoy. Ahora sólo tengo que encontrar cómo cortar el principio y el final del vídeo".
Ja.
Animationmaker estrelló mi PC. Avidemux no se instaló. Tuberia rota. vidcutter siguió eliminando la parte que quería conservar y guardando la parte que quería eliminar. oneshot no se detendría en 10 segundos, pase lo que pase. Siguió saltando de 9 y tantos a 10,3 segundos. No encontré el comando "cortar" en kdenlive. ffmpeg copió todo el video, aunque configuré cuidadosamente la hora de inicio y la duración. avconv no fue encontrado mediante la búsqueda de apt-cache.
Pitivi finalmente hizo el truco. Con esto es bastante fácil. Cargue el archivo de video en la pequeña subventana a la izquierda, arrástrelo a una pista, coloque el cursor donde desea cortarlo. El botón de cortar y el botón de eliminar están en el lado derecho de la ventana. Una vez cortada una pieza, haces clic en ella para seleccionarla y haces clic en eliminar. Si la pieza que cortaste está al comienzo del video, arrastra la pieza restante hacia la posición inicial.
Para guardar, no haga clic en "Guardar", haga clic en "Renderizar". Tiene la opción de elegir entre formatos de salida. Elegí mp4 y ogv. mp4 es más pequeño, ogv es de mejor calidad. El renderizado lleva un tiempo.
Pero no tanto como me llevó darme cuenta de todo eso :).