You are on page 1of 39

Desarrollo de Proyectos

Interactivos


Bloque Electivo


Compilador:
Lic. Ingrid Riquelme Ramrez


Licenciatura en Diseo Grfico


CONOCERSE ACEPTARSE AMARSE CUIDARSE SUPERARSE TRANSMITIR TRANSFORMAR



Introduccin 1
Desarrollo de Proyectos Interactivos
ndice

Introduccin 3
Objetivo General 4

Tema 1. Manejo de la informacin en interactivos 5
Objetivo de Aprendizaje 5
Sinopsis 5
1.1 Hipertexto 5
1.2 Hipermedia 8
1.3 Hipervnculos o enlaces 9
1.4 Estructuracin 12

Tema 2. Interfaces para la interactividad 17
Objetivo de Aprendizaje 17
Sinopsis 17
2.1 Diagramacin y estructura 17
2.1.1 Sistemas de navegacin 18
2.2 Legibilidad 25
2.3 Proporcin 27
2.4 Accesibilidad para el usuario 28
2.5 Diagrama de hipertexto 30

Tema 3.Formatos 31
Objetivo de Aprendizaje 31
Sinopsis 31
3.1 Formatos para proyectos interactivos en CD- ROM 32
3.2 Formatos para proyectos en lnea 32
3.3 Compatibilidad entre plataformas 33

Tema 4. Produccin 35
Objetivo de Aprendizaje 35
Sinopsis 35
4.1 Creacin de un master 35
4.2 Programas FTP para colocar proyectos interactivos en Internet 36

Bibliografa General 39









Introduccin 2
Desarrollo de Proyectos Interactivos
Introduccin

Desde el desarrollo de la Word Wide Web, la forma de la lectura ha cambiado
bastante, anteriormente con los libros slo se lea de forma secuencial,
actualmente esto ha cambiado con el hipertexto y la hipermedia, en donde
muchas de las ocasiones parece no existir una trayectoria definida por el autor,
sino que el lector elige hacia dnde quiere ir, qu quiere hacer y hasta en algunos
casos el mismo escribe la historia, formando parte de una comunidad de
conocimiento inmensurable.

Al contar con todos los elementos es necesario basarse en una estructura
dependiendo de las necesidades del proyecto y del usuario, con ello se definir
desde un principio cul es el grado de poder del usuario dentro del proyecto y
qu caminos se desea sean elegibles.

Para tener interactividad con el usuario no hace falta introducir en el proyecto
todos los medios a nuestro alcance, tampoco basta con que sea interactivo sino
tambin accesible, desde el uso correcto de tipografa hasta el acceso va
mdem o banda ancha o por CD, son aspectos importantes en el desarrollo de
un proyecto interactivo.

Debe elegirse el soporte ms adecuando para el proyecto interactivo ya sea en
lnea o fuera de lnea (CD), dependiendo del contenido, usuarios, costo,
almacenamiento, velocidad, facilidad de acceso, retroalimentacin y
actualizacin.

Para subir en lnea o crear un CD hbrido, es necesario conocer las herramientas
necesarias, por ejemplo para proyectos en lnea lo ms recomendable es el uso
de aplicaciones FTP, mientras que para proyectos interactivos con distribucin va
CD, se genera el proyector y el ejecutable, existen ciertas limitantes en ste tipo
de distribucin por los sistemas operativos, sin embargo, existen opciones y se
puede solucionar para que el proyecto sea completamente accesible
independientemente del uso de Mac o PC.




Objetivo general 3
Desarrollo de Proyectos Interactivos












Objetivo general




Al trmino del curso el estudiante manejar los elementos y la estructura
necesaria para desarrollar y producir proyectos de comunicacin interactiva, tanto
en lnea como para CD-Rom.























Tema 1. Manejo de la informacin en interactivos 4
Desarrollo de Proyectos Interactivos

Tema 1. Manejo de la informacin en interactivos

Subtemas

1.1 Hipertexto
1.2 Hipermedia
1.3 Hipervculos o enlaces
1.4 Estructuracin


Objetivo de Aprendizaje

Al trmino del tema el estudiante comprender lo que es el hipertexto e
hipermedia as como algunas de sus caractersticas y formas de estructuracin.


Sinopsis

Desde el desarrollo de la Word Wide Web, la forma de la lectura ha cambiado
bastante, anteriormente con los libros slo se lea de forma secuencial,
actualmente esto ha cambiado con el hipertexto y la hipermedia, en donde
muchas de las ocasiones parece no existir una trayectoria definida por el autor,
sino que el lector elige hacia dnde quiere ir, qu quiere hacer y hasta en algunos
casos el mismo escribe la historia, formando parte de una comunidad de
conocimiento inmensurable.

