Usted no tiene que ser un experto en Flash para crear prototipos. La flexibilidad del programa permite la creación de un prototipo con un conocimiento limitado de ActionScript 3 . Prototipado rápido ayuda a los usuarios a visualizar el producto final. Flash le permite crear prototipos de fidelidad variable ( hasta qué punto el prototipo se parece al producto final) , por lo que es fácil de actualizar capas interactivas y los conceptos de diseño de wireframes simples a diseños detallados y completos. Instrucciones
Preparación
1
Crear imágenes que representan las pantallas y los Estados requeridos, utilizando programas como Fireworks , Photoshop o Corel . La fidelidad de las imágenes puede ser en cualquier lugar de alambre de diseños visuales ( ver referencia 2 ) .
2
Open Flash y haga clic en " Archivo", luego haga clic en " Nuevo" y luego haga clic en " Archivo de Flash ( ActionScript 3.0 ) "en el menú que se abre. Haga clic en " Ventana" en el menú principal , luego haga clic en "Propiedades" y luego haga clic en "Propiedades" de nuevo en el menú desplegable. Escriba " 1024px " en el campo " W " y " 768px " en el campo "H".
3
Guarde el archivo haciendo clic en "Archivo " en el menú principal, haga clic en " Guardar como ", escriba un nombre (como" proto ") y haga clic en" Guardar ".
4
Importar sus imágenes haciendo clic en " archivo ", luego haga clic en" Importar "y luego haciendo clic en " importar a biblioteca " . Vaya a donde las imágenes se haga clic en " Abrir". Si las imágenes están en secuencia , Flash importará automáticamente como fotogramas clave sucesivos de la capa seleccionada , de lo contrario tendrá que añadir fotogramas clave , haga clic en el cuadro, haga clic en " Insertar fotograma clave " en el menú desplegable para cada imagen ( ver referencia 3 ) .
5
Nombre de la capa de " Wire" haciendo doble clic en el "Nivel 1 " y presionar "Enter " en su teclado . Añadir fotogramas clave entre imágenes en la línea de tiempo , haga clic en el primer fotograma clave y presionando "F5 " en el teclado en cuatro ocasiones ( ver referencia 2 ) .
6
Dar su imagen nombres marcos haciendo clic en " Ventana " en el menú principal, luego haga clic en "Propiedades" y luego en "Propiedades" de nuevo en el menú desplegable. Con un cuadro de imagen resaltado, escriba el nombre de la imagen en el campo " Etiqueta de fotograma " . Repita este proceso para el resto de imágenes (ver referencia 2 ) .
7 Crear una nueva capa haciendo clic en " Insertar capa " en la parte inferior de la línea de tiempo y nombrarlo " AS3 . " Haga clic en el fotograma 1 de la capa " AS3 " y haga clic en "Acción " en el menú desplegable. Escriba el siguiente código:
stop ();
( . Ver referencia 2 )
Button
8
doble haga clic en " color de relleno " en la barra de herramientas , haga clic en " None" por el color ( que será el cuadro con una línea roja diagonal) . Haga doble clic en " Color de trazo " en la barra de herramientas e introduzca un valor de " 3 " en " Stroke Altura ", haga clic en cualquier color ( ver referencia 2 ) .
9
Haga clic en la herramienta "Rectángulo " en la barra de herramientas y, manteniendo pulsado el ratón , arrastre por el escenario para dibujar un rectángulo . El rectángulo debe ser un tamaño apropiado para las zonas se puede hacer clic . Haga clic en la herramienta "Rectángulo " y, a continuación , en el menú principal, haga clic en " Modificar ", después haga clic en " Convert to New Symbol " en el menú desplegable. Haga clic en la casilla " Button " radial y escriba " Button_btn " para el nombre ( ver referencia 2 ) .
10
doble clic en el botón para entrar en su línea de tiempo . Haga clic en el fotograma con la etiqueta " Hit ", y elegir la opción " Insertar fotograma clave . " Cambiar el color del botón . Haga lo mismo con " Over ". Elimine el color de " Up ". Esto le dará un botón invisible que se puso de relieve cuando el usuario coloca el ratón sobre ella. Haga clic en " Escena 1 " en la parte inferior de la línea de tiempo para salir de la línea de tiempo del botón. Eliminar el botón de la etapa ( ver referencia 2 ) .
11
Crear una nueva capa haciendo clic en " Insertar capa " en la parte inferior de la línea de tiempo , y el nombre de la nueva capa "Botones ". Insertar fotogramas clave en la capa " botones" en los mismos números de trama como las imágenes de la capa de " Wire" (ver referencia 2 ) .
12
Arrastre un " botón " de la biblioteca y colóquelo en la etapa . Haga clic en " Ventana" en el menú principal , luego haga clic en "Propiedades" y luego haga clic en "Propiedades" de nuevo en el menú desplegable. Con el botón aún seleccionado, introduzca un nombre de instancia única , como el nombre de la página que se vaya a , por ejemplo, " page1_btn " ( ver referencia 2 ) .
13
Haga clic Frame 1 de la capa " AS3 " y haga clic en "Acción " en el menú desplegable. Escriba el siguiente código, sustituyendo " page1 " para sus nombres de etiqueta de marco :
page1_btn.addEventListener ( MouseEvent.CLICK , onPage1 , false, 0 , true) ;
función
onPage1 ( evt : MouseEvent ) : . void {
gotoAndStop ( " page1 "); }
14
Repita el proceso para otras páginas
< br >