Cómo hacer una App para dibujar con distintas formas y colores

Este taller muestra cómo construir una app que dibuja diferentes formas (líneas, círculos y puntos) en diferentes colores, mientras el usuario desliza su dedo por la pantalla del dispositivo móvil. Además, la app permitirá compartir los dibujos realizados a través de WhatsApp, así como eliminar la pantalla simplemente agitando el móvil.

Para desarrollar la aplicación utilizaremos App Inventor, una herramienta que permite crear aplicaciones para Android de una forma visual y sencilla.  Más concretamente, App Inventor permite la programación en bloques, que es un tipo de programación en la cual no necesitamos conocer un lenguaje de programación, ya que ésta se realiza uniendo bloques gráficos que irán conformando la funcionalidad de la aplicación. Todo ello lo haremos accediendo, desde un navegador, a la página http://appinventor.mit.edu/.

Comenzaremos con los pasos a seguir para incluir en nuestra app una funcionalidad básica y, finalmente, mostraremos diversas propuestas de mejora para aquellos alumnos que las deseen implementar.

El material de apoyo de este taller incluye, además de este guion, una carpeta con iconos que podrás utilizar en la Tarea 11. Además, transcurrido el tiempo destinado a la realización de este taller, se publicará el proyecto App Inventor (archivo con extensión .aia) que se obtendría tras seguir los pasos indicados en esta guía (las instrucciones para importar dicho archivo desde tu cuenta de App Inventor se encuentran en la Tarea 15 al final de este documento). En dicho proyecto podrás ver las soluciones de cada una de las tareas que se plantean en este guion

Requisitos iniciales

• Para utilizar App Inventor necesitaremos registrarnos previamente en la página http://appinventor.mit.edu/, utilizando para ello una cuenta de Gmail. Si no disponemos de una, lo primero que tendremos que hacer será crearla.
• Disponemos de tres formas para ver la app mientras que la vamos construyendo. Este paso es muy recomendable y útil, porque nos permitirá ir comprobando cómo va quedando nuestra aplicación a medida que la vamos desarrollando. El taller está planteado de forma que no probaremos la aplicación hasta que no lleguemos a desarrollar la funcionalidad básica (hasta completar la Tarea 5). No obstante, si deseas probar la app antes, te sugerimos que le eches un vistazo a la Tarea 6, en la cual se explica cómo probar la app utilizando cada una de las alternativas posibles.

Acceso a app y configuraciones iniciales

1. Para crear apps con App Inventor tendrás que ir a http://appinventor.mit.edu/ usando un navegador de internet (Chrome o Firefox, si usas Windows, y Safari, si usas MAC). Posteriormente, haz clic en el enlace “Create Apps” que encontrarás en la parte superior izquierda. A continuación, tendrás que introducir tu cuenta de Gmail. Cuando hayas entrado con tu cuenta, llegarás a la siguiente pantalla:

2. Como podrás observar, la interfaz aparece en inglés. Si deseas cambiar el idioma de la interfaz a español, en la barra de menús superior derecha pulsa en English para desplegar el combo y elegir el idioma Español.

3. Al principio, nos situaremos en la página de Mis Proyectos desde la que podrás gestionar los proyectos de tus aplicaciones (en particular, el proyecto de la aplicación que vamos a desarrollar con este taller).

Pasos a realizar para completar la funcionalidad básica de nuestra app: descargar

• Tarea 1. Crear un proyecto nuevo.
• Tarea 2. Añadir un lienzo
• Tarea 3. Ajustar la anchura y altura del lienzo al tamaño del contenedor
• Tarea 4. Añadir un desplegable que nos permita elegir la forma (círculo, recta o punto) que queremos que se dibuje cuando arrastremos el dedo sobre la pantalla.
• Tarea 5. Programar qué debe hacer la aplicación cuando se deslice el dedo sobre la pantalla.
• Tarea 6. Probar la aplicación
• Tarea 7. Borrar el lienzo cuando agitemos el móvil.
• Tarea 8. Instalar la app definitivamente en el dispositivo móvil

Materiales

• Guión completo del taller: descargar.
• Iconos.zip: descargar.

Objetivos

1. 1. Fomentar la vocación por la ingeniería informática, y en concreto por la programación de ordenadores, entre los estudiantes de educación secundaria y bachillerato.
   2. Aumentar el interés entre las chicas por el estudio de carreras STEM, en particular por la Ingeniería Informática.