En Basic256, tenemos a posibilidad de cargar Imágenes en Mapas de Bits, o sea fotografías, o incluso dibujos que hayamos hecho en PAINT para expandir la capacidades expresivas de las aplicaciones que haremos en el futuro. Pero para nuestras prácticas usamos la aplicación auxiliar PISKEL, un programa de dibujo que tiene la bondad de funcionar online, desde el mismo navegador web, o bien descargar la aplicacion nativa para que corra cuando no tenemos internet en lasiguiente página web. Enseñar BASIC256 y PISKEL en una sola clase puede parecer mucho, pero cuento con una ventaja estratégica: Muchos de mis alumnos tienen hermanos, primos o incluso vecinos en primero, segundo y tercer grado (niños de 6,7 y 8 años). Por lo tanto, durante la semana, les he enseñado a los más chicos a usar PISKEL para generar colores y hasta pequeñas animaciones GIF. Por ello, cuando llegaron los alumnos de cuarto, quinto y sexto a clase, no sólo conocían la aplicación sino que muchos de ellos ya lo habían probado online y eso hizo que la clase se desarrollara de forma menos técnica. A continuación, les haré una reseña de que vimos con los más chicos, y luego con los grandes para generar nuestros recursos en PISKEL.
DIBUJAR EN PISKEL
La explicación sobre PISKEL será sencilla como la hice para los más chiquitos (estaban ansiosos por dibujar asi que debia ser breve). Tenemos muchas herramientas en la barra de la izquierda pero para ésta clase usaremos sólo:
El PINCEL (que puede hacerse más grande o pequeño desde los botones que están arriba de la barra).
El pincel espejado es el favorito de los más chicos, ya que pueden crear rostros (y laberintos según ellos) de forma fácil, como dibujar con ambas manos al mismo tiempo.
LA GOMA en PISKEL realmente elimina la información de color dejando el fondo transparente.
Color: Tal y como ocurre en aplicaciones profesionales como Adobe Photoshop, Indesign, Illustrator, After Effects al clickearlo abre el selector de color. Por defecto el selector está en NEGRO.
El selector de color posee 3 áreas, la de la izquierda tiene los últimos colores creados. En el área intermedia, podemos mover un círculo blanco para indicar cuan fuerte será el color (cuan SATURADO) si lo movemos a la esquina superior derecha obtendremos el color más puro. Si lo bajamos un poco como se ve en la imagen vamos oscureciéndolo. Pero si lo movemos hacia la esquina superior izquierda se írá aclarando. TODOS preguntaron como hacer marrón, por ello debemos ir a la barra de la derecha, y cambiar EL TONO de color en los naranjas y luego oscurecerlo (bajando el circulo) hasta obtener el color deseado. Para EXPORTAR, debemos ir al cuarto botón que está en la barra de la derecha,ésto desliza un panel en el cual debemos usar la opción DOWNLOAD PNG, y éso abrirá un diálogo (por defecto va a la carpeta descargas).
DE VUELTA AL BASIC256
Abrimos basic 256, escribimos CLG y clickeamos en el botón guardar, navegamos hasta LA MISMA CARPETA donde exportamos nuestro archivo PNG (el dibujo), y guardamos este programa. En mi caso lo llamé: "programa del soldado", el basic256 agregara la extensión .KBS para el archivo.
IMGLOAD
IMGLOAD como su nombre lo indica (en ingles es abreviatura de ImageLoad), es para cargar imágenes y en clase lo comparo con CIRCLE que tiene 2 valores para posición (x, y) y uno de tamaño (radio). En el caso de IMGLOAD, tenemos dos numeros de posicion (horizontal, vertical) como en el caso del círculo, y luego un valor de tamaño (un numero). Siempre les digo a los chicos que "HAGAN UN POCO DE MAGIA NEGRA CON LOS NUMEROS", la INTUICION y el JUGAR con valores sin dudas enseña mas de lo que yo pueda decir, y finalmente entre comillas el nombre del archivo (no es necesario indicar la extensión .png) Cuando ven su propio dibujo en la pantalla al ejecutar el programa, es normal que empiecen a gritar de emocion (es el WOW-moment). CLG CIRCLE 10, 10, 40 IMGLOAD 100, 100 , 4 , "Granadero"
Fin de la Clase (?)
Con esto termina la clase de la semana... Pero puedo adelantarles que si toman el codigo de la clase 5 y reemplazan el codigo del fantasma, con el IMGLOAD, obtenemos control de movimiento de esta imagen. Habra mas de esto en las proximas clases, pero si desean bajarse mi granadero lo pueden hacer en este linkmas abajo todo el codigo para moverlo (recuerden que el archivo de basic .KBS debe estar en la misma carpeta que el archivo del granadero .PNG).
#Codigo Completo para Copiar y Pegar
CLG fastgraphics ancho = 40 izq = 20 arriba = 60 WHILE TRUE a = key print a if (a = 16777235) then arriba = arriba - 4 endif if (a = 16777236) then izq = izq + 4 endif if (a = 16777237) then arriba = arriba + 4 endif if (a = 16777234) then izq = izq - 4 endif IMGLOAD izq, arriba, 3, "granadero" refresh pause 0.1 CLG ENDWHILE