El documento presenta un tutorial sobre programación con Snap, centrado en la creación de gráficos mediante la instrucción de dibujar cuadrados. Se enfatiza la importancia de la creatividad y la práctica, destacando que existen múltiples soluciones para una misma tarea. Al final, se invita a los participantes a desarrollar un proyecto personal y compartirlo con sus compañeros.

1. 2
Aprendo a programar con Snap:
Mi primer proyecto
Programamos Videojuegos y Apps
Flor Palomares, Patricia
Huertas Fernández, José Ignacio
Moreno León, Jesús
Moriana Coronel, María
Septiembre 2012
CICLOS FORMATIVOS
http://programamos.es
@programamos

2. Licencia
©Programamos, Septiembre de 2013
Algunos derechos reservados.
Este artículo se distribuye bajo la licencia“ReconocimientoCompartirIgual 3.0 España" de CreativeCommons, disponible en
http://creativecommons.org/licenses/by-sa/3.0/es/deed.es
Este documento (o uno muy similar)
está disponible en (o enlazado desde)
http://programamos.es

3. Una tarea, muchas soluciones
●
Entra en:
http://snap.berkeley.edu/snapsource/snap.html
●
●
●
Utilizando las distintas fichas, intenta dibujar un
cuadrado.
PISTA: para pintar tienes que usar la ficha verde
“bajar lápiz” y mover el objeto.
Compara tu
compañero/a
resultado
con
el
de
otro/a

4. Una tarea, muchas soluciones
●
●
Habrás comprobado que no existe una única
forma de hacer una misma tarea. Si esto pasa al
dibujar un simple cuadrado imagina cuando se
hace una aplicación completa...
De las tres soluciones siguientes, ¿cuál crees que
es la mejor?

5. Una tarea, muchas soluciones
●
●
●
¡CORRECTO!
Para los/as que eligieron la
primera... ¿qué pasa si ahora
quiero cambiar el tamaño del
cuadrado?¿cuántos
valores
tengo que modificar?
Siempre intentaremos seguir:
●
●
Cuantas menos
código mejor.
líneas
de
Si algo se repite, agruparlo
en una estructura de control
(fichas amarillas)

6. Una tarea, muchas soluciones
●
Modifica el programa anterior para que se
dibujen dos cuadrados con un aspecto similar al
siguiente:

7. Una tarea, muchas soluciones
●
Posible solución:
●
●
●
●
(1) Antes de empezar a dibujar
fijamos el color del lápiz a negro,
subimos el lápiz (por si acaso nos lo
habíamos dejado bajado), borramos
todo y nos situamos en el centro de
la pantalla. Bajamos el lápiz para
empezar a pintar.
(2) Metemos el bloque que pinta el
cuadrado.
(3) Antes de pintar el segundo
cuadrado tendremos que desplazar el
cursor a la posición (50,50), sin
pintar...
(4) Y pintamos el segundo cuadrado

8. Comprobación “a mano”
●
●
Ya ves cómo nuestro programa se va complicando
poco a poco...
Para comprobar que funciona
vamos a ejecutarlo “a mano”:
●
●
●
correctamente
Toma papel y boli.
Divide en el papel un eje de coordenadas y pinta
los puntos -100, -50, 0, 50, 100 en ambos ejes.
Sigue la ejecución del programa minuciosamente y
comprueba si el resultado que has dibujado al
terminar coincide con lo que querías conseguir.

9. Otro cuadrado más...
●
●
●
Aunque la solución anterior es correcta, ¿qué
pasaría si ahora quiero dibujar tres cuadrados, de
forma que el tercer cuadrado comience en el centro
del segundo?.
NOTA: Pinta los cuadrados un poco más pequeños
para que quepan en la pantalla.
¿y si quiero diez?

10. Otro cuadrado más...
●
●
Podemos poner bloques “repetir”
dentro de otros “repetir”, así
conseguimos
pintar
todos
los
cuadrados que queramos de forma
sencilla...
Mira la solución propuesta, ¿habías
conseguido algo parecido?

11. Conclusión
●
●
A los/as que habéis llegado hasta
aquí... ENHORABUENA!! Ya estáis
programando!!
Si no has sido capaz de llegar a
alguna solución, no te preocupes.
Esto se aprende practicando. Ahora
que ya has visto cómo se hace,
¿serías capaz de repetirlo sin mirar?
SEGURO QUE SÍ

12. Dibujo libre
●
●
●
Llegó la hora de dar rienda suelta a tu
imaginación.
Haz un programa que dibuje algo y muestra el
resultado a tus compañeros/as.
Entre todos/as votar los diseños para quedaros
con el más:
●
Original
●
Llamativo
●
Gracioso