buscar Buscar en RED Descartes    

Cuarta sesión de la 4ª edición del curso "Edición de libros interactivos"

Cuarta sesión (25 de noviembre de 2022)

 

 youtube Desarrollo de la cuarta sesión. Cuarta sesión en línea.

Descripción   Contenidos temporalizados

Grabación de la cuarta sesión celebrada el 25 de noviembrebre de 2022 dirigida e impartida por el Dr. Rivera presidente de RED Descartes Colombia.

Comparten gestión y docencia: Lcdo. José Antonio Salgueiro González, secretario de la RED Descartes de España y el Ing. MSc. Ramiro A. Lopera Sánchez de la IU Pascual Bravo y miembro de la RED Descartes Colombia.

 

El desarrollo de la clase se realiza siguiendo los contenidos escritos en el libro interactivo: "Diseño de libros interactivos" (disponible también en versión pdf, pero siendo necesaria la conexión a internet para acceder a los objetos interactivos) y en el orden ahí incluido.

 

 

 Descripción línea temporal de contenidos

Libro interactivo con la  "Guía de la cuarta sesión".

 Línea temporal de contenidos

 00 m 00s: Introducción. Trabajaremos con elementos multimedia: textos e imágenes (primera parte).

02 m 32 s: Para textos consulten el libro guía p. 46 donde se detalla el código necesario.

03 m 15 s: En la guía de esta cuarta sesión tienen los elementos que trabajaremos.

03 m 57 s: Como intersertar listas. 

04 m 50 s: Etiqueta <ul> (listas no ordenadas) y <li>.

06 m  05 s: Crear en "mis estilos" nuevas listas. Inclusión de una imagen como ilustración de cada elemento de la lista mediante una clase. Diferencia entre outside e inside en list-style.

11 m 13 s: Crear un tipo de lista propio.

16 m 50 s: En flaticon.es tienen iconos.

17 m 38 s: Inclusión de citas textuales. Hiperenlaces. Notas a pie de página y refrencias bibliográficas.

19 m 30 s: Para una cita textual incluimos una clase class="note".

21 m 17 s: Quitar la línea lateral de adorno en una cita textual incluyendo una modificación en mis_estilos e introducir otros cambios opcionales.

25 m 20 s: Incluir un hiperenlace: etiqueta <a>.

28 m 34 s: Poner una nota a pie de página. Etiqueta <span> es una etiqueta neutra, pero permite introducir estilos y clases. Para nota a pie de página usamos class="footnote".

32 m 34 s: Bibliografía: <bibitem id="xxx"> y referencias bibliográficas: <bibref ref_id="xxx">.

37 m 35 s: Tarea de esta sesión: elaborar una página similar a la incluida en el libro de referencia "Diseño de libros interactivos p. 53" con un mínimo de dos notas a pie de página, dos hiperenlaces y una cita textual.

