Há duas partes na criação de um aplicativo com o App Inventor. Primeiro, você projeta a aparência do app e, em seguida, informa ao aplicativo o que fazer por meio do programação .
FIRST STEPS
- Faça um esboço no papel primeiro
- Use seu protótipo de papel
- Tenha-o perto de você

- Abrir o MIT App Inventor
- ai2.appinventor.mit.edu
- Selecione "Iniciar novo projeto"no menu Projects (Projetos)

PARTS OF THE DESIGNER
Clique no ícone laranja para saber mais sobre as partes destacadas. Clique nas setas à esquerda e à direita para saber mais sobre outras partes do Designer.

A Palette (Paleta) lista TODOS os possíveis componentes (partes) que você pode adicionar ao seu aplicativo.
Eles são agrupados por drawers (gavetas) ou tabs (guias). Basta clicar em uma gaveta para abri-la.

O Viewer (Visualizador) mostra a aparência do aplicativo depois que você arrasta os componentes da Paleta.
Os componentes não visíveis não aparecem na tela do aplicativo, mas ainda são partes importantes do aplicativo.

O Components Panel (Painel de componentes) lista todos os componentes que foram adicionados ao aplicativo.
Eles têm um espaço extra na frente se estiverem contidos em outro componente.

O Properties Panel (Painel de propriedades) é onde você vê ou altera os diferentes recursos de cada componente.

O Media Panel é onde você carrega arquivos como imagens e sons para usar no seu aplicativo. Você pode simplesmente arrastar e soltar arquivos no Media Panel.
TIME TO TRY IT!
ATIVIDADE 1: PROJETAR UM APLICATIVO
Agora que você adicionou todos os componentes do aplicativo, você passará para o Blocks Editor para começar a programação do aplicativo a seguir!
VARIABLES
Antes de começar a programação, vamos aprender sobre variáveis. Você precisará usá-las quando programar o Recycle Game.
Se você estiver criando um aplicativo, às vezes precisará acompanhar diferentes informações dentro do app. É para isso que servem as variáveis.
O EDITOR DE BLOCOS
- Abra seu projeto Recycle Game no App Inventor
- Você adicionou todos os seus componentes
- Agora, mude para o Blocks Editor (Editor de Blocos)

PARTES DO EDITOR DE BLOCOS
Clique no ícone laranja para saber mais sobre as partes destacadas. Clique nas setas à esquerda e à direita para saber mais sobre outras partes do Blocks Editor (Editor de Blocos).

Os Blocos listam todos os blocos disponíveis para serem usados.
Os blocos built-in (integrados) fazem parte de todos os aplicativos.
Cada componente também tem seu próprio conjunto de blocos de código.

O Visualizador é o espaço de trabalho do programação , onde você coloca todos os blocos de código.
Clique em um componente e arraste o bloco desejado para o Viewer (Visualizador).

A Mochila permite que você salve seus blocos de código/programação para reutilizá-los em outros projetos.
Arraste os blocos que você criou para a mochila. Você pode abrir outro projeto e arrastá-los para reutilizá-los.

Verifique os avisos em amarelo e os erros em vermelho antes de executar o aplicativo.

Você pode aumentar e diminuir o zoom e redefinir o zoom do Viewer (Visualizador).
Você pode remover blocos não utilizados arrastando-os para a lixeira para excluí-los.