AulaDirectiva comienza a impartir el curso ActionScript 3.0 en Flash CS3

Publicado el día 22-01-08 bajo la categoría Novedades :: (0)

AulaDirectiva se complace en ser la primera academia de enseñanza a distancia en ofrecer un curso en español sobre la más reciente versión de ActionScript.

El curso consta de 18 módulos teóricos (con ejemplos de aplicación) y un anexo sobre usabilidad.

Si bien los contenidos del curso podrán ser aprovechados por todos aquellos programadores con experiencia en versiones previas del lenguaje que deseen migrar a la nueva versión, no se requieren conocimientos de programación para comenzar a cursar. No obstante, es aconsejable disponer de una cierta base sobre el manejo de las herramientas de diseño y la interfaz de Flash.

La siguiente lista resume a rasgos generales los temas que se tratan en el curso:

» Conceptos y Elementos Básicos
» Variables y Tipos de datos
» Operadores
» Sentencias Condicionales y Bucles
» Funciones
» Clases, Objetos, Métodos y Propiedades
» Arrays (Matrices o Vectores)
» Gestión del Contenido Gráfico
» Botones y Movie Clips
» Transformaciones sobre Objetos Gráficos
» Creación y Manipulación de Textos Dinámicos
» Generación de Gráficos Vectoriales
» Creación y Manipulación de Imágenes Bitmap
» Nueva Arquitectura para el Manejo de Eventos
» XML y la Sintaxis E4X
» Componentes de Interfaz con el Usuario (UI v3)
» Manejo de Archivos
» Operaciones sobre Cadenas de Texto
» Cálculos Matemáticos
» Funciones de Fecha y Hora
» Animación Dinámica
» Gestión Multimedia (Audio y Vídeo)
» Recursos y Usabilidad

Los alumnos contarán en todo momento con el soporte de un tutor especializado en la materia, al que podrán consultar ante cualquier duda relativa a los contenidos del curso.

Una vez asimilados los módulos teóricos y resueltas todas las prácticas propuestas, los alumnos desarrollarán una completa aplicación a modo de proyecto final, que les permitirá poner a prueba sus conocimientos.

Información sobre el curso

Módulo demostrativo

¿Qué podemos esperar para la nueva versión de Flash?

Publicado el día 26-01-07 bajo la categoría Novedades :: (0)

Lo primero, un predecible cambio de nombre. Porque Flash 9 formará parte de la nueva suite creativa de Adobe, y por lo tanto recibirá el título honorífico de Flash CS3.

Afortunadamente, el cambio de nombre será lo menos relevante, ya que la nueva generación de nuestra herramienta favorita traerá consigo unas cuantas e interesantes mejoras:

Una interfaz renovada y mejorada

Este es un cambio que afectará a todas las aplicaciones de la suite, incluyendo Photoshop. En lo referente a Flash, la barra de herramientas ocupará por defecto una sola columna y sus iconos gozarán de un aspecto más moderno y profesional. El espacio de trabajo podrá maximizarse fácilmente, gracias a la posibilidad de contraer los paneles hasta mostrar únicamente sus iconos representativos.

Mayor integración

Resulta lógico esperar una mayor integración con otras herramientas de Adobe, tales como Photoshop, Illustrator y After Effects.

Los diseñadores podrán importar en Flash un documento PSD y visualizar su contenido en capas, conservando su estructura original, e incluyendo efectos y modos de fusión (que serán traducidos al sistema de representación de Flash o rasterizados en caso de no encontrarse un equivalente). Se podrá incluso seleccionar las capas a incluir en la importación del documento.

La compatibilidad con Illustrator estará 100% garantizada, de modo que los puntos bezier de un documento AI, que hasta Flash 8 sufrían modificaciones al importarse en Flash, ya no se verán afectados.

Otra apuesta fuerte en materia de integración será la posibilidad de seleccionar las capas a exportarse en una película de Quicktime, para importar seguidamente en After Effects el material producido en Flash y combinar así ambas aplicaciones.

