CREACIÓN DIGITAL Y PENSAMIENTO COMPUTACIONAL (25-26)

 1º BACHILLERATO (GRUPOS A - B)

Creación Digital y Pensamiento Computacional (CDPC)

 IES SALDUBA

00. INTRODUCCIÓN:

Tarea 01:

Criterios que se evalúan con esta actividad: 1.1; 1.2; 1.3; 1.4.

01. Tarea 01. Pensamiento Algorítmico.

02. Tarea 01. Crea un algoritmo para realizar con éxito una tarea. Esta tarea debe estar relacionada con tu vida diaria dentro de nuestro centro, IES Salduba.

03. Tarea 01. Tu profe preferido, es decir, Sergio Rojas, está entrenando al ratón de la tarea 01 para que, ingresando por cualquier tubo, salga siempre por el número cinco y consiga su comida. ¿Puedes ayudar al gran maestro Jedi Sergio Rojas facilitándole un algoritmo que cumpla esta misión?

A. SABERES BÁSICOS: PROGRAMACIÓN GRÁFICA MULTIMEDIA.

-----------------------------------------------------------------------------------------------------------------------------

CDPC.1.A.1. Fundamentos de Programación.

Tarea 02:

Criterios que se evalúan con esta actividad: 1.1; 1.2; 1.3; 1.4.

02.01. Busca información sobre que entendemos en el mundo digital por ``Fundamentos de la Programación´´. Además, busca un vídeo explicativo de relevancia en youtube e inserta el enlace de dicho vídeo en esta tarea.

CDPC.1.A.2. Conceptos de instrucción y secuenciación, algoritmo vs. código.

02.02. Busca, ayudándote de Internet, el significado de los anteriores conceptos. Pon ejemplos de cada uno de ellos. Para ello, usa la tarea 01. Si no encuentras ejemplos de alguno de estos conceptos en la tarea 01, busca en Internet algún ejemplo concreto. Incluye el enlace a la página de dicho ejemplo.

CDPC.1.A.3. Estructuras de control selectivas e iterativas, finitas e infinitas.

02.03 Busca, ayudándote de Internet, el significado de los anteriores conceptos. Pon ejemplos de cada uno de ellos. Además, crea un algoritmo donde aparezcan varias estructuras de este tipo.

CDPC.1.A.4. Funciones. Introducción al uso de funciones gráficas: punto, línea, triángulo, cuadrado, rectángulo, círculo, elipse, sectores y arcos.

02.04. Busca, ayudándote de Internet, el significado de función . Encuentra en la página web de p5.js donde consultar todas las funciones que tiene definida este lenguaje de programación. Incluye un ejemplo que creas que vamos a utilizar en este curso. Por último, no olvides escribir las URLs de ambas páginas.

CDPC.1.A.5. Procesamiento de imágenes. Gráficos vectoriales. Diseño digital generativo basado en algoritmos. Eventos: ratón y teclado. Uso de la línea y el punto para dibujar líneas a mano alzada. Operaciones en el espacio: translaciones, escalados, rotaciones, etc. Diseño de patrones.

CDPC.1.A.6. Arte generativo en la naturaleza: Fibonacci y fractales. Imagen de mapa de bit. Aplicación de filtros. Procesamiento de imágenes píxel a píxel.

CDPC.1.A.7. Modelado 3D. Herramientas.

CDPC.1.A.8. Procesamiento de vídeo, audio y animaciones. Tratamiento de vídeo como vector de fotogramas.

CDPC.1.A.9. Tratamiento del sonido. Diseño de mini-juegos e instalaciones artísticas generativas e interactivas

CDPC.1.A.10. Habilidades y herramientas para el trabajo colaborativo.

-----------------------------------------------------------------------------------------------------------------------------

Para trabajar este bloque A de saberes básicos vamos a utilizar p5.js.

p5.js es una biblioteca de JavaScript, que es un lenguaje que los navegadores web (Chrome, Explorer, Firefox, Safari, Opera) son capaces de ejecutar. A grandes rasgos, las páginas web se escriben en HTML, donde se indican los contenidos y estructura de la página web, incluyendo, texto, imágenes y videos. Este código en HTML se complementa con el lenguaje CSS, que permite cambiar el estilo de la página web: agregar colores, tipografías, alineación, márgenes, y tamaños. Así, HTML y CSS permiten hacer páginas web estáticas. Sobre esta base, se puede programar en el lenguaje JavaScript, que permite agregar comportamientos a la página web que son dinámicos e interactivos, como por ejemplo que cuando la persona presione un botón, se reproduzca un video, o el texto cambie de color, o que cada minuto la página se refresca, entre otros.

Comenzamos a utilizar este programa. Para ello, tenemos dos formas de trabajar:

Primera forma: En línea, es decir, con acceso a Internet. Es más sencilla pero en caso de no tener acceso a Internet, no podríamos avanzar en nuestro trabajo. Para el trabajo en línea tenemos que registrarnos en la página web de p5.js.

Para más información:

p5.js con acceso a internet

Segunda forma: Sin tener acceso a Internet. En este caso, debemos instalar en nuestro ordenador alguno de los programas que permiten lo anterior. En este curso vamos a usar Visual Studio Code, de software libre. 

Para más información:

p5.js sin acceso a internet

Tarea 03:

Criterios que se evalúan con esta actividad: 1.1; 1.2; 1.3; 1.4.

MI PRIMER BOSQUEJO

Sigue todos los pasos que Drolejan explica en los dos videos anteriores. Para superar esta tarea tienes que enseñar a tu profe preferido, Sergio, paso a paso, todo lo que Drolojean comenta en este video. Haz capturas de pantallas de tu trabajo para ello o comparte con tu profe tus bosquejos. Además, realiza un segundo bosquejo realizando los cambios que hagan sorprenderse a tu profe.

Tarea 04:

Criterios que se evalúan con esta actividad: 1.1; 1.2; 1.3; 1.4.

Tarea 04

Tarea 05:

Criterios que se evalúan con esta actividad: 1.1; 1.2; 1.3; 1.4.

Tarea 05