viernes, 29 de mayo de 2009

Pack de Apuntes - Clase 10 - Viernes 29-05-2009

Aquí va el pack de apuntes incluyendo:
  • Bitácora 10
  • TP 03 (lean atentamente la consigna)
Aquí el link para descargar ZIP con los PDFs de clase 10.
Salutes!

jueves, 28 de mayo de 2009

…A último momento


De pronto el viernes pasado (22/05) ocurrió una estampida de visitas hacia el blog de la cátedra.
¿Auténtico interés en la materia o alumnos distraídos haciendo el trabajo práctico 02 a último momento?

Recordatorio: acuérdense de traer auriculares para la clase que viene y de ponerse al día con las lecturas de las bitácoras y apuntes de flash. Este blog y las bitácoras y apuntes en PDF son una herramienta imprescindible para estar al día con la materia, aún si faltaron a clases.

viernes, 22 de mayo de 2009

Pack de Apuntes - Clase 09 - Viernes 22-05-2009

Importante: recordá que hoy es la entrega del TP02.

Aquí va el pack de apuntes incluyendo:
  • Bitácora 09
Aquí el link para descargar ZIP con los PDFs de clase 09.
Salutes!

jueves, 21 de mayo de 2009

Trabajo Práctico 02 - es mañana!

Señoras y señores, recuerden que mañana (viernes 22 de mayo) se entrega el TP02, cuya consigna pueden bajar y releer aquí. La entrega, como toda instancia de evaluación, es obligatoria y de suma importancia para su cursada.

Les recuerdo que este es uno de los dos trabajos prácticos prácticos —valga la redundancia— que tendremos durante el cuatrimestre, por lo que es necesario que le dediquen el tiempo apropiado. El hecho de tratarse de una pieza pequeña (en cuanto a dimensiones) no le quita complejidad o importancia al asunto.

¡Lean los apuntes! (con un poco de suerte, repasar su lectura les será de ayuda)

Será hasta mañana.

sábado, 16 de mayo de 2009

Para seguir mirando y analizando

Aquí les dejo un sitio web para mirar y analizar:



Se trata de esta interfaz:
http://www.seedmagazine.com/ui09/

para acceder a los contenidos de esta web:
http://www.seedmagazine.com/

pero de forma más visual, novedosa y experimental, si se quiere.


La interfaz:

El desarrollo de la interfaz del sitio no es perfecta, de hecho tiene varias fallas que saltan a la luz al clickear y mover rápidamente, pero nos sirve para analizar un par de cuestiones importantes para nuestra cursada.

Noten, desde un principio, cómo el campo está dividido en tres áreas que se controlan de forma diferente y que interactúan y se modifican entre sí:
  • El sector de arriba contiene las tags y permite ir viendo cuáles de las noticias se corresponden con cada una.
  • El sector central contiene las mentadas noticias.
  • El sector de abajo permite suscribirse a la revista y controlar el nivel de zoom (es decir, de acercamiento) con el que veo el segmento central.
Esta división del campo ha sido una buena decisión del diseñador en pos de organizar el contenido y clarificar el manejo de la interfaz.


Interacción por medio de roll-over:

Gran parte de la interacción con el sitio pasa por el evento de usuario denominado roll-over en ActionScript.

La parte superior de la pantalla, que contiene las tags, reacciona ante la presencia del cursor mostrando las tags gradualmente a medida que nos acercamos al borde más alto de la pantalla, esto sucede de manera gradual y matemática de acuerdo a la posición del cursor. Por debajo de la palabra que identifica cada tag, aparece un rectángulo de color cuyo largo responde tanto a la cercanía del cursor, como al largo de dicha palabra. Esto nos ayuda a ver no sólo la etiqueta a la cual estamos apuntando, sino a las más cercanas; a medida que las etiquetas quedan más lejos del cursor, el rectángulo de fondo pierda altura y se va desvaneciendo (lo mismo que la tipografía).

En el segmento central de la pantalla, a medida que hacemos roll-over sobre una noticia u otra se van prendiendo las tags que la caracterizan, de forma tal que sepamos rápidamente a qué grupos temáticos/taxonómicos pertenece cada una sin tener que acercarnos explícitamente.


Interacción por medio de drag (arrastre):

