Gaia Framework, mis impresiones

Bueno, prometí en ASNativos que escribiría esto así que aquí están mis impresiones sobre el GAIA framework. Realmente a mi me ha impresionado por varias razones.

La primera es que está pensado para Flash. Exclusivamente. Estaba ya como harto de ver frameworks para Flex o mixtos. Para mí esto es muy importante ya que el uso de Flash IDE en el proceso de desarrollo es clave para mí. La idea de usar el Flex SDK para compilar cogiendo los assets de un lado o de otro me parece muy alejado de la filosofía de Flash, para mí el tripback con la gente de diseño es vital y me parece que la mejor manera de hacerlo es manejando el mismo fla e intentando mantener la mayor estructura posible dentro de él. A partir de ahí ir asociando clases a los distintos DisplayObjects (casi se me escapa MovieClips ;). Parece que GAIA es perfecto para este tipo de desarrollos.

Capacidades

Lo primero que voy a hacer es enumerar que beneficios vamos a sacar de él.

Está bien documentado. Esto lo pongo lo primero, porque para mí es vital. La pagina web te enseña rápidamente ha iniciarte en él y además te da una clara visión tanto global como especifica de sus características. Sacas casi toda la información del mismo punto. Primero tienes un video de introducción para tener la “big picure”, luego un wiki donde entra en detalles y finalmente un foro donde se intercambia información entre los usuarios. A ver si aprenden otros (ejem, papervision, ejem).

Automatización. Una de las cosas más interesantes de GAIA es que genera (scaffold) un esqueleto de todo el sitio web a partir de una definición en XML. Además, esta definición del sitio en un fichero XML no solo guía el scaffolding sino que además se utiliza en runtime para la navegación. Una idea sencilla y brillante. Este esqueleto inicial y funcional te permite que un grupo de personas vayan trabajando en diferentes secciones sabiendo que las pueden previsualizar en cualquier momento y están listas para ser integradas.

Plantillas: Durante el scaffolding las páginas son generadas a partir de una plantilla. La editas, le das a generar y la secciones se crean a partir de ellas. Usa plantillas tanto para el .fla como para las clases .as

Actionscript y línea de tiempo: Te permite utilizar tanto uno como el otro para hacer las transiciones. Yo, en un proyecto estoy trabajando con 2 diseñadores y 2 programadores en el mismo proyecto y todos usando el GAIA. Esta es una de sus mejores virtudes, un diseñador la puede usar y ver su montaje en flash funcionando dentro del resto de la web sin que todavía la haya tocado el programador. Y para las páginas estáticas, directamente a producción. Aunque solo haya usado la linea de tiempo, incluso para las transiciones. Esto no tiene precio.

Navegación: Con una simple instrucción Gaia.api.goto(”seccion/subseccion/pagina”), se encarga de cargar y navegar a esa página. Punto.

Control del flujo: GAIA se encarga automáticamente de hacer las transiciones de entrada y salida de cada sección, así como la precarga e inicialización. Tiene varios tipos de flujo, como ejemplo el standard seria: transición de salida -> precarga -> transición de entrada -> finalización. Se encarga de esto de manera automática y tiene hasta 4 tipos de flujos diferentes.

Assets: En la definición del site puedes asociar distintos assets externos a cada página, como ficheros xml, sonidos, imágenes o lo que sea. Durante la precarga de esa sección te precarga también los assets y te los deja directamente accesibles desde el código.

Event Hijacking: Durante el flujo GAIA puedes hacer que salte un evento y pararlo hasta que sea necesario. Por ejemplo si antes de una transición de salida quieres realizar un proceso puedes pararlo, hacer lo que sea y más adelante decirle que siga.

Integración SWFObject y SWFAddress. Por si fuera poco, te genera la plantilla .html usando SWFObject y SWFAddress de tal manera que con muy poco código tienes ya las funcionalidades de navegación hacia adelante y atrás así como deeplinking. Todo un lujo.

SEO: Con la definición del sitio en XML, GAIA te puede generar una estructura de ficheros en HTML donde podrás meter el contenido alternativo y que si se acceden de manera directa cargarán la sección correspondiente en la web. Todos esos textos que metas en el HTML también son accesibles por código para que los puedas usar en la película Flash.

Resultados

Después de leerme toda la documentación la verdad que quedé muy impresionado y quise hacer una primera prueba con un microsite de publicidad bastante básico y el resultado fue impresionante. En su primer uso, el sitio estaba listo para producción en 6 horas de trabajo con 2 personas partiendo de PSDs. Aquí os dejo la muestra. Fijaros, transiciones de entrada y salida, deeplinking, navegacion con el botón derecho, precarga…etc. El site es muy sencillo, pero que eso no os haga pensar que GAIA es solo para este tipo de proyectos. Actualmente lo estamos usando para el nuevo site de una importante multinacional, con una estructura realmente complicada y parece que está funcionando de perlas.

