Taller dictado en la Universidad del Bío-Bío. El taller enseña desde la producción hasta la generación de un sitio web utilizando tecnología Flash y XML.

Wednesday, September 28, 2005

Comienza el Taller

¿Qué importancia tiene el desarrollo de Sitios?

Existen sitios web para cada producto o servicio, ¿pero qué diferencia uno de otro?, sin duda la manera de concepción ya sea conceptual o gráfica. Pero estas dos están ligadísimas desde un comienzo.

Además, un sitio web, debe traspasar la misión y la visión de la empresa a su gráfica y funcionamiento, por esto siempre un sitio web es escalable, ya que generalmente los sitios web comienzan de una forma, para terminar de otra. Es decir un sitio web puede pasar por tres estados, estos estados están dispuestos en forma piramidal estando en la base el panfleto, luego las transacciones con el público y para terminar en la cúspide las transacciones integradas.

En la base de esta pirámide esta el sitio promocional. Permite que las pequeñas empresas entren al mercado, generan presencia y seriedad, pueden dar a conocer sus servicios o productos.

En el segundo nivel de esta pirámide encontramos a las transacciones al público, después de ser un sitio promocional de la empresa, comienza el intercambio con el usuario, acá podemos ver el comercio electrónico, los generadores de contenido y portales web.

Y en el último segmento encontramos a las transacciones integradas, encontramos a las empresas que asesoran a otros en materia web para mejorar sus posiciones competitivas en la red. Los otros que participan en este segmento son los que construyen el hardware que dirige el tránsito en Internet, también están las empresas que ponen el capital de riesgo de Internet, es decir proporcionan capital, reclutan administradores y ayudan a crecer las empresas que están en Internet para que sus acciones se negocien en el mercado bursátil y generen altos rendimientos sobre la inversión.

Por tanto cada sitio web tiene su posición dentro de esta pirámide, lo importante es dar la asesoría comunicacional precisa para saber si lo que necesita el cliente es un sitio promocional o un sitio de transacciones con el público.

Taller 1

Planificar la Producción Antes de Empezar a Producir.

Como Configurar el Escenario de Trabajo

Eres Diseñador y esperan que tengamos un desarrollo impresionante con Flash. Más que mal es el Aniversario de tu Carrera. Siempre quieren cosas que superen lo que puede hacer Flash. La marca de la escuela tiene que quedar bien posicionada. Los sitios anteriores tenían emociones y sensaciones. Las animaciones pueden evocar ciertos conocimientos o formas de interacción con la audiencia. Es decir lo importante es el contenido.

Bueno aquí va la configuración del escenario de ejemplo. Están apunto de asumir el reto más importante de este año, si lo hacen bien podrán ponerlo en su carpeta de trabajos y recibir los aplausos de sus congéneres. Cómo si la presión fuera poca su jefe de departamento le dice:”Espero que este trabajo quede para siempre en la Escuela”, Se me olvidaba “Tienes tres semanas para hacerlo”.

Así que como vamos a crear un estilo para este año? …. Que contendrá el sitio… Bueno es sabido que para la Semana de Diseño hay ciertas actividades que son prácticamente históricas, podría mostrar todo esto en un plano de la escuela poniendo en cada hito una descripción detallada de la actividad, poner por ejemplo que los alumnos puedan mostrar todos sus trabajos, presentar sus objetivos personales, sumado a eso pondrá música y gráficos en movimiento que mostrará lo talentoso que son. El sitio será un ejemplo de lo que pueden hacer. Tendrá una tipografía sólida, transiciones sofisticadas y música y sonidos ambientales apropiados. Pero lo más importante seguirá siendo el contenido.

· Información detallada de la Escuela y de cada alumno, teniendo navegaciones separadas e intuitivas

· Transiciones que presentan las distintas secciones y que construyen la Interfaz de Usuario

· Elementos Interactivos para navegar el Sitio