La hipermedia ha enriquecido al conocimiento pues ya no es solo texto, sino se
conforma de imgenes, sonidos, audio y cualquier cantidad de aplicaciones que
se le pueden integrar para lograr una mayor interactividad con el usuario.

Al contar con todos estos elementos es necesario basarse en una estructura
dependiendo de las necesidades del proyecto y del usuario, con ello se definir
desde un principio cul es el grado de poder del usuario dentro del proyecto y
qu caminos se desea sean elegibles.


1.1 Hipertexto

Algunos dicen que el hipertexto comienza con las ideas de Vannevar Bush
1
, otros
con los pensamientos de Paul Otlet
2
, pero quien acu el trmino de Hipertexto

1
Vannevar Bush y el Memex (Memory Expander) As we may think,
www.press.umich.edu/jep/works/vbush
2
Paul Otlet, www.boxesandarrows.com/archives/forgotten_forefather_paul_otlet.php


Tema 1. Manejo de la informacin en interactivos 5
Desarrollo de Proyectos Interactivos

fue Ted Nelson con la siguente definicin: "un cuerpo de material escrito o
pictrico interconectado en una forma compleja que no puede ser
representado en forma conveniente haciendo uso de papel"
3
.

En los aos sesenta se presenta un proyecto llamado Xanadu
4
, su finalidad es la
de disponer de toda la literatura escrita por la humanidad. El ve al hipertexto como
un gnero literario en donde cualquier texto es Interrelacionable con otro. El
usuario en el ordenador dispone de la informacin por medio de una base de
datos y cada usuario aade vnculos, por lo que nada se pierde.

El hipertexto genera la necesidad de la interaccin por parte del receptor, esta
interactividad puede darse en diversos grados, desde el solo ir cambiando la
trayectoria a travs de los enlaces, hasta que el mismo receptor se convierta en
autor de la obra. Y as ha seguido evolucionando hasta lo que hoy conocemos
como la www o world wide web, en donde podemos encontrar toda clase de
informacin, transformndose en una red de conocimientos.

Una de las caractersticas ms importantes del hipertexto es que su lectura no es
completamente secuencial como podra ser la lectura en un libro, an limitando las
trayectorias a las que puede recurrir el usuario, no es tan lineal, algunos escritores
han creado novelas con hipertexto, donde la lectura es como un hipertexto, un
ejemplo es la novela Rayuela de J ulio Cortzar.

El hipertexto se conforma de informacin la cual presenta nodos y enlaces, un
nodo es la unidad de informacin, sta puede ser la pgina, pantalla, escena, etc.
y el enlace, es el vnculo entre cada unidad de informacin o nodo y cada nodo
puede contener toda clase de informacin incluyendo multimedia aunque al haber
multimedia se le llama hipermedia.















3
Ted Nelson, http://www.ldc.usb.ve/~abianc/hipertexto.html
4
Xanad, www.aus.xanadu.com/xanadu/future.html#7


Tema 1. Manejo de la informacin en interactivos 6
Desarrollo de Proyectos Interactivos



Figura 1.1 Ejemplo Nodo y enlace





















Tema 1. Manejo de la informacin en interactivos 7
Desarrollo de Proyectos Interactivos
1.2 Hipermedia

El trmino hipermedia es reciente, tiene una relacin muy estrecha con el
hipertexto, consta de los mismos elementos, un nodo y un enlace, la diferencia
entre stos dos son el uso de imgenes, audio, video, animacin como enlace en
la hipermedia, mientras que en el hipertexto se usa obviamente el texto.


Figura 1.2 Ejemplo Nodo y enlace en hipermedios














Tema 1. Manejo de la informacin en interactivos 8
Desarrollo de Proyectos Interactivos
1.3 Hipervnculos o enlaces

Los hipervnculos o enlaces constituyen una de las partes primordiales del
hipertexto, con ellos se traslada el usuario de un lugar a otro, encontrando
informacin y siguiendo un camino predeterminado.

Existen bsicamente tres tipos de enlaces:

1. Enlaces estructurales. Con este tipo de vinculacin el usuario se traslada de
un nodo a otro, respetando la estructura de la informacin, un ejemplo para
identificar este tipo de vnculo, es cuando en una pgina de inicio hay varios
botones los cuales al accionarlos muestran cierta informacin solicitada.





Figura 1.3a Vnculos estructurales





Tema 1. Manejo de la informacin en interactivos 9
Desarrollo de Proyectos Interactivos
2. Enlaces asociativos. Son palabras o imgenes vinculadas a otros nodos
que proporcionan mayor informacin relativa al tema.

























Figura 1.3b Vnculos asociativos



