38 m 34 s: Inclusión de imágenes: eitqueta <img> (cierre especial <img />.

 41 m 27 s: Centrado de imágenes.

44 m 10 s: class="image_expand" propia del libro interactivo y onclick.

48 m 52 s: Etiqueta <figure> con un título a pie de figura: <figcaption>. O encima de la figura. O con otro prefijo como Tabla (prefix="Tabla").

52 m 30 s: Preguntas y diálogos.

 

Chat de la sesión

 

 

Tercera sesión de la tercera edición del curso "Edición de objetos interactivos con DescartesJS"

Tercera sesión (18 de noviembre de 2022)

 

1A. youtube Desarrollo de la tercera sesión. Tercera sesión en línea.

Descripción   Contenidos temporalizados

Grabación de la tercera sesión celebrada el 18 de noviembre de 2022 dirigida e impartida por el Dr. Rivera de la Institución Universitaria Colegio Mayor de Antioquia de Medellín (Colombia) y presidente de RED Descartes Colombia. 

Comparten gestión y docencia: Lcdo. José Antonio Salgueiro González, secretario de la RED Descartes de España y el Ing. MSc. Ramiro A. Lopera Sánchez de la Institución Universitaria Pascual Bravo y miembro de la RED Descartes Colombia.

 

 

 

Documento de referencia de esta sesión: "Curso de DescartesJS. Sesión3

Línea temporal   

00 m 00 s: Introducción. Objetivos de esta sesión.

01 m 14 s: En el documento de referencia (Sesión 3) la primera actividad es incluir diferentes tipos de fondo y de marcos incluyendo el manejo de imágenes, controles tipo botón, espacios y condicionales.

03 m 17 s: Recordad configurar la escena para que se escale (selector "Escena", parámetro "expandir escena").

04 m 02 s: Incluir una imagen en un espacio indicandp expadir en "despliegue". Puede descargar las imágenes auxiliares —fondos, botones y marcos— que se usan en la sesión 3 (y otras más) desde aquí.

05 m 19s: El selector "Programa" y los algoritmos "Inicio" y "Cálculos". Dibujar si en un espacio.

06m 16s: Crear más espacios (agregar o clonar) y condicionar su representación con dibujar si. 

09 m 35 s: Uso de un control para poder seleccionar los espacios y las imágenes ques estos contienen. Selector "Controles" y tipos controles. Control tipo botón y sus parámetros (ubicación, tamaño, imagen asociada, acción).

15 m 30 s: Crear un espacio auxiliar botones para ubicar en él el control tipo botón y con fondo transparente.

17 m 20 s: Limitar el valor de la variable usada en el control tipo botón.

18 m 20 s: Incluir otro botón para retroceder en los espacios e imágenes asociadas a ellos.

20 m 30 s: Surge un problema en la codificación (en este vídeo se explica cuál fue el error).

21 m 10 s: Agregar un título a la escena. Selector "Gráficos" tipo texto.

22 m 48 s: Cambiar el color del texto.

23 m 40 s: Agregar marcos. Usamos una variable auxiliar m (de marco) y un espacio adicional. Hay que posicionar u ordenar los espacios para su representación (son capas una encima de otra que se dibujan según el orden puesto en el editor de configuración de espacios).

28 m 20 s: Agregamos un control tipo barra para cambiar los marcos (cambiar el valor de la variable auxiliar m).

32 m 30 s: Tarea a realizar: Editar una escena similar a la construida en esta primera parte de la sesión.

33 m 00 s: Parámetros o propiedades del control tipo barra. Uso de gradiente en colores.

36 m 00 s: En la p. 36 del libro guión de la sesión 3 tenemos otra actividad.

37 m 00 s: Agregar un gráfico tipo imagen, en este caso es vectorial (svg). Ancho y alto de la imagen en porcentaje. Posicionamiento según coordenadas relativas a los ejes. Si el porcentaje es negativo invierte la imagen.

40 m 27 s: Incluir un espacio 3D con trasparencia. Nuevo selector "Gráficos 3D". Añadir un gráfico 3D.

42 m 04 s: Selector animación y control de una animación.

42 m 26 s: Variables de espacio (rotación en z, espacio.rot.z).

44 m 49 s: Un botón para una animación. Ubicación del botón usando el ancho del espacio (espacio. _w). Seleccionar en el paraámetro acción el valor "animar".

47 m 20 s: Incluir una rotación en y (selector animación y espacio.rot.y).

49 m 06 s: Añadir una imagen tipo gif animado o WebP animado. Es necesario un espacio HTMLIframe.

52m 20 s: Formatos o tipos de imágenes (p. 6 y siguientes del libro guión de esta sesión).

56 m 00 s: Tarea a realizar y se solicita algo de creatividad.

58 m 30 s: Preguntas y/o comentarios.


 

 Para la cuarta sesión: Hagan la tarea propuesta y practiquen.

English Level 5

English level 5

Título: English Level 5
Sección: iCartesiLibri
Bloque: Otras lenguas
Unidad: Lengua inglesa
Nivel/Edad: Secundaria y Bachillerato (15 años o más)
Idioma: Inglés
Autor: Gary Scott Vernier & Jhon Alfer Rua
Diseñadora e ilustraciones: Sara Montoya Arbelaez
Desarrollo y programación adicional: Ramiro A. Lopera Sánchez, Sebastian Iserte y Cindy Tatiana Bedoya Congote.
ISBN: 978-84-18834-55-4

pdf32 Haz clic aquí para ver una versión en pdf

InformaciónHaz clic en la imagen para abrir el recurso

Descargar recursoDescargar recurso

ComparteCódigo para embeber como iframe ComparteCódigo para abrir en ventana emergente

Puedes encontrar todos los libros interactivos de iCartesiLibri en
https://proyectodescartes.org/iCartesiLibri/index.htmVer Créditos

Este material está publicado bajo una licencia:
Licencia Creative Commons
Creative Commons Reconocimiento-NoComercial-CompartirIgual 4.0 Internacional

 

English Level 4

English level 4

Título: English Level 4
Sección: iCartesiLibri
Bloque: Otras lenguas
Unidad: Lengua inglesa
Nivel/Edad: Secundaria y Bachillerato (15 años o más)
Idioma: Inglés
Autor: Gary Scott Vernier & Jhon Alfer Rua
Diseñadora e ilustraciones: Sara Montoya Arbelaez
Desarrollo y programación adicional: Ramiro A. Lopera Sánchez, Sebastián Iserte y Cindy Tatiana Bedoya Congote.
ISBN: 978-84-18834-54-7

pdf32 Haz clic aquí para ver una versión en pdf

InformaciónHaz clic en la imagen para abrir el recurso

Descargar recursoDescargar recurso

ComparteCódigo para embeber como iframe ComparteCódigo para abrir en ventana emergente

Puedes encontrar todos los libros interactivos de iCartesiLibri en
https://proyectodescartes.org/iCartesiLibri/index.htmVer Créditos

Este material está publicado bajo una licencia:
Licencia Creative Commons
Creative Commons Reconocimiento-NoComercial-CompartirIgual 4.0 Internacional

 

Tercera sesión de la 4ª edición del curso "Edición de libros interactivos"

Tercera sesión (11 de noviembre de 2022)

 

1A. youtube Desarrollo de la tercera sesión. Tercera sesión en línea.

Descripción   Contenidos temporalizados

Grabación de la tercera sesión celebrada el 11 de noviembre de 2022 dirigida e impartida por el Dr. Rivera presidente de RED Descartes Colombia.

Comparten gestión y docencia: Lcdo. José Antonio Salgueiro González, secretario de la RED Descartes de España y el Ing. MSc. Ramiro A. Lopera Sánchez de la IU Pascual Bravo y miembro de la RED Descartes Colombia.

 

El desarrollo de la clase se realiza siguiendo los contenidos escritos en el libro interactivo: "Diseño de libros interactivos" (disponible también en versión pdf, pero siendo necesaria la conexión a internet para acceder a los objetos interactivos) y en el orden ahí incluido.

 

 

 Descripción línea temporal de contenidos

Libro interactivo con la  "Guía de la tercera sesión".

 

00 m 00s: Nos adentraremos en las hojas de estilo. Nos adentramos dentro del libro de "Diseño de libros interactivos en la pág. 21 y siguientes. Vimos estilos en las etiquetas y ahora nos adentramos en las hojas de estilos en un fichero externo.

02 m 15 s: En el libro de referencia anterior hay una herramienta de edición de HTML y CSS y visualización (acceder a la caja de herramientas en la esquina superior derecha).

02 m 42 s: Tendremos como tarea, después de esta clase, el diseñar algunos contenedores similares a los que tenemos en las pp. 19 y 20 de la guía de esta sesión 3ª y veremos el diseño de algunas listas especiales.

03 m 50 s: Comenzamos en la guía de esta sesión en la p. 15 (que pone sesión 2 en la portada del capítulo). Y, aprovechemos la ocasión, para ver cómo podemos incluir un nuevo capítulo en nuestro libro. Para ello disponemos de este vídeo de ayuda: "Nuevo capítulo y tabla de contendido".

04 m 48 s: Inclusión de un título en la tabla de contenido (toc) del libro. Hemos de indentificarlos con un "id" y en la sección toc del libro interactivo que estamos diseñando incluimos una línea donde referenciamos el id del titulo a incluir.

07 m 39 s: Hoja de estilos externa (localizada en la carpeta de nombre extra). En la p. 16 podemos ver en un vídeo cómo generarla.

10 m 06 s: Editar la hoja de estilos (ver vídeo en la p. 17 y los estilos ahí usados y reflejados en el texto de esta página).

15 m 05 s: Colores. Una buena introducción la podemos encontrar en el libro "Introducción a la graficación por computadora". El modelo RGB.

17 m 47 s: Otro formato para definir el color. Código hexadecimal.

19 s 04 s: El formato HSV.

20 m 35 s: En la p. 5 del núm. 1 de la revista RED Descartes hay un artículo de colores y CSS.

22 m 09 s: Cambiar familia de fuentes (carpeta font).

25 m 33 s: Definir clases.

27 m 56 s: Practiquemos clases con la herramienta auxiliar herramienta de edición de HTML y CSS.

29 m 38 s: Definamos una caja (.caja0).

35 m 15 s: Copiar la caja diseñada en la hoja de estilos.

36 m 46 s: Incluir una caja en un div usando class.

38 m 14 s: Uso de margin y padding.

 43 m 49 s: Otro diseños de caja.

46 m 00s: Avance del cambio de colores para el uso del fondo oscuro.

47 m 30 s: Más diseños de cajas. Caja con fondo una imagen. Vídeo auxiliar de diseño de cajas.

53 m 40 s: Preguntas, diálogo.

La plantilla inical del libro para realizar sobre ella las prácticas es:  

Mi_libro (descarga de la plantilla)

 

 Chat de la sesión.

 

 

 

Página 15 de 189

SiteLock

Módulo de Búsqueda

Palabras Clave

Título

Categoría

Etiqueta

Autor

Acceso

Últimos materiales de Matemáticas

Utilizamos cookies para mejorar nuestro sitio web y su experiencia al usarlo. Las cookies utilizadas para el funcionamiento esencial de este sitio ya se han establecido. Para saber más sobre las cookies que utilizamos y cómo eliminarlas , consulte nuestra Política de Privacidad.

  Acepto las Cookies de este sitio.
EU Cookie Directive Module Information