IC Editorial ha puesto el máximo empeño en ofrecer una información completa y precisa. Sin embargo, no asume ninguna responsabilidad derivada de su uso, ni tampoco la violación de patentes ni otros derechos de terceras partes que pudieran ocurrir. Mediante esta publicación se pretende proporcionar unos conocimientos precisos y acreditados sobre el tema tratado. Su venta no supone para IC Editorial ninguna forma de asistencia legal, administrativa ni de ningún otro tipo.

Reservados todos los derechos de publicación en cualquier idioma.

Según el Código Penal vigente ninguna parte de este o cualquier otro libro puede ser reproducida, grabada en alguno de los sistemas de almacenamiento existentes o transmitida por cualquier procedimiento, ya sea electrónico, mecánico, reprográfico, magnético o cualquier otro, sin autorización previa y por escrito de IC EDITORIAL;

su contenido está protegido por la Ley vigente que establece penas de prisión y/o multas a quienes intencionadamente reprodujeren o plagiaren, en todo o en parte, una obra literaria, artística o científica.

ISBN: 978-84-17224-54-7

Nota de la editorial: IC Editorial pertenece a Innovación y Cualificación S. L.

Presentación del manual

El Certificado de Profesionalidad es el instrumento de acreditación, en el ámbito de la Administración laboral, de las cualificaciones profesionales del Catálogo Nacional de Cualificaciones Profesionales adquiridas a través de procesos formativos o del proceso de reconocimiento de la experiencia laboral y de vías no formales de formación.

El elemento mínimo acreditable es la Unidad de Competencia. La suma de las acreditaciones de las unidades de competencia conforma la acreditación de la competencia general.

Una Unidad de Competencia se define como una agrupación de tareas productivas específica que realiza el profesional. Las diferentes unidades de competencia de un certificado de profesionalidad conforman la Competencia General, definiendo el conjunto de conocimientos y capacidades que permiten el ejercicio de una actividad profesional determinada.

Cada Unidad de Competencia lleva asociado un Módulo Formativo, donde se describe la formación necesaria para adquirir esa Unidad de Competencia, pudiendo dividirse en Unidades Formativas.

El presente manual desarrolla la Unidad Formativa UF1587: Publicación de productos editoriales multimedia,

perteneciente al Módulo Formativo MF0937_3: Implementación y publicación de productos editoriales multimedia,

asociado a la unidad de competencia UC0937_3: Generar y publicar productos editoriales multimedia,

del Certificado de Profesionalidad Desarrollo de productos editoriales multimedia.

Índice

Portada

Título

Copyright

Presentación del manual

Capítulo 1 Publicación de productos editoriales multimedia en web y para dispositivos móviles

1. Introducción

2. Fundamentos de la publicación editorial multimedia en web

3. Herramientas utilizadas para la publicación en web

4. Desarrollo de publicación editorial multimedia en web

5. Resumen

Ejercicios de repaso y autoevaluación

Capítulo 2 Publicación de productos editoriales multimedia en soporte físico digital

1. Introducción

2. Los soportes de la publicación editorial multimedia

3. Fundamentos de la publicación editorial multimedia en soporte físico digital

4. Herramientas utilizadas para la publicación en soporte físico digital

5. Desarrollo de publicación editorial multimedia en soporte físico digital

6. Resumen

Ejercicios de repaso y autoevaluación

Capítulo 3 Actualización de publicaciones editoriales multimedia en diferentes soportes

1. Introducción

2. Posibilidades de actualización en las diferentes publicaciones

3. Herramientas utilizadas para la actualización de las publicaciones

4. Resumen

Ejercicios de repaso y autoevaluación

Bibliografía

Capítulo 1

Publicación de productos editoriales multimedia en web y para dispositivos móviles

1. Introducción

La World Wide Web o “amplia red mundial” es hoy día el más importante medio de publicación y distribución de información en formato de documentos multimedia de hipertexto. Como servicio de internet, permite interconectar estos documentos y ofrecerlos en tiempo real a millones de usuarios conectados desde cualquier parte del mundo, a través de un navegador instalado en un PC en un dispositivo móvil moderno.