Tema 1. Manejo de la informacin en interactivos 10
Desarrollo de Proyectos Interactivos
3. Enlaces incrustados. Son aquellos vnculos que ayudan a los usuarios a
encontrar lo que buscan si el lugar en donde estn no es el adecuado.




Figura 1.3b Vnculos incrustados


Los vnculos al estar ligados ntimamente al hipertexto y a los hipermedios, deben
ser llamativos y descriptivos. Siguen una funcin parecida a los encabezados en
un peridico, te describen cierta informacin y la destacan de forma breve y
concisa.











Tema 1. Manejo de la informacin en interactivos 11
Desarrollo de Proyectos Interactivos
1.4 Estructuracin

Al haber recolectado la informacin y contar con todos los nodos, se selecciona la
estructura de hipertexto/hipermedia, depende bsicamente del cada tipo de
proyecto/usuario y sus necesidades, existen aproximadamente cuatro estructuras,
las cuales se vern una por una a continuacin.

Secuencial o lineal

Es la forma ms simple de organizar la informacin, debido a que es
completamente secuencial, generalmente es utilizada para contenidos educativos
o presentaciones donde el contenido se va dando paso a paso, restringe bastante
la interactividad, la ventaja de este tipo de estructura es que se asegura el acceso
del usuario a la informacin.











Figura 1.4a Estructuracin secuencial





















Tema 1. Manejo de la informacin en interactivos 12
Desarrollo de Proyectos Interactivos
Jerrquica

Este tipo de estructura conocida tambin como arborescente consta bsicamente
de una pgina principal de la cual se va desglosando la informacin, dependiendo
de su orden de importancia, generalmente es utilizado para proyectos
institucionales.


















Figura 1.4b Estructuracin jerrquica






















Tema 1. Manejo de la informacin en interactivos 13
Desarrollo de Proyectos Interactivos
Reticular

Este tipo de navegacin es una combinacin entre la estructura secuencial y la de
jerrquica, ordena la informacin categricamente; es utilizada generalmente para
uso acadmico, permite un grado mayor de interactividad por parte del usuario.





















Figura 1.4c Estructuracin reticular




















Tema 1. Manejo de la informacin en interactivos 14
Desarrollo de Proyectos Interactivos
Telaraas

La telaraa es utilizada bsicamente para usuarios avanzados, pues tienen un
completo dominio sobre la informacin, pueden vincularse de cualquier parte del
sitio sin haber un orden jerrquico, para los usuarios principiantes resulta ser muy
confuso este tipo de navegacin. Sin embargo con este tipo de estructura hay
mucha ms interaccin con el usuario sin limitarle demasiado los trayectos
posibles a elegir.


















Figura 1.4d Estructuracin telaraa




















Tema 1. Manejo de la informacin en interactivos 15
Desarrollo de Proyectos Interactivos
La mayor parte de los sitios utiliza ms de una estructura de navegacin,
dependiendo de los requerimientos de despliegue de la informacin. Se puede
decir que mientras mayor sea el grado de complejidad se tender al uso de
estructuras tipo telaraa y a mayor simplicidad se usar la secuencial.




Figura 1.4e Uso Estructuras













Tema 2. Interfaces para la interactividad 16
Desarrollo de Proyectos Interactivos
Tema 2. Interfase para la interactividad

Subtemas

2.1 Diagramacin y estructura
2.1.1 Sistemas de Navegacin
2.2 Legibilidad
2.3 Proporcin
2.4 Accesibilidad para el usuario
2.5 Diagrama del hipertexto


Objetivo de Aprendizaje

Al trmino del tema el estudiante desarrollar proyectos interactivos en base a la
correcta eleccin de sistemas de navegacin, facilitando la accesibilidad y
usabilidad al usuario.


Sinopsis

La estructura de informacin se encuentra ntimamente ligada con los sistemas de
navegacin; esto se debe a que mientras mayor control se tenga sobre la
organizacin de la estructura, ms fcil es decidir sobre que sistema de
navegacin se basar el proyecto interactivo y el grado de interactividad que
deber tener; sin embargo, no basta con tener un sistema de navegacin correcta
y contar con toda la informacin, tambin hace falta pensar en el usuario.

Para tener interactividad con el usuario, no hace falta introducir en el proyecto
todos los medios a nuestro alcance, tan slo basta con estudiar, estructurar el
proyecto, pero sobre todo ver las necesidades del usuario. No slo basta con que
sea interactivo, sino tambin accesible, desde el uso correcto de tipografa hasta
el acceso va modem o banda ancha o por CD, son aspectos importantes en el
desarrollo de un proyecto interactivo


2.1 Diagramacin y estructura

