Introducción

En este módulo vamos a introducirnos en todo lo referente a programación. La mayoría de los usuarios tienen un ordenador o pc al alcance de su mano, pero cuando hablan de "programar" parece que hay que estudiar una ingeniería y realmente no es así. Existen nuevos métodos y programas que nos facilitan la vida.

También sentaremos un poco las bases para entender la lógica de la programación, lo bueno de esto, que lo que aprendas aquí te valdrá para cualquier cosa, así que presta atención y no dejes escapar nada.

Unidad 9: Programación estructurada.

¿Qué vas aprender en este módulo? Bueno, este módulo pretende que conozcas la metodología de programación, es decir, ¿cómo se programa?. Existen unos elementos básicos que existen en cualquier lenguajes de programación, piensa lo siguiente:.

  • [IF-ELSE] o [SI-SINO]. En programación una estructura muy importante y usada es la condicional, si "ocurre tal cosa" hago esto. Si "ocurre tal otra" hago aquello. ¡Qué difícil es esto de programar!. Piensa lo siguiente, si voy a salir a la calle, tengo que coger la cartera, sino, no hago nada. Como ves, podré hacer más cosas, por ejemplo, podría añadir, si voy a salir a la calle, tengo que coger la cartera, ir vestido, coger las llaves...etc. Como ves, no es solo una cosa, puedo hacer muchas, cada cosa sería una sentencia. Pero ¿y sino? Pues también puedo hacer varias cosas, ya que no voy a salir a la calle, me voy a poner el pijama, voy a leer un libro, estudiar el curso de Aula Mentor...etc.

  • [FOR, WHILE, DO WHILE] o [POR n_veces, MIENTRAS (condición), HACER - MIENTRAS (condición)] Estas cosas a lo mejor te suenan mas a otro idioma, y bueno, en realidad lo es, si lo traduces del inglés lo verás sencillo. En programación una cosa que se suele hacer mucho es "las repiticiones", es decir, si voy a repetir mucho una cosa, y en esas repeticiones solo voy a variar una variable, pues ¿porqué no hacerlo de forma iterativa?. Como no, con un ejemplo seguro que lo entendemos mejor: imagina que tienes que hacer una mudanza del piso A aL piso B. Realmente hay muchos pasos que se repiten, y en programación, cuanto menos repitas código mejor que mejor. No por nada, sino porque estarás optimizando el programa. (De echo, los buenos algoritmos o programas son aquellos que son muy reutilizables). Bien, volviendo al ejemplo, si tengo que pasar 10 cajas de la casa A a la casa B y esto lo metemos en un programa (podrías ser un dron, coche ...etc); tendríamos que decirle paso a paso qué es lo que debe hacer. Recuerda que los programas solo hacen lo que les decimos.

    • Dirígete a la casa A
    • Coge caja número 1 y móntala en el coche
    • Dirígite a la casa B y suéltala
    • -------------------------
    • Dirígete a la casa A
    • Coge caja número 2 y móntala en el coche
    • Dirígite a la casa B y suéltala
    • -------------------------
    • Dirígete a la casa A
    • Coge caja número 3 y móntala en el coche
    • Dirígite a la casa B y suéltala
    • -------------------------
    • Dirígete a la casa A
    • Coge caja número 4 y móntala en el coche
    • Dirígite a la casa B y suéltala
    • -------------------------
    • Dirígete a la casa A
    • Coge caja número 5 y móntala en el coche
    • Dirígite a la casa B y suéltala
    • -------------------------
    • Dirígete a la casa A
    • Coge caja número 6 y móntala en el coche
    • Dirígite a la casa B y suéltala
    • -------------------------
    • Dirígete a la casa A
    • Coge caja número 7 y móntala en el coche
    • Dirígite a la casa B y suéltala
    • -------------------------
    • Dirígete a la casa A
    • Coge caja número 8 y móntala en el coche
    • Dirígite a la casa B y suéltala
    • -------------------------
    • Dirígete a la casa A
    • Coge caja número 9 y móntala en el coche
    • Dirígite a la casa B y suéltala
    • -------------------------
    • Dirígete a la casa A
    • Coge caja número 10 y móntala en el coche
    • Dirígite a la casa B y suéltala

    Si tuvieramos un dron al cual le podríamos meter órdenes, si le decimos todo lo anterior lo haría exáctamente, pero bueno, te estarás preguntado, ¿no podemos hacerlo de forma más sencilla? Es decir, si te fijas, en todos los pasos hacemos lo mismo, solo ha cambiado una cosa, el número de caja. Pues aquí es donde está la importancia de la programación usando sentencias iterativas, ya sea for, while o do-while. Todo lo anterior se podría haber escrito de la siguiente forma:

    for(int i=1; i<=10; i++){

    Dirígete a la casa A

    Coge caja número i y móntala en el coche

    Dirígite a la casa B y suéltala

    }

    Si te fijas, el for lo que hace es: desde la variable [i] con valor 1, mientras que la variable [i] sea <=10, súmale 1 a la variable (i++). ¿Y si lo quisiera al revés? Pues si lo quisieramos decreciente sería i--. ¡Pero ojo!, el inicio de la variable y el fin deben cambiar.

    Esto es en cualquier lenguaje de programación, existe también el while(condición) "hacer esto" y el "hacer esto" mientras se cumpla la condición. realmente es un juego de opciones para hacer iteraciones. En la primera tendríamos todo en la misma frase, en el while nosotros seríamos los encargados de ir aumentando el contador, es decir, tendríamos que hacer un i++; al final de cada iteración.

    i=1;

    while(i<=10){

    Dirígete a la casa A

    Coge caja número i y móntala en el coche

    Dirígite a la casa B y suéltala

    i++;

    }

    ¿Y cómo se haría la misma operación con un DO-WHILE?

    i=1;

    do{

    Dirígete a la casa A

    Coge caja número i y móntala en el coche

    Dirígite a la casa B y suéltala

    i++;

    }while(i<=10)

    Compara las tres opciones, la última tiene una particularidad, que hace el "do" al menos una vez, ya que la condición o pregunta se hace al final. Es decir, hacer mientras(condición) tiene esa ventaja/inconveniente. Ahora te pregunto: ¿Sería igual en los tres casos? ¿Hay que tener algo en cuenta en cada caso? ¿Cuántas veces entraría en la última opción con el do-while?

    ¿Existen más cosas? Por supuesto, existen muchas cosas para programar, switch, funciones...etc, pero vayamos poco a poco. Con esto ya tienes mucho ganado si lo controlas bien.