Muchas empresas del ámbito de la información y las nuevas tecnologías han apostado por la web como alternativa a sus productos editoriales clásicos al comprender que este formato tiene un futuro muy prometedor basado en un sinfín de posibilidades y recursos tecnológicos en continuo desarrollo. El éxito, sin embargo, es todavía difícil de conseguir, y la competencia es abrumadora.

Para alcanzarlo, es fundamental seguir una metodología de desarrollo basada en el refinamiento de prototipos, consiguiendo así los niveles de usabilidad, accesibilidad y funcionalidad requeridos. Es importante comprender bien el proceso de publicación web y saber usar las herramientas y lenguajes específicos, de manera que el producto pueda ser ofrecido de manera adecuada al mayor número de personas posible.

2. Fundamentos de la publicación editorial multimedia en web

La publicación de productos editoriales multimedia en formato online, es decir, en internet, se basa en unos conceptos que son necesarios conocer para obtener el mejor resultado. En primer lugar, hay que destacar que el producto estará alojado (almacenado) en un servidor web propio o bien contratado a terceras empresas, las cuales ofrecerán el plan de alojamiento que mejor se adapte a las características del producto.

Características de tres tipos de alojamiento web. Hay páginas que ofrecen comparativas de precios en función de los servicios que se contraten, como <http://www.losmejoreshostings.com/>.

Son muchos los factores que afectan al precio de estos servicios: la capacidad de almacenamiento y transferencia de archivos, las aplicaciones añadidas que disponga el servidor, el uso de sistemas de bases de datos, las medidas de seguridad y gestión de usuarios o la capacidad de ofrecer streaming multimedia, entre otros.

Definición

Streaming

Es un término relacionado con la transmisión a través de internet de datos de audio o vídeo de forma que el usuario los disfruta en tiempo real, como un flujo continuo, a la vez que estos se están descargando. Se basa principalmente, en guardar los datos en un búfer temporal del ordenador e ir reproduciéndolos con un mínimo retardo, pero de manera continua, lo cual es una experiencia de uso positiva por parte del usuario. Es una fórmula opuesta a la descarga completa de los archivos multimedia para ser escuchados o visualizados. Lógicamente, esta técnica no es recomendable para aquellos equipos obsoletos y con conexiones de bajo y limitado ancho de banda.

Además, es necesario tener un nombre de dominio asociado a él, por ejemplo, <http://www.arteinteractivo.com>, el cual suele pagarse anualmente. Muchas veces su precio está incluido en el paquete del alojamiento. Aunque existen opciones de almacenamiento en servidores gratuitos, es una opción que no se recomienda por sus grandes limitaciones en todos los sentidos y por el uso habitual de publicidad de terceros.

Para alojar el producto multimedia en un servidor web se debe realizar una copia o transferencia de los archivos, desde el equipo local donde se ha desarrollado, al servidor. Esto puede hacerse con cualquier programa informático que permita comunicar ambos equipos mediante protocolo FTP (siglas de File Transfer Protocol o “protocolo de transferencia de archivos”). Programas muy conocidos para este fin son FileZilla (gratuito), WS_FTP, Cute FTP, Total Commander, etc. La empresa de alojamiento suministra la dirección, nombre de usuario y contraseña para realizar esta tarea, así como el acceso al panel de control del servidor que permite configurar los parámetros de ciertos servicios.

Otro tema es el uso de los componentes tecnológicos que garanticen las mejores características funcionales e interactivas. En este sentido, la base de todo producto publicado en internet es el lenguaje HTML que sirve para estructurar la información como documento o página web, dándole el formato que hoy en día es universal para prácticamente todas las plataformas hardware y software.

Definición

HTML

Son las siglas de HyperText Markup Language, es decir, “Lenguaje de Marcas de HiperTexto”. Es un estándar desarrollado actualmente por la World Wide Web Consortium (W3C) basado en el SGML del cual es un subconjunto extendido. Utiliza etiquetas, que son palabras reservadas del lenguaje encerradas entre los caracteres “<” y “>” para definir el formato y las propiedades del texto, hipertexto, imágenes, sonidos, vídeos, etc. Es el lenguaje más importante de la web, pues casi todas las páginas tienen elementos de este lenguaje. Hay varias versiones, de las que la última es HTML 5 (más multimedia).