Una vez definidos los contenidos del proyecto interactivo y analizando
previamente sus necesidades se procede a disear la estructura de la informacin.
Los contenidos se irn conformando con hipertextos e hipermedios dependiendo
de la naturaleza del proyecto, facilitando as, la interaccin de los usuarios.



Tema 2. Interfaces para la interactividad 17
Desarrollo de Proyectos Interactivos
























Con esta estructuracin se definirn las posibles opciones que tiene el usuario en
su trayectoria adems de permitir visualizar fcilmente el grado de interactividad.
La interfaz grfica deber comunicar dicha estructura de la informacin por medio
de los sistemas de navegacin, independientemente del uso de botones, mapa de
imgenes, conos o textos como enlaces.

2.1.1 Sistemas de Navegacin

Segn los criterios de Gloor(1997)
5
existen siete sistemas de navegacin las
cuales pueden ser bastante tiles en un proyecto interactivo, entre estos sistemas
estn la bsqueda, jerarqua, similitud, cada uno se ver a detalle a continuacin:

Enlace. Es el sistema bsico de vinculacin, traslada al usuario de un nodo a otro.


Figura 2.1.a Ejemplo enlace, www.kirupa.com




5
Gloor, P. Elements of Hypermedia Design: Techniques for Navigation and Visualization in
Cyberspace. Birkhuser, Cambridge MA, 1997. (http://www.ickn.org/elements/index.htm)


Tema 2. Interfaces para la interactividad 18
Desarrollo de Proyectos Interactivos

Bsqueda. Al tener una mayor complejidad en la estructuracin de informacin y
contar con una cantidad inmensa de nodos, la mejor opcin es el motor de
bsqueda, puede ser por palabras clave, por secciones o categoras, un claro
ejemplo de este sistema es google.




Figura 2.1.b Ejemplo bsqueda, www.google.com


Secuencializacin. Con este sistema se aumenta la probabilidad de que el
usuario no pierda parte esencial de los contenidos siguiendo una secuencia, un
claro ejemplo son pginas de tutoriales los cuales van guiando paso a paso al
usuario.

Jerarqua. Simplemente se jerarquiza la informacin por orden de precisin, como
ejemplo pueden mostrarse los nodos de mayor importancia a menor o de antiguo
a reciente.



Tema 2. Interfaces para la interactividad 19
Desarrollo de Proyectos Interactivos
Similitud. Se hace uso de elementos comunes como palabras clave, temas,
objetos, como el peridico en lnea, donde estn las secciones de ciudad,
finanzas, internacional, etc.





Figura 2.1.c Ejemplo secuencia, www.kirupa.com



















Tema 2. Interfaces para la interactividad 20
Desarrollo de Proyectos Interactivos



Figura 2.1.d Ejemplo jerarqua, www.wired.com























Tema 2. Interfaces para la interactividad 21
Desarrollo de Proyectos Interactivos



Figura 2.1.e Ejemplo jerarqua, www.eluniversal.com






















Tema 2. Interfaces para la interactividad 22
Desarrollo de Proyectos Interactivos
Mapas. Son representaciones de los nodos que conforman el sitio y reflejan una
visin global de la informacin. Son muy utilizados para facilitarle a los usuarios
todas las opciones que tiene sin pasar necesariamente por todas, un claro ejemplo
son los mapas de sitio.





Figura 2.1.f Ejemplo mapas, www.eluniversal.com



















Tema 2. Interfaces para la interactividad 23
Desarrollo de Proyectos Interactivos
Agentes. Son guas que facilitan la realizacin de cierto proceso o actividad
siguiendo pasos predefinidos.






















Figura 2.1.f Ejemplo mapas






















Tema 2. Interfaces para la interactividad 24
Desarrollo de Proyectos Interactivos
2.2 Legibilidad

Legibilidad es la capacidad de definir y distinguir claramente los caracteres del
alfabeto, mientras tanto que la comprensin se refiere al contenido del texto o
prrafo. La compresin se encuentra ligada a la legibilidad, mientras ms ntido
sea el carcter y su entorno (color de fondo, interlineado, estilo de la tipografa,
etc.), se lograr una mayor comprensin del contenido.

Muchas ocasiones se encuentran pginas donde el diseo experimental
predomina, visualmente puede lucir esttico, sin embargo, el contenido ha sido
dejado a un lado. Habr usuarios seguidores de ste tipo de sitios, as como
aquellos que cambien rpidamente de pgina por no encontrar la informacin que
desean, por ello es necesario estudiar el mercado, para saber exactamente hasta
qu punto lo esttico tiene un mayor peso que el contenido.




Figura 2.2.a Uso de tipografa donde lo esttico predomina al contenido.
www.nuevosricos.com



Tema 2. Interfaces para la interactividad 25
Desarrollo de Proyectos Interactivos
La legibilidad en pantalla e impresos difiere sustancialmente. En pantalla el
usuario tiende a reducir el nmero de palabras que lee, esto se debe al cansancio
producido por el monitor y a la gran competencia existente entre cada pgina,
cada una debe llamar la atencin del usuario pero sobre todo retenerla. Para
lograr la retencin hay unos puntos bsicos a desarrollar en la mayora de las
pginas, uno de ellos es el uso de palabras claves destacadas, uso de subttulos,
prrafos pequeos y con una sola idea.




Figura 2.2.b Uso de puntos bsicos, remarcados en naranja
www.eluniversal.com.mx








2.3 Proporcin


Tema 2. Interfaces para la interactividad 26
Desarrollo de Proyectos Interactivos

Las aplicaciones encargadas de presentar las pginas Web son los navegadores
(browsers), entre los que destacan Internet Explorer y Netscape Navigator,
Mozilla, etc.

La forma de la ventana del navegador es siempre rectangular, pero su tamao
vara, dependiendo del monitor y de la tarjeta grfica. Se hablan de dos tamaos
de pantalla diferentes:

Tamao absoluto: es el tamao "real" de la ventana del monitor, medido
generalmente en pulgadas, depende de cada monitor.

Resolucin o tamao relativo: viene determinada por el nmero de pxeles que se
muestran en la ventana del monitor, siendo el pxel la unidad mnima de
informacin que se puede presentar en pantalla. La resolucin ms utilizada
actualmente es de 800 x 600 pxeles.

Existen ms resoluciones como veremos a continuacin:




























Tema 2. Interfaces para la interactividad 27
Desarrollo de Proyectos Interactivos


Figura 2.3 Algunas resoluciones de pantallas


2.4 Accesibilidad para el usuario

Sin desearlo, al disear un proyecto interactivo en lnea o en CD-ROM, se est
diseando para un sin fin de plataformas, navegadores y usuarios, por ello se
deben tener en cuenta algunas especificaciones tcnicas sobre el equipo de los
usuarios as como aspectos funcionales. Se muestra una breve lista de los puntos
que no se deben olvidar a continuacin:

1. Resolucin del monitor
600 x 800 px
1024 x 768 px
1280 x 960 px

Actualmente se disean las pginas conforme a estos estndares, sin
embargo, con el tiempo irn cambiando las medidas por la constante
evolucin de los equipos y mejora en los monitores.



Tema 2. Interfaces para la interactividad 28
Desarrollo de Proyectos Interactivos

2. Navegadores
Internet Explorer
Netscape Communicator
Mozilla

Y unos 50 ms navegadores, pueden obtener informacin en:
http://browsers.evolt.org/

Cada navegador despliega la informacin segn decodifica los lenguajes
como el html, por ello es que hay ciertas variantes en la visualizacin de los
contenidos dependiendo del navegador y su versin, adems de que algunos
plug ins o java scripts no son compatibles con los diversos navegadores
existentes en el mercado.

3. Velocidad de conexin
Mdem
Banda Ancha

Es muy importante saber qu tipo de usuarios navegar el sitio, porque de
eso depende la velocidad en la que descargarn las pginas, no hay que
olvidar que si la mayora de nuestros usuarios cuentan con mdem, la
visualizacin debe ser rpida debido a que el lmite para que una persona
mantenga su atencin en una pgina es de 10 segundos*
6
o se corre el
riesgo de que ya no visiten el sitio por la tardanza, an siendo un diseo muy
atractivo.

Cuando se desarrollan proyectos complejos y con muchos elementos de
multimedia se tiende a caer en el uso de archivos demasiado pesados, una
manera de solucionar esto es avisando al usuario desde un inicio, cunto
tiempo va a tardar en descargar la pgina, mientras tanto, l puede ir
visitando otros sitios.

Otra situacin es si los usuarios ingresan a la pgina o proyecto por medio de
CD-ROM, Intranet o de su trabajo, debido a que generalmente se cuenta con
banda ancha, por lo tanto, se tiene la libertad de no preocuparse tanto por el
peso e introducir un mayor nmero de elementos multimedia.

4. Uso de plug ins
La especificacin del uso de plug ins, es necesaria para la correcta
visualizacin del sitio, sealada desde un principio.

La mayora de las ocasiones se disea para una descarga rpida del sitio y
su eficiencia en los ordenadores, pero pocas veces se detienen a ver la

6
Nielsen, J akob. (2000) Usabilidad Diseo de sitios Web. Pg. 42-45.


Tema 2. Interfaces para la interactividad 29
Desarrollo de Proyectos Interactivos
importancia del usuario y los beneficios que se obtendran si diseramos en
base a ellos. No es suficiente con la funcionalidad del sitio sino que tambin
debe ser accesible y usable, captando as, un mayor nmero de usuarios.

Al aumentar la interactividad con el usuario hay un mayor aprovechamiento
de los recursos del sistema.


2.5 Diagrama del hipertexto

El diagrama ilustra la estructuracin de los nodos y la relacin entre ellos, cada
nodo muestra cierta codificacin y muestra con qu otros nodos ser enlazada, un
ejemplo del diagrama se muestra en la imagen a continuacin:
























Figura 2.5 Ejemplo Diagrama







Tema 3. Formatos 30
Desarrollo de Proyectos Interactivos
Tema 3. Formatos

Subtemas

3.1 Formatos para proyectos interactivos en CD ROM
3.2 Formatos para proyectos interactivos en lnea
3.3 Compatibilidad entre plataformas


Objetivo de Aprendizaje

Al trmino del tema el estudiante conocer y ejecutar las herramientas y soportes
para la produccin de proyectos interactivos.


Sinopsis

Debe elegirse el soporte ms adecuando para el proyecto interactivo ya sea en
lnea o fuera de lnea (CD), dependiendo del contenido, usuarios, costo,
almacenamiento, velocidad, facilidad de acceso, retroalimentacin y actualizacin.

Cada soporte tiene ventajas y desventajas como lo veremos en la tabla a
continuacin:



Caractersticas

Soportes On-line Soportes Off-line
Transporte Pleno Depende del acceso
Capacidad de Almacenamiento Limitada Ilimitada
Actualizacin de contenidos Exige nueva edicin En tiempo real
Transparencia de uso mayor Menor
Velocidad de Acceso Mayor Menor
Disponibilidad de la tecnologa
Ordenadores
Multimedia
Ordenadores conectados
Coste de difusin Copias Hospedaje de pginas
Interactividad con y entre los
usuarios
Nula Plena

Figura 3.a Caractersticas Soportes



Tema 3. Formatos 31
Desarrollo de Proyectos Interactivos

3.1 Formatos para proyectos interactivos en CD-ROM

Los proyectos interactivos pueden desarrollarse en dos software principalmente, la
seleccin de uno o ambos depende esencialmente de las necesidades de cada
proyecto. Ambos son de Macromedia
7
, uno es llamado Director y el otro es Flash,
ambos son compatibles, sin embargo, cada uno cumple con ciertas necesidades.

Macromedia Director

Es una herramienta diseada para crear contenido interactivo para CD y para el
internet. Con este software se puede incorporar fotografa, video, sonido,
animacin, modelos 3D, texto y swf.

Con Director se pueden crear aplicaciones que dan acceso y controlan otras
aplicaciones, adems de que se puede crear contenido para personas con
capacidades distintas. Lo ms recomendable es usar Director cuando se desee
hacer contenido interactivo con animacin 2D y 3D, video, audio, grficos, etc. Por
su desempeo, es ideal para el desarrollo de contenido en CD, DVD y Kioscos.

Macromedia Flash

Es un programa desarrollado para trabajar en vectores principalmente y puede
desplegar archivos pequeos, como fotografas, video, sonido, texto, optimizando
todos estos para la Web. Con este software se pueden hacer animaciones 2D, de
excelente calidad, tiene grandes ventajas a excepcin de las animaciones en 3D,
que no pueden ser controladas de igual forma como con Director.

Los formatos de los archivos generados para su uso en CD, son *.EXE para
Windows y *.HQX para Mac, posteriormente si se desea que sea un CD auto
ejecutable encontrarn las instrucciones de cmo hacerlo en el captulo 4.

Tambin podran incluirse directamente los archivos de un sitio, es decir, los
archivos html, pero por lo general, es mejor usar cualquiera de los programas
anteriores pues se ven con mejor calidad.


3.2 Formatos para proyectos interactivos en lnea

La tendencia es que las pginas web de Internet sean multimedia. La mayora de
las pginas Web slo son visuales y utilizan medios escritos, de imagen y
animacin, y muchas an no aaden sonido, sin embargo, s tienen al menos
interaccin mnima que es una caracterstica importante de los multimedios

7
http://www.macromedia.com/la


Tema 3. Formatos 32
Desarrollo de Proyectos Interactivos

actuales. Conforme se mejoran las capacidades y el ancho de banda de Internet
(cantidad de informacin que puede transferirse a las computadoras conectadas)
los multimedios se ampliarn a todas sus caractersticas.

Cuando vemos una pgina Web en lnea, parece ser un solo elemento y no es as,
est compuesta por una gran cantidad de archivos que van desde la informacin,
imgenes, videos, etc. todos stos elementos son integrados bajo un lenguaje de
programacin llamado HTML, por s mismo puede resultar un poco esttico, por
ello, para lograr un mayor grado multimedia o interactividad, existen diferentes
lenguajes de programacin, plug ins o applets que pueden ser integrados en los
navegadores o plataformas.


3.3 Compatibilidad entre plataformas

Existen diferentes plataformas informticas en funcin del hardware y sistema
operativo instalado, a continuacin se mencionarn las plataformas existentes en
la actualidad
8
.

Plataforma PC/Windows. Es la ms extendida, a nivel usuario y domstico.
Tambin la encontramos en determinadas empresas que no trabajen en red,
aunque cada da es ms frecuente que estn todos interconectados. Son
mquinas mono procesadoras (un solo procesador), en cuanto a hardware, con el
SO Windows, de representacin de la informacin a travs de ventanas, que fue
creado por Microsoft y basado en el sistema visual y de almacenamiento de
carpetas, escritorio, etc. de Macintosh, un entorno muy intuitivo y agradable.

Plataforma Apple/Mac-Os. Est menos extendida a nivel usuario, ya que se ha
concentrado en aquellas personas o empresas dedicadas al sector grfico o
publicitario. Esto fue debido a que los microprocesadores Apple, su estructura y
SO, eran ms robustos, con mayor fidelidad respecto a los datos manejados y
mayor capacidad para manejar grandes datos y efectuar grandes operaciones
como las que se realizan a nivel multimedia o grficos. Poco a poco el PC va
adquiriendo una mayor robustez as como unos microprocesadores cada vez ms
potentes y es por esto que el PC, o WS son muy utilizados actualmente en
empresas de este sector.

En un principio eran totalmente incompatibles, pero cada vez ms se aproximan y
tras el nacimiento del PowerPC, es ms factible trabajar con las dos plataformas.
Son mquinas mono procesadoras y multitarea. (El Mac siempre ha tenido una
mayor capacidad que el pc)


8
http://www.cnice.mecd.es/eos/MaterialesEducativos/mem2001/nutricion/program/in/basi.html


Tema 3. Formatos 33
Desarrollo de Proyectos Interactivos
Plataforma WS/Windows NT. Es una plataforma formada por uno o varios
procesadores intel, con un SO de Windows, pero especfico para trabajar en red.

Plataforma Unix. Es una plataforma formada por varios procesadores intel o
similar y el Sistema operativo Unix creado por Bell, y de libre distribucin. Un
sistema operativo muy robusto y de gran fiabilidad y seguridad en la informacin.
Existe un SO unix, creado por Sun y llamado Solaris, muy utilizado en servidores
de informacin, bases de datos, redes, etc.

Plataforma WS/Linux. PC/Linux. Es una plataforma similar a la de Unix, pero
para PC mono procesadores. Tambin de libre distribucin y que est teniendo
una gran aceptacin e implantacin.

Hay que tomar en cuenta las plataformas existentes para hacer el proyecto lo ms
accesible posible, independientemente del sistema operativo o plataforma
utilizada, la mayor parte de los usuarios o tiene una PC o Mac, su funcionamiento
es similar, sin embargo, cada uno interpreta la informacin de forma distinta.






























Tema 4. Produccin 34
Desarrollo de Proyectos Interactivos

Tema 4. Produccin

Subtemas

4.1 Creacin de un master
4.2 Programas FTP para colocar proyectos interactivos en Internet


Objetivo de Aprendizaje

Al trmino del tema el estudiante utilizar las herramientas necesarias para
exponer un proyecto interactivo en soporte off-line y on-line.


Sinopsis

Para subir en lnea o crear un CD hbrido, es necesario conocer las herramientas
necesarias, por ejemplo para proyectos en lnea lo ms recomendable es el uso
de aplicaciones FTP, mientras que para proyectos interactivos con distribucin va
CD, se genera el proyector y el ejecutable, existen ciertas limitantes en ste tipo
de distribucin por los sistemas operativos, sin embargo, existen opciones y se
puede solucionar para que el proyecto sea completamente accesible
independientemente del uso de Mac o PC.


4.1 Creacin de un master

Director y Flash no tienen la habilidad de crear CDs o habilitar el Auto Ejecutable
por s mismos. Los proyectores son especficos para cada tipo de plataforma, un
proyector para Mac no sirve para Windows y viceversa, sin embargo se puede
crear un CD hbrido el cual contenga ambos proyectores.

La mejor opcin es crear cada ejecutable en cada una de sus plataformas y
quemarlos en el Mac, con un software llamado Toast de Roxio
9
.

Auto Ejecutable en Windows
10

El auto ejecutable puede ser implementado al momento de quemar el CD. Para
ello se debe generar un archivo llamado AutoRun.inf en el programa Bloc de Notas
y deber incluir el siguiente texto:


9
http://www.roxio.com/en/support/toast/toasthybrid.jhtml
10
http://www.macromedia.com/go/tn_13374


Tema 4. Produccin 35
Desarrollo de Proyectos Interactivos
[AutoRun]
open=nombre_proyecto.exe

Este archivo deber colocarse en la misma ubicacin que el proyector de
Windows. Se remplazar el nombre_proyecto por el nombre del archivo
generado. Con estos dos archivos en el CD, en cualquier PC se auto ejecutar el
proyector.

Auto Ejecutable en Mac

En la Mac, la funcionalidad de Auto ejecutable no funciona como un programa o
script, como el archivo *.INF en Windows, sino que la ejecuta el Quicktime.

Para crear un proyector para Mac que funcione con el autoPlay, se debe tener un
software que tenga la opcin de AutoPlay, uno de esos programas es el Toast de
Roxio.


4.2 Programas FTP para colocar proyectos interactivos en
Internet

Para cargar los archivos de un sitio en un servidor en la WWW, es necesario tener
un programa llamado FileTransfer Protocol (FTP). Con esta aplicacin es posible
acceder y transferir documentos utilizando la red.

Los programas FTP en una parte visualizan la estructura de directorios del
ordenador local y en la otra parte la estructura del ordenador remoto al que se ha
hecho la conexin, as es posible cargar o bajar los archivos. De la misma manera
es posible borrar o renombrar los archivos. Los programas FTP contienen por lo
general una "pgina" de administracin. En ella se pueden memorizar todos los
datos de las direcciones FTP (computador servidor o direccin del dominio)
direccin del servidor, datos de usuario y contrasea.














Tema 4. Produccin 36
Desarrollo de Proyectos Interactivos



Figura 4.2.a Ejemplo pantalla Programa Cute FTP


En los siguientes links podrn encontrar informacin sobre algunos de los
programas FTP existentes, algunos son de uso libre y otros hay que pagar
licencia. Hay diversos dependiendo del sistema operativo.

http://www.duiops.net/descarga/ftp.htm
http://es.selfhtml.org/selfhtml7/tbcf.htm

Existe una gran cantidad de programas para subir los archivos en Internet por
FTP, si el sitio fue desarrollado con Dreamweaver, existe la opcin de subir los
archivos con ste mismo programa, slo basta seguir las siguientes instrucciones:

1. Abrir programa Dreamweaver, ir a Sitio>Nuevo Sitio

2. Seguir las instrucciones en la ventana que aparece, hasta llegar a la seccin
compartir archivos.

3. Ah hay varias opciones, una de ellas es FTP, se selecciona y se aaden los
datos.

4. Introducir direccin FTP

5. Nombre de la carpeta donde se almacenarn los archivos


Tema 4. Produccin 37
Desarrollo de Proyectos Interactivos

6. Nombre del usuario

7. Contrasea

Todos estos datos tcnicos los proporciona el proveedor del hosting, no olvidar
pedir la informacin antes de configurar el FTP.




























Figura 4.2.b Ventana configuracin FTP en Dreamweaver











Bibliografa General 38
Desarrollo de Proyectos Interactivos
Bibliografa general


- Nielsen Kakob. Usabilidad. Diseo de Sitios Web. Pearson Educacin, S.A.
Madrid, 2000

- Rosenfeld, Louis. Arquitectura de la informacin para el www. McGraw-Hill,
Mxico, 2000

- Moreno Muoz, Antonio. Diseo ergonmico de aplicaciones hipermedia.
Paids, Barcelona, 2000

- Green, Tom. Sitios Web Dinmicos con Studio MX 2004. Anaya Multimedia,
Madrid, 2004

- Drsteler, J uan Carlos. Visualizacin de informacin. Gestin 2000,
Barcelona, 2003

- Orihuela, J os Luis. Introduccin al diseo digital. Anaya Multimedia, Madrid,
1999

- Lynch, Patrick. Principios de Diseo Bsicos para la creacin de Sitios Web.
Gustavo Gili, Barcelona, 2002


Vnculos


- http://www.duiops.net/descarga/ftp.htm

- http://es.selfhtml.org/selfhtml7/tbcf.htm

- http://www.roxio.com/en/support/toast/toasthybrid.jhtml

- http://www.macromedia.com/go/tn_13374

- http://www.press.umich.edu/jep/works/vbush

- http://www.boxesandarrows.com/archives/forgotten_forefather_paul_otlet.php

- http://www.aus.xanadu.com/xanadu/future.html#7