LLops Blog

Desde que empecé a programar, cada vez que veía una composición tipográfica, un collage de palabras o una letra imposible, me quedaba pensando qué básico y limitado es el texto en la web. Incluso en Flash, siempre un par de pasos por delante en cuanto a gráficos se refiere, estamos sometidos a una caja de texto. Por más que le daba vueltas nunca se me ocurría una manera diferente de generar texto. Al menos hasta que Flash 8 introdujo la clase Bitmap, y ahí empecé a imaginarme un posible camino.

Básicamente lo que quería conseguir era que partiendo de cualquier tipografía y utilizando cualquier motivo, se pudiera representar cualquier texto de forma legible (y obviamente, de forma dinámica, que sino ya está photoshop). Y aquí está una demostración:

Los motivos que he escogido para este experimento son corazones, hojas, trazos y manchas de sangre; y las fuentes Supernova, Eras Demi, Kristen y Saginaw.

Nota: una vez elegido un motivo y el idioma, la única forma de volver a la home es clicar en “Recargar” o refrescar la página. Me daba muuucha pereza tener que limpiar todos los recursos para dejar el experimento en el inicio :p

Puedes ver el experimento aquí

En el post anterior hablaba de las plantas de IKEA. Pues bien, aquí está la primera: La Planta de Viento.

Como ya comenté, la original es una aplicación AIR, pero como de momento no puedo poner el .air para descargar he decidido adaptarla para navegador. Así se pierden algunas opciones y la gracia de tenerla en el escritorio, pero el resto es básicamente igual.

Continuar leyendo »

El año pasado en Herraiz&Soto lanzamos una comunidad para IKEA enfocada al mundo del hogar. Aquí los usuarios pueden subir las fotos de sus casas, conocer a nuevos vecinos, pedir consejos de decoración y, en general, hablar de hogar a hogar.

Uno de los detalles de esta comunidad es que cada vecino cuenta con un buzón, pero en vez de recibir facturas y folletos publicitarios se le envían regalos, como wallpapers o canciones.

Una de las ideas que tuvimos para los regalos fue hacer una serie de plantas para que la gente decorara su escritorio. La gracia es que estas plantas están hechas en AIR y son interactivas, con lo que el escritorio pasa a cobrar un poco más de vida. Para haceros un idea:

La primera planta la tuve programada hace más o menos un año, y la segunda un mes después, pero no ha sido hasta el día de hoy (por mil y una razones) que no hemos lanzado una de ellas.

Este fue un proyecto del que me siento muy orgulloso, básicamente porque me divertí de lo lindo programando y porque me parece que está muy bien acabado. Y a pesar de que me hubiera encantado hablar antes de él, el hecho de que no se hubiera enviado a los usuarios de elhogar.de no daba pie a hacerlo.

De momento no puedo poner los archivos .air para descargar, pero por si a alguien le interesa echarle un vistazo en un par de días colgaré la primera planta en el Lab y en cuanto pueda iré publicando el resto.

En el anterior post, en el apartado El envío de la postal, comentaba que parte del desarrollo consistía en enviar una imagen y distintas variables de Flash al servidor, pero que en AS3 no había una forma sencilla de hacer un envío multipart y habíamos recurrido a la potente librería as3httpclientlib para conseguirlo.

A pesar de que dicha librería funciona perfectamente, lo hace todo mediante sockets, cosa que añade un grado (o varios, según el caso) de dificultad. Como para el proyecto de IKEA no íbamos sobrados de tiempo, no le di más vueltas y la utilicé, pero me quedó la espinita de si no había maneras más sencillas de hacerlo, y desde entonces he estado mirando todo lo relacionado con el tema de envíos desde Flash. Este artículo recoge y explica distintas soluciones que he ido encontrando.

Empezaremos con el caso más sencillo, que es enviar una imagen desde Flash al servidor.

Continuar leyendo »

Este ha sido el penúltimo trabajillo en el que he estado embarcado: la felicitación de Navidad para IKEA.

Para ser sinceros, este tipo de acciones tienen bastantes números de acabar en un bodrio por tres motivos:

1. el cliente quiere todos los topicazos navideños: las luces, el árbol, el Papa Noel, mensajes de amor y buen rollo, etc etc
2. el cliente quiere su producto bien grande o en todos lados, eso sí, en versión navideña (como si la aspiradora decorada con guirnaldas fuera lo más natural del mundo)
3. el cliente quiere que se viralice, para que todos tus familiares y amigos puedan ver la aspiradora con guirnaldas y poner así nuestro granito de spam en internet

Y nosotros, como buenos samaritanos, hemos cumplido escrupulosamente con todos los puntos, pero de una forma un poquito más original y divertida (a lo mejor también es un bodrio y me estoy engañando…)

Continuar leyendo »

¿Que pasaría si la gente pudiese relacionarse por lo que imaginan en vez de por lo que piensan?

Esta pregunta fue la semilla que ha dado lugar a www.bankofimagination.com, el último proyecto de Herraiz&Soto para Camper.

Continuar leyendo »

Al contrario que en el 2007, donde todo lo que hice en CS3 y AS3 fue en solitario, durante este año he trabajado en varios proyectos en equipo, tanto con compañeros de mi agencia como estudios o freelances. En general, me considero bastante flexible a la hora de trabajar con otros programadores y no intento imponer nada (y más en el mundillo Flash, donde hay mil maneras distintas de alcanzar un objetivo), pero aún así, he llegado a la conclusión de que hacen falta una serie de “buenas prácticas” para que el proceso no sea un sufrimiento para el resto.

