Module 3 ES
Module 3 ES
Module 3 ES
CURSO E-LEARNING
Este módulo empieza con una visión general de las tecnologías y herramientas disponibles para la
programación de aplicaciones móviles y proporciona ejemplos que se podrían usar con estudiantes de
escuelas primarias. Le sigue una presentación detallada del entorno App Inventor. Se describe el proceso
de desarrollo de dos juegos populares con App Inventor. Finalmente, el módulo presenta la plataforma de
realidad aumentada "Metaverse" que permite a estudiantes y profesores crear sus propias aplicaciones de
realidad aumentada.
Antes de que pueda empezar a escribir su primera app debe decidir sobre qué sistema de software
funcionará su app y qué lenguaje de programación utilizará para ello. Los sistemas de software más
populares son Android proporcionado por Google o iOS por Apple.
Programar para Android requiere conocimientos de programación en Java y Android SDK. iOS sólo
funciona con dispositivos Apple, como también ocurre con la herramienta de programación XCode, por lo
que para ello necesitará un computador Apple con el Sistema Operativo Mac OSX. Para desarrollar una
app para iOS necesitará conocer el lenguaje Objective-C o bien Swift
Si quiere empezar a programar dispone de varias posibilidades. En la siguiente unidad nos centraremos
en las tecnologías disponibles
Aplicaciones Nativas
1
Las aplicaciones nativas están escritas en los lenguajes citados para los sistemas de software anteriores
(Objective-C, Cocoa)
Recursos en la red
Descubra lo básico sobre aplicaciones nativas
https://searchsoftwarequality.techtarget.com/definition/native-application-native-app
Si quiere empezar a escribir una app para Android puede empezar con "Android Studio" que proporciona
un entorno integrado de desarrollo.
Android Studio ofrece:
● Sistema de compilación basado en Gradle
● Emulador con múltiples características
● Entorno que permite el desarrollo para varios dispositivos Android
● Ejecución instantánea a la aplicación en ejecución para materializar los cambios sin regenerar un
fichero APK nuevo
● Plantillas de código e integración con GitHub para implementar funciones comunes e importar
código de ejemplo
● Herramientas de prueba y "frameworks"
● Herramientas Lint para perfilar problemas de rendimiento, usabilidad, compatibilidad y otros
● Soporte a C++ y NDK
La guía de usuario está escrita en un lenguaje simple que motiva al principiante a crear su primera app.
2
Utilizar la tecnología de bloques es también posible para empezar con su primera app. Esta opción es
mucho más fácil que aprender a utilizar un lenguaje de programación; sin embargo, también tiene sus
limitaciones. GoodBarber es un proveedor de herramientas de desarrollo. Al registrarse se dispone de un
periodo de prueba gratuito de 30 días. La herramienta le permite crear app fácilmente con funciones
avanzadas para los usuarios de la app (autenticación de usuarios, notificaciones "push", monetización y
demás). GoodBarber ofrece tarifas variadas que empiezan por 32 € al mes.
En el capítulo 2 nos centramos en App Inventor, que es un entorno de desarrollo para Android
suministrador por Google
Recursos en la red
Android Studio - https://developer.android.com/studio
Descargue Android Studio y dele un vistazo a la guía de usuario para empezar a programar.
GoodBarber - https://www.goodbarber.com/
Herramienta para construir apps utilizando bloques.
¿Cómo preparar a nuestros jóvenes para la era digital que ya nos rodea a todos? Hemos de comunicar
contenidos complejos en formas fáciles de ser usados. Entender programas de ordenador y algoritmos
son competencias clave en el mundo digital.
Hay varias formas mejores de enseñar a los niños competencias digitales que simplemente dejarles
experimentar en entornos digitales
3
aprendiendo los elementos básicos Xcode. Además, Apple proporciona una ayuda a profesores
"Cualquiera puede programar curriculum" para impartir programación desde la educación primaria hasta
la universidad.
Scratch
Scratch es un lenguaje visual de programación diseñado en los laboratorios MIT Media especialmente
para jóvenes de 8 a 16 años, para programar historias interactivas, juegos y animaciones, que pueden ser
compartidas con otros. Además, estudiantes desde primaria hasta universitarios pueden aprender otras
disciplinas como matemáticas, programación, lenguaje, artes y ciencias sociales. En el archivo ScratchEd
Online Community Archive los educadores pueden encontrar recursos, discusiones e historias de otros
educadores
Workshops
Los workshops son una gran posibilidad para que los jóvenes trabajen juntos y aprendan en grupo.
Maker Spaces
Con Maker Spaces, los niños aprenden a crear algo nuevo con materiales y herramientas. Maker Spaces
utiliza herramientas como Arduino, Raspberry Pi, Calliope Mini, BBC micro:bit y Makey Makey y otras
herramientas para construir y programar robots. Los teléfonos inteligentes, Apps, tabletas e impresoras
3d pueden utilizarse para probar. No se trata tan sólo de habilidades para programar, sino un lugar donde
los niños pueden ser creativos.
Recursos en la red
4
Video ‘Lo que no enseñan muchas escuelas’ - https://youtu.be/nKIu9yen5nc: Video motivador para
construir computadores y programarlos
Scoyo - Aprendiendo programación para niños: Mit Spaß fit für die Zukunft - https://www-
de.scoyo.com/eltern/kinder-und-medien/programmieren-lernen-kinder-fit-fuer-die-zukunft
Online-Magazin für Eltern rund um Lernen, Schule, Familienleben & Medienkompetenz
Code.org - https://code.org/: Proporcioan tutoriales de una hora para todas las edades en 45 idiomas.
CodeAcademy - https://www.codecademy.com/: Sitio web de referencia para aprender lenguajes como
Python, PHP, jQuery, JavaScript,...
Lightbot - http://lightbot.com/index.html: App para que los niños aprendan a programar
Dash - https://uk.makewonder.com/dash/: Dash es un robot que puede ser controlado por apps. Válido
para diferentes edades
CoderDojo - https://zen.coderdojo.com/find: Una comunidad global de clubs de programación
compuesta de voluntarios con edades entre 7 y 17 años.
Making -Diseño digital creativo y experimental con niños. -
https://de.slideshare.net/sandra_slideshare/making-kreatives-digitales-gestalten-und-experimentieren-
mit-kindern-einfhrung-und-ausgewhlte-werkzeuge
Arduino - https://www.arduino.cc/
Rasperry Pi - https://www.raspberrypi.org/
App Inventor es una aplicación web que le permite desarrollar aplicaciones para dispositivos Android
(smartphones y tablets) utilizando un lenguaje de programación visual. Es gratuito y software libre.
Para trabajar con App Inventor necesita
● Una cuenta Google
5
● Un computador con acceso a internent.,
● Un navegador web compatible (Mozilla Firefox, Apple Safari, Google Chrome - Microsoft Internet
Explorer no está soportado).
Si tiene problemas con la conexión a internet o accediendo a su cuenta Google puede utilizar App
Inventor 2 Ultimate.
App Inventor guarda el proyecto en un almacenamiento en la nube con el nombre de su cuenta Google.
No necesita guardar proyectos en su disco duro local.
Una Aplicación App Inventor se obtiene con el Diseñador de Componentes (Component Designer) y el
editor de bloques (Block Editor). Con el Diseñador, puede crear los formularios y pantallas de de la
aplicación, disponiendo los elementos o componentes de la aplicación. Con el Editor de Bloques puede
establecer un comportamiento arrastrando y ubicando bloques de programa o código. Los bloques
representan los comandos que realizan alguna función a hacer.
Hay dos tipos de componentes: visibles y no visibles. Los componentes visibles (como botones, etiquetas
de texto, recuadros, etc) son aquellos que serán visibles cuando la aplicación se lance y formarán parte
del interfaz de usuario. Los componentes no visibles (como el acelerómetro, el sonido o el sensor de
orientación) no son visibles pero proporcionan acceso a la funcionalidad del dispositivo. No forman parte
de la interfaz de usuarios
Puede crear más de un formulario o pantalla en la aplicación pero debe ser cuidadoso porque cada
pantalla consume recursos del dispositivo. En general, no debería tener más de 10 pantallas para una
app.
Si no dispone de un dispositivo android que conectar al computador, todavía puede desarrollar y probar
apps con App Inventor. El cual proporciona un emulador de Android que instala un dispositivo virtual en
su computador y funciona tal cual lo hace un dispositivo Android real.
Recursos en la red
Un tutorial para principantes: http://appinventor.mit.edu/explore/ai2/beginner-videos.html
Empezando don App Inventor 2 de MIT: https://appinventor.mit.edu/explore/get-started.html
Un vídeo de App Inventor hecho por google: https://www.youtube.com/watch?v=sGiaXOKqeKg
Un resumen del Diseñador y Editor de bloques https://appinventor.mit.edu/explore/designer-blocks.html
6
El Diseñador (Designer) le ayuda a establecer el aspecto de su aplicación. Consiste en cinco columnas o
áreas:
● Paleta
En la paleta ("Palette") puede seleccionar los componentes visuales y no visuales y arrastralos al área de
visualización. La columna de la paleta está organizada en grupos de componentes llamados cajoneras
("drawers") compuesta de User Interface ("Interfaz de usuario") , Layout ("diseño"), Media, Drawing and
Animation ("Dibujos y animaciones"), Maps ("Mapas"), Sensors, Social, Storage ("Almacenamiento"),
Connectivity ("Conexiones"), Experimental, Extensions etc.
User Interface ("Interfaz de usuario"). Estos componentes son: Botones, checkboxes, selectores de
fechas, imágenes, etiquetas, listas, notificaciones, cajas de texto para contraseñas, deslizadores, rodillos ,
selectores de hora, y visualizadores de elementos web.
Layout ("diseño y disposición") Permite ubicar y dar formato. Utilizando estos componentes, puede
definir una disposición y aspecto en la pantalla (Horizontal, Horizontal con desplazamiento, Con filas y
columnas, vertical, vertical con desplazamiento)
Dibujo y animacion Esta cajonera le permite crear dibujos y animaciones. Consiste en elementos como
Ball, Canvas y sprites de imágenes.
• El Canvas es un panel rectangular sensible al tacto en su aplicación donde se puede dibujar y
ubicar sprites.
• Puede programar animaciones situando el elemento "Ball" y sprites dentro del canvas. Estos
componentes reaccionan a toques y arrastres, interactuando con otros sprites en el borde del Canvas,
moviéndose y transformándose de acuerdo a ciertos valores en sus atributos
Sensor Este componente proporciona acceso a los sensores del dispositivo (acelerómetros, sensores de
posicionamiento global, de orientación , lectores de códigos de barras, sensores de proximidad, etc).
7
Storage Es un componente no visible para escribir y leer archivos de una carpeta privada con datos
asociados a su aplicación.
Connectivity Esta cajonera consisteen componentes de tipo ActivityStarter, Bluetooth y Web
● Viewer
En el área Viewer puede ver el contenido de cada pantalla de su aplicación
● Components
En la columna Components puede ver una estructura en forma de árbol de todos los componentes
(visibles o no) de un vistazo. Puede renombrar o eliminar un componente
● Media
De la columna Media puede organizar los archivos de medios (sonidos, imágenes y vídeos)
● Propiedades
En la columna Propiedades ("Properties") puede determinar aspectos de la apariencia y otras
características de cada componente.
Recursos en la red
Una referencia rápida sobre el Designer
https://appinventor.mit.edu/explore/sites/all/files/Teach/media/MITAppInventorQuickReference.pdf
El Editor de Bloques manipula bloques de código que programan el comportamiento de su aplicación. Los
bloques elementos con forma de piezas de puzzle que se utilizan para crear el programa.
Las aplicaciones creadas por App Inventor son guiadas por eventos. Las instrucciones no se ejecutan más
que como respuesta a eventos. Un evento es una acción como hacer clic en un botón o hacer un gesto en
la pantalla. Mover o girar el teléfono también es un evento. El programador describe cómo debe el
8
dispositivo responder ante los eventos utilizando bloques que responden ante eventos ( event handler
blocks)
Bloques de procedimiento
Con los bloques de Procedimiento puede gestionar procedimientos. Un procedimiento es una secuencia
de instrucciones que se agrupan bajo un nombre y llevan a cabo una tarea específica. En vez de tener un
programa complejo, puede crear procedimientos e invocarlos cuando desee para aprovecharlos.
Los bloques de procedimiento y muchos otros, incluyendo el 'if-else' y 'make list', proporcionan un botón
"blue mutator". Haciendo clic en este botón puede transformar el bloque, por ejemplo, añadiendo
argumentos a los procedimientos o ramificaciones 'else' para un 'if'.
Recursos en la red
Aquí se explica cómo funcionan los bloques básicamente.
https://appinventor.mit.edu/explore/understanding-blocks.html
9
Un resumen de la Arquitectura de una App
http://www.appinventor.org/Architecture2
10
Paso 6: Compruebe la conexión.
Recursos en la red
Un resumen de la configuración de App Inventor 2
http://appinventor.mit.edu/explore/ai2/setup.html
11
Capítulo 3: Crear juegos con App Inventor
A continuación tiene una lista de pasos orientativos que pueden seguirse para crear un juego simple
usando App Inventor.
12
● Configure estos bloques y conéctelos apropiadamente para establecer el comportamiento
● Puede definir procedimientos para crear nuevos bloques de instrucciones que se repiten
● Utilice procedimientos y llamadas a métodos
Pong es un juego que se usa para demostrar los pasos básicos para crear un juego tal como describe la
sección 3.1. Los siguientes dos documentos describen cómo puede hacerse
Diseñar el interfaz gráfico del juego Pong
Definir la funcionalidad de los componentes del juego Pong. El editor de bloques
Recursos adicionales
https://appinventor.mit.edu/explore/sites/.../Pong%205a_13.pdf
http://www.appinventor.org/content/ai2apps/intermediateApps/pong
MoleMash es otro juego usado como demostración de los pasos que se toman para crear un juego como
describe la sección 3.1. Los siguientes dos documentos describen cómo puede hacerse.
Diseñar el interfaz gráfico de usuario del juego MoleMash
Definir la funcionalidad de los componentes del juego MoleMash game - El editor de bloques
Recursos adicionales
Mole Mash - App Inventor Tutorial Parte 1 https://youtu.be/Ya1ejdRwKvw
Mole Mash - App Inventor Tutorial Parte 1 https://youtu.be/IPSG7bYXN2M
13
Capítulo 4 - Metaverse. Realidad Aumentada
Metaverse es una plataforma web gratuita de fácil aprendizaje que permite a los profesores y
estudiantes crear sus propias experiencias de realidad aumentada (RA) sin necesidad de escribir ningún
programa. Las experiencias de RA. se desarrollan con Metaverse Studio y pueden ser reproducidas con la
App Metaverse Mobile (iOS y Android).
¿Qué pueden los profesores y estudiantes crear con Metaverse? Las posibilidades son interminables,
pero hay algunos ejemplos orientativos:
● Búsqueda de tesoros con RA,
● Juegos RA,
● Historias interactivas con RA,
● Puzzles y concursos con rA,
● Viajes virtuales con RA,
● Muros mediáticos
Recursos en la Red
Lo que los educadores tienen que contar sobre Metaverse: (en Inglés) En este vídeo, educadores usan
Metaverse con sus estudiantes y comparten sus propias experiencias y la de sus estudiantes
Metaverse Preview: Una vista previa rápida de Metaverse Studio y la App Metaverse Mobile.
Portales de RA: Este vídeo muestra portales de RA "teleport" de varios usuarios de todo el mundo. Los
portales han sido creados con cámaras de 360o y Metaverse
Joe Merrill's Lake Park Elementary Class: Un juego de RA sobre vocabulario orientado a estudiantes de
primaria creado con Metaverse
14
4.2 - Empiece a usar Metaverse Studio
Para utilizar Metaverse Studio primero debe crear una cuenta en la plataforma y familiarizarse con el
entorno de la app. El siguiente documento proporciona los pasos que se necesitan dar para iniciarse en el
uso de Metaverse. Incluye una presentación del entorno Metaverse Studio
Recursos en la red
Metaverse Studio Overview: Demostración del procedimiento básico de uso de Metarverse Studio para
crear Experiencias de RA.
Metaverse Dashboard Overview: Un resumen rápido del aspecto del panel principal de Metaverse.
Metaverse Studio ofrece muchas herramientas para crear experiencias RA simples o complejas
fácilmente. El siguiente documento presenta los pasos básicos que debe seguir para crear experiencias en
RA.
Recursos en la red
Metaverse Storyboard Overview: Un resumen rápido de Metaverse Experience Storyboard.
Character Scenes: Demostración de cómo se pueden usar las escenas con personajes.
Text Input Scenes: Demostración de cómo se pueden usar las escenas de introducción de texto.
Publishing Experiences: Una guía rápida sobre cómo publicar sus experiencias Metaverse.
Add a GPS Location: Tutorial sobre cómo añadir ubicaciones GPS a las experiencias Metaverse.
Build a Digital Breakout: Aprenda cómo construir una actividad "Digital Breakout" para su clase ¡ En
menos de 15 minutos!
Dese un paseo por una experiencia aquí: https://studio.gometa.io/discover/me/…
Build a Simple Trivia Game: Aprenda cómo hacer un juego de trivia de 3 cuestiones que usa escenas de
Alarma para las preguntas y contabiliza los puntos usando Property Blocks.
15