PROCESSING

 >>> you can download it here

Processing is an open-source programming language and integrated development environment based on Java, used as a medium for teaching and creating multimedia and interactive digital design projects. It is developed by artists and designers as an alternative tool to proprietary software.

Processing es un lenguaje de programación y entorno de desarrollo integrado de código abierto basado en Java, que sirve como medio para la enseñanza y producción de proyectos multimedia e interactivos de diseño digital. Es desarrollado por artistas y diseñadores como una herramienta alternativa al software propietario. 

PIXELS AND COLORS

Computer screens are made up of a matrix of dots that we call PIXELS. The more pixels a screen or digital image has, the higher its resolution. Each pixel can have a different color, which is a combination of three components: RED (R), GREEN (G), and BLUE (B). This is the RGB code, which expresses each component as a number between 0 and 255.

Thus, 0,0,0 is black and 255,255,255 is white.

You can visit this webpage to get the RGB code of any color:  https://htmlcolorcodes.com/

COORDINATES

The coordinate origin (0,0) on a computer screen is the top-left corner. Each pixel has two coordinates (x, y) to indicate its position on the screen. 

The x coordinate (width) is the horizontal distance from the left edge of the screen, and

The y coordinate (height) is the vertical distance from the top edge of the screen.

WINDOW SIZE

You can define the size of the window where you run the program with the command size(x,y);

x = width    y=height

URL to download the program: https://processing.org/

You can download processing-4.3.3. for windows x64 here (you dont need to install anything only run the exe file)

PRACTICES

P1-Hello world

P2-Geometric Shapes 1

P3-Geometric Shapes 2

P4-House

P5-Olympic Rings

P6-Hello Mouse

P7-Advanced Hello Mouse

P8-Traffic Lights

P9-Tunk

P10-Free activity

**P 1: Hello Word - Drawing a dot and a line - Dibujar un punto y una línea

To draw a dot use the sentence: point (x,y);

To draw a line use: line (x1,y1,x2,y2);

**P2: Geometric shapes (photocopy)

**P3.: Geometric shapes (2) - Dibujar formas geométricas simples

Reproduce exactly this model

P4: Drawing a house

You can follow Amalia's model, but it´s better you design yours!

P5: Olympic Rings

Help:

- The stroke weight refers to the edge of the shape. Use at least 5 >> strokeWeight(5);

- Transparent shapes >> fill(R,G,B,0); >> the last number is the opacity 0=transparent

- White Backgound >> background(255);

✧ ➷༄*ੈ✩ ✧ ➷ೃ༄*ੈ✩ ✧ ➷ೃ༄*ੈ✩

VARIABLES

A variable is a memory address where data can be stored. The use of variables involves three actions:

1.-Defining the variable (int, float, boolean, char, string)

2.-Assigning it a value

3.-Using the variable

Una variable es una dirección de memoria donde se puede guardar un dato. El uso de variables implica tres acciones:

1. Definir la variable (int, float, boolean, char, string)

2. Asignarle un valor

3. Utilizar la variable

FUNCTIONS

A function is a set of instructions grouped under a single name. There are functions defined in the development environment, such as draw() and setup(), as well as others that can be defined by the user. To execute a function, you need to use the following syntax:

Una función es un conjunto de instrucciones agrupadas bajo un mismo nombre. Existen funciones definidas en el entorno de desarrollo como draw() y setup(), y otras que puede definir el usuario. Para que se ejecute una función hay que usar la sintaxis:

void setup (){

código que se va a ejecutar

}

P6: Create a program to control the mouse - Hello Mouse!

Elaborar un programa para controlar el ratón - Hola Mouse!

BUCLES Y CONDICIONALES

Cuando el programa tenga que tomar una decisión utilizaremos la sentencia condicional if / else que indicarán las instrucciones que se ejecutarán si se cumple o no una condición. Se utilizarán los signos =>< para establecer esas condiciones.

if (nombre ==5){

//instrucciones que se ejecutarán si se cumple la función

}

else{

//insrucciones que se ejecutarán si no se cumple la función

}

 

Para repetir una o más instrucciones un número determinado de veces utilizaremos la sentencia for o while ...

for (byte i=0; i<10 ; i=i+1){

//instrucciones a repetir

}

  *********************

while (boton==0);{

//instrucciones a repetir

}

P7: Advanced Hello Mouse - the color is changing!

Hola Mouse Avanzado - el color del trazo va cambiando de color

P8: TRAFFIC LIGHTS - SEMÁFORO

https://fdiazuceda.blogspot.com/2023_12_12_archive.html

Para dibujar este semáforo copiamos el siguiente código:

void setup() {

  size (400,400);                                        // Creamos una ventana de 400x400 pixeles

  rect(120,20,120,360);                             // Dibujamos un rectángulo

  triangle(20,20,120,20,120,120);             // Triángulo  en la parte superior izquierda

  triangle(240,20,340,20,240,120);           // Triángulo  en la parte superior derecha

  triangle(20,140,120,140,120,240);        // Triángulo  en la parte central izquierda

  triangle(240,140,340,140,240,240);      // Triángulo  en la parte central derecha

  triangle(20,260,120,260,120,350);        // Triángulo  en la parte inferior izquierda

  triangle(240,260,340,260,240,350);      // Triángulo  en la parte inferior derecha

  fill(0,0,0);                                                 // Ponemos el relleno del fondo en negro

  ellipse (180,80,100,100);                        // Dibujamos el círculo superior

  ellipse (180,200,100,100);                      // Dibujamos el círculo central

  ellipse (180,320,100,100);                      // Dibujamos el círculo inferior

}

A continuación programamos el siguiente código para que vaya encendiéndose de cada color:

* No olvidar definir la variable time al principio para poner el tiempo a cero:

Y finalmente definimos el dibujo para cada color:

P9: DEPÓSITO

El depósito debe simular que se llena con la letra "a" y se vacía con la tecla "z" 

   

TAREA PARA EL LUNES 23 DE MARZO

 - Si no has podido terminar la aplicación personal, puedes continuar con ella y enviarme el nuevo archivo aia para revisarlo justo antes de la evaluación y subir algo la nota.

- Si ya la has terminado, realiza esta otra aplicación (un juego) que contará ya para la nota final de curso!!

Puedes elegir entre:

>> PRÁCTICA 8 de la web de Justo: JUEGO PONG

>> PRÁCTICA 9 de la web de Justo: JUEGO TOPO

Cómo ya sabes, tienes los recursos, las instrucciones y un vídeo explicativo en la web (solo es necesario hacer un juego a elegir entre los dos que son de una dificultad similar)

Bases de Datos - TIC II

Introducción: ¿Qué es una base de datos?

vídeo1

vídeo 2

Recordatorio de bases de datos 4ºESO 

Ejercicio guiado: Biblioteca

Editando formularios:

Para dar una apariencia más limpia al formulario configuramos los siguientes parámetros:

Nos quedará algo así:

Tutorial: https://www.youtube.com/watch?v=ynb7xkTyaSQ&ab_channel=HernandoMorenoA.

════ ∘◦❁◦∘ ════

APLICA TODO LO QUE HAS APRENDIDO Y CREA TU BASE DE DATOS CON ACCESS

El objetivo de esta práctica es diseñar y construir una base de datos funcional en Microsoft Access. Los estudiantes deberéis crear una base de datos que incluya tablas, relaciones, consultas y un formulario de presentación para interactuar con los datos de manera eficiente.

Condiciones:

1- Una tabla principal con al menos 5 campos además del id (tipos variados, al menos uno de tipo texto, otro numérico y otro si/no)

2- Otra tabla relacionada con uno de los campos de la tabla principal para que salga un "desplegable" o cuadro de lista.

3- Diseñar un formulario de presentación para interactuar con los datos de forma eficiente, de tal forma que aparezcan casillas para rellenar los campos (el id no es necesario) y los siguientes botones:

*Nuevo

*Guardar

*Cerrar Formulario

*Ir al primer campo

*Ir al campo anterior

*Ir al campo siguiente

*Ir al último campo

**Botón para que se ejecute una de las consultas

**Botón para que salga un informe de la tabla principal con todos los registros de la base de datos.

Añade también alguna imagen y un pie de formulario con tu nombre y apellidos

4- Rellenar unos 10 registros

5- Crear al menos 3 consultas

Importante:

Publica tu base de datos en tu blog en la misma entrada de Access, haciendo una captura de pantalla de la previsualización del formulario de presentación de tal forma que al clicar en la imagen se abra el link de tu Drive para descargar la base de datos!!

Avanzado:

Guardar la base de datos como ejecutable de tal forma que se ejecute directamente el formulario de presentación

Para ello en menú archivo > guardar como > elegir la opción de Crear ACCDE (esto hace que se compile un archivo solo ejecutable)

Además, en las opciones de Access debemos configurar lo siguiente (menú archivo>opciones):

-En Base de Datos Actual, elegir el formulario que queremos que se abra en la opción Mostrar formulario

-Además, si queremos que el usuario no tenga acceso a la navegación por el resto de la base de datos, se puede ocultar desmarcando el tic en opciones de navegación.

Para conseguir que las consultas e informes se abran también en ventanas emergentes, hay que configurarlas en la pestaña formato/otras de la hoja de propiedades, buscar la opción "Emergente" y cambiar a Sí

PRUEBAS PRÁCTICAS DE WORD Y EXCEL

 

:: PRUEBA DE WORD - realizada el lunes 16 de marzo

TAREA PARA EL LUNES 23 DE MARZO 