Herramientas más potentes

Las herramientas de dibujo darán un verdadero salto evolutivo en Flash CS3. Se utilizará la misma “pluma” de Illustrator, y existirán primitivas para diversas figuras (como rectángulos y elipses), de modo que éstas dejarán de tratarse como simples formas.

Por otro lado, la posibilidad de crear nuestras propias herramientas personalizadas utilizando rutinas de JSAPI se perfila como una de las novedades más interesantes.

Animación programada sin necesidad de escribir el código

La novedad que más entusiasmo ha despertado es la posibilidad de convertir en código de ActionScript las animaciones producidas en la línea de tiempo. Se trata de un aporte del mismísimo Robert Penner, que sin dudas tendrá una gran aceptación en las comunidades de animadores y usuarios de Flex.

Fuertes mejoras en materia de desarrollo

Como si la nueva versión de ActionScript (con un paradigma totalmente distinto al de versiones anteriores, y una potencia equivalente a la de lenguajes como Java y C++) no fuera suficiente, los developers se verán beneficiados con un nuevo entorno de programación y un depurador a la altura del que podemos encontrar actualmente en Flex, junto a ventajas adicionales como la de poder contraer bloques enteros de código.

Por su parte, los nuevos componentes requerirán la mitad de la memoria que exigen los actuales, y serán fácilmente personalizables gracias al aporte de Grant Skinner. Bastará con hacer doble click sobre la instancia de un componente para acceder al modo de edición, en el que podremos modificar a gusto cada estado del mismo.


Se espera que la nueva versión de Flash haga su aparición para finales de Marzo o principios de Abril de este año, fecha estimada del desembarque de la nueva línea de productos Adobe CS3.



Animación con ActionScript: Los límites (Parte IV)

Publicado el día 29-11-06 bajo la categoría Tutoriales :: (0)

En esta última entrega del tutorial que hemos dedicado a los límites, vamos a implementar la técnica conocida como screen wrapping, para lograr que un objeto que abandona el escenario por uno de sus lados, reaparezca sobre el lado opuesto manteniendo la misma dirección, tal como sucedía con la pequeña nave del recordado juego Asteroids.

Comenzamos, como ya es costumbre, definiendo los cuatro límites:

  1. superior = 0;
  2. izquierdo = 0;
  3. inferior = Stage.height;
  4. derecho = Stage.width;

El siguiente paso será adjuntar dinámicamente una instancia del clip objeto, que ubicaremos en el centro del escenario, asignándole velocidades aleatorias tanto en x como en y:

  1. objeto._x = Stage.width/2;
  2. objeto._y = Stage.height/2;
  3. objeto.vx = Math.random()*4-1;
  4. objeto.vy = Math.random()*4-1;

Dentro del evento enterFrame, además de incrementar las coordenadas x e y de acuerdo a las velocidades asignadas para desplazar el objeto, establecemos la acción a seguir cuando el mismo abandone el escenario por cada uno de sus lados:

  1. onEnterFrame = function () {
  2.       objeto._x += objeto.vx;
  3.       objeto._y += objeto.vy;
  4.       if (objeto._x-objeto._width/2>derecho) {
  5.          objeto._x = izquierdo-objeto._width/2;
  6.       } else if (objeto._x+objeto._width/2<izquierdo) {
  7.          objeto._x = derecho+objeto._width/2;
  8.       }
  9.       if (objeto._y-objeto._height/2>inferior) {
  10.          objeto._y = superior-objeto._height/2;
  11.       } else if (objeto._y<superior-objeto._height/2) {
  12.          objeto._y = inferior+objeto._height/2;
  13.       }
  14. };

Si el objeto abandona el escenario por la derecha, lo reposicionamos sobre el lado izquierdo, cuidando de desplazarlo hacia la izquierda tantos puntos como la mitad de su ancho, de modo que el objeto no haga su aparición con la mitad derecha ya en el escenario. Aplicando la misma lógica sobre los tres lados restantes, obtendremos el resultado deseado:


[swf]http://www.auladirectiva.com/blog/de-flash/wp-content/uploads/2006/11/wrapping.swf,320,240,8,#444[/swf]

Hemos analizado ya todos los posibles cursos de acción a seguir cuando un objeto en movimiento abandona los límites del escenario. La elección de una u otra alternativa dependerá de los requerimientos de cada animación, aunque en ocasiones podremos combinar dos o más técnicas en un mismo trabajo.

Hemos aprendido a definir y reconocer los límites, que podrán coincidir o no con los bordes del escenario. No obstante, a la hora de afrontar un proyecto y experimentar con la flexibilidad de ActionScript, los verdaderos límites los pondrá como siempre nuestra propia imaginación.



Blogmusik + Pandora: Flash canaliza la música online

Publicado el día 24-11-06 bajo la categoría Destacados :: (0)

Blogmusik y Pandora se perfilan como dos de los nuevos aciertos de Flash, que tal vez terminen alcanzando las proporciones de fenómenos masivos como Youtube. Si bien no hablamos de servicios esencialmente idénticos, los dos tienen a la música online como protagonista, y gozan de una interfaz dinámica desarrollada íntegramante en Flash. Y como todo lo que lleve la palabra "Flash" adjunta nos interesa en este blog, vamos a hacer foco en lo que ambas aplicaciones tienen para ofrecernos:


Blogmusik

La principal característica de esta emulación virtual del extendido iPod, es sin lugar a dudas la increíble velocidad con la que se muestran los resultados cuando llevamos a cabo la búsqueda de un artista, y la forma casi instantánea de comenzar la ejecución del tema seleccionado, sin esperas ni precargas.



bmusik.jpg


Entre sus opciones más interesantes, encontramos la posibilidad de crear nuestras propias listas de reproducción personalizadas, y compartir nuestra música con quienes deseemos desde la propia aplicación.

Por supuesto que no todo lo que reluce es oro, y a la actual versión beta del servicio le queda mucho camino por recorrer para convertirse en una aplicación sólida, libre de los numerosos bugs que presenta actualmente. Los temas que se muestran en los resultados no siempre pertenecen al repertorio del artista buscado, y la interfaz presenta serios problemas de usabilidad (al cambiar el idioma nos desconecta del sistema, por citar un ejemplo), que seguramente serán resueltos en la versión definitiva.


Pandora

Entre los secretos que guarda la caja de Pandora, se encuentra una importante selección musical lista para ser disfrutada por quienes osen abrirla. La aplicación deriva de un interesante proyecto denominado Genoma Musical, concebido en el año 2000 con el objeto de agrupar y clasificar la música de acuerdo a sus rasgos más esenciales. Pandora nos permite actualmente crear nuestra propia estación de radio personalizada, analizando el matiz del artista o tema introducido y ofreciendo una lista de material de similares características, delegando en nosotros la tarea de aceptar o rechazar las alternativas propuestas.


01: Introducimos el nombre de un artista o canción

pandora1.jpg



02: Pandora analiza el estilo y genera una lista de alternativas

pandora2.jpg



03: Aceptamos o rechazamos las propuestas

pandora3.jpg


Dadas sus características especiales, el servicio de Pandora resulta un tanto pesado si lo comparamos con la fluidez de Blogmusik, pero debemos tener en cuenta que se trata de dos propuestas diferentes, con un estilo propio y bien definido.

Ambos servicios tienen mucho por mejorar, pero no cabe duda de que su potencial es enorme. Veremos cómo sigue su evolución a la vez que contemplemos el surgimiento casi seguro de nuevas alternativas que utilicen a Flash como medio para canalizar la música en Internet.



Animación con ActionScript: Los límites [Parte III]

Publicado el día 20-11-06 bajo la categoría Tutoriales :: (0)