Los puntos que voy a explicar me parecen igual de válidos si se trabaja solo, pero obviamente la repercusión es mucho menor porque no afecta a nadie más. Y con trabajar en equipo no me refiero sólo a dos o más personas simultáneamente, sino también aquellos desarrollos que un día empieza uno y luego ha de continuar otro.

Continuar leyendo »

Sin darme cuenta han pasado 7 meses desde que publiqué la última pieza del Lab, todo un mundo teniendo en cuenta que uno de los objetivos de este blog era precisamente dar salida a estos pequeños proyectos. Podría echarle la culpa a la falta de tiempo (que no es que sea mentira tampoco), pero hay otro factor que influye mucho, y es el de la búsqueda del “siempre más difícil”, con lo que varios experimentos se quedan a medias por no pasar el filtro.

Suerte que de vez en cuando hago algo como Gomets que me recuerda que el nivel de la idea siempre prevalece sobre el nivel técnico. Una pieza puede ser atractiva, plástica o entrañable sin necesidad de código muy complejo.

Gomets es un experiencia no interactiva donde pequeñas redondas de colores (de ahí el nombre) se mueven, fusionan, repelen… formando diferentes efectos visuales. Todo el código se centra básicamente en movimientos elípticos jugando con parámetros como el ángulo, la velocidad o el radio.

También cuenta con un panel de opciones para configurar los comportamientos. Si se le dedica 5 minutos a investigar cómo funcionan se pueden encontrar combinaciones muy gustosas.

Y he de darle las gracias a mi mejor betatester, por sus consejos, por la paleta de colores, por el naming… media aplicación vaya! ;)

Puedes ver la pieza aquí.

A pesar de tener poco cero tiempo para dedicarle al blog, no quería dejar de escribir este pequeño tip sobre como se recogen variables externas en AS3. No es que sea nada muy complejo (la verdad es que incluso en la ayuda se comenta), pero me resultó curioso cuando el otro día un compañero me preguntó si lo sabía y me di cuenta que en todo este tiempo tocando AS3 no había tenido necesidad de usarlo... Así que lo documento por si existe por ahí algún despistado como yo :)

Haciendo un poco de memoria, en versiones anteriores se podía acceder a las variables directamente en el  _root (_root.miVariable). Ahora es bastante menos intuitivo, aunque no carece de lógica.

En AS3 se utiliza la clase Loader cuando queremos cargar un swf o una imagen, y su propiedad contentLoaderInfo para acceder a la información del fichero y al proceso de carga (bytesLoaded, etc). Dicha propiedad es en realidad una instancia de la clase LoaderInfo. Así pues, al buscar cualquier información referente al swf, tiene sentido hacerlo en dicha clase, y las variables externas no son una excepción. Por esa razón existe una propiedad llamada parameters, de tipo Object para almacenar pares de nombre-valor.

Y la pregunta evidente es: si el primer swf no está cargado mediante Loader, ¿cómo acceder a esta información? La respuesta consiste en que cualquier objeto de la Display List cuenta con una propiedad loaderInfo que provee la información del SWF principal.

En este punto, si quisiéramos acceder a una variable llamada textoA sabemos que podemos hacerlo de la siguiente forma:

donde this puede ser tanto el DocumentClass como cualquier frame del timeline.

Y un par de consideraciones:

• Debemos asegurarnos que al acceder a loaderInfo en un objeto, además de ser del tipo Display, éste se encuentre en la Display List, ya que sino generará error.
• Sino se conocen el número de variables a recibir, podemos usar un for..in sobre parameters para que nos muestre todos los valores, ya que es un Object.

Dejo un ejemplo que utiliza swfobject 2.1 para cargar un swf y pasarle 2 variables que se muestran en cajas de texto:
Descargar ejemplo.

Hace ya varios años, en una época en la que la web estaba poblada de páginas estáticas y todo el movimiento se reducía a los gif, un programa llamado FutureSplash consiguió sorprender a todos por su increíble capacidad para la animación.

Emulando el sistema de cinematografía, basado en proyectar fotogramas de forma rápida y sucesiva para lograr la sensación de movimiento, FutureSplash incorporaba una linea de tiempo en la que se podía dibujar frame a frame para reproducir luego la película.

Un año más tarde, ese revolucionario programa fue adquirido por Macromedia y nació Flash 1.0, para acabar evolucionando actualmente en Flash CS3, de la mano de Adobe. Y por sorprendente que parezca, nueve versiones después, la filosofía para generar animación se ha mantenido intacta.

Al margen de la animación tradicional en linea de tiempo, la otra forma de generar animación es mediante código, y en ActionScript sí que ha ido evolucionando el tema:

• En Flash 5 se introdujo el archiconocido enterFrame.
• En Flash MX nos obsequiaron con setInterval (lo recuerdo como una gran novedad).
• Y ya en AS3, se ha apostado por la clase Timer como sucesora de setInterval.

Así pues, en Flash 5, para animar mediante código se utilizaba enterFrame, pero con la introducción de setInterval la comunidad empezó a dividirse entre partidarios y detractores de uno y otro sistema. Es fácil encontrar discusiones en blogs, foros y listas sobre este tema, y personalmente he perdido la cuenta de cuantas veces he debatido sobre ello.

En este artículo vamos a estudiar la clase Timer (setInterval está desaconsejada, pero la lógica se puede aplicar igualmente) y el evento enterFrame, con la esperanza de poder definir cuándo es mejor usar una u otra.

Continuar leyendo »