Sin embargo, HTML no es suficiente; junto al código HTML, los documentos suelen incluir otros lenguajes de programación que se clasifican en lenguajes de guiones del lado del cliente y lenguajes de guiones del lado del servidor, o simplemente de servidor. Los lenguajes del lado del cliente son interpretados por el navegador web una vez cargada la página en el ordenador de la persona que la ha solicitado, ofreciendo mayor funcionalidad y haciéndola más interactiva. Uno de los lenguajes de este tipo más conocidos es Javascript, que se usa frecuentemente para crear innumerables funciones que no ofrece el HTML, por ejemplo la aparición dinámica de mensajes, ventanas, acciones al pulsar en un determinado elemento o cuando se pasa el puntero del ratón sobre un objeto.

Los lenguajes del lado del servidor como ASP, PHP o JSP que pueden potenciar en gran medida el producto, se ejecutan en el servidor web, enviando al cliente de la página un determinado resultado donde frecuentemente se realizan accesos a sistemas de bases de datos.

HTML suele acompañarse también de hojas de estilo CSS para unificar los estilos visuales (colores, tipos de letras, márgenes, etc.) del producto editorial multimedia.

2.1. Análisis previo de prototipos

Para la elaboración y posterior análisis del prototipo de un producto editorial multimedia, como elemento demostrativo y representativo del mismo, debe determinarse desde un principio a qué nivel de detalle, fidelidad y funcionalidad se va a llegar respecto al producto final y la herramienta de prototipado que se va a utilizar. En este proceso creativo, el equipo de trabajo desarrolla y evoluciona el prototipo una vez aceptado por el cliente, para publicar por último el producto final en un determinado medio o soporte.

El análisis se realiza en función del tipo de prototipo. Desde el punto de vista teórico los prototipos pueden ser:

1 Exploratorios:se usan para definir los objetivos principales del producto multimedia identificando a grandes rasgos los requerimientos funcionales y sus alternativas.
2 Interactivos: son dinámicos y ejecutables en tiempo real, mostrando así al cliente/usuario las funciones más importantes de manera interactiva.
3 Operacionales: son prototipos interactivos que se refinan de manera progresiva hasta que evolucionan en el producto final.

Desde un punto de vista más práctico, un prototipo puede ser de tipo Sketch, es decir, más próximo al boceto realizado con lápiz y papel que representa en las etapas más iniciales, el concepto o idea general, el esquema y la distribución de los elementos de diseño, e incluso algunos detalles funcionales. Es frecuente utilizarlo en las primeras entrevistas con el cliente y en reuniones internas del equipo de desarrollo.

Este tipo también se denomina en “baja fidelidad” o “estático”, ya que normalmente se diseñan a mano mediante dibujos o esquemas y en su análisis se suelen producir iteraciones de refinamiento, hacia un prototipo más desarrollado y dinámico. Las iteraciones de refinamiento suelen generar nuevas entrevistas con el cliente y el desarrollo de ideas o mejoras en su funcionalidad.

Su coste de producción normalmente es y debe ser bajo -incluso desechable- en relación con otros tipos de prototipos. Por el contrario, el coste del análisis es más alto pues necesita posteriormente un desarrollo mayor. El objetivo del Sketch es separar el diseño de la creación “física” del producto.

A un nivel más avanzado existen los prototipos de tipo Wireframe, que ofrecen mayor detalle del contenido que representan y están especialmente indicados en la organización y distribución visual de las páginas o pantallas del producto, pero no en los detalles gráficos o estilísticos. Si se debe analizar una secuencia de páginas prototipadas en modo Wireframe, se habla de Storyboard.

Sabía que...

Aunque las primeras ideas sobre el concepto de Storyboard surgen a principios del siglo XX, no es hasta los años 30 cuando la compañía Walt Disney lo usa en la producción de películas animadas. En poco tiempo se hizo muy popular en la industria cinematográfica, generalizándose su uso en todo tipo de películas.