Unidad 10: Programación orientada objetos y eventos.

Con la programación orientada a objetos o POO, se crean estructuras digitales a partir de objetos de la realidad o necesidad. Los objetos pueden ser tanto físicos como tangibles, es decir, una persona, un animal, vehículos, pero también pueden ser conexiones a internet, protocolos, comunicación vía bluetooth…etc.

Para que se pueda decir que un lenguaje es orientado a objetos tiene que cumplir una serie de características de las que podemos destacar algunas como son: la herencia, encapsulamiento, gestión de eventos, atributos, creación de objetos…etc.

Existen muchos programas orientados a objetos, de los más usado serían Java, Python, C#, Visual Studio, Delphi…etc. A través de estos programas se han podido crear otros, y crear a su vez nuevos framework de desarrollo para que los desarrolladores realicen las tareas más arduas de forma más cómoda.

En el curso vamos a ver una programación orientada a objetos y eventos basada en Scratch inicialmente. No te tomes la siguiente unidad a "juego para niños" porque no lo es, es verdad que todo esto se ve en cursos de la ESO, ya que poco a poco lo que se quiere es ir acostumbrando a los alumnos a este tipo de estructuras, ellos juegan, y a la vez aprenden....o creén que están jugando cuando están aprendiendo, como lo quieras ver. Además, podrás hacer muchas cosas y acostumbrarte a este tipo de programación te será muy útil para las siguiente unidades, asi que ¡ánimo y a estudiar!

Unidad 11. Programación con Scratch.

En esta unidad vamos aprender muchas cosas sobre Scratch. No caigas en el error común de pensar que esto es "solo para niños" ya que se puede usar de muchas formas, si lo piensas, dale un lápiz en un bebé hará garabatos, pero si lo coge alguien mayor, los garabatos serán más definidos, incluso te puede hacer una obra de arte. Esta es la idea de Scratch, esta herramienta usado de la forma correcta tiene mucho potencial.

Otro punto fuerte de Scratch bajo mi punto de vista es que de una forma gráfica podemos ver resultados, yo he programado en C, C++, Java, html, jquery...etc y claro, siempre que se hablaba de "parte gráfica o visual" uno se echaba a temblar y si lo piensas, aquí podemos mover objetos, cambiar escenarios, hacer cómic, historietas, resolver algoritmos...etc de una forma fácil.

Unidad 12. Scratch para Arduino.