¿Hay alguien más que lo esté usando por ahí? Me gustaría ver sus impresiones :)

26 Responses to “Gaia Framework, mis impresiones”

  1. llops Says:

    Buen post Joseba :)

    No había oído hablar de GAIA hasta que lo empezastéis a mencionar en la lista. Desde entonces he jugado con él a ratillos, pero no he tenido la oportunidad de probarlo en proyectos reales.

    De todas maneras, ahí van una impresiones:
    - como dices, está enfocado a Flash, y se nota en la total libertad a la hora de plantear un proyecto. De momento no he encontrado ni una sola pega para trabajar con diseñadores y/o animadores. Punto muy importante para los “bichos raros” que todavía tiramos de IDE.

    - el scaffolding es genial. Definitivamente, Rails ha hecho mucho bien en el mundo de la programación.

    - la API es realmente simple, y no sólo para navegar: acceder a los assets, los preloads, transiciones, etc. es facílisimo (aunque al principio algunas instrucciones me parecieron un poco engorrosas)

    - los assets. Odio precargar cosas.

    Y bueno, como dices SWFObject, SWFAddress, SEO… bastantes regalos.

    En el momento que lo pruebe en un proyecto serio y lo vea en funcionamiento con el resto del equipo, ya le dedicaré una entrada detallada a este “generoso” framework.

    Saludos!

  2. Fede Rivas Says:

    Pues tio, despues de esto, tengo claro que tengo que comenzar a usarlo desde ya mismo, asi que me pondre con él e iremos comentando impresiones.

    Gracias por tu post !

  3. Patricia Says:

    Gracias por el artículo! Me aclara un montón de dudas iniciales… Por lo que llevo visto (que es poco…) Gaia me parece una herramienta fácil de usar y con mucho potencial. :)

  4. Mario Iglesias Says:

    Muchas gracias! parece perfecto para implementarlo en los proyectos flash, me anima a trabajar en ello, ya intercambiaremos impresiones…

  5. xleon Says:

    ¿Qué tal funcionan las precargas múltiples dentro de una misma sección? ¿Se puede extender su fucionalidad?

    Que pena que no exista algo así para trabajar sin Flash IDE

  6. Joseba Says:

    La verdad es que muy bien, se hace utilizando los assets y te la integra con la precarga de la propia seccion. También se pueden añadir dinámicamente en runtime

  7. Joan Says:

    Que hos parece montar un foro en español para poder intercambiar opiniones (Yo me ofrezco a montarlo).

    No se si ya hay alguno, en tal caso ¿podeis pasar la url?

  8. Steven Sacks Says:

    No hablo español así que utilicé el babelfish.yahoo.com para traducir este blog (y este comentario).

    Gracias por la revisión de Gaia. Estoy alegre usted gocé el usar de ella, a pesar de la barrera linguística.

    Por lo que va un foro español, no podría contestar a preguntas muy bien porque no hablo español, pero podríamos utilizar el babelfish si necesitamos.

    ¿Si cualquiera de usted habla inglés, también, quizá usted estaría dispuesto a ayudar a localizar Gaia y su documentación en español?

  9. Angel E. Anton Says:

    De acuerdo completamente con Joseba, aunque a pesar de estar bien documentado seria maravilloso contar con una aplicación de ejemplo completamente terminada, algo equivalente a la Flex Store para Flex, al menos yo no la he encontrado.
    Estamos terminando un proyecto hecho con GAIA Framework y AS2, una vez concluido trataré de postearlo. Si es en un forum en español mejor !! :)

  10. Oscar Says:

    Hola Joseba, tengo una duda sobre el uso de gaia. Tengo un sitio generado con 2 secciones, ahora quiero meterle comportamiento a una de las secciones. ¿Como lo hago?, edito la document class de dicha sección instanciando la vista de mi paquete mvc diréctamente en el método transitionIn o cual sería el procedimiento?

    y otra duda, las secciones que te genera tienen un dos métodos en los frames 10 y 20 transitionOutComplete(); transitionInComplete();, cuando se llaman? para que sirven?

    muchas gracias!

    muchas gracias.

  11. Joseba Says:

    Oscar,

    Efectivamente yo suelo instanciar el MVC dentro de el Page creado por Gaia (el Document Class) dejo la clase Page para manejar todo lo relacionado con Gaia y el MVC lleva la seccion en si misma.

    En cuanto a lo de los fotogramas 10 y 20 que comentas esos los pone solo cuando creas scaffolding con transiciones en linea de tiempo (las de AS no te las pone) y basicmente informan al framework que la transicion a terminado.

    De todas maneras ASNativos es un lugar mejor para preguntar este tipo de dudas ;)

  12. Oscar Says:

    Muchas gracias Joseba,
    Sí se que es Asnativos donde preguntar estas cosas pero es que escribo a la lista y nunca llega el mail :( sorry, lo he probado ya desde hotmail y desde gmail pero nada….

  13. Joseba Says:

    Es que el primer mensaje es moderado, para evitar spam. El resto llegan instantaneamente.

  14. Patricia Says:

    Holas Joseba!

    Tengo una duda sobre cómo crear el menú de navegación en Gaia.. ¿dónde hay que poner la instrucción Gaia.api.goto….?

    Tengo creado el menú (con sus botoncicos y tal..) en el “nav.fla”, pero aqui no me lo reconoce, me dice ‘Acceso a una prop no definida’. Entonces… ¿en el nav.as? ¿cómo se hace?

    S.O.S! :**

    Por cierto, FELICIDADES atrasadas ya..! ;)

  15. Patricia Says:

    Eys econtré la documentación! :) Confirmado, esto del Gaia es la leche!

  16. ddt Says:

    ¡Me alegro!
    Lo bueno que tiene es que la documentación es muy buena.

    besos

  17. Mercedes Says:

    Hola Joseba, muy buena tu revisión de Gaia. Me intriga una cuestión: ¿porqué nadie le da bola al comentario dejado por Steven Sacks? Es groso! O es que suponen que es falso? Bueno, eso, saludos

  18. Beto Says:

    Mmmm, perdón por molestar…pero tengo la misma duda que tenía patricia (que resolvió con la documentación pero no dice cómo). ¿Cómo armo la navegación??? En el nav.as? Uso AS2, estoy muy desorientado…desde hace un par de días. Si alguien me puede tirar una soga, agradecido! Y pido disculpas si este no es el lugar para preguntar, es que lo encontré googleando. Saludos

  19. Beto Says:

    Bueno, ahí lo encontré. Lo dejo por si alguien tiene la misma duda. En AS2, en la timeline:

    import com.gaiaframework.api.Gaia;
    Gaia.api.goto();
    prueba.onRelease = function () {
    Gaia.api.goto(”index/nav/Autores”);
    }

  20. Acerca de Gaia Framework « Gaia Framework en Español Says:

    [...] Gaia Framework By pocaco Para comprender qué es Gaia Framework recomiendo leer el excelente artículo que escribió en su blog Joseba Alonso (desarrollador flash) sobre las capacidades y resultados de Gaia [...]

  21. Patricia Says:

    El link a la docum Gaia para definir la navegación.. ;)

    http://www.gaiaflashframework.com/wiki/index.php?title=Global_Navigation_Made_Easy_with_Event_Listening

    Dudaaaaa.. ¿dónde está la función del estado _over??
    saludos,

  22. БaкинcкийПиpoг Says:

    Премного благодарен! Буду теперь заходить на ваш блог почаще! :)

  23. panaewa Says:

    He creado un script de ant para crear y compilar los proyectos de gaia sin la necesidad de Flash.

  24. Alice Says:

    Hey - whats up. Thanks for the info. I’ve been digging around looking some info up for shool, but i think i’m getting lost!. Yahoo lead me here - good for you i guess! Keep up the great information. I will be coming back over here in a few days to see if there is any more info.

  25. Al Says:

    Hi … I stumbled on your site by mistake. I was searching in Yahoo for Antivirus software that I had already purchased when I came upon your site, I have to say your page is pretty informative, I just love the theme, its amazing!. I don’t have the time this minute to fully read your site but I bookmarked it and also signed up for your RSS feed. I’ll back around in a day or two. thanks for a cool site.

  26. Marcos Huerta Hernandez Says:

    No lo he utilizado de hecho lo oí por ahí, así que decidí buscar información y me tope con este blog, y gracias por la info me agrado mucho.

    lo que si verdaderamente me desanimo fue eso del final el ejemplito el proyecto en 6 hrs de trabajo y con 2 usuarios, creo que lo mismo lo puede haber hecho en AS3 puro y en 2 hrs y un solo usuario,,
    pero bueno lo probare y veré que aprendo de él gracias por la información…

Leave a Reply

Entries (RSS)