· Elementos de sonido apropiados para complementar la experiencia de usuario.

“¡Perfecto!, sí lo haremos”, se dirán a si mismos,”Pero casi todos los miembros del equipo están trabajando en otros proyectos” entonces como conseguirlo ¿debe estar cada persona de la escuela encargada de una parte? Y si esto es así se esta poniendo en peligro la coherencia del sitio, con estas tres semanas que tenemos, ¿será posible? Se deberá gestionar la creación de todas las páginas y ensamblarlas entre si.

Se podría incluir una película Flash por cada persona y dejar una nota para tenerlo todo controlado desde el principio. Aparte del simple hecho de que esta solución es muy ineficiente y supone un esfuerzo muy tedioso, el argumento claro para ponerla en práctica es lo inevitable del cambio. Además hay que considerar la cantidad de errores que tales acciones repetitivas podrían suponer.

¿Te suena alguno de estos ejemplos?

Ejemplo 1 Tan pronto como termina una película de Flash, recibes una solicitud de cambiar la información que aquí esta.

Ejemplo 2 Repasas tu trabajo terminado y descubres que hay una falta de ortografía en tu propio nombre.

Ejemplo 3 Terminas las 60 películas y tedas cuenta de que los apodos deberían ir todos en minúsculas y con cremillas.

El mínimo cambio implica abrir cada una de las películas de Flash. Tiene que haber una mejor manera, ¿no?

Antes de que te empieces a dar cabezazos con el teclado permíteme mostrarte un planteamiento perfecto de desarrollo de sitios.

Proceso de Flujo de Trabajo

Supongamos que por cada sección exista una plantilla de diseño válida cada miembro del equipo la utilizará para “generar” su propia película. Por tanto en Flash sólo se generan los movimientos y las diagramación por que todo lo demás viene desde afuera.

¿Te suena demasiado bien? Bienvenido al proceso de Flujo de Trabajo de desarrollo de sitios de modo off-line.

Proceso para Construir un Sitio Avanzado en Flash

Cada uno de los pasos serán discutidos en cada capítulo y cada uno de ellos te ayudaran para poder construir el sitio de ejemplo pero es indiscutible que la primera etapa siempre es la Planificación.

1. Tormenta de Ideas

2. Contenido del Sitio

3. Diseño de la Plantilla

4. Integrando Flash con Archivos Externos

Tormenta de Ideas

El primero de los pasos en el proceso de flujo de trabajo es la tormenta de ideas ¿Qué es exactamente lo que vas a hacer? ¿Para quién lo vas a hacer? ¿Cómo lo vas a hacer? La Tormenta de Ideas te permite considerar opciones buenas y alas, y planificar todos los aspectos de la producción. La planificación previa a la producción es extremadamente importante. Solo la falta de planificación va a llevar a la basura tu proyecto. Todo sitio que se precie (e incluso los que no sean tan importantes) deben dedicar por lo menos un tercio del desarrollo del proyecto a la planificación. Cuanto más tiempo mejor.

Una buena idea consiste también en introducir estimaciones presupuestarias y de plazo de ejecución. Esto ayuda a tener en cuenta las ideas. Dicho esto, una buena reunión de tormenta de ideas debe contener una buena cuota de ideas interesantes. Aunque probablemente no sea factible poner en práctica cada uno de esos conceptos por causa de restricciones relativas al plazo/presupuesto, tales ideas abren la puerta a soluciones más creativas. Cuando uno apunta alto luego se amolda a lo que es posible (plazo de ejecución, presupuesto, recursos de diseño/desarrollo), los resultados suelen ser soluciones bastante acertadas que, de otra forma, ni se habrían planteado. Y esta es la verdadera esencia de la tormenta de ideas.

Objetivo


El objetivo de la reunión de tormenta de ideas consiste en responder a las siguientes preguntas:

· ¿Cuál es la audiencia?

· ¿Qué elementos va a conformar el sitio?

