Plantilla Basic
Versión 1.0
Índice
1. Introducción.......................................................................................................
1. Introducción
A lo largo de este documento se describen los elementos que forman la plantilla Basic en la herramienta au...
4
Con respecto a la navegación por gestos, se utilizarán los gestos de “izquierda” y “derecha” para navegar entre páginas....
5
2. Configuración del proyecto
La plantilla permite la configuración del proyecto con los siguientes parámetros:
Nombre T...
6
3. Páginas
Esta plantilla cuenta con dos tipos de páginas:
 Página de contenido
 Página de secciones
Las operaciones d...
7
Dentro de las páginas de contenido se puede utilizar los siguientes componentes:
Componente Cantidad Descripción
Audio 0...
8
4. Componentes
Los componentes que pueden ser utilizados en esta plantilla, ya sea como componentes primarios dentro de ...
9
Nombre Tipo Valor por defecto Descripción
Color de fondo Color #FFFFFF Color de fondo del contenedor.
Color del borde Co...
10
Este componente no contiene ningún otro componente.
4.4 Destacado
El componente “Destacado” es muy útil para concretar ...
11
Para editar fórmulas matemáticas de una manera visual haz clic en en la barra de edición. Puedes copiar o pegar
fórmula...
12
Nombre Tipo Valor por defecto Descripción
Vídeo Recurso en
formato .MP4
Vacío Vídeo que se reproducirá dentro del compo...
13
Estas son sus propiedades:
Nombre Tipo Obligatorio Descripción
Título Texto Sí Título mostrado en la cabecera del cuest...
14
Nombre Tipo Valor por defecto Descripción
Recurso
(HTML5)
Recurso en
formato HTML5
Vacío Fichero comprimido que contien...
15
Esta es la visualización del panel de propiedades:
Este componente contiene el siguiente componente:
Componente Cantida...
16
Esta es la visualización del panel de propiedades:
Este componente contiene el siguiente componente:
Componente Cantida...
17
5. Recursos
Los tipos de archivo que pueden ser utilizados como recursos dentro de las páginas son:
 Imágenes en forma...
18
6. Herramientas
Sólo existirá una herramienta dentro de esta plantilla: el buscador.
Se accede desde el menú superior p...
19
A. Anexos
A.1. Tamaños de imágenes y contenidos externos
Todos los elementos multimedia de adaptan al tamaño de su cont...
20
2. Después de seleccionar el archivo, aparecerá información a la derecha de “Source”.
3. Selecciona la pestaña “Picture...
21
Una característica a tener en cuenta es el formato de salida del vídeo que debe ser mp4. En caso de que
HandBrake lo co...
22
6. Haz clic en “Start” para comenzar con el proceso de compresión
Una vez finalizado el proceso, ya tienes el vídeo lis...
Upcoming SlideShare
Loading in...5
×

Netex learningMaker | Basic Template v1.0 [Es]

249

Published on

