Nuestra APP: Diseñar nuestro interfaz básico

1. Interfaz de
APP Inventor 2

2. ¿Qué es App Inventor?
Es un entorno de desarrollo de aplicaciones para dispositivos
Android. Se trata de un servicio basado en la nube por lo que
todas las tareas se realizan en un navegador (Google Chrome
o Mozilla Firefox), de tal manera que todos los proyectos que
se vayan realizando se quedan almacenados en la nube.
Para poder acceder al servicio necesitas una cuenta de
google.
El interfaz de App inventor está formado por tres
herramientas:
● Gestor de proyectos: Donde se guardaran nuestros
proyectos.
● Diseñador: Donde deseñaremos el interfaz de
nuestras aplicaciones
● Editor de bloques: Donde programaremos las
acciones que se realizaran con el interfaz
anteriormente diseñado.

3. Mis Proyectos (My Projects)
La vista de los proyectos es la primera que se carga nada mas
acceder a APP Inventor, en esta herramienta podemos realizar
un seguimiento de todos nuestros proyectos.
Desde el botón My projects
podemos acceder a los proyectos
que tenemos guardados
Para crear un nuevo
proyecto

4. Diseñador (Designer)
La herramienta de diseño nos permite seleccionar los componentes
de la App y definir el interfaz de usuario de la misma(botones,
cuadros de texto, etiquetas, etc.)
Para poder incluir
componentes al diseño de
nuestra aplicación solo hay
que seleccionar los
componentes en la paleta y
arrástralos al visor

5. Diseñador (Designer)
La herramienta de diseño nos permite seleccionar los componentes
de nuestra aplicación y definir el entorno de usuario de la misma.
Situa los componentes en el
visor para establecer el
aspecto de tu aplicación
A medida que incorpores
componentes a tu aplicación
se irán añadiendo a la lista
de componentes
Situa los componentes en el
visor para establecer el
aspecto de tu aplicación
A medida que incorpores
componentes a tu aplicación
se irán añadiendo a la lista
de componentes
En el panel media añadimos
imágenes, sonidos o vídeos a
nuestra App

6. Diseñador (Designer)
Seleccionas un
componente de la lista
Y las propiedades del
componente seleccionado
aparecen en el panel
Para pasar al editor de
Bloques

7. Editor de Bloques (Blocks)
El comportamiento de nuestra aplicación se programa
mediante bloques en el editor de bloques.
Encaja las piezas como en un
puzle para establecer el
comportamiento de la aplicación
Arrastra los bloques para
utilizarlos en el programa

8. Editor de Bloques (Blocks)
Aquí se encuentran los bloques
de uso general
Aquí están los bloques
correspondientes a los
componentes incluidos en la app