El coste de realizar los prototipos en modo Wireframe es mayor que en modo Sketch, pero lógicamente en la etapa de análisis y desarrollo, el coste disminuye pues su nivel de detalle es mayor. El refinamiento de los prototipos de tipo Wireframe permite obtener más información sobre los requerimientos y restricciones del producto.

Los modos Wireframe y Storyboard se consideran “dinámicos” si además representan un modelo operativo, informatizado, interactivo y poseedor de las funciones presentes en el producto final.

Muestra de una pantalla de la herramienta gratuita de edición de wireframes Indigo Estudio

Hay otros conceptos respecto al análisis de los prototipos creados. Este se puede realizar de manera “global” cuando se estudian un conjunto amplio de características y funcionalidades para su implementación en el producto definitivo, o de manera “local” cuando se analiza un único elemento o componente, que posee una funcionalidad determinante en el sistema. Dicho de otra manera, el prototipo puede mostrar muchas características con pocos detalles o bien pocas características pero de manera muy detallada -lo cual es especialmente útil en las etapas de análisis y desarrollo posteriores para solucionar determinados aspectos técnicos-.

Actividades

1. ¿Qué tipo de prototipo es el que se puede hacer con lápiz y papel?

2. ¿A qué corresponden las siglas FTP y para qué se usa?

2.2. Especificaciones técnicas del producto

El desarrollo de un producto o aplicación editorial multimedia parte generalmente de la definición del proyecto entre el cliente y el equipo de trabajo. En esta fase inicial deben especificarse claramente los aspectos y detalles técnicos más importantes del producto en lo que se refiere a:

1 El tema general de la aplicación multimedia.
2 A quién va dirigido el producto.
3 Determinar el formato de publicación de la aplicación: principalmente online y offline.
4 Planificar el desarrollo realizado mediante sucesivas iteraciones de prototipos y su aceptación por parte del cliente y a qué nivel de detalle se hará.
5 Si la aplicación se va a basar en el libro de estilo que aporte el cliente o es necesario crear uno nuevo. Diseñar las líneas generales de la apariencia estética del producto.

Posteriormente, aunque desde las etapas iniciales de desarrollo, se irán especificando otras características, como:

1 Qué tecnología y lenguajes se van a usar para programar la aplicación.
2 Las especificaciones técnicas sobre los tipos de archivo multimedia que se van a usar, así como sus niveles de compresión.
3 El nivel de “responsividad” del producto, es decir, su grado de adaptación a distintos dispositivos independientemente de las características técnicas de estos, como la resolución de sus pantallas. Cada vez se accede más a la web y a las aplicaciones desde dispositivos móviles.
4 Los elementos de control internos de la aplicación como el sistema de navegación: menú de navegación, botones de navegación, hipertexto, hipervínculos, etc.
5 Reproducción de las secuencias de audio y vídeo, reproductores que usarán y “codecs”. Determinar si en algunas pantallas se usarán animaciones y/o música de fondo.
6 Temporización: ajuste del tiempo de determinados elementos, en los que a modo de presentación se van desarrollando secuencias de carácter demostrativo o didáctico, donde es muy importante fijar correctamente la velocidad de ejecución.
7 Accesibilidad y usabilidad del producto.
8 Otros elementos: barras de desplazamiento, controles de impresión, sistemas de búsquedas, formularios, acceso a datos, etc.

Definición

Codec

Es un término que proviene de las palabras “codificador-decodificador” y sirve para referirse a un sistema software o hardware que permite la reproducción y transmisión de flujos de datos multimedia, en especial audio y vídeo. La principal función de un “codec” es reducir el tamaño de los ficheros, lo cual mejora su reproducción y el almacenaje. La mayoría de las veces esto provoca pérdida de información y, por tanto, de calidad.

Hay un gran número de técnicas y métodos relacionados con el desarrollo de proyectos y la programación de los mismos, mediante los cuales se puede llevar un control de las especificaciones funcionales, operativas y de seguimiento. Una de las más sencillas es el uso de las tablas de control, que sirven para especificar cómo se comporta la aplicación multimedia a lo largo de los distintos temas o pantallas, especificando como datos más importantes:

