Okey, este es el plan: vamos a crear un sitio Web que consista en una portada (también conocido como inicio o 'home') y tres secciones. En su parte principal tendremos una botonera que nos permitirá navegar entre cada una de ellas y, por supuesto, regresar a la portada.

Y en un derroche de originalidad sin par, bautizaremos nuestro trabajo como "el sitio de los colores" (sí, llevo años haciendo clases con el mismo ejemplo).

Comencemos con un archivo nuevo. Si diseñamos pensando en los usuarios con pantallas en resolución de 800 x 600 – casi el 50% de Chile – usaremos un tamaño de 760 x 420 pixeles para asegurarnos de que puedan ver el sitio en plenitud. Ahora, si somos más progres y apuntamos a la otra mitad del país con una resolución de 1024 x 768, podemos ampliar hasta 955 x 600.

¡Ah! Desde aquí puedo oler sus preguntas (...salvo que sea el cajón de arena de mi gato): ¿no que Flash permite expandir las películas a cualquier tamaño? En efecto, pero se suele tener problemas con las proporciones, en especial cuando se incorporan elementos de mapa de bits, como imágenes, fotografías o tipografías de pixeles (pixel fonts).

La regla sería entonces que si deseas un diseño prolijo, no juegues al elástico con Flash.

Para efectos de este tutorial no nos complicaremos. Trabajemos con el tamaño estándar proporcionado por el programa: 550 x 400 pixeles. Si necesitan modificarlo, pueden recurrir al menú Modificar > Documento, o bien desde el inspector de propiedades.

Nuestro primer movimiento será crear la portada. No es necesario que sea un candidato a los Webby; para el caso, bastará con tomar la herramienta de texto, darle un título a nuestro sitio y unas breves indicaciones.

Una buena idea es alinear las letras al centro de la película, pero déjenlas un poco cargadas al lado izquierdo pues dentro de poco insertaremos la botonera en el extremo opuesto.

¿Listo? Ahora vamos por las secciones. Lo más simple sería ir creando fotogramas clave a lo largo de la línea de tiempo para cada una de ellas, pero nuestro sitio quedará mejor organizado si sacamos partido a una función divisoria llamada Escenas. Para esto, pulsa sobre el menú Insertar > Escena.

Whoa! ¿Qué pasó? ¿Un archivo nuevo? Nada de eso. Las escenas crean una nueva línea de tiempo dentro del archivo Flash, transcurriendo en forma consecutiva o cuando nosotros le indicamos a la película que vaya de una a otra. La portada aún está allí. Basta ir al botón de Escenas en el lado superior derecho de la linea de tiempo para pasar de una a otra.

Bien. En esta nueva escena, escribe SECCIÓN ROJA (con el color correspondiente) y pon alguna forma para amenizar. Con un círculo o cuadrado estará bien. Que se capte la idea.

Crea una nueva Escena desde el menú y repite la operación con SECCIÓN VERDE (y su color). Intenta darle otra organización a los elementos para que se note variedad. Haz lo mismo con la SECCIÓN AZUL, pero recuerda en todas ellas dejar una leve franja desocupada al lado derecho.

Al finalizar tendrás cuatro escenas (portada + secciones roja, verde y azul). ¡Felicitaciones! Aunque no lo creas, esta es la base de tu sitio Web.

Y sí, puede que no parezcan gran cosa... pero con botones comenzará a tomar forma. Vamos a eso.

Creando una botonera y sus acciones >>