Published in: Business
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
249
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
5
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Netex learningMaker | Basic Template v1.0 [Es]"

  1. 1. Plantilla Basic Versión 1.0
  2. 2. Índice 1. Introducción....................................................................................................................................3 1.1 Estructura de un proyecto................................................................................................................................... 3 1.2 Navegación.......................................................................................................................................................... 3 1.3 Especificaciones .................................................................................................................................................. 4 2. Configuración del proyecto ............................................................................................................5 3. Páginas............................................................................................................................................6 3.1 Página de contenido............................................................................................................................................ 6 3.2 Página de secciones............................................................................................................................................. 7 4. Componentes .................................................................................................................................8 4.1 Sección ................................................................................................................................................................ 8 4.2 Contenedor ......................................................................................................................................................... 8 4.3 Audio ................................................................................................................................................................... 9 4.4 Destacado.......................................................................................................................................................... 10 4.5 HTML ................................................................................................................................................................. 10 4.6 Imagen............................................................................................................................................................... 11 4.7 Vídeo ................................................................................................................................................................. 11 4.8 Cuestionario ...................................................................................................................................................... 12 4.9 Contenido externo ............................................................................................................................................ 13 4.10 Carrusel ............................................................................................................................................................. 14 4.11 Grupo de acordeón ........................................................................................................................................... 14 4.12 Grupo de pestañas ............................................................................................................................................ 15 5. Recursos........................................................................................................................................17 6. Herramientas................................................................................................................................18 A. Anexos .............................................................................................................................................19 A.1. Tamaños de imágenes y contenidos externos ........................................................................................................ 19 A.2. Codificación de vídeos con HandBrake ................................................................................................................... 19 A.2.1. Proceso de codificación .......................................................................................................................................................19
  3. 3. 1. Introducción A lo largo de este documento se describen los elementos que forman la plantilla Basic en la herramienta autora Netex learningMaker. 1.1 Estructura de un proyecto Esta plantilla solo permite utilizar “Páginas” para estructurar los proyectos. Existirán dos tipos de páginas: la página de contenido y la página de secciones. 1.2 Navegación  Menú principal: es el menú que se muestra en todas las páginas y secciones de la plantilla. En el menú principal se muestra una jerarquía con las páginas y secciones existentes dentro del proyecto. Para cada página del menú se mostrará gráficamente el estado en el que el alumno se encuentra (desconocido/completado/no completado). Dependiendo de la configuración del proyecto, el menú permitirá una navegación secuencial o libre. El menú principal está siempre visible en resoluciones iguales o superiores a 980px, pero para las inferiores permanecería plegado.  Menú de página: es el menú que se muestra en el pie de las páginas de secciones y permite al usuario navegar entre las diferentes secciones de una página.
  4. 4. 4 Con respecto a la navegación por gestos, se utilizarán los gestos de “izquierda” y “derecha” para navegar entre páginas. También se utilizará para navegar entre las secciones de una página siempre y cuando se haya configurado en “horizontal” la propiedad de “Navegación de secciones” (ver apartado siguiente). 1.3 Especificaciones Los dispositivos, resoluciones y navegadores soportados para estas plantillas son los siguientes:  Dispositivos: o Android 4+ o Cualquier otro compatible con los navegadores especificados  Navegadores: o IExplorer8+ o Firefox 18+ o Chrome 15+ o Android 4.0+ o Safari 5.1+  Resoluciones: o 240x320 o 320x480 o 480x800 o 768x1024 Wireframe de ejemplo:
  5. 5. 5 2. Configuración del proyecto La plantilla permite la configuración del proyecto con los siguientes parámetros: Nombre Tipo Obligatorio Valor por defecto Descripción Título Texto Sí Project Title Título mostrado en la cabecera. Subtítulo Texto Sí Project Subtitle Subtítulo mostrado en la cabecera. Botón Cerrar Sí/No Sí No Si seleccionas “True”, se muestra el botón para salir del proyecto, y si seleccionas “False”, no se muestra. Navegación Secuencial/Libre Sí Libre Secuencial: solo se puede avanzar de página/sección cumpliendo los objetivos anteriores. Libre: el usuario puede navegar libremente por todas las páginas/secciones del contenido. Navegación de secciones Horizontal/Vertical Sí Vertical Horizontal: las secciones se muestran unas al lado de las otras (en forma de slide). Vertical: las secciones se muestran una debajo de las otras. Imagen de logo Recurso en formato .GIF, .PNG o .JPEG No (Vacío) Logo mostrado en la cabecera de la página. Color de fondo Color Sí #FFFFFF Color de fondo del proyecto Color H1 Color Sí #000000 Color de los títulos H1 Color H2 Color Sí #000000 Color de los títulos H2 Color H3 Color Sí #000000 Color de los títulos H3 Color H4 Color Sí #000000 Color de los títulos H4 Color H5 Color Sí #000000 Color de los títulos H5 Color H6 Color Sí #000000 Color de los títulos H6 Color de enlace Color Sí #008cba Color de los enlaces Color de fondo del menú Color Sí #ffffff Color de fondo del menú Color de fondo del menú (activo) Color Sí #7fc9ff Color de fondo del elemento del menú activo Color del menú Color Sí #000000 Color de la entrada del elemento del menú activo Transición de entrada Listado No none Efecto de animación al entrar en una página. Transición de salida Listado No none Efecto de animación al salir de una página. CSS Personalizado Recurso No (Vacío) Selección de un archivo CSS que se cargará en el proyecto.
  6. 6. 6 3. Páginas Esta plantilla cuenta con dos tipos de páginas:  Página de contenido  Página de secciones Las operaciones de gestión de páginas desde el editor se realizan a través del menú superior de herramientas, el cual nos da acceso a la interfaz de “Gestionar páginas”. Desde aquí es posible cambiar el orden de las páginas, añadir nuevas páginas, eliminar páginas ya existentes o duplicarlas. A continuación se describen en detalle las propiedades de cada uno de los tipos de página así como los componentes que pueden incluir cada una de ellas. 3.1 Página de contenido La página de contenido está destinada a mostrar contenidos que no están jerarquizados en secciones. Aparecen en el menú principal como entradas clickables directamente (no se expanden, ya que no contienen secciones). Las propiedades que se pueden establecer desde el editor para este tipo de página son: Nombre Tipo Valor por defecto Descripción Título Texto Page Content Título mostrado en la página.
  7. 7. 7 Dentro de las páginas de contenido se puede utilizar los siguientes componentes: Componente Cantidad Descripción Audio 0..N Documento en formato .MP3. Destacado 0..N Componente para concretar y resaltar información. HTML 0..N Texto que se añade en las diferentes secciones. Imagen 0..N Muestra una imagen en el contenido. Vídeo 0..N Vídeo que se reproducirá dentro del componente. Cuestionario 0..N Conjunto de preguntas ordenadas a las que hay que responder. Contenido externo 0..N Permite utilizar contenido HTML o Flash creado por otras herramientas de autor (animaciones, actividades…). Contenedor 0..N Permite agrupar componentes en una determinada disposición: tres columnas, doble columna - columna simple, columna simple - doble columna, dos columnas o una columna. 3.2 Página de secciones La página de secciones está destinada a mostrar contenidos que están jerarquizados en secciones. Aparecen en el menú principal como elementos “expandibles”, es decir, al hacer clic en la entrada del menú que representa la página se expanden sus secciones como entradas “clickables” para acceder directamente a la sección. Dependiendo del valor especificado en la propiedad “Navegación de secciones” a nivel de proyecto, las secciones dentro de esta página se mostraran unas debajo de otras (vertical) o unas al lado de otras (horizontal). La propiedad que se puede establecer desde el editor para este tipo de página es: Nombre Tipo Valor por defecto Descripción Título Texto Page Section Título mostrado en la página. Dentro de las páginas de contenido se puede utilizar el siguiente componente: Componente Cantidad Descripción Sección 0..N Sección dentro de la página.
  8. 8. 8 4. Componentes Los componentes que pueden ser utilizados en esta plantilla, ya sea como componentes primarios dentro de las páginas, o como componentes incluidos dentro de otros componentes, son los siguientes:  Sección  Contenedor  Audio  Destacado  Texto en HTML  Imagen  Vídeo  Cuestionario  Contenido externo  Carrusel  Grupo de acordeón  Grupo de pestañas A continuación se describen las propiedades de cada uno de estos componentes, su posible utilización y los componentes que pueden tener en su interior. 4.1 Sección Son las diferentes partes que están dentro de la página de secciones. En las secciones se pueden incluir, a su vez, todos los componentes disponibles. La propiedad que se puede establecer desde el editor para este componente es: Nombre Tipo Valor por defecto Descripción Título Texto Page Section Título de la sección. Dentro se puede utilizar los siguientes componentes: Componente Cantidad Descripción Audio 0..N Documento en formato .MP3. Destacado 0..N Componente para concretar y resaltar información. HTML 0..N Texto que se añade en las diferentes secciones. Imagen 0..N Muestra una imagen en el contenido. Vídeo 0..N Vídeo que se reproducirá dentro del componente. Cuestionario 0..N Conjunto de preguntas ordenadas a las que hay que responder. Contenido externo 0..N Permite utilizar contenido HTML o Flash creado por otras herramientas de autor (animaciones, actividades…). Contenedor 0..N Permite agrupar componentes en una determinada disposición: tres columnas, doble columna - columna simple, columna simple - doble columna, dos columnas o una columna. 4.2 Contenedor Este componente permite agrupar otros componentes en una determinada disposición: tres columnas, doble columna - columna simple, columna simple - doble columna, dos columnas o una columna. Las propiedades que se pueden establecer desde el editor para este componente son:
  9. 9. 9 Nombre Tipo Valor por defecto Descripción Color de fondo Color #FFFFFF Color de fondo del contenedor. Color del borde Color #FFFFFF Color del borde del contenedor. Esta es la visualización de su panel de propiedades: Dentro se puede utilizar los siguientes componentes: Componente Cantidad Descripción Columna 0..N Componente divido en columnas en el que se incluyen el resto de componentes. El número de columnas se selecciona desde el panel de propiedades de este componente. Audio 0..N Documento en formato .MP3. Destacado 0..N Componente para concretar y resaltar información. HTML 0..N Texto que se añade en las diferentes secciones. Imagen 0..N Muestra una imagen en el contenido. Vídeo 0..N Vídeo que se reproducirá dentro del componente. Cuestionario 0..N Conjunto de preguntas ordenadas a las que hay que responder. Contenido externo 0..N Permite utilizar contenido HTML o Flash creado por otras herramientas de autor (animaciones, actividades…). Contenedor 0..N Permite agrupar componentes en una determinada disposición: tres columnas, doble columna - columna simple, columna simple - doble columna, dos columnas o una columna. 4.3 Audio Este componente se utiliza para introducir un recurso audio (.MP3). Se recomienda utilizar este tipo de recurso para aportar ejemplos basados en situaciones cotidianas, conversaciones entre comercial/cliente, narrar una historia, relatar un caso… Es importante tener en cuenta que todos los recursos audiovisuales generan interés en el usuario. La propiedad que se puede establecer desde el editor para este componente es: Nombre Tipo Valor por defecto Descripción Audio Recurso en formato .MP3 Vacío Archivo .MP3 reproducido por el componente. Esta es la visualización de su panel de propiedades:
  10. 10. 10 Este componente no contiene ningún otro componente. 4.4 Destacado El componente “Destacado” es muy útil para concretar y resaltar información a lo largo del proyecto. Por ejemplo, sirve para aportar puntos clave sobre un determinado asunto, ejemplificar una idea o, simplemente, aportar un dato curioso que motive continuar con la lectura. Las propiedades que se pueden establecer desde el editor para este componente son: Nombre Tipo Valor por defecto Descripción Color de fondo Color #FFFFFF Color de fondo del destacado. Color del borde Color #FFFFFF Color del borde del destacado. Esta es la visualización de su panel de propiedades: El componente que puede contener es el siguiente: Componente Cantidad Descripción HTML 1..N Texto mostrado dentro del destacado. 4.5 HTML El componente HTML permite la introducción directa de texto en formato HTML, en el que se puede incluir:  Texto con formato  Imágenes  Fórmulas matemáticas
  11. 11. 11 Para editar fórmulas matemáticas de una manera visual haz clic en en la barra de edición. Puedes copiar o pegar fórmulas desde Microsoft Word y es compatible con MathML. El texto en html se incluye en muchos de los componentes mencionados (destacados, secciones, citas…). Además del propio contenido HTML, este componente no dispone de ninguna otra propiedad que pueda ser modificada desde el editor. Por otra parte, este componente no puede incluir a ningún otro componente. 4.6 Imagen Este componente se utiliza para introducir una imagen en diferentes partes del contenido. Las imágenes aportan dinamismo al proyecto y dan fuerza a la información que se trata. Sin embargo, no es recomendable abusar de su uso ya que pueden “desvirtualizar” la información. Cada imagen debería acompañar al texto y tener un objetivo concreto. Ej.: un esquema que resuma los pasos de un proceso o, simplemente, una imagen de un equipo de trabajo que acompañe al texto que describe un buen equipo de trabajo. Las propiedades que se pueden establecer desde el editor para este componente son: Nombre Tipo Valor por defecto Descripción Imagen Recurso en formato .GIF, .PNG, .JPEG. Vacío Recurso imagen mostrado en el componente. Texto alternativo Texto Vacío Es el texto que se muestra cuando una imagen no se visualiza correctamente (debido a una velocidad de conexión lenta, por ejemplo). Esta es la visualización de su panel de propiedades: Este componente puede contener el siguiente componente: Componente Cantidad Obligatorio Descripción Pie de imagen 1 No Texto que se sitúa en la parte inferior de la imagen sobre un fondo gris. Describe la imagen. 4.7 Vídeo Este componente se utiliza para introducir un vídeo. Se recomienda el uso de vídeos con un propósito motivacional o informativo: describir pasos de un proceso, relatar un caso real para ejemplificar la teoría o exponer un ejemplo. Estas son sus propiedades:
  12. 12. 12 Nombre Tipo Valor por defecto Descripción Vídeo Recurso en formato .MP4 Vacío Vídeo que se reproducirá dentro del componente. Carátula Recurso en formato .GIF, .PNG, .JPEG Vacío Imagen mostrada antes de reproducir el vídeo. Subtítulo por defecto Recurso en formato .SRT Vacío Archivo que permitirá la reproducción de los subtítulos establecidos por defecto en el vídeo. Subtítulo español Recurso en formato .SRT Vacío Archivo que permitirá la reproducción de los subtítulos en español en el vídeo. Subtítulo inglés Recurso en formato .SRT Vacío Archivo que permitirá la reproducción de los subtítulos en inglés en el vídeo. Subtítulo gallego Recurso en formato .SRT Vacío Archivo que permitirá la reproducción de los subtítulos en gallego en el vídeo. Subtítulo catalán Recurso en formato .SRT Vacío Archivo que permitirá la reproducción de los subtítulos en catalán en el vídeo. Subtítulo portugués Recurso en formato .SRT Vacío Archivo que permitirá la reproducción de los subtítulos en portugués en el vídeo. Subtítulo italiano Recurso en formato .SRT Vacío Archivo que permitirá la reproducción de los subtítulos en italiano en el vídeo. Subtítulo holandés Recurso en formato .SRT Vacío Archivo que permitirá la reproducción de los subtítulos en holandés en el vídeo. Esta es la visualización de su panel de propiedades: Este componente no contiene ningún otro componente. Para saber cómo codificar vídeos con la herramienta HandBrake, consulta el anexo A.2. 4.8 Cuestionario Un cuestionario es un componente que se puede incluir dentro de cada una de las secciones. Son un conjunto de preguntas ordenadas que sirven para obtener información de quien las responde. Dentro de cada cuestionario se pueden incluir diferentes tipos de preguntas (respuesta simple, relacionar, rellena los huecos…).
  13. 13. 13 Estas son sus propiedades: Nombre Tipo Obligatorio Descripción Título Texto Sí Título mostrado en la cabecera del cuestionario. Ponderar puntuaciones Listado Sí Si seleccionas “False”, la puntuación total se normaliza a 100 puntos por defecto, de manera que todas las preguntas tienen el mismo valor. Si seleccionas “True”, tendrás que fijar los puntos para cada pregunta (ver Manual de autor). Evaluable Listado Sí En el listado se escoge si el cuestionario será evaluable (True) o no (False). Puntuación para aprobar Numérico Sí Puntuación necesaria para dar el cuestionario por aprobado (también se puede modificar a nivel de proyecto). Preguntas aleatorias Listado Sí Si seleccionas “True”, las preguntas se mostrarán de forma aleatoria al usuario. Si seleccionas “False”, aparecerán en el orden en que las hayas dispuesto. Preguntas a incluir Numérico No Número de preguntas que se mostrarán a la hora de responder al cuestionario. Si se selecciona “True” en la propiedad “Preguntas aleatorias”, se mostrará en número de preguntas que se indique de manera aleatoria. Si se selecciona “False”, se mostrará en número de preguntas que se indique pero en el orden en que están en el proyecto. Color de fondo Color Sí Color de fondo de la cabecera. Color de borde Color Sí Color del borde de la pregunta. Color de fondo del cuestionario Color Sí Color de fondo del cuerpo del cuestionario. Título de la cabecera visible Listado Sí Si seleccionas “True”, el usuario verá el título en la cabecera. Si seleccionas “False”, no lo verá. Botón de informe visible Listado Sí Si seleccionas “True”, el usuario verá el botón para ver el informe del cuestionario. Si seleccionas “False”, no tendrá opción de verlo. Paginación visible Listado Sí Si seleccionas “True”, el usuario podrá ver la página del cuestionario en que se encuentra debajo del título de la cabecera. Si seleccionas “False”, no lo verá. Puntuación de pregunta visible Listado Sí Si seleccionas “True”, el usuario verá la puntuación de cada pregunta debajo del título de la cabecera o de la paginación. Si seleccionas “False”, no la verá. Para obtener más información acerca de cómo crear un cuestionario y de los diferentes tipos de preguntas que se pueden incluir consulta el Manual de autor (apartado 4.7). 4.9 Contenido externo Este componente permite utilizar contenido HTML creado por otras herramientas de autor (animaciones, actividades…). Estas son sus propiedades:
  14. 14. 14 Nombre Tipo Valor por defecto Descripción Recurso (HTML5) Recurso en formato HTML5 Vacío Fichero comprimido que contiene el recurso en HTML5 a mostrar Recurso (Flash) Recurso en formato .SWF Vacío Película flash a mostrar Visualización Listado: HTML5/Flash/ Combinada Combinada Opción a mostrar por defecto. Si se escoge la combinada se intentará visualizar primero el Flash, en el caso de no tener el plugin de Flash disponible, se muestra el recurso HTML5. Si se escoge alguna de las otras opciones, no hay “fallback” de visualización. Nombre de Índice Texto Index.html Nombre del archivo HTML de inicio del contenido externo. Debe estar ubicado en la raíz del zip incluido, es decir, sin estar contenido en una carpeta. Esta es la visualización del panel de propiedades: 4.10 Carrusel Este componente se utiliza para introducir varias imágenes que se podrán visualizar individualmente, una tras otra, haciendo clic sobre las flechas que se muestran a la derecha ( ) y a la izquierda ( ) de la imagen o sobre los puntos al pie de la misma ( ). Este componente no tiene propiedades editables, pero contiene el siguiente componente: Componente Tipo Obligatorio Descripción Imagen Recurso en formato .GIF, .PNG, .JPEG Sí Recurso imagen mostrado en el componente. Puedes añadir tantas como desees. 4.11 Grupo de acordeón Este componente nos permite mostrar contenidos en forma de acordeón desplegable. Este acordeón permanece oculto hasta que hacemos clic sobre un componente HTML. Los componentes que puede incluir el acordeón son: actividad, audio, cita, HTML, imagen, actividad de texto, vídeo, cuestionario, contenido externo y mapa de clicks. Las propiedades que se pueden establecer desde el editor para este componente son: Nombre Tipo Obligatorio Descripción Plegar automáticamente Listado No Cuando hay varios acordeones, si seleccionas “True”, cada vez que despliegues uno de ellos se plegará el anterior que hayas desplegado. Si seleccionas “False”, los acordeones que despliegues permanecerán así hasta que los pliegues. Color de fondo de la cabecera Color No Color de fondo de la cabecera antes de desplegar el acordeón.
  15. 15. 15 Esta es la visualización del panel de propiedades: Este componente contiene el siguiente componente: Componente Cantidad Obligatorio Descripción Acordeón 1..N Sí Contiene los componentes que se quieren desplegar. 4.12 Grupo de pestañas Este componente nos permite mostrar contenidos en varias pestañas que se podrán visualizar individualmente haciendo clic en cada una de ellas. Puedes incluir cualquier tipo de componente de los disponibles en la herramienta. Las propiedades que se pueden establecer desde el editor para este componente son: Color de cabecera activo Color No Color de fondo de la cabecera una vez se despliegas el acordeón. Color de fondo principal Color No Color de fondo de la sección que se visualiza al desplegar el acordeón. Nombre Tipo Obligatorio Descripción Titulo Texto Sí Título mostrado en cada pestaña. Color de fondo de la cabecera Color No Color de fondo de la cabecera. Color de pestaña activo Color No Color de fondo de la pestaña seleccionada. Color de fondo principal Color No Color de fondo de la sección que se visualiza dentro de cada pestaña.
  16. 16. 16 Esta es la visualización del panel de propiedades: Este componente contiene el siguiente componente: Componente Cantidad Obligatorio Descripción Contenido de pestaña 1..N Sí Contiene los componentes que se quieren desplegar.
  17. 17. 17 5. Recursos Los tipos de archivo que pueden ser utilizados como recursos dentro de las páginas son:  Imágenes en formato .PNG  Imágenes en formato .JPEG  Imágenes en formato .GIF  Audios en formato .MP3  Vídeos en formato .MP4  Documento en formato .PDF  Contenido externo comprimido en formato .ZIP (.doc, .ppt, .xcl, .pdf, .xls…)
  18. 18. 18 6. Herramientas Sólo existirá una herramienta dentro de esta plantilla: el buscador. Se accede desde el menú superior pulsando en el ícono de la lupa, permitiendo buscar dentro de la página actual. Los resultados de la búsqueda se deben mostrar resaltados en la página (en amarillo por ejemplo). El comportamiento de las herramientas es exclusivo, es decir, si se abre una herramienta para su uso (en este caso el buscador), el resto de elementos que estén desplegados en pantalla (por ejemplo el menú principal en aquellas vistas donde esté oculto por defecto) se cerrarán para mostrar la herramienta.
  19. 19. 19 A. Anexos A.1. Tamaños de imágenes y contenidos externos Todos los elementos multimedia de adaptan al tamaño de su contenedor. A.2. Codificación de vídeos con HandBrake HandBrake es una herramienta para la conversión de vídeos desde casi cualquier formato a una selección de codecs modernos y ampliamente compatibles. Las razones fundamentales por las que usar esta herramienta son:  Convierte vídeo desde casi cualquier formato  Libre y de código abierto  Multiplataforma (Windows, Mac y Linux) Una vez instalado HandBrake y dependiendo de los ajustes de compresión, los vídeos resultantes pueden ser reproducidos en ordenadores de escritorio y dispositivos móviles (iPhone, iPod Touch, iPad, Smartphones, Tablets Android, etc.). A.2.1. Proceso de codificación En este apartado se describen los pasos a seguir para realizar la codificación de vídeo con la herramienta HandBrake: 1. Abre HandBrake, haz clic en “Source/Open File” y selecciona el archivo que quieres convertir.
  20. 20. 20 2. Después de seleccionar el archivo, aparecerá información a la derecha de “Source”. 3. Selecciona la pestaña “Picture” para configurar el tamaño del vídeo. El tamaño recomendado para vídeos que se van a visualizar en dispositivos móviles es 640x360. Para ello debes configurar los siguientes parámetros tal y como se muestra en la imagen:  Cropping: Automatic  Anamorphic: None  Width: 640  Keep Aspect Ratio: selecciona este parámetro para que se ajuste automáticamente el alto del vídeo al ancho indicado 4. Selecciona la ruta destino así como el nombre del archivo haciendo clic en “Browse”.
  21. 21. 21 Una característica a tener en cuenta es el formato de salida del vídeo que debe ser mp4. En caso de que HandBrake lo convierta a otro formato se puede forzar cambiando la extensión del archivo de salida. 5. Selecciona la pestaña “Video” y configura la conversión de vídeo como se muestra en la imagen, prestando especial atención a los siguientes parámetros: a. Web optimized: este parámetro debe estar seleccionado. b. Vídeo Codec: selecciona códec H.264 (x264). Esto da mejor calidad y menor tamaño de archivo que la codificación MPEG-4 y VP3. Además, la mayoría de dispositivos soportan este formato, por lo que se está convirtiendo en un estándar. c. H.264 Profile: selecciona perfil Baseline. d. H.264 Level: selecciona nivel 3.1.
  22. 22. 22 6. Haz clic en “Start” para comenzar con el proceso de compresión Una vez finalizado el proceso, ya tienes el vídeo listo con las características adecuadas para ser visualizado correctamente en dispositivos móviles y en escritorio. Ahora sólo tienes que añadir el vídeo a la zona de recursos y utilizarlo dentro de tu proyecto.

×