¿Cómo realizar animación y creación de pop up utilizando flash?
Estoy empezando en flash y tengo unas inquietudes.
Tengo que hacer mi portafolio como proyecto en la U y quería hacer un muñequito que camine por la pantalla y luego tengo algunas acciones con los botones, como crees que sea mejor animarlo, cada parte, ¿cómo un símbolo o como un movie clip?
Para cada parte o sea cada pantalla como hago, ¿por ejemplo "dibujos" en una escena y "galeria" en otra escena y si es así luego que script utilizo para ir de una escena a otra?
Como se hace un cargando y si me puedes hacer una sugerencia interesante para un cargando soy pintor y diseñador.
¿Y cómo se hace un pop-up completo o sea hago la página con mi logo hago click y luego se hace un pop-up con la página completa y se puede personalizar el tamaño?
Se que es mucho pero les agradezco su ayuda.
Zantoz
Tengo que hacer mi portafolio como proyecto en la U y quería hacer un muñequito que camine por la pantalla y luego tengo algunas acciones con los botones, como crees que sea mejor animarlo, cada parte, ¿cómo un símbolo o como un movie clip?
Para cada parte o sea cada pantalla como hago, ¿por ejemplo "dibujos" en una escena y "galeria" en otra escena y si es así luego que script utilizo para ir de una escena a otra?
Como se hace un cargando y si me puedes hacer una sugerencia interesante para un cargando soy pintor y diseñador.
¿Y cómo se hace un pop-up completo o sea hago la página con mi logo hago click y luego se hace un pop-up con la página completa y se puede personalizar el tamaño?
Se que es mucho pero les agradezco su ayuda.
Zantoz
Respuesta de peloto
1
Wow... si que son muchas preguntas... pero si a ti no te importa leer a mí no me importa escribir.
Vamos por partes.
Pregunta 1
Para animar a un personaje, todo depende del tiempo que tengas y la calidad que desees.
Lo más sencillo sería que el muñeco fuera un movieclip con una animación sencilla (movimiento de piernas y balanceo de brazos) y lo animases desde la línea de tiempo con una interpolación de movimiento para que se moviera.
Pero si quieres dividir el muñeco en cinco símbolos (uno por extremidad, y otro tronco y cabeza) y animarlos por separado, la calidad es mayor porque las posibilidades de corregir movimientos son mayores.
Lo dejo a tu elección.
Pregunta 2
Yo siempre que trabajo, divido la película en cuantas más partes, mejor. Es preferible tener 10 escenas limpias y claras, que 3 confusas.
Para poder ir de una escena a otra, utiliza el comando gotoAndPlay desde el botón o frame que desees. Por ejemplo:
GotoAndPlay("galeria", 1); donde galería es el nombre de la escena y 1 el número de fotograma al que quiero que vaya una vez dentro de la escena galería. Recuerda que el nombre de la escena debe ir entre comillas ("").
Pregunta 3
Si lo que deseas es un preload, puedes ir al "lab" de Kadazuro:
http://www.kadazuro.com/html/index.html
Allí encontrarás muchos preloaders para descargar y configurar a tu gusto.
Yo creo que para comenzar son más que suficientes, aunque si quieres darle un toque de "pintor-diseñador", puedes retocar la barra de porcentaje, coger una fuente chula, o añadir algún gráfico que te destaque del resto ;).
Pregunta 4
Para hacer un popUp, tienes que tener un código, tanto en tu página html como en la película de flash que insertes.
En el archivo html donde insertarás tu película de flash, inserta en el head el siguiente código:
<!--
function MM_openBrWindow(theURL,winName,features) { //v1.2
window.open(theURL,winName,features);
}
//-->
En la película de flash, inserta el siguiente código donde quieras (fotograma, botón...):
javascript:MM_openBrWindow('PAGINA.htm','window','resizable=NO,location=NO,directories=NO,status=no,menubar=NO,toolbar=NO,resizable=NO,titlebar=NO,width=ANCHOFOTO,height=ALTOFOTO')
Ajusta los parámetros como mejor te convengan:
- location = barra de localización
- directories = barra de direcciones
- status = barra de estado
- menubar = barra menu
- toolbar = barra de herramientas
- titlebar = barra de titulo
- resizable= que el usuario pueda modificar el tamaño
- width = anchura
- height= altura
Para cerrar una ventana previamente abierta, basta con poner al botón el siguiente vínculo:
Javascript:window. Close()
Espero que te haya servido de ayuda. Si te quedan dudas, consúltame.
Vamos por partes.
Pregunta 1
Para animar a un personaje, todo depende del tiempo que tengas y la calidad que desees.
Lo más sencillo sería que el muñeco fuera un movieclip con una animación sencilla (movimiento de piernas y balanceo de brazos) y lo animases desde la línea de tiempo con una interpolación de movimiento para que se moviera.
Pero si quieres dividir el muñeco en cinco símbolos (uno por extremidad, y otro tronco y cabeza) y animarlos por separado, la calidad es mayor porque las posibilidades de corregir movimientos son mayores.
Lo dejo a tu elección.
Pregunta 2
Yo siempre que trabajo, divido la película en cuantas más partes, mejor. Es preferible tener 10 escenas limpias y claras, que 3 confusas.
Para poder ir de una escena a otra, utiliza el comando gotoAndPlay desde el botón o frame que desees. Por ejemplo:
GotoAndPlay("galeria", 1); donde galería es el nombre de la escena y 1 el número de fotograma al que quiero que vaya una vez dentro de la escena galería. Recuerda que el nombre de la escena debe ir entre comillas ("").
Pregunta 3
Si lo que deseas es un preload, puedes ir al "lab" de Kadazuro:
http://www.kadazuro.com/html/index.html
Allí encontrarás muchos preloaders para descargar y configurar a tu gusto.
Yo creo que para comenzar son más que suficientes, aunque si quieres darle un toque de "pintor-diseñador", puedes retocar la barra de porcentaje, coger una fuente chula, o añadir algún gráfico que te destaque del resto ;).
Pregunta 4
Para hacer un popUp, tienes que tener un código, tanto en tu página html como en la película de flash que insertes.
En el archivo html donde insertarás tu película de flash, inserta en el head el siguiente código:
<!--
function MM_openBrWindow(theURL,winName,features) { //v1.2
window.open(theURL,winName,features);
}
//-->
En la película de flash, inserta el siguiente código donde quieras (fotograma, botón...):
javascript:MM_openBrWindow('PAGINA.htm','window','resizable=NO,location=NO,directories=NO,status=no,menubar=NO,toolbar=NO,resizable=NO,titlebar=NO,width=ANCHOFOTO,height=ALTOFOTO')
Ajusta los parámetros como mejor te convengan:
- location = barra de localización
- directories = barra de direcciones
- status = barra de estado
- menubar = barra menu
- toolbar = barra de herramientas
- titlebar = barra de titulo
- resizable= que el usuario pueda modificar el tamaño
- width = anchura
- height= altura
Para cerrar una ventana previamente abierta, basta con poner al botón el siguiente vínculo:
Javascript:window. Close()
Espero que te haya servido de ayuda. Si te quedan dudas, consúltame.
2 respuestas más de otros expertos
Respuesta de manuelaguado
1
La mejor forma para animarlo seria parte por parte en clips de película independientes, por lo regular al tratarse de animaciones lo más recomendable es trabajar en varias escenas para poder navegar entre ellas se usa gotoAndPlay("escena", 1) el numero seguido a escena corresponde al frame, para hacer un preloader el código es el sig:
Para que funcione se requiere de un clip de película llamado en este caso "barra" que estará colocado en el primer frame, un cuadro de texto dinámico con la variable "porcentaje" también colocado en el primer frame, y el tercer frame de la escena tendrá el nombre de "inicio", el funcionamiento es este:
De lo contrario,
para que puedas realizar un pupop el codigo debera de ir en el archivo html:
En la función openpopup se definen los parámetros de la ventana popup que se abre, en este caso después de definir la función openpopup se llama inmediatamente a la función, sin embargo se puede asignar la función a un botón, var popurl="index2.htm" en esta variable cargamos el nombre del archivo que se cargara en la popup, el tamaño de la ventana, esta definido en width=screen. width,height=screen. Height, que en este caso se definió a pantalla completa, es útil también que una vez que se llama al popup se acomode al centro de la pantalla, el código para lograrlo se coloca en el archivo que se llama (en este caso index2.htm), el código sería el sig:
Este caso supone una ventana de dimensiones 750 x 550 los valores se dividen entre dos con el fin de sacar su pinto medio que es lo que se resta a la mitar del ancho y alto de pantalla.
Finalmente una recomendación, cuando se me ocurrió hacer una animación no tenia ni idea de como comenzar, y lo mejor que pude hacer fue observar animaciones ya hechas, para ello también utilice el programa flash decompiler que me mostró en gran medida como se habían hecho y como se manipulaban los movimientos, posiblemente, sea una muestra de que carezco de imaginación, pero admito que me sirvió de mucho, por lo que te recomiendo que analices algo ya hecho, por ejemplo "http://www.happytreefriends.com". saludos y espero que tengas buenos resultados, cualquier duda solo dilo.
//en el primer frame
if (_root.getBytesLoaded()>=_root.getBytesTotal()) {
gotoAndPlay("inicio");
}
A = ((_root.getBytesLoaded()/_root.getBytesTotal())*100);
porcentaje = Math.round(A)+"%";
barra._xscale = A;
//en el segundo frame
gotoAndPlay(1);
Para que funcione se requiere de un clip de película llamado en este caso "barra" que estará colocado en el primer frame, un cuadro de texto dinámico con la variable "porcentaje" también colocado en el primer frame, y el tercer frame de la escena tendrá el nombre de "inicio", el funcionamiento es este:
if (_root.getBytesLoaded() // si los bytes que se han cargado,
>= // son mas o igual
_root.getBytesTotal() // a los bytes totales de la pelicula,
{gotoAndPlay("inicio"); // entonces ve i reproduce el frame que se llama inicio,
De lo contrario,
A = ((_root.getBytesLoaded()/_root.getBytesTotal())*100);// asigna a la variable "A" el valor de los bytes cargados divididos entre los bytes totales y multiplicalos por cien (la formula es para obtener el porcentaje cargado por regla de tres) porcentaje = Math.round(A)+"%";// asigna a la variable "porcentaje" el valor entero de la variable "A" y agrega el sombolo "%", barra._xscale = A; // asigna a el clip llamado barra en su propiedad "ancho" el valor correspondiente a el valor de la variable "A" (que ademas siempre correspondera a un valor entre 0 y 100), frame 2: gotoAndPlay(1);// ve y reproduce el frame numero uno,Esto es para que el código se repita indefinidamente hasta que la condición descrita en if se cumpla y salte al frame tres llamado inicio de lo contrario no existiría un valor de actualización y la barra y el cuadro de texto no mostrarían valores actuales.
para que puedas realizar un pupop el codigo debera de ir en el archivo html:
<HTML>
<HEAD>
<TITLE>tu título</TITLE>
</HEAD>
<BODY bgcolor="#ffffff" text="#808080">
<SCRIPT TYPE="text/javascript">
function openpopup(){
var popurl="index2.htm"
winpops=window.open(popurl,"","location=no,status=no,menubar=no,scrollbars=no,resizable=no,toolbar=no,width=screen.width,height=screen.height")
}
openpopup()
</script>
<SCRIPT TYPE="text/javascript">
window.opener=top
window.close();
</script>
</BODY>
</HTML>
En la función openpopup se definen los parámetros de la ventana popup que se abre, en este caso después de definir la función openpopup se llama inmediatamente a la función, sin embargo se puede asignar la función a un botón, var popurl="index2.htm" en esta variable cargamos el nombre del archivo que se cargara en la popup, el tamaño de la ventana, esta definido en width=screen. width,height=screen. Height, que en este caso se definió a pantalla completa, es útil también que una vez que se llama al popup se acomode al centro de la pantalla, el código para lograrlo se coloca en el archivo que se llama (en este caso index2.htm), el código sería el sig:
<SCRIPT LANGUAGE="JavaScript">
function centrar() {
window.moveTo((screen.width/2)-375,(screen.height/2)-275);
}
</script>
<SCRIPT TYPE="text/javascript">
centrar();
</script>
Este caso supone una ventana de dimensiones 750 x 550 los valores se dividen entre dos con el fin de sacar su pinto medio que es lo que se resta a la mitar del ancho y alto de pantalla.
Finalmente una recomendación, cuando se me ocurrió hacer una animación no tenia ni idea de como comenzar, y lo mejor que pude hacer fue observar animaciones ya hechas, para ello también utilice el programa flash decompiler que me mostró en gran medida como se habían hecho y como se manipulaban los movimientos, posiblemente, sea una muestra de que carezco de imaginación, pero admito que me sirvió de mucho, por lo que te recomiendo que analices algo ya hecho, por ejemplo "http://www.happytreefriends.com". saludos y espero que tengas buenos resultados, cualquier duda solo dilo.
¿Gracias
antes de ponerte los mil puntos que te mereces como hago un autorun si le quiero poner todo esto en un cd?
Mil gracias nuevamente
antes de ponerte los mil puntos que te mereces como hago un autorun si le quiero poner todo esto en un cd?
Mil gracias nuevamente
En lo personal cuando hago cd's autoejecutables, me gusta personalizar el ejecutable del player esto lo logro con el programa resource hacker http://www.users.on.net/johnson/resourcehacker/ con el se puede quitar el menu, el menu contextual y personalizar el titulo de la ventana, así como el icono. Para crear un autorun es necesario de tres archivos:
autorun.inf
ejecutable.exe
icono.ico
El archivo autorun.inf lo puedes hacer con tu block de notas en el se pone lo sig:
[autorun]
open=ejecutable.exe
icon=icono.ico
En caso de que el archivo ejecutable contenga un icono también puedes ponerlo como icono en el autorun de la sig forma:
[autorun]
open=ejecutable.exe
icon=ejecutable.exe
Los archivos deben de ir en la raíz del cd, caso contrario se especifica toda la ruta.
autorun.inf
ejecutable.exe
icono.ico
El archivo autorun.inf lo puedes hacer con tu block de notas en el se pone lo sig:
[autorun]
open=ejecutable.exe
icon=icono.ico
En caso de que el archivo ejecutable contenga un icono también puedes ponerlo como icono en el autorun de la sig forma:
[autorun]
open=ejecutable.exe
icon=ejecutable.exe
Los archivos deben de ir en la raíz del cd, caso contrario se especifica toda la ruta.
Respuesta
1
A ver, en cuanto al hombrecito, creo que lo mejor es realizar un movieclip (MC) donde el muñequito realice los movimientos de caminar pero hasta dar un par de pasos. Para que no tengas que volver a animar y animar la misma secuencia de pasos. Con que hagas los movimientos de levantar una pierna y la otra al caminar y que esto se repita creando un "loop".
El uso de escenas no es necesario, en realidad todo depende de como te quede más cómodo para trabajar.
Profesionalmente hay como un standard de no trabajar con escenas ya que al trabajar todo en una misma peli se puede visualizar todo lo que hay y aplicar scripts generales a todla la peli, que al trabajar con escenas se dificulta, ya que no se puede aplicar un mismo script a varias escenas sin tener que repetirlo en todas.
Por eso generalmente se trabaja todo en una misma peli, creando infinitos MC unos dentro de otros ya que facilita modificaciones a posteriori, crear transiciones entre MC, etc.
Para facilitar el trabajo es bueno crear "labels" para dividir como si fuera en escenas.
En cuanto a los cargando (llamados preloaders) hay muchas maneras de encararlos... Si necesitás algunos ejemplos podes fijarte en www.flashkit.com en la sección movies, preloaders.
En cuanto a la gráfica yo pondría algo relacionado a tu trabajo, teniendo en cuenta que no debe ocupar demasiado espacio en el archivo, ya que el preloader (sus gráficos y script) debe cargarse lo más rápido posible.
Para el pop-up necesitarás un javascript inserto en la página de inicio, el cual va a ser llamado por el botón en tu logo.
-----------------------------
<head>
<SCRIPT LANGUAGE="JavaScript">
<!--
function reDir() {
var url640x480 = "640.html";
var url800x600 = "800.html";
var url920x720 = "920.html";
var url1024x768 = "1024.html";
var url1152x864 = "1024.html";
var url1280x960 = "1024.html";
var url1280x1024 = "1024.html";
if ((screen.width == 640) && (screen.height == 480))
window.location.href= url640x480;
else if ((screen.width == 800) && (screen.height == 600))
window.location.href= url800x600;
else if ((screen.width == 920) && (screen.height == 720))
window.location.href= url920x720;
else if ((screen.width == 1024) && (screen.height == 768))
window.location.href= url1024x768;
else if ((screen.width == 1152) && (screen.height == 864))
window.location.href= url1152x864;
else if ((screen.width == 1280) && (screen.height == 960))
window.location.href= url1280x960;
else if ((screen.width == 1280) && (screen.height == 1024))
window.location.href= url1280x1024;
else window.location.href= url800x600;
}
// -->
</SCRIPT>
</head>
---------------------
Esto hace que se detecte la configuración de monitor del usuario y dependiendo de eso habrá tal o cual html, que contendrán los tamaños adaptados.
Claro que también se puede encarar el script de varias maneras, pero esta también es una solución.
Si vas a llamar al script desde html con añadir reDir();
En el link de la imagen ya está. Si vas a hacer un flash que tenga el botón del popup necesitás ponerle al botón un getURL con javascript:reDir(); para llamar al javascript que está inserto en el html.
El uso de escenas no es necesario, en realidad todo depende de como te quede más cómodo para trabajar.
Profesionalmente hay como un standard de no trabajar con escenas ya que al trabajar todo en una misma peli se puede visualizar todo lo que hay y aplicar scripts generales a todla la peli, que al trabajar con escenas se dificulta, ya que no se puede aplicar un mismo script a varias escenas sin tener que repetirlo en todas.
Por eso generalmente se trabaja todo en una misma peli, creando infinitos MC unos dentro de otros ya que facilita modificaciones a posteriori, crear transiciones entre MC, etc.
Para facilitar el trabajo es bueno crear "labels" para dividir como si fuera en escenas.
En cuanto a los cargando (llamados preloaders) hay muchas maneras de encararlos... Si necesitás algunos ejemplos podes fijarte en www.flashkit.com en la sección movies, preloaders.
En cuanto a la gráfica yo pondría algo relacionado a tu trabajo, teniendo en cuenta que no debe ocupar demasiado espacio en el archivo, ya que el preloader (sus gráficos y script) debe cargarse lo más rápido posible.
Para el pop-up necesitarás un javascript inserto en la página de inicio, el cual va a ser llamado por el botón en tu logo.
-----------------------------
<head>
<SCRIPT LANGUAGE="JavaScript">
<!--
function reDir() {
var url640x480 = "640.html";
var url800x600 = "800.html";
var url920x720 = "920.html";
var url1024x768 = "1024.html";
var url1152x864 = "1024.html";
var url1280x960 = "1024.html";
var url1280x1024 = "1024.html";
if ((screen.width == 640) && (screen.height == 480))
window.location.href= url640x480;
else if ((screen.width == 800) && (screen.height == 600))
window.location.href= url800x600;
else if ((screen.width == 920) && (screen.height == 720))
window.location.href= url920x720;
else if ((screen.width == 1024) && (screen.height == 768))
window.location.href= url1024x768;
else if ((screen.width == 1152) && (screen.height == 864))
window.location.href= url1152x864;
else if ((screen.width == 1280) && (screen.height == 960))
window.location.href= url1280x960;
else if ((screen.width == 1280) && (screen.height == 1024))
window.location.href= url1280x1024;
else window.location.href= url800x600;
}
// -->
</SCRIPT>
</head>
---------------------
Esto hace que se detecte la configuración de monitor del usuario y dependiendo de eso habrá tal o cual html, que contendrán los tamaños adaptados.
Claro que también se puede encarar el script de varias maneras, pero esta también es una solución.
Si vas a llamar al script desde html con añadir reDir();
En el link de la imagen ya está. Si vas a hacer un flash que tenga el botón del popup necesitás ponerle al botón un getURL con javascript:reDir(); para llamar al javascript que está inserto en el html.