:: PRUEBA DE EXCEL >>  DESCARGA AQUÍ EL DOCUMENTO SIN FORMATO  (cuando pinches y se abra el archivo en otra ventana ve a archivo (file) y pincha en descarga (download) y ya lo guardas con tu nombre. Luego ya sigue las instrucciones de la fotocopia que también puedes ver aquí: Instrucciones y al finalizar lo publicas en tu blog!!

Resultado:

3. Communicating ideas through graphic representation

 - Scales

- Dimensioning

- Views

- Perspectives

QCAD

SKETCHUP

Hoja de Cálculo: Excel

 

-P1: Operaciones Básicas (P6)

- P2: Operaciones Combinadas (P7)

- P3: Operaciones con funciones I (P8)

- P4: Operaciones con funciones II (P9)

Gráficos:

Continúa en el mismo documento Excel con los siguientes ejercicios:

Hoja 5: Gráficos circulares (P11)

Hoja 6: Gráficos de barras (P12)

Hoja 7: Gráficos de líneas (P13)

PROYECTO - BARRERA PARKING o similar

Este es un proyecto clásico de Arduino para automatizar una barrera de estacionamiento (parking). Utiliza un sensor ultrasónico (HC-SR04) para detectar la presencia de un coche, un servomotor para mover la barrera, y dos LEDs (verde y rojo) para indicar el estado (libre/abierto o cerrado). 

1. Componentes Necesarios

• Tarjeta controladora Arduino Uno (o compatible).
• Sensor Ultrasónico HC-SR04.
• Servomotor SG90 (Micro Servo).
• LED Verde y LED Rojo.
• 2 Resistencias de 220 o 330 ohmios.
• Protoboard y cables de conexión. 

2. Conexiones (Esquema)

HC-SR04: VCC a 5V, GND a GND, Trig al Pin 10, Echo al Pin 9.

Servo: Cable marrón/negro a GND, rojo a 5V, naranja/amarillo a Pin 11.

LED Verde: Ánodo (+) al Pin 12, Cátodo (-) a GND (con resistencia).

LED Rojo: Ánodo (+) al Pin 13, Cátodo (-) a GND (con resistencia).

3.1. Código Arduino - Bloques con Tinkercad

opción A

opción B

3.2. Código IDE Arduino 

(Copiar, pegar en IDE y completar) >> ver opciones(fotocopia)

***

#include <Servo.h>

// Definición de Pines

const int trigPin = ;

const int echoPin = ;

const int servoPin = ;

const int ledVerde = ;

const int ledRojo = ;

// Variables

Servo myServo;

long duracion;

int distancia;

int distanciaSeguridad = 20; // Distancia en cm para detectar coche

void setup() {

  pinMode(trigPin, );

  pinMode(echoPin, );

  pinMode(ledVerde, );

  pinMode(ledRojo, );

 

  myServo.attach(servoPin);

 

  // Barrera cerrada inicialmente (0 grados)

  myServo.write(0);

  Serial.begin(9600); //*opcional

}

void loop() {

  // Medir distancia con sensor ultrasónico

  digitalWrite(trigPin, LOW);

  delayMicroseconds(2);

  digitalWrite(trigPin, HIGH);

  delayMicroseconds(10);

  digitalWrite(trigPin, LOW);

 

  duracion = pulseIn(echoPin, HIGH);

  distancia = duracion * 0.034 / 2;

 

  Serial.print("Distancia: "); //*opcional

  Serial.println(distancia);

  // Lógica de la barrera

  if (distancia > 0 && distancia <= distanciaSeguridad) {

    // Coche detectado: Abrir barrera

    digitalWrite(ledVerde, ); // Luz verde encendida

    digitalWrite(ledRojo, );   // Luz roja apagada

    myServo.write();            // Mueve servo a 90 grados

    delay(3000);                  // Espera 3 segundos para que pase

  }

  else {

    // No hay coche: Cerrar barrera

    digitalWrite(ledVerde, );  // Luz verde apagada

    digitalWrite(ledRojo, );  // Luz roja encendida

    myServo.write();             // Mueve servo a 0 grados

  }

 

  delay(100); // Pequeña pausa para estabilidad

}

***

4. Funcionamiento

Estado Inicial: La barrera está en 0 grados (cerrada) y el LED rojo está encendido.

Detección: El sensor envía una onda de sonido. Si el coche está a menos de distanciaSeguridad (20 cm), el código lo detecta.

Acción: El LED rojo se apaga, el verde se enciende y el servo gira a 90 grados (barrera sube).

Cierre: Tras 3 segundos (delay(3000)), el servo vuelve a 0 grados y se enciende el rojo nuevamente. 

 

5. DISEÑA CON TINKERCAD UNA MAQUETA PARA IMPRIMIR CON LA IMPRESORA 3D Y COMPRUEBA EL FUNCIONAMIENTO.

Enlaces de interés:

Simulación del circuito en Tinkercad: -::- Vídeo del circuito    -::- Vídeo del código de bloques

Proyecto master:  https://tecnovadores.blogspot.com/2020/02/parking-arduino.html