Ya hemos aprendido un lenguaje de programación de alto nivel, es decir, más cercano al usuario y encima gráfico. También hemos comprobado en las primeras unidades cómo se puede programar Arduino de forma nativa, usando las herramientas y programando en C++.

Ahora, vamos aprender a programar nuestro Arduino usando el mismo método de la unidad anterior. En este caso, las entradas y salidas estarán referidas a Arduino, para poder sacarle todo el provecho a esta unidad tendríamos que tener un Arduino físico para comprobar por nosotros mismos que es fácil de programar. En caso contrario, como ya has usado el emulador de Tinkercad y Scratch en tu PC, imagina tenerlo todo junto, eso es precisamente lo que hace S4A.

Unidad 13. Programación con Processing.

Processing es un software de programación y entorno de desarrollo integrado de código abierto basado en Java, de fácil utilización, y que sirve como medio para la enseñanza y producción de proyectos multimedia e interactivos de diseño digital. Fue iniciado por Ben Fry y Casey Reas a partir de reflexiones en el Aesthetics and Computation Group del MIT Media Lab dirigido por John Maeda.

¿Qué me aporta processing? pues tiene un montón de ejemplos resueltos para empezar y adentrarte en la programación clásica de Java y aprender a "darle vida" a los parámetros que tu creas conveniente. Además se pueden hacer juegos, de hecho la actividad M2_3 consiste en que realices un juego.

Pero ojo, no creas que esto está orientado solo para hacer "jueguecitos", que además de poder hacerlos, puedes usar esto como un SCADA (Supervisión, Control y Adquisición de Datos), y si no se te ocurre ningún ejemplo, aquí va uno. En la industria, se suelen usar unos elementos que son los PLC, y para ver cómo va el proceso en cuestión se representa con unos esquemas y símbolos en la pantalla. Tanto los PLC´s como los SCADA son sistemas muy caros. Ahora, si somos capaces de crear un sistema sencillo con Arduino, le agregamos varios sensores, hacemos unos "dibujos" en Processing y vamos interactuando con los elementos y la pantalla, tendremos un SCADA y sistema "barato" y libre de pagar licencias.

Ayuda para las actividades del curso: módulo 2

En esa ocasión tenemos que aprender dos cosas básicas: ¿cómo puedo resolver un problema? ¿cómo puedo representar gráficamente la solución a un problema?

Tenemos que empezar por investigar un poco en cómo funciona un algoritmo, al final es la secuencia de pasos a seguir para resolver un problema y tomar la decisión correcta en cada caso.

¿Porqué no se da el algoritmo directamente para que se implemente?.

He realizado muchos cursos en los que al final el usuario copiaba y pegaba los ejercicios y cuando salía por la puerta si se le propone que lo reproduzca por su cuenta, no lo sabe porque solo ha realizado el "copy+paste". Este ejercicio es una excusa de que investigues cómo se pueden resolver las cosas, y en caso de necesitar ayuda, siempre puedes ponerte en contacto con tu tutor, pero al menos, intenta pensar cómo lo harías.

¿Puedo usar cualquier lenguaje o programa para hacer el ejercicio?.

Si, por supuesto, puedes usar html, javascript, Scratch, java, C++...etc. El lenguaje que te resulte cómodo, lo que me tienes que demostrar es que has creado un flujograma (ya sea en papel escrito o cualquier programa para ello) y has sabido resolver el problema inicial.

En la actividad se habla de una actividad de ejemplo, descárgatela de aquí. y seguro que te viene bien como inicio.

Los pasos para resolver esta actividad serán los siguientes:

  • Pon Scrath en tu idioma
  • Abre un archivo nuevo
  • Añade dos personajes
  • Añade un fondo apropiado
  • Pulsa sobre un objeto y mira sus posibilidades, ¿qué hay en movimientos? ¿y en apariencia? ¿y en eventos?..sigue así con todos hasta que veas qué opciones tenemos.
  • A cada elemento se le puede asignar un evento, es decir, que cuando pulse la tecla "X" o la que quiera, "haga algo". Bien, cada personaje tiene una forma de recoger eventos, revisa que puedes "hacer algo" al pulsar la tecla que desees.
  • Tendrás que ir recogiendo cada evento para cada tecla. No olvides que debes elegir los eventos para un objeto, y luego pinchar en el otro y seguir agregando los eventos del resto de teclas
  • ¿Pero qué hago al pulsar una tecla? Bueno, lo más sencillo es "Avanzar X pasos" dependiendo de la velocidad. También hay otro efecto que es "apuntar en dirección" y el objeto apuntará en esa dirección, también puedes girar, mostrar, ocultar...etc.
  • ¿Y que pasa cuando cambio de dirección? El objeto se pone en otra dirección queda raro. Esto es porque, deberías añadir varios "disfraces". Ve al objeto, duplicar los disfraces y en cada disfraz duplicado pon la forma que creas conveniente. En la parte superior hay unos botones de ayuda para voltear/reflejar verticalmente u horizontalmente