Otro de los posibles cursos de acción a seguir cuando un objeto en movimiento abandona el escenario consiste en traerlo de regreso como si se tratase de un nuevo objeto.

Regenerando los objetos que abandonan el escenario constantemente, podemos crear complejos sistemas de partículas sin tener que preocuparnos por el consumo de memoria, ya que estaremos viendo una y otra vez los mismos objetos, traídos de regreso al escenario cada vez que lo abandonen.

Se trata en realidad de una técnica similar a la que estudiamos en la primera entrega de este tutorial, ya que debemos esperar a que el objeto abandone el escenario por completo. La diferencia radica en que en lugar de eliminarlo, lo colocaremos en una nueva posición.

Hasta ahora hemos estado jugando con un sólo objeto. En esta entrega iremos más allá, creando una fuente dinámica compuesta por 100 partículas que fluirán constantemente sobre el escenario. Las partículas aparecerán abajo, en el centro, y se dirigirán con fuerza hacia arriba y más lentamente hacia los laterales. Utilizaremos una variable para definir la gravedad que afectará a las partículas para que desciendan, y un array para contenerlas.

El primer paso será, como siempre, definir los límites e inicializar todas las variables:

  1. superior = 0;
  2. izquierdo = 0;
  3. inferior = Stage.height;
  4. derecho = Stage.width;
  5. gravedad= 0.5;
  6. objetos = new Array();
  7. cantidad = 100;

Tomamos los límites propios del escenario, y definimos la variable gravedad, junto al array objetos. Definimos también la cantidad de partículas que fluirán sobre el escenario, a través de la variable cantidad.

Ahora es el momento de poner nuestro sistema de partículas en funcionamiento:

  1. function onEnterFrame(Void):Void {
  2.    var objeto:MovieClip;
  3.    var indice:Number = objetos.length
  4.    if (indice&lt;cantidad) {
  5.     objeto = attachMovie("objeto", "objeto"+indice, indice);
  6.     objeto._x = Stage.width/2;
  7.     objeto._y = Stage.height;
  8.     objeto.vx = Math.random()*2-1;
  9.     objeto.vy = Math.random()*-5-10;
  10.     objetos.push(objeto);
  11.    }
  12.    for (var i = 0; i<objetos.length; i++) {
  13.       objeto = objetos[i];
  14.       objeto.vy += gravedad;
  15.       objeto._x += objeto.vx;
  16.       objeto._y += objeto.vy;
  17.       if (objeto._x-objeto._width/2>derecho ||
  18.          objeto._x+objeto._width/2<izquierdo
  19.          || objeto._y-objeto._height/2>inferior ||
  20.          objeto._y+objeto._height/2<superior) {
  21.         objeto._x = Stage.width/2;
  22.             objeto._y = Stage.height;
  23.             objeto.vx = Math.random()*2-1;
  24.             objeto.vy = Math.random()*-5-10;
  25.       }
  26.    }
  27. }

Nótese cómo vamos añadiendo al array objetos cada instancia del clip objeto que adjuntamos, para poder controlar el movimiento independiente de cada una de las partículas a través de un bucle for. En cuanto la partícula en cuestión abandona el límite inferior del escenario, la reposicionamos automáticamente en el punto de partida (abajo, en el centro), y la dotamos de una nueva velocidad aleatoria.

Nótese también como la velocidad en el eje y está afectada por la variable gravedad, a la vez que otorgamos una velocidad menor al eje x para desplazar las partículas levemente hacia los laterales.

Este es el resultado de nuestro código:


[swf]http://www.auladirectiva.com/blog/de-flash/wp-content/uploads/2006/11/fuente.swf,320,240,8,#CCCCCC[/swf]

En la cuarta y última entrega de este tutorial contemplaremos la técnica del screen wrapping, que nos permitirá reposicionar un objeto sobre el lado opuesto al que abandone el escenario, creando una agradable sensación de continuidad.