El sector central de la pantalla puede draggearse (arrastrarse presionando el mouse), así como también el slider de zoom en la parte inferior derecha para acercarnos o alejarnos.

En el caso de los contenidos, vemos cómo se puede jugar con la inercia si se los suelta cuando están todavía en movimiento.


El color en la codificación:

A cada tag se le corresponde un color, y están organizados como el espectro visible de la luz, de rojo a azul, pasando por los tonos intermedios (a grandes rasgos: amarillo, verde y cyan).

(Nota fuera de tema: es curioso cómo el color magenta no se encuentra de forma natural en el espectro de luz visible, ya que las longitudes de onda del rojo y del azul no son contiguas, por lo tanto no tiene una longitud de onda propia sino que depende de la superposición de rojo y azul.)


El sonido en la codificación:

La función del sonido en la codificación cobra protagonismo, cuando comprendemos que a cada longitud de onda de la luz (de color) se le corresponde una frecuencia de sonido (más agudo, o más grave). Definitivamente una relación inteligente teniendo en cuenta que tanto en el caso de la luz (color) como en el del sonido, nos encontramos hablando de ondas.

No sólo se escuchan las diferentes frecuencias cuando se pasa el cursor por las tags (en este caso en orden), sino que también se escuchan cuando nos posamos sobre alguna de las noticias, y las tags correspondientes se encienden (en este caso, no las escuchamos en orden, lo que genera una rica morfología sonora futurista al estilo Star Trek).


Animaciones funcionales:

Tanto el zoom in como el out están animados de forma tal que el usuario se ubique fácilmente y entienda que está ante los mismos contenidos, y que no se trata de un cambio de pantalla.


¿Podrán hacer otros aportes? ¡Dejen comentarios si tienen ideas!

Saludos!

viernes, 15 de mayo de 2009

Pack de Apuntes - Clase 08 - Viernes 15-05-2009

Importante: recordá que hoy es la pre-entrega obligatoria del TP02.

Aquí va el pack de apuntes incluyendo:
  • Bitácora 08
Aquí el link para descargar ZIP con los PDFs de clase 08.
Salutes!

domingo, 10 de mayo de 2009

Complejidad visual


A lo largo de la historia, la aparición de nuevas tecnologías fue modificando la manera de generar imágenes y la estética que de ellas emana. Un momento clave de este proceso fue la invención de la fotografía, a partir de allí se inició un proceso de evolución y transformación de las así llamadas imágenes técnicas, que devino en la invención de:
  • fotografía
  • técnicas fotográficas aplicadas a los procesos de reproducción (impresión)
  • cine
  • televisión
  • video
  • imagen informática
En este sentido, la imagen informática posibilitó la creación de un nuevo imaginario en relación al universo de las imágenes creadas por el hombre. De ella se desprendió el imaginario infográfico y de allí la idea de visualización de información a través de la imagen informática.

Aquí les dejo un link interesantísimo para mirar/pensar la cuestión comunicacional y estética que plantea el desafío de mostrar un gran caudal de información a través de imágenes informáticas:

www.visualcomplexity.com

Es sumamente útil relevar este tipo de soluciones gráficas(?) que organizan información compleja, para poder abordar con mayor comodidad el diseño de una interfaz con menor cantidad de información y complejidad.

sábado, 9 de mayo de 2009

Corrección en Starbucks

Para quienes deseen una corrección extra sobre cuestiones técnicas de Flash, tanto del banner como de trabajos ajenos a la materia (e.g. multimedial)…

Yo estaré mañana (domingo) con compu, tomando algo en el Starbucks de Elcano a partir de las 14 hs. Traigan archivos, para corregir sobre algo concreto, y las consignas de los trabajos que quieran corregir. Si no estoy en la PB estoy en el primer piso.

dirección: Av. Elcano 3179 (Belgrano R, Capital)
día y fecha: domingo 10/5, 14 hs.

(comenten! así tengo una idea de si viene gente o no; yo voy de todas formas)

Salutes!

viernes, 8 de mayo de 2009

Banners de referencia

Aquí hay subidos algunos banners de años anteriores para que tengan una idea.

Nos vemos al rato!

Pack de Apuntes - Clase 07 - Viernes 08-05-2009

Aquí va el pack de apuntes incluyendo:
  • Bitácora 07
  • TP 02
Aquí el link para descargar ZIP con los PDFs de clase 07.
Salutes!