1 Nombre, número o código de la pantalla.
2 Orígenes o entradas: de qué pantalla o pantallas se llega a esta.
3 Destinos o salidas: desde esta pantalla, a qué pantallas se puede acceder.
4 Fondo: si la pantalla tiene un diseño de fondo, el color del mismo, si es una imagen o si usa algún tipo de efecto o animación, por ejemplo.
5 Textos que aparecen en la pantalla y descripción de los estilos usados.
6 Elementos de navegación: menús, botones, hipertexto, etc.
7 Botones de acción: botones que permiten ejecutar un determinado comando, como salir de la aplicación, desactivar el sonido, imprimir una determinada pantalla, etc.
8 Zonas sensibles de la pantalla y su comportamiento, es decir, aquellas que tienen definida una determinada interactividad con el usuario.
9 Elementos multimedia: secuencias de audio o vídeo, así como los controles que se usan para su reproducción, propiedades, etc.
10 Ventanas de ayuda y control: su contenido, formato y eventos que producen su aparición.
11 Otros datos: si la pantalla se presenta durante un tiempo determinado, incluye controles de formulario, búsquedas u otros elementos, etc.

Nota

Las tablas de control permiten hacer la descripción de las pantallas que forman la aplicación, una vez establecida la idea principal y la navegación por el árbol de contenidos, así como el orden de aparición de los elementos que componen una pantalla, el destino de los vínculos de una página, o el tiempo que dura una determinada narración.

Aplicación práctica

De la reunión mantenida con un cliente para la realización de una web multimedia se obtiene la siguiente información: se desea un diseño claro y bien estructurado donde en la parte superior izquierda se coloca el logotipo de la empresa. Justo debajo debe ir un menú horizontal que ocupe todo el ancho de la página, con los enlaces “home”, “quiénes somos”, “marco normativo”, “sitios de interés”, “acceso usuarios”, “servicios y contacto”. Más abajo, el espacio horizontal lo ocupa un banner y un espacio para buscar, con la distribución que se desee.

Debajo de esto se presenta el área de contenido. Estará formada por el título del contenido que se esté visitando y a la derecha la fecha y la hora. Justo después, a la izquierda se muestra el texto de dicho contenido y a la derecha ocupando el 30 % del espacio, una zona fija para registrarse.

Al final, en la parte más inferior, se sitúa el pie de página que muestra a la izquierda el enlace “información del sitio”, y a la derecha el enlace copyright. Los márgenes que rodean la página ocupan aproximadamente el 15 % en todos los lados.

Realice el prototipo sketch o dibujado a mano que cumpla con estos requisitos de diseño.

SOLUCIÓN (Posible solución)

Aplicación práctica

Se necesita realizar la tabla de control del boceto web que se muestra en la siguiente imagen. El tipo de letra es Arial, de tamaño 10 para el texto normal, 14 para los enlaces y 24 para los títulos.

SOLUCIÓN

Núm.	Elemento	Descripción
1	Nombre página	“La Empresa”.
2	Orígenes	Desde cualquier página se puede acceder a ella.
3	Destinos	“Productos”, “Obesidad”, “Médicos”, “Redes sociales”, “FAQ”, “Contacto”, “Mapa de Sitio” y “Aviso Privacidad”.
4	Fondo	Color blanco y en algunas zonas color gris o azul.
5	Textos	Fuente Arial tamaño 10, color gris. Estilo negrita color azul y tamaño 24 para los títulos y tamaño 14 para los enlaces en color blanco y gris.
6	Navegación	Una zona rectangular gris en la parte superior desde donde se puede navegar a “Empresa”, “FAQ” y “Contacto”. Una zona principal horizontal, con el fondo azul, desde donde se puede navegar a “Productos”, “Obesidad”, “Médicos” y “Redes sociales”.
7	Botones acción	Dos botones en la zona superior que sirven para elegir el idioma de la página.
8	Zonas sensibles	Todos los botones y elementos de navegación especificados serán zonas sensibles. También los enlaces de texto. El logotipo puede tener la propiedad de navegar a la pantalla de inicio al pulsar en él.
9	Multimedia	La zona derecha de las páginas se decora con imágenes y/o vídeos.
10	Ayuda	La información de ayuda se suministra en el enlace “FAQ”.