· ¿Cuál es el flujo general del sitio?

Audiencia

Saber quien va a visitar y usar nuestro sitio sin lugar a dudas ayuda a acotar las ideas que determinarán el contenido, materia y forma y flujos finales del sitio. Teniendo en cuenta a la audiencia, puedes estructurar un diseño acorde con sus necesidades y expectativas. El nivel de conocimientos, experiencias y objetivos a la hora de usar un sitio varía de principiantes a expertos. Los usuarios principiantes pueden necesitar instrucciones especiales que los orienten en lo que respecta a funcionalidad y organización de la información del sitio. Los usuarios mas avanzados, por otra parte, pueden ver este tipo de ayuda como un obstáculo a la hora de acceder al contenido. Un sistema bien diseñado y pensado debe ser capaz de acoplarse a una amplia gama de conocimientos e intereses de los usuarios.

Elementos


Imagínate que el sitio fuera como una cena ¿debes preparar solo entradas o una comida de siete platos? ¿vas a servir sopa o ensalada, o quizás ambas? Después de contestar cada una de estas preguntas puedes concentrarte en preparar cada plato. Solo entonces podrás centrarte en los ingredientes o en este caso, el color, la diagramación la composición y el movimiento (en otras palabras la materia y la forma)

Por tanto ¿qué debe contener la cena (o sitio)? No te preocupes que todo salga bien, estamos en la tormenta de ideas, pero eso si busca ideas sobre las cuales edificar y áreas problemáticas que evitar. Así que sobre la lista Inicial, empieza por nombrar cosas:
a)………......
b)………......
c)…………....
d)…………….

La tormenta de ideas entrego material suficiente no estructurada como para poder comenzar a trabajar en lo que contendrá nuestro sitio de ejemplo. Pero para eso necesitamos ordenarla, jerarquizarla y para eso tenemos la Arquitectura de la Información.

Arquitectura de la Información

Son el conjunto de prácticas mediante las cuales el diseñador organiza conjuntos de información, permitiendo, que cualquier tipo de usuario los entienda y los integre a su sistema cognoscitivo en forma simple, para cumplir así con el objetivo comunicacional propuesto.

El contenido se organiza en subconjuntos con nombres de fácil comprensión para el usuario final, diseño funcional de las operaciones de búsqueda y del uso de la información que contienen (pertinencia).


· Una eficiente arquitectura de información permite que:

· Entiendan grandes cantidades de información,

· Busquen y encuentren la información que necesitan de manera simple,

· Realicen sin dificultades las acciones necesarias para acceder a la información mediante el computador.

La correcta arquitectura de información permite a los creadores de un sitio Web:

· Aclarar la visión y la misión del sitio, entrándose en las necesidades de sus audiencias,

· Generar el diseño de estructuras que soporten el cambio y el crecimiento en el tiempo,

· Determinar qué contenidos y funcionalidades deberá contener el sitio para su cumplimiento de los objetivos,

· Poner nombres comprensibles a las áreas de la información y crear sistemas.

Taller 2

Como Diseñar más Allá de la Materia y la Forma.

Contenido del Sitio.

Wireframe como herramienta de Construcción.

Objetivos del diseño de Sitios.

Flash

Coreografía.

Como Espaciar los Elementos en el Tiempo.

Transiciones.

Diseño Dinámico Frente a Diseño Estático

Taller 3

Integrando Flash con Archivos Externos.

Diseño de la plantilla.

Contenidos en el mismo Flash.

Externalizar el Contenido.

Como Agregar Contenido a un Documento XML.

Análisis del Código ActionScript que Carga e Interpreta y Asigna Formato al Contenido XML

Generación del Sitio

Diseño de la plantilla.

Contenidos en el mismo Flash.

Externalizar el Contenido.

Como Agregar Contenido a un Documento XML.

Análisis del Código ActionScript que Carga e Interpreta y Asigna Formato al Contenido XML

a

Generación del Sitio

a