Lo primero que tenemos que hacer aquí es ir al ejemplo de processing que se llama "Bounce". Archivo --> Ejemplos --> Topics --> Bounce. Esta ejemplo es la base de lo que queremos hacer

primero tenemos que entender este ejemplo, ¿cómo funciona el código creado por otra persona?. Si no lo entendemos, será casi imposible modificar y crear cosas nuevas. Yo cogería papel y lápiz para ir anotando y ayudándome en la interpretación del código. Presta atención a lo siguiente:

  • ¿Dónde se crea la pelota o bola?
  • ¿Cómo puedo controlar la velocidad de la pelota?
  • ¿Cómo controlo el tamaño de la pelota y la pantalla? El valor de la pantalla size se tiene que poner en valor numérico, no le asignes variables ya que es una cosas especial de Processing
  • ¿Cómo controla la aplicación que ha llegado a un borde?
  • Una vez entendido todo esto, pregúntate: ¿cómo podemos crear un rectángulo? Revisa el ejemplo del curso. ¿Cómo podemos controlar que el usuario a pulsado una tecla? Si cada vez que pulse sobre una tecla me desplazo en un sentido, ¿cómo controlo que a llegado al final?

La mayoría de los problemas de la actividad es por no entender los pasos anteriores y descuidar que Fill() lo usemos justo antes de pintar/refrescar el elemento. ¿Sigues con dudas? Vayamos por parte viendo cómo resolver esta actividad.

¿Qué variables tengo en el programa?

Tengo que crear una pantalla, una bola o pelota y una pantalla

¿Cómo creo el rectángulo?

Primero tenemos que entender que un rectángulo tiene un alto y un ancho. Pero cuando lo queremos ubicar en un sitio necesitamos saber donde. Por tanto además de los parámetros ancho y alto, necesitaremos las coordenadas x e y para saber donde lo ponemos. Para ello, lo ideal es crearnos unas variables al inicio y luego crearlo.

Rectángulo: necesitamos alto, ancho, posicionX, posiciónY.

Pelota/bola: necesitamos el radio, posicionX y posiciónY, en verdad lo que hace es pintar una elipse, lo único que no está deformada, por eso el valor para crearlo es: ellipse(xpos, ypos, rad, rad); Fíjate que radio (rad) está igual, si quieres como primera toma de contacto, cambia del ejemplo lo siguiente:

ellipse(xpos, ypos, rad*2, rad); y si ponemos ellipse(xpos, ypos, rad, rad*2);

Bien, como habrás podido comprobar, con esto ponemos deformamos la pelota en el eje de la X(vertical) o en el eje de la Y(horizontal).Ahora vamos a comprobar que queremos una pantalla de 600x400 pixeles:

void setup(){
  size (600, 400);
  ellipseMode(RADIUS);
}

Ahora vamos a crear el rectángulo, vamos hacer una prueba, imagina que queremos un rectángulo de alto 50px y de largo 150px. Recuerda que las variables las solemos declarar arriba, añade este código en la parte superior:

	int anchoRect= 150;
	int altoRect= 10;

¿En qué posición lo ponemos?. Pues por ahora vamos a suponer que está en la mitad de la pantalla, es decir, la mitad del eje X y la mitad del eje Y. Esto sería 300, 200 ya que habíamos puesto size(600,400). ¿dónde "pintamos" el rectángulo? Por lo que deberíamos escribir el código dentro de la función "draw". Si tienes duda, busca donde en el ejemplo pinta la elipse (o pelota en este caso) y ponlo justo antes.

Pruébalo y ahora vamos hacer una prueba más. Escribe esto rectMode (CENTER);. ¿Qué ha pasado, se ha centrado justo en la pantalla, es decir el punto de referencia ahora es el centro del rectángulo.

	rect(300, 200, anchoRect, altoRect);  
	//Como si pusiéramos rect(300, 200, 150, 10); pero usando variables.
	//¿y si agrego dos variables más para las ubicaciones?,
	//Por ejemplo que se llame posXRect y posYRect para la posición del rectángulo. 
	//quedando así rect(posXRect, posYRect, anchoRect, altoRect);

Bien, sabiendo esto, si todo ha ido bien tendremos la pelota botando por la pantalla y el rectángulo justo en el centro. ¿es eso lo que queremos? No, por supuesto, ahora lo que tenemos que ubicar el rectángulo en la parte inferior, ¿cómo sabemos las coordenadas? La X estaría bien, ya que está centrada horizontalmente, pero tendríamos que modificar la coordenada Y, es decir, la vertical. pero ojo, tenemos que ponerlo abajo, pero tenemos que restarle el ancho de la variable. Podríamos poner las variables en la siguiente posición

	int anchoRect= 150;
	int altoRect= 10;
	int posXRect = 300;
	int posYRect = 400-altoRect;

Bien, si ejecutas esto, verás que el rectángulo ha empezado o puesto su esquina superior en las coordenadas que hemos dicho. Pero hay como una especie de "claro" en la parte inferior, te preguntarás ¿porqué no está al fondo del todo si hemos dicho que era el alto de la pantalla menos el alto del rectángulo...

Recuerda que hemos puesto en el modo de rectángulo CENTER, y claro, eso hace que lo ponga en el centro tanto vertical como horizontal, si ahora coges y borras o comentas eso con "//" verás que si se va al fondo.

¿Cómo controlo que el usuario a pulsado una tecla?

Bien, para esto tenemos que crearnos una función (ve al final del código y ponlo justo al final) para detectar que se ha presionado la tecla, y ver si ha pulsado la fecha hacia la derecha o izquierda. Dependiendo de lo que pulse, lo que tendremos que hacer sería mover el rectángulo hacia la derecha (recuerda que teníamos una variable para la posición X del rectángulo) y mover hacia la izquierda.

	void keyPressed() {
		if (key == CODED) {
	   		if (keyCode == LEFT) {
	   			posXRect -= 5;
	   		} else if (keyCode == RIGHT) {
	      		posXRect += 5;
	   		}  
		} 
	}

Recuerda que para que funcione, debes hacer click en la pantalla que ha creado processing para que pueda capturar el evento del teclado, en caso contrario el evento lo coge el sistema operativo. Con esto ya tenemos la pelota botando, y el rectángulo. Además sabemos que el rectángulo se mueve a la derecha o izquierda. ¿Cómo controlo la velocidad del movimiento del rectángulo? Pues fíjate que pone: Si pulso el "keyCode" LEFT, posXRect-=5. Esto significa que la posición ahora donde tiene que pintar el rectángulo es 5 píxeles menos que antes. ¿Y si queremos darle velocidad? Pues solo tendríamos que avanzar en vez de 5px, avanzar 10px.

¿Y sí queremos cambiar el color a la pelota o al rectángulo?

Podemos usar la función fill(). Pero no debemos olvidar que tenemos que poner un fill por cada objeto. Si solo ponemos un fill() solo existirá un color. Prueba el siguiente código ahora

 	fill(0,255,0); //RGB- Ponemos Green al máximo 255
  	rect(posXRect, posYRect, anchoRect, altoRect);
  
  	fill(0,0,255); //RGB- Ponemos Blue al máximo 255
  	ellipse(xpos, ypos, rad, rad);

¿Qué nos quedaría por hacer?

Realmente ya tenemos casi todo lo que se pide en la actividad, solo nos falta: controlar qué hace cada elemento en cada iteración. Es decir, coge papel cuadriculado y bolígrafo y busca los estremos, es decir, ¿cómo rebota la pelota? ¿y si rebota en la parte inferior si coincide con el rectángulo y en caso contrario cuando toque sin dar en la paleta o rectángulo cambie el color de la pelota a rojo, o que pare el juego?

Si has realizado los pasos correctamente tendrías que tener una imagen parecida a esta:

Ayuda actividad M2_3

Es posible que algún paso se nos haya pasado, es muy importante entender la actividad, ya que sino nos va a resultar difícil hacer cosas con processing. Te puedes descargar el ejemplo que se ha hablado en esta ayuda y por supuesto, debes retomar esta actividad y ver qué paso se nos ha pasado. Recuerda lo importante es aprender.

Descarga la ayuda que hemos visto para esta actividad aquí.

Esta web utiliza cookies, puedes ver nuestra la política de cookies, aquí Si continuas navegando estás aceptándola. Pulsa para quitar este mensaje
Política de cookies +