El documento describe una aplicación móvil creada en MIT App Inventor para mostrar los planetas del sistema solar. La aplicación contiene 8 pantallas diferentes accesibles mediante botones que muestran los planetas y sus lunas más importantes. El autor explica el proceso de diseño de la interfaz, la carga de imágenes, y el uso de bloques de programación para agregar la funcionalidad de cambiar entre pantallas al hacer clic en los botones de los planetas. La aplicación fue probada y funciona correctamente en un dispositivo móvil.

1. Ensayo Unidad 6
Diseño para dispositivos móviles
Dr Pablo Cerda Luque
Grupo P
Abril 22, 2022
Alumno: Omar Alejandro Arriaga Pérez
Matricula: 2173350239
Universidad Autónoma de Tamaulipas
Facultad de Arquitectura, Diseño y Urbanismo
Licenciatura en Diseño Gráfico y Animación Digital

2. Mit app inventor
La aplicación que realice es que se pueda mostrar a los planetas del sistema solar en la
pantalla completa y que al presionar los planetas como si fueran botones se abra la
pantalla con sus lunas más importantes.
La aplicación contiene 8 diferentes pantallas, y este habilitado por medio de botones,
para que, con gestos o con el botón de back, puedas regresar al inicio, en donde se
encuentran los planetas del sistema solar.
Para llegar a este resultado, primero dividí todos los elementos de la página, puse los
planetas como si fueran botones individuales, el fondo de pantalla este vacío
únicamente con imágenes del universo abierto, y cada planeta tiene su imagen en
formato png cono sus respectivas lunas. Así que son, 8 botones y 9 imágenes de
fondo.
Al empezar a configurar MIT App inventor, lo primero que hice fue, crear todas las
screens, se crearon 9

3. De igual manera, se subieron las imágenes individuales a la sección de media del
programa, dentro de la screen 1, la pantalla home, se agregó una tabla para en
esta poner los planetas como botones, en esta arrastro desde el user interface
desde donde dice “button” las veces necesarias para completar los 8 planetas en
cuestión.
Enseguida muestro las pruebas de ello:

4. Una vez ya teniendo esto preparado, continuamos con poner las imágenes en las
respectivas secciones. Cuidando desde que screen este ubicado para no
cometer errores. Por ejemplo, en el screen 1 subí, los 8 botones, seleccionando
uno a la vez, para que en properties le quite el nombre, para que no aparezca el
de fabrica y aparezca tal y como esta diseñado en le Wireframe. Cada botón mide
200 x 200 pixeles, y en la sección de imagen seleccione la imagen
correspondiente, así se trabajaron todos los botones.

5. Desde el screen 2 al 8, lo único que necesite cambiar son las imágenes de fondo.

6. Hasta aquí ya tengo todas las imágenes en el celular virtual, pero falta la
funcionalidad.
En el lado derecho superior del interfaz está el botón “blocks” una vez adentro de
ella tengo del lado izquierdo los blocks de control hasta los de procedures. Tomo
desde los blocks, tomando en cuenta siempre en que screen estoy colocado, dar
un click en el de control y el botón a utilizar es el de when button1 click do + open
another screenname#

7. Estos botones son únicamente para el screen 1, para todas las demás, recordamos que se debe siempre de regresar al home y se utiliza
el siguiente botón.
De esa manera con gestos o el botón de back siempre regresará al inicio, esto esta probado de funcionar al conectar mi celular para
hacer las pruebas.
Aplicaciones 100 porciento funcional.