Desar sar roll ro llo o de d e Proye ro yect ctos os Interactivos Bloque Bloqu e Electiv Electivo o Compilador: Lic. Lic . Ingr Ingrid id Riquelme Ramírez Ramírez
Licenciatur Lic enciatura a en Dis Diseño eño Gráfico Gráfico
Desarrollo Desarrollo de Proyectos Proyectos Interactivos Interactivos Índice Introducción Objetivo General General Tema 1. Manejo Manejo de la infor mación en in teractivo s Objetivo de Aprendizaje Aprendizaje Sinopsis 1.1 Hipertexto 1.2 Hipermedia 1.3 Hipervínculos o enlaces 1.4 Estructuración
Tema 2. Interfaces Interfaces p ara la interactiv idad Objetivo de Aprendizaje Sinopsis 2.1 Diagramación y estructura 2.1.1 Sistemas de navegación 2.2 Legibilidad 2.3 Proporción 2.4 Accesibilidad para el usuario 2.5 Diagrama de hipertexto
Tema 3.Formatos 3.Formatos Objetivo de Aprendizaje Sinopsis 3.1 Formatos para proyectos interactivos en CD- ROM 3.2 Formatos para proyectos en línea 3.3 Compatibilidad entre plataformas
Tema 4. Produc ción ció n
3 4 5 5 5 5 8 9 12 17 17 17 17 18 25 27 28 30 31 31 31 32 32 33
Objetivo de Aprendizaje Sinopsis 4.1 Creación de un master 4.2 Programas FTP para colocar proyectos interactivos en Internet
35 35 35 35 36
Bibliografía General
39
Introducción
1
Desarrollo Desarrollo de Proyectos Proyectos Interactivos Interactivos Índice Introducción Objetivo General General Tema 1. Manejo Manejo de la infor mación en in teractivo s Objetivo de Aprendizaje Aprendizaje Sinopsis 1.1 Hipertexto 1.2 Hipermedia 1.3 Hipervínculos o enlaces 1.4 Estructuración
Tema 2. Interfaces Interfaces p ara la interactiv idad Objetivo de Aprendizaje Sinopsis 2.1 Diagramación y estructura 2.1.1 Sistemas de navegación 2.2 Legibilidad 2.3 Proporción 2.4 Accesibilidad para el usuario 2.5 Diagrama de hipertexto
Tema 3.Formatos 3.Formatos Objetivo de Aprendizaje Sinopsis 3.1 Formatos para proyectos interactivos en CD- ROM 3.2 Formatos para proyectos en línea 3.3 Compatibilidad entre plataformas
Tema 4. Produc ción ció n
3 4 5 5 5 5 8 9 12 17 17 17 17 18 25 27 28 30 31 31 31 32 32 33
Objetivo de Aprendizaje Sinopsis 4.1 Creación de un master 4.2 Programas FTP para colocar proyectos interactivos en Internet
35 35 35 35 36
Bibliografía General
39
Introducción
1
Desarrollo Desarrollo de Proyectos Proyectos Interactivos Interactivos Introducción Desde el desarrollo de la Word Wide Web, la forma de la lectura ha cambiado bastante, anteriormente con los libros sólo se leía 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 dónde 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 necesario basarse en una estructura estructura dependiendo de las necesidades del proyecto y del usuario, con ello se definirá desde un principio cuál 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 también accesible, desde el uso correcto de tipografía hasta el acceso vía módem o banda ancha o por CD, son aspectos importantes en el desarrollo de un proyecto interactivo. Debe elegirse el soporte más adecuando para el proyecto interactivo ya sea en línea o fuera de línea (CD), dependiendo del contenido, usuarios, costo, almacenamiento, velocidad, facilidad de acceso, retroalimentación y actualización. Para subir en línea o crear un CD híbrido, es necesario conocer las herramientas necesarias, por ejemplo para proyectos en línea lo más recomendable es el uso de aplicaciones FTP, mientras que para proyectos interactivos con distribución vía CD, se genera el proyector y el ejecutable, existen ciertas limitantes en éste tipo de distribución 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.
Introducción
2
Desarrollo de Proyectos Interactivos
Objetivo general
Al término del curso el estudiante manejará los elementos y la estructura necesaria para desarrollar y producir proyectos de comunicación interactiva, tanto en línea como para CD-Rom.
Objetivo general
3
Desarrollo de Proyectos Interactivos Tema 1. Manejo de la información en interactivos Subtemas 1.1 Hipertexto 1.2 Hipermedia 1.3 Hipervículos o enlaces 1.4 Estructuración
Objetivo de Aprendizaje Al término del tema el estudiante comprenderá lo que es el hipertexto e hipermedia así como algunas de sus características y formas de estructuración.
Sinopsis Desde el desarrollo de la Word Wide Web, la forma de la lectura ha cambiado bastante, anteriormente con los libros sólo se leía 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 dónde 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 imágenes, 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 cuál es el grado de poder del usuario dentro del proyecto y qué caminos se desea sean elegibles.
1.1Hipertexto 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 término 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 información en interactivos
4
Desarrollo de Proyectos Interactivos fue Ted Nelson con la siguente definición: "un cuerpo de material escrito o
pictórico interconectado en una forma compleja que no puede ser representado en for ma conveniente haciendo uso de papel" 3. En los años 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 género literario en donde cualquier texto es Interrelacionable con otro. El usuario en el ordenador dispone de la información por medio de una base de datos y cada usuario añade vínculos, por lo que nada se pierde. El hipertexto genera la necesidad de la interacción por parte del receptor, esta interactividad puede darse en diversos grados, desde el solo ir cambiando la trayectoria a través 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 información, transformándose en una red de conocimientos. Una de las características más importantes del hipertexto es que su lectura no es completamente secuencial como podría ser la lectura en un libro, aún 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 Julio Cortázar. El hipertexto se conforma de información la cual presenta nodos y enlaces, un nodo es la unidad de información, ésta puede ser la página, pantalla, escena, etc. y el enlace, es el vínculo entre cada unidad de información o nodo y cada nodo puede contener toda clase de información incluyendo multimedia aunque al haber multimedia se le llama hipermedia.
3
Ted Nelson, http://www.ldc.usb.ve/~abianc/hipertexto.html Xanadú, www.aus.xanadu.com/xanadu/future.html#7
4
Tema 1. Manejo de la información en interactivos
5
Desarrollo de Proyectos Interactivos
Figura 1.1 Ejemplo Nodo y enlace
Tema 1. Manejo de la información en interactivos
6
Desarrollo de Proyectos Interactivos 1.2Hipermedia El término hipermedia es reciente, tiene una relación muy estrecha con el hipertexto, consta de los mismos elementos, un nodo y un enlace, la diferencia entre éstos dos son el uso de imágenes, audio, video, animación 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 información en interactivos
7
Desarrollo de Proyectos Interactivos 1.3Hipervínculos o enlaces Los hipervínculos o enlaces constituyen una de las partes primordiales del hipertexto, con ellos se traslada el usuario de un lugar a otro, encontrando información y siguiendo un camino predeterminado. Existen básicamente tres tipos de enlaces: 1.
Enlaces estructurales . Con este tipo de vinculación el usuario se traslada de un nodo a otro, respetando la estructura de la información, un ejemplo para identificar este tipo de vínculo, es cuando en una página de inicio hay varios botones los cuales al accionarlos muestran cierta información solicitada.
Figura 1.3a Víncul os estr uctur ales
Tema 1. Manejo de la información en interactivos
8
Desarrollo de Proyectos Interactivos 2.
Enlaces asociativos . Son palabras o imágenes vinculadas a otros nodos que proporcionan mayor información relativa al tema.
Figura 1.3b Vínculo s asociativo s
Tema 1. Manejo de la información en interactivos
9
Desarrollo de Proyectos Interactivos 3.
Enlaces incrustados . Son aquellos vínculos que ayudan a los usuarios a encontrar lo que buscan si el lugar en donde están no es el adecuado.
Figura 1.3b Vínculos in crus tados Los vínculos al estar ligados íntimamente al hipertexto y a los hipermedios, deben ser llamativos y descriptivos. Siguen una función parecida a los encabezados en un periódico, te describen cierta información y la destacan de forma breve y concisa.
Tema 1. Manejo de la información en interactivos 10
Desarrollo de Proyectos Interactivos 1.4Estructuración Al haber recolectado la información y contar con todos los nodos, se selecciona la estructura de hipertexto/hipermedia, depende básicamente del cada tipo de proyecto/usuario y sus necesidades, existen aproximadamente cuatro estructuras, las cuales se verán una por una a continuación.
Secuencial o lineal Es la forma más simple de organizar la información, 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 información.
Figura 1.4a Estruc turació n secuencial
Tema 1. Manejo de la información en interactivos 11
Desarrollo de Proyectos Interactivos Jerárquica Este tipo de estructura conocida también como arborescente consta básicamente de una página principal de la cual se va desglosando la información, dependiendo de su orden de importancia, generalmente es utilizado para proyectos institucionales.
Figura 1.4b Estructuració n jerárquica
Tema 1. Manejo de la información en interactivos 12
Desarrollo de Proyectos Interactivos Reticular Este tipo de navegación es una combinación entre la estructura secuencial y la de jerárquica, ordena la información categóricamente; es utilizada generalmente para uso académico, permite un grado mayor de interactividad por parte del usuario.
Figura 1.4c Estruc turació n reticular
Tema 1. Manejo de la información en interactivos 13
Desarrollo de Proyectos Interactivos Telarañas La telaraña es utilizada básicamente para usuarios avanzados, pues tienen un completo dominio sobre la información, pueden vincularse de cualquier parte del sitio sin haber un orden jerárquico, para los usuarios principiantes resulta ser muy confuso este tipo de navegación. Sin embargo con este tipo de estructura hay mucha más interacción con el usuario sin limitarle demasiado los trayectos posibles a elegir.
Figura 1.4d Estruc turació n telaraña
Tema 1. Manejo de la información en interactivos 14
Desarrollo de Proyectos Interactivos La mayor parte de los sitios utiliza más de una estructura de navegación, dependiendo de los requerimientos de despliegue de la información. Se puede decir que mientras mayor sea el grado de complejidad se tenderá al uso de estructuras tipo telaraña y a mayor simplicidad se usará la secuencial.
Figura 1.4e Uso Estruct uras
Tema 1. Manejo de la información en interactivos 15
Desarrollo de Proyectos Interactivos Tema 2. Interfase para la interactividad Subtemas 2.1 2.1.1 2.2 2.3 2.4 2.5
Diagramación y estructura Sistemas de Navegación Legibilidad Proporción Accesibilidad para el usuario Diagrama del hipertexto
Objetivo de Aprendizaje Al término del tema el estudiante desarrollará proyectos interactivos en base a la correcta elección de sistemas de navegación, facilitando la accesibilidad y usabilidad al usuario.
Sinopsis La estructura de información se encuentra íntimamente ligada con los sistemas de navegación; esto se debe a que mientras mayor control se tenga sobre la organización de la estructura, más fácil es decidir sobre que sistema de navegación se basará el proyecto interactivo y el grado de interactividad que deberá tener; sin embargo, no basta con tener un sistema de navegación correcta y contar con toda la información, también 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 sólo basta con estudiar, estructurar el proyecto, pero sobre todo ver las necesidades del usuario. No sólo basta con que sea interactivo, sino también accesible, desde el uso correcto de tipografía hasta el acceso vía modem o banda ancha o por CD, son aspectos importantes en el desarrollo de un proyecto interactivo
2.1
Diagramación y estructura
Una vez definidos los contenidos del proyecto interactivo y analizando previamente sus necesidades se procede a diseñar la estructura de la información. Los contenidos se irán conformando con hipertextos e hipermedios dependiendo de la naturaleza del proyecto, facilitando así, la interacción de los usuarios.
Tema 2. Interfaces para la interactividad 16
Desarrollo de Proyectos Interactivos Con esta estructuración se definirán las posibles opciones que tiene el usuario en su trayectoria además de permitir visualizar fácilmente el grado de interactividad. La interfaz gráfica deberá comunicar dicha estructura de la información por medio de los sistemas de navegación, independientemente del uso de botones, mapa de imágenes, íconos o textos como enlaces.
2.1.1 Sistemas de Navegación Según los criterios de Gloor(1997) 5 existen siete sistemas de navegación las cuales pueden ser bastante útiles en un proyecto interactivo, entre estos sistemas están la búsqueda, jerarquía, similitud, cada uno se verá a detalle a continuación:
Enlace. Es el sistema básico de vinculación, 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 an d Visualization in Cyberspace. Birkhäuser, Cambridge MA, 1997. (http://www.ickn.org/elements/index.htm)
Tema 2. Interfaces para la interactividad 17
Desarrollo de Proyectos Interactivos Búsqueda. Al tener una mayor complejidad en la estructuración de información y contar con una cantidad inmensa de nodos, la mejor opción es el motor de búsqueda, puede ser por palabras clave, por secciones o categorías, un claro ejemplo de este sistema es google.
Figura 2.1.b Ejemplo bús queda, www.google.com
Secuencialización . 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 páginas de tutoriales los cuales van guiando paso a paso al usuario.
Jerarquía. Simplemente se jerarquiza la información por orden de precisión, como ejemplo pueden mostrarse los nodos de mayor importancia a menor o de antiguo a reciente.
Tema 2. Interfaces para la interactividad 18
Desarrollo de Proyectos Interactivos Similitud . Se hace uso de elementos comunes como palabras clave, temas, objetos, como el periódico en línea, donde están las secciones de ciudad, finanzas, internacional, etc.
Figura 2.1.c Ejemplo secuencia, www.kirup a.com
Tema 2. Interfaces para la interactividad 19
Desarrollo de Proyectos Interactivos
Figura 2.1.d Ejemplo j erarquía, www.wired.com
Tema 2. Interfaces para la interactividad 20
Desarrollo de Proyectos Interactivos
Figura 2.1.e Ejemplo jerarquía, www.eluniversal.com
Tema 2. Interfaces para la interactividad 21
Desarrollo de Proyectos Interactivos Mapas . Son representaciones de los nodos que conforman el sitio y reflejan una visión global de la información. 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.eluni versal.com
Tema 2. Interfaces para la interactividad 22
Desarrollo de Proyectos Interactivos Agent es. Son guías que facilitan la realización de cierto proceso o actividad siguiendo pasos predefinidos.
Figur a 2.1.f Ejemplo mapas
Tema 2. Interfaces para la interactividad 23
Desarrollo de Proyectos Interactivos 2.2
Legibilidad
Legibilidad es la capacidad de definir y distinguir claramente los caracteres del alfabeto, mientras tanto que la comprensión se refiere al contenido del texto o párrafo. La compresión se encuentra ligada a la legibilidad, mientras más nítido sea el carácter y su entorno (color de fondo, interlineado, estilo de la tipografía, etc.), se logrará una mayor comprensión del contenido. Muchas ocasiones se encuentran páginas donde el diseño experimental predomina, visualmente puede lucir estético, sin embargo, el contenido ha sido dejado a un lado. Habrá usuarios seguidores de éste tipo de sitios, así como aquellos que cambien rápidamente de página por no encontrar la información que desean, por ello es necesario estudiar el mercado, para saber exactamente hasta qué punto lo estético tiene un mayor peso que el contenido.
Figura 2.2.a Uso de tip ografía donde lo estético predomi na al contenido . www.nuevosricos.com
Tema 2. Interfaces para la interactividad 24
Desarrollo de Proyectos Interactivos La legibilidad en pantalla e impresos difiere sustancialmente. En pantalla el usuario tiende a reducir el número de palabras que lee, esto se debe al cansancio producido por el monitor y a la gran competencia existente entre cada página, cada una debe llamar la atención del usuario pero sobre todo retenerla. Para lograr la retención hay unos puntos básicos a desarrollar en la mayoría de las páginas, uno de ellos es el uso de palabras claves destacadas, uso de subtítulos, párrafos pequeños y con una sola idea.
Figura 2.2.b Uso de punt os b ásicos, remarcados en naranja www.eluniversal.com.mx
2.3
Proporción Tema 2. Interfaces para la interactividad 25
Desarrollo de Proyectos Interactivos Las aplicaciones encargadas de presentar las páginas 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 tamaño varía, dependiendo del monitor y de la tarjeta gráfica. Se hablan de dos tamaños de pantalla diferentes: Tamaño absoluto: es el tamaño "real" de la ventana del monitor, medido generalmente en pulgadas, depende de cada monitor. Resolución o tamaño relativo: viene determinada por el número de píxeles que se muestran en la ventana del monitor, siendo el píxel la unidad mínima de información que se puede presentar en pantalla. La resolución más utilizada actualmente es de 800 x 600 píxeles. Existen más resoluciones como veremos a continuación:
Tema 2. Interfaces para la interactividad 26
Desarrollo de Proyectos Interactivos
Figura 2.3 Algunas resolu cion es de pantallas
2.4
Accesibilidad para el usuario
Sin desearlo, al diseñar un proyecto interactivo en línea o en CD-ROM, se está diseñando para un sin fin de plataformas, navegadores y usuarios, por ello se deben tener en cuenta algunas especificaciones técnicas sobre el equipo de los usuarios así como aspectos funcionales. Se muestra una breve lista de los puntos que no se deben olvidar a continuación:
1.
Resolució n del monitor 600 x 800 px 1024 x 768 px 1280 x 960 px Actualmente se diseñan las páginas conforme a estos estándares, sin embargo, con el tiempo irán cambiando las medidas por la constante evolución de los equipos y mejora en los monitores.
Tema 2. Interfaces para la interactividad 27
Desarrollo de Proyectos Interactivos 2.
Navegadores Internet Explorer Netscape Communicator Mozilla Y unos 50 más navegadores, pueden obtener información en: http://browsers.evolt.org/ Cada navegador despliega la información según decodifica los lenguajes como el html, por ello es que hay ciertas variantes en la visualización de los contenidos dependiendo del navegador y su versión, además de que algunos plug ins o java scripts no son compatibles con los diversos navegadores existentes en el mercado.
3.
Velocidad de con exión Módem Banda Ancha Es muy importante saber qué tipo de usuarios navegará el sitio, porque de eso depende la velocidad en la que descargarán las páginas, no hay que olvidar que si la mayoría de nuestros usuarios cuentan con módem, la visualización debe ser rápida debido a que el límite para q ue una persona mantenga su atención en una página es de 10 segundos* 6 o se corre el riesgo de que ya no visiten el sitio por la tardanza, aún siendo un diseño 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, cuánto tiempo va a tardar en descargar la página, mientras tanto, él puede ir visitando otros sitios. Otra situación es si los usuarios ingresan a la página 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 número de elementos multimedia.
4.
Uso de plug ins La especificación del uso de plug ins, es necesaria para la correcta visualización del sitio, señalada desde un principio. La mayoría de las ocasiones se diseña para una descarga rápida del sitio y su eficiencia en los ordenadores, pero pocas veces se detienen a ver la
6
Nielsen, Jakob. (2000) Usabilidad Diseño de sitios Web. Pág. 42-45.
Tema 2. Interfaces para la interactividad 28
Desarrollo de Proyectos Interactivos importancia del usuario y los beneficios que se obtendrían si diseñáramos en base a ellos. No es suficiente con la funcionalidad del sitio sino que también debe ser accesible y usable, captando así, un mayor número 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 estructuración de los nodos y la relación entre ellos, cada nodo muestra cierta codificación y muestra con qué otros nodos será enlazada, un ejemplo del diagrama se muestra en la imagen a continuación:
Figura 2.5 Ejemplo Diagrama
Tema 2. Interfaces para la interactividad 29
Desarrollo de Proyectos Interactivos Tema 3. Formatos Subtemas 3.1 Formatos para proyectos interactivos en CD – ROM 3.2 Formatos para proyectos interactivos en línea 3.3 Compatibilidad entre plataformas
Objetivo de Aprendizaje Al término del tema el estudiante conocerá y ejecutará las herramientas y soportes para la producción de proyectos interactivos.
Sinopsis Debe elegirse el soporte más adecuando para el proyecto interactivo ya sea en línea o fuera de línea (CD), dependiendo del contenido, usuarios, costo, almacenamiento, velocidad, facilidad de acceso, retroalimentación y actualización. Cada soporte tiene ventajas y desventajas como lo veremos en la tabla a continuación:
Características
Soportes On-line
Soportes Off-line
Transporte
Pleno
Depende del acceso
Capacidad de Almacenamiento
Limitada
Ilimitada
Actualización de contenidos
Exige nueva edición
En tiempo real
Transparencia de uso
mayor
Menor
Velocidad de Acceso
Mayor
Menor
Disponibilidad de la tecnología
Ordenadores Multimedia
Ordenadores conectados
Coste de difusión
Copias
Hospedaje de páginas
Interactividad con y entre los usuarios
Nula
Plena
Figura 3.a Características Sopo rtes
Tema 3. Formatos 30
Desarrollo de Proyectos Interactivos 3.1 Formatos para proyectos interacti vos en CD-ROM Los proyectos interactivos pueden desarrollarse en dos software principalmente, la selección 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 diseñada para crear contenido interactivo para CD y para el internet. Con este software se puede incorporar fotografía, video, sonido, animación, modelos 3D, texto y swf. Con Director se pueden crear aplicaciones que dan acceso y controlan otras aplicaciones, además de que se puede crear contenido para personas con capacidades distintas. Lo más recomendable es usar Director cuando se desee hacer contenido interactivo con animación 2D y 3D, video, audio, gráficos, etc. Por su desempeño, es ideal para el desarrollo de contenido en CD, DVD y Kioscos.
Macro media Flash Es un programa desarrollado para trabajar en vectores principalmente y puede desplegar archivos pequeños, como fotografías, video, sonido, texto, optimizando todos estos para la Web. Con este software se pueden hacer animaciones 2D, de excelente calidad, tiene grandes ventajas a excepción 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 encontrarán las instrucciones de cómo hacerlo en el capítulo 4. También podrían 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 int eractivos en línea La tendencia es que las páginas web de Internet sean multimedia. La mayoría de las páginas Web sólo son visuales y utilizan medios escritos, de imagen y animación, y muchas aún no añaden sonido, sin embargo, sí tienen al menos interacción mínima que es una característica importante de los multimedios 7
http://www.macromedia.com/la
Tema 3. Formatos 31
Desarrollo de Proyectos Interactivos actuales. Conforme se mejoran las capacidades y el ancho de banda de Internet (cantidad de información que puede transferirse a las computadoras conectadas) los multimedios se ampliarán a todas sus características. Cuando vemos una página Web en línea, parece ser un solo elemento y no es así, está compuesta por una gran cantidad de archivos que van desde la información, imágenes, videos, etc. todos éstos elementos son integrados bajo un lenguaje de programación llamado HTML, por sí mismo puede resultar un poco estático, por ello, para lograr un mayor grado multimedia o interactividad, existen diferentes lenguajes de programación, plug ins o applets que pueden ser integrados en los navegadores o plataformas.
3.3 Compatibilidad entre plataformas Existen diferentes plataformas informáticas en función del hardware y sistema operativo instalado, a continuación se mencionarán las plataformas existentes en la actualidad 8 .
Plataforma PC/Windows . Es la más extendida, a nivel usuario y doméstico. También la encontramos en determinadas empresas que no trabajen en red, aunque cada día es más frecuente que estén todos interconectados. Son máquinas mono procesadoras (un solo procesador), en cuanto a hardware, con el SO Windows, de representación de la información a través 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 gráfico o publicitario. Esto fue debido a que los microprocesadores Apple, su estructura y SO, eran más 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 gráficos. Poco a poco el PC va adquiriendo una mayor robustez así como unos microprocesadores cada vez más 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 más se aproximan y tras el nacimiento del PowerPC, es más factible trabajar con las dos plataformas. Son máquinas 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 32
Desarrollo de Proyectos Interactivos Plataforma WS/Windows NT . Es una plataforma formada por uno o varios procesadores intel, con un SO de Windows, pero específico 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 distribución. Un sistema operativo muy robusto y de gran fiabilidad y seguridad en la información. Existe un SO unix, creado por Sun y llamado Solaris, muy utilizado en servidores de información, bases de datos, redes, etc.
Plataforma WS/Linux. ó PC/Linux . Es una plataforma similar a la de Unix, pero para PC mono procesadores. También de libre distribución y que está teniendo una gran aceptación e implantación. Hay que tomar en cuenta las plataformas existentes para hacer el proyecto lo más 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 información de forma distinta.
Tema 3. Formatos 33
Desarrollo de Proyectos Interactivos Tema 4. Producción Subtemas 4.1 4.2
Creación de un master Programas FTP para colocar proyectos interactivos en Internet
Objetivo de Aprendizaje Al término del tema el estudiante utilizará las herramientas necesarias para exponer un proyecto interactivo en soporte off-line y on-line.
Sinopsis Para subir en línea o crear un CD híbrido, es necesario conocer las herramientas necesarias, por ejemplo para proyectos en línea lo más recomendable es el uso de aplicaciones FTP, mientras que para proyectos interactivos con distribución vía CD, se genera el proyector y el ejecutable, existen ciertas limitantes en éste tipo de distribución 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 Creación de un master Director y Flash no tienen la habilidad de crear CDs o habilitar el Auto Ejecutable por sí mismos. Los proyectores son específicos para cada tipo de plataforma, un proyector para Mac no sirve para Windows y viceversa, sin embargo se puede crear un CD híbrido el cual contenga ambos proyectores. La mejor opción es crear cada ejecutable en cada una d e sus plataformas y quemarlos en el Mac, con un software llamado Toast de Roxio 9 .
Auto Ejec ut able en Wind ow s 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 http://www.macromedia.com/go/tn_13374
10
Tema 4. Producción 34
Desarrollo de Proyectos Interactivos [AutoRun] open=nombre_proyecto.exe Este archivo deberá colocarse en la misma ubicación 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 Ejec ut able 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 opción 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 aplicación 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 conexión, 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 "página" de administración. En ella se pueden memorizar todos los datos de las direcciones FTP (computador servidor o dirección del dominio) dirección del servidor, datos de usuario y contraseña.
Tema 4. Producción 35
Desarrollo de Proyectos Interactivos
Figura 4.2.a Ejemplo pantalla Programa Cute FTP En los siguientes links podrán encontrar información 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 opción de subir los archivos con éste mismo programa, sólo 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 sección compartir archivos.
3.
Ahí hay varias opciones, una de ellas es FTP, se selecciona y se añaden los datos.
4.
Introducir dirección FTP
5.
Nombre de la carpeta donde se almacenarán los archivos Tema 4. Producción 36
Desarrollo de Proyectos Interactivos 6.
Nombre del usuario
7.
Contraseña
Todos estos datos técnicos los proporciona el proveedor del hosting, no olvidar pedir la información antes de configurar el FTP.
Figura 4.2.b Ventana configuración FTP en Dreamweaver
Tema 4. Producción 37