4. Programamos nuestras primeras aplicaciones con MIT App Inventor
- 4.0 Introducción
- 4.1. Preguntas y Respuestas
- 4.2. Lector de códigos QR
- 4.3. Traductor
- 4.4. Localización con GPS
4.0 Introducción
En este bloque se pretende desarrollar todo lo aprendido en los bloques anteriores y poner en práctica todos nuestros conocimientos sobre MIT App Inventor. Hasta ahora nos hemos familiarizado con el entorno de MIT App Inventor, hemos podido empezar a comprender la lógica de bloques que existe en la programación con esta aplicación y hemos programado pequeñas aplicaciones con funcionalidades básicas. Este trabajo es necesario para comprender cómo funciona MIT APP Inventor.
En los siguientes apartados de este bloque profundizaremos en el uso de diferentes características de MIT App Inventor a través de la programación de aplicaciones un poco más complejas y que nos permitirán:
- Aprender el manejo de funcionalidades básicas.
- Aprender a trabajar con el entorno de bloques y dar vida a nuestras aplicaciones.
- Reflexionar sobre las posibilidades que estos pequeños programas pueden tener a la hora de programar nuestra aplicación.
- Sentar las bases para poder desarrollar aplicaciones sencillas de forma autónoma, así como impulsar el aprendizaje autónomo en la programación de aplicaciones con MIT App Inventor.
No obstante, es necesario poner de relieve que este curso no pretende que quien curse esta formación domine todos los aspectos de programación que se pueden desplegar con MIT App Inventor, sino introducir al usuario en aspectos esenciales en su manejo y funcionamiento o, dicho de otro modo, dotar al alumnado de una competencia suficiente como para desarrollar o empezar a desarrollar sus proyectos ApS mediante el desarrollo de una aplicación. Una formación que habilite a cualquier usuario a dominar la creación de aplicaciones con MIT App Inventor conllevaría muchas más horas de formación y superaría con creces los objetivos de esta formación inicial.
Imagen 4.0.1. Bing (2023). Image Creator with Dalll-E 3 (january 3 version) [Large language model]. https://www.bing.com/images
Aún así, para aquellas personas que deseen profundizar más sobre la programación de Apps con MIT App Inventor, compartimos algunos recursos de utilidad:
- Canal de youtube de Mit App Inventor.
- Mit App Inventor. Tutorials (Inglés)
- Hour of Code with MIT App Inventor (Inglés)
- Books
- Canal de Youtube. Curso de MIT App Inventor (Castellano)
- Canal de Youtube. Curso de App Inventor 2. (Castellano)
4.1. Preguntas y Respuestas
El desarrollo de una App como producto de un proyecto de Aprendizaje-Servicio puede utilizar la gamificación como estrategia de aprendizaje. Pensemos, por ejemplo, en aplicaciones que amplíen el conocimiento en algún ámbito de actuación o que, simplemente, den a conocer conceptos o definiciones concretas. En estos casos, la aplicación móvil se convierte en un excelente producto final enmarcado en un proyecto de ApS y el abanico de posibilidades es enorme.
Por ejemplo, una aplicación de preguntas y respuestas puede contribuir a dar a conocer las señales de tráfico para mejorar la educación vial de los niños y niñas y adolescentes. Otros ejemplos, por citar algunos más, pueden ser una App de preguntas y respuestas sobre la lengua de signos o el lenguaje braille que permitan acercar estos lenguajes a cualquier persona interesada.
En definitiva, una App de preguntas y respuestas es un claro ejemplo de un producto final compatible con un proyecto de ApS donde las preguntas y respuestas pueden alcanzar varios objetivos: difusión de una problemática, dar a conocer una realidad, mejorar los conocimientos o ejercitar la memoria del usuario, entre otros.
En el video que se muestra a continuación se explica, mediante un ejemplo sencillo, cómo desarrollar una app de preguntas y respuestas de forma sencilla. Para desarrollar este tipo de aplicaciones conviene resaltar la importancia de los componentes situados dentro de la categoría “Disposición” de la columna “Paleta de componentes” que permiten la distribución en la pantalla de los diferentes elementos alineados o centrados según interese. Además, es importante almacenar las puntuaciones obtenidas y para ello MIT App Inventor dispone del componente no visible llamado “TinyBD”, una pequeña base de datos gratuita que podemos encontrar en la categoría “Almacenamiento”. Todo ello se aborda en el siguiente vídeotutorial:
Vídeo 4.1.1. Programamos. (2019, 1 mayo). AppInventor 4: App de Preguntas y Respuestas [Vídeo]. YouTube. Recuperado 1 de noviembre de 2023, de https://youtu.be/VZSeDw79v70?si=afIoPH9MnvcpGv7T
4.2. Lector de códigos QR
Muchos proyectos de ApS buscan como objetivo la difusión de un tema concreto, ya sea promover una acción solidaria o visibilizar una situación particular del entorno más cercano, entre otros. Para este fin, se suelen emplear, por lo general, herramientas de publicación y difusión de contenidos muy variados, que van desde un simple cartel publicitario pasando por una publicación en una web propia o la difusión de contenidos en formatos de presentación llamativos y sorprendentes como pueden ser los creados por herramientas como Canva, Emaze, Prezzi, PowTown o Genially.
Pues bien, además de acceder a dicha información a través de un ordenador, se puede tener acceso a estos recursos o contenidos desde un dispositivo móvil con ayuda de un lector de códigos QR. Eso sí, el recurso o contenido debe de estar alojado o publicado en la plataforma correspondiente.
En el vídeo que se muestra a continuación, podemos realizar una pequeña aplicación que nos permitirá leer un código QR que nos llevará a la información almacenada y publicada en la dirección web a la que nos dirija. Para ello, se utilizarán tres elementos incluidos en la categoría de “Interfaz de usuario”, otro incluido en “Disposición” y finalmente un elemento más de la categoría “Sensores”:
- Etiqueta (categoría Interfaz de usuario). Componente visible
- Botón (categoría Interfaz de usuario). Componente visible
- VisorWeb (categoría Interfaz de usuario). Componente visible
- DisposiciónVertical (categoría Disposición). Componente visible
- LectorCódigoDeBarra (categoría Sensores). Componente No visible
Si lo deseas, una vez que acabes puedes poner en práctica tu app de lectura de código QR escaneando el siguiente código:
Actualmente hay muchas herramientas para generar Códigos QR, como qrmonkey, Qr Code Generator o Me Qr, aunque en los últimos meses están apareciendo opciones generadas por Inteligencia artificial para crear códigos QR más atractivos y artísticos, como el presentado sobre estas líneas, creado con QuickQr.Art.
Para desarrollar una aplicación que lea códigos Qr como el que se encuentra sobre estas líneas, sigue las indicaciones del siguiente videotutorial:
Video 4.2.1. Programamos. (2019, 1 mayo). Crea una aplicación para móviles con App Inventor: Lector de Códigos QR [Vídeo]. YouTube. Recuperado 1 de noviembre de 2023, de https://youtu.be/YJjIXfcYCRU?si=nso16NdmRH5xqQzw
4.3. Traductor
¿Sabías que puedes crear tu propio traductor con MIT App Inventor? Dentro de la "Paleta de componentes" nos encontramos con una categoría muy interesante para llevar a cabo proyectos de ApS llamada “Medios”. Dentro de esta categoría podemos encontrar herramientas muy útiles de carácter multimedia que pueden ayudar a los usuarios de nuestras aplicaciones en diferentes situaciones.
Imagen 4.3.1. CATEDU. (2023, diciembre 4). Uso de la Paleta y sus opciones. Captura de pantalla. (CC BY-NC)
Por ejemplo, nos encontramos con componentes como "Grabador", "Cámara" o "GrabadoraDeSonidos" pueden ser elementos de una aplicación que tiene como objetivo ayudar a personas que tienen dificultades de memoria. También disponemos del componente "TextoAVoz" con el que podemos hacer aplicaciones que faciliten la comunicación de personas con dificultades de vocalización o, por el contrario, el componente "ReconocimientoDeVoz" sería muy útil para aquellas aplicaciones que estén destinadas a ayudar a personas con problemas de audición. Con todas estas herramientas es fácil pensar en proyectos de ApS cuya finalidad sea la integración social de personas gracias a las aplicaciones móviles.
En el siguiente video, se explica un ejemplo a partir del cual podemos aprender a desarrollar una aplicación, con ayuda del componente no visible llamado "TraductorYandex", para facilitar traducción de textos al inglés o francés. Obviamente, la elección de otros idiomas queda a criterio del programador o programadora. Por ejemplo, integrar otros idiomas menos conocidos facilitaría la integración del usuario en un entorno de idioma desconocido. A modo de ejemplo, pensemos en un estudiante extranjero de intercambio cuyo idioma no sea muy conocido. La App le permitiría una integración más rápida en su nuevo entorno educativo y social.
Vídeo 4.3.1. Programamos. (2019, 1 mayo). Crea una aplicación para móviles con App Inventor: Traductor [Vídeo]. YouTube. Recuperado 1 de noviembre de 2023, de https://youtu.be/DtIgSsvh2V0?si=bISi3l4lyQfCqSsC
4.4. Localización con GPS
De todos los sensores que ofrece un dispositivo móvil, el GPS es sin duda uno de los más utilizados. Sus aplicaciones para proyectos de ApS son muy amplias para la creación de aplicaciones que incorporen rutas, mapas, geolocalización, seguridad, etcétera..
La programación de esta app se divide en cuatro videos didácticos que nos permitirán conocer el manejo básico de este componente no visible llamado “SensorDeUbicación”, perteneciente a la categoría de "Sensores" y su interacción con otras aplicaciones como Google Maps gracias al componente “VisorWeb”, de la categoría "Interfaz de usuario"
Vídeo 4.4.1. Programamos. (2019, 1 mayo). Creación de una app que use el GPS con App inventor (parte 1) [Vídeo]. YouTube. Recuperado 1 de noviembre de 2023, de https://youtu.be/93zyCj5rfJc?si=8yVM985TBhBN11qc
Imagen 4.4.1. CATEDU. (2023b, diciembre 4). Bloque SensorDeUbicación para GPS. Captura de pantalla. (CC BY-NC)
Vídeo 4.4.2. Programamos. (2019, 1 mayo). Creación de una app que use el GPS con App inventor (parte 2) [Vídeo]. YouTube. Recuperado 1 de noviembre de 2023, de https://youtu.be/OZ_c75Vku1c?si=AJYpHq1VvDl1s94A
Posteriormente, sustituiremos el componente “VisorWeb” por otros dos componentes “Map” y “Maker” de la categoría Maps para mejorar aún más nuestra aplicación y visualizar un marcador sobre un mapa con la latitud y longitud correspondientes.
Imagen 4.4.2. CATEDU. (2023b, diciembre 4). Uso del bloque SensorDeUbicación para GPS. Captura de pantalla. (CC BY-NC)
Vídeo 4.4.3. Programamos. (2019, 1 mayo). Creación de una app que use el GPS con App inventor (parte 3) [Vídeo]. YouTube. Recuperado 1 de noviembre de 2023, de https://youtu.be/ABi_Pg-D0F8?si=LLJ3Vg62DfC6w8nY
Vídeo 4.4.4. Programamos. (2019, 1 mayo). Creación de una app que use el GPS con App inventor (parte 4) [Vídeo]. YouTube. Recuperado 1 de noviembre de 2023, de https://youtu.be/qp0JV2GPCQY?si=aKbxa2RGhbauRl9k