Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

DISEÑO Y PRODUCCIÓN DIGITALSesión 07

Elementos de los medios digitales:Texto; gráficas, fotografías e íconos; audio; animación; video.

Presenta:

Lic. Fernando Gutiérrez C., MATI

Departamento de ComunicaciónInstituto Tecnológico y de Estudios Superiores de Monterrey,

Campus Estado de México

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

(GONZÁLEZ M., MARCHAND H., Meracdotecnia para los negocios

en Internet.Universidad Virtual, 2001)

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Principales componentes de una página Web• Los web sites que tienen mayor impacto visual son los que a través del

manejo correcto de recursos gráficos capturan la atención del usuario y logran que éste disfrute interactuar en la página.

• Los principales elementos o recursos gráficos que componen un web site son:– Color– Fondo (Background)– Tipografía– Imágenes o gráficos

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

(GONZÁLEZ M., MARCHAND H., Meracdotecnia para los negocios

en Internet.Universidad Virtual, 2001)

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

(GONZÁLEZ M., MARCHAND H., Meracdotecnia para los negocios

en Internet.Universidad Virtual, 2001)

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

(GONZÁLEZ M., MARCHAND H., Meracdotecnia para los negocios

en Internet.Universidad Virtual, 2001)

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Usability Testing1. Utilizar iconos convencionales con los que el usuario esta familiarizado

2. Utilizar links de una o dos palabras que sean explícitos por si mismos

3. Mostrar links con formato preestablecido

4. Evitar links irrelevantes

5. No “enterrar2 información (menos de 3 clicks)

6. Mostrar jerarquía (camino del usuario)

7. Reflejar una estructura similar a la forma de pensar del usuario y no a la organización interna del sitio

8. No ser misterioso, enfatizar las secciones navegables

9. Brindar ayuda al usuario, búsquedas

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: Multimedia• MULTIMEDIA, es una colección de tecnologías basadas en

el uso de sistemas computacionales que dan al usuario la capacidad de acceder y procesar información en por los menos tres de las siguientes formas; texto, gráficas, imagen fija, imagen con movimiento, video y audio.

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: Multimedia

• La Multimedia Interactiva aparece cuando se le permite al usuario controlar ciertos elementos y el momento en que deben presentarse.

• Se habla de Hypermedia cuando se incluye una estructura de elementos relacionados a través de los cuales el usuario puede navegar.

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: MultimediaPRODUCTO MULTIMEDIA:

– Es la presentación de cierta información, mediante la integración de diferentes medios, por lo general a través de una computadora, donde el usuario puede interactuar.

– Un elemento imprescindible en todo Producto Multimedia es la INTERACCION.

– La interacción se basa en el principio de que el usuario puede decidir a donde ir, o que es lo primero que quiere ver entre una serie de opciones que se le ofrecen en la pantalla.

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: MultimediaINTERACCIÓN:

La interacción implica tres conceptos básicos:-Inmersión : La presentación debe ser tan interesante que debe atrapar al usuario.

-Navegación: El recorrido no debe ser lineal, es decir, el usuario puede elegir si desea ir al final, regresarse. o ir al principio. Puede ir viajando de acuerdo al interés que le susciten las diferentes opciones.

-Manipulación: El sistema debe brindar diferentes acciones para que el usuario pueda interactuar con las opciones que se le presenten de la forma más fácil e intuitiva posible.

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: MultimediaTEXTO• El texto es quizás el apartado al que menor atención se le

presta, pero suele ser indispensable en las mayorías de las producciones. Normalmente se presenta en formato ANSI (estándar de Windows), cuyo uso está muy extendido, por lo que el intercambio de la información suele ser de lo más fácil.

• El TEXTO es el fondo del producto.

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: MultimediaFORMATOS DE TEXTO:• TXT: Texto universal en formatos ANSI o ASCII.• RTF: Rich Text Format (Formato de Texto Enriquecido). Permite

características de color, negritas,etc.• DOC: Microsoft WORD para Mac• DOC: Microsoft WORD para Windows • WordPerfect para Mac • WordPerfect para Windows

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: MultimediaIMÁGENES• Generalmente la imagen fija en multimedia esta en formato

mapa de bits o bitmap. Un bitmap se compone de los puntos de color en pantalla que pueblan su extensión formando así una imagen. Los formatos de archivos de imágenes de bitmap más comunes son Windows Bitmap (BMP), TIFF (Taffed Information File Format ). También pueden utilizarse otros formatos de compresión como: JPG, GIF.

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: MultimediaFORMATOS GIF, JPG, TIFF, y BMP• GIF: Formato gráfico desarrollado por Compuserve y destinado en un

principio a imágenes de 8 bits (256 colores). Lleva la extensión GIF.• JPEG: Formato gráfico utilizado para imágenes artísticas y destinado a

imágenes de 24 bits (16.7 millones de colores). Lleva la extensión JPEG o JPG.

• TIFF: Tagged Information File Format de imagen de carácter universal. Admite información adicional como canales de Photoshop o compresión LZW. Lleva la extensión TIF.

• BMP: Formato Bitmap de Microsoft Windows, tanto para 8 como para 24 bits. Admite compresión propia. Lleva la extensión BMP.

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: MultimediaVIDEO Y ANIMACIONES• Los archivos de animación y video se distinguen básicamente por la

fuente de donde se toma el original, por lo que no es raro el uso de formato AVI, para almacenar animaciones producidas digitalmente, o bien la inclusión de vídeo en un formato de animación como el Flic.

• La imagen en movimiento la podemos dividir en video y animación, el video es el registro que se hace de la realidad por medio de una cámara de video, la animación es la representación que hacemos de la realidad mediante diferentes técnicas, ya sea en dos o en tres dimensiones.

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: MultimediaVIDEO Y ANIMACIONES• Básicamente, los parámetros que definen la calidad de un vídeo o

animación digital son el número de cuadros por segundo (25 en cine, aunque por razones de consumo de memoria suele usarse 15 o incluso 10), la resolución de color (lo normal es usar de 256 a 32,000 colores), la aplicación de algún algoritmo de compresión (para reducir el tamaño del archivo, aunque pierda calidad: .MOV. MPEG), y el tamaño de la ventana donde se va a visualizar (lo común es usar ventanas de 160 x 120 píxeles).

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: MultimediaFORMATOS DE VIDEO• Video For Windows: Sistema de vídeo de Microsoft para Windows.

Admite de 8 a 24 bits de imagen y de 8 16 bits de sonido. Lleva la extensión AVI.

• QuickTime for Windows: Sistema de vídeo de Apple Computer para Windows. Admite la mismas capacidades que AVI. Lleva la extensión MOV.

• MPEG: Motion Picture Expert Group. Desarrollado por un grupo de expertos para la representación de vídeo de alta calidad. Necesita software de descompre- ción propio. Lleva la extensión MPG.

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: MultimediaAUDIO• El audio puede ser voz, música, ruido, efectos de audio.• El sonido de forma de onda consiste en la digitalización de la onda del

sonido original introducido por micrófono u otro medio, que se guarda en un archivo como un formato determinado, por lo regular en WAV para máquinas con Sistema Operativo Windows.

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Medios Digitales: MultimediaFORMATOS DE AUDIO• WAV: Formato de forma de onda de Microsoft Windows. Admite 8 y

16 bits, y frecuencias de muestreo de 11, 22 y 44 KHz. Lleva la extensión WAV.

• MIDI: (Musical Instruments Digital Interface) ocupan menos espacio que los archivos WAV. Un archivo MIDI es un archivo de datos que almacena notas musicales en forma de información digital, que pueden reproducirse en una máquina que esté equipado con una tarjeta de sonido . “Los archivos WAV, MP3 y VQF almacenan los sonidos propiamente dichos, como hacen los CD musicales o las cintas de audio. Los archivos WAV pueden ser muy grandes y requerir compresión, lo que se ha logrado con el MP3 y el VQF. Los archivos MIDI no almacenan sonidos, sino instrucciones que permiten a unos dispositivos llamados sintetizadores reproducir los sonidos o la música.”

• Eric Menjivar

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Etapas de Desarrollo de un Producto MultimediaEtapas de Desarrollo de un Producto MultimediaI. JustificaciónDefinir ObjetivosDefinir Público MetaDefinir Mensaje

II. Planeación* Elección de recursos multimedia necesarios.* Selección de herramientas (Software y plataforma de desarrollo).* Determinar el recurso humano necesario.* Estructurar información.* Elaborar esquema de navegación.* Calendarización.* Presentar Prototipo (DOMI).* Preparar Presupuesto.

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Etapas de Desarrollo de un Producto MultimediaEtapas de Desarrollo de un Producto MultimediaIII. Producción* Diseño de la interfase gráfica.* Diseño de imágenes.* Diseño de animaciones.* Redacción de textos.* Producción de audio.* Producción de video.* Programación.* Integración de los recursos.

Departamento de Comunicación. 2003Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Instituto Tecnológico y de Estudios Superiores de Monterrey, Campus Estado de México

Etapas de Desarrollo de un Producto MultimediaEtapas de Desarrollo de un Producto MultimediaIV. Diseño de empaqueV. PruebaVI. Presentación, Entrega o Distribución

ACTORES INVOLUCRADOS EN EL PROCESO1.Líder de Proyecto2.Especialista en tratamiento de imágenes.3.Especialista en animaciones.4.Especialista en video.5.Especialista en audio.6.Redactor de textos.7.Programador.