Scratch e Ensino Técnico

De MediaWiki do Campus São José
Ir para: navegação, pesquisa

Instalando o Scratch

Página de Download do Scratch

O Scratch, programa com o qual trabalharemos nessa oficina, é um software interativo criado pelo MIT usado tanto para o ensino e aprendizagem de lógica de programação quanto para a criação de aplicativos simples. O Scratch possui uma interface simples e direta e, atualmente, possui duas versões: uma via browser e outra instalada no computador. Nesse oficina será usada a versão instalada.

Link para download: Download

O software deve ser instalado de acordo com seu sistema operacional:

Via Ubuntu

Na página de download do Scratch, clique em "Install Scratch with Software Center" na opção "Scratch 1.4 for Debian / Ubuntu". Clique em "Central de Programas para a instalação". Feito isso, clique em instalar no canto superior direito.

Via Windows

Clique para download

Após instalar, execute usando o arquivo .exe e aceite os termos e condições do Scratch.

Aula 1

Primeiro contato

Interface copia.png


O campo 1 é a parte gráfica do Scratch, onde o palco e os sprites interagem entre si de forma visual. Os sprites são conhecidos como imagens gráficas que possuem uma série de funcionalidades visuais, como por exemplo, mover-se (em relação a um plano cartesiano), desenhar algo no palco, etc... O Scratch já vem configurado com um sprite padrão (o gatinho amarelo) que pode ser totalmente personalizável. Em 1 encontram-se também o botão verde (mais conhecido como flag) e um vermelho (stop).

1.png


Em 2 temos o local para gerenciar os sprites, com as opções de criar, importar, e pegar um sprite aleatório. Uma vez criado o sprite irá aparecer nesse campo também. Clicando com o botão direito sobre o sprite irá abrir um espaço para customizá-lo.

2.png

O campo 3 indica a área de programação dos sprites e do palco, vista em blocos. Da mesma forma que na programação temos os algoritmos, no Scratch eles são representados em blocos e são editados nesse campo de programa. Existem as opções de "trajes" e "sons" (no topo da tela). Trajes são as "roupas" dos sprites. Na aba sons, é possível utilizar diversos efeitos sonoros nos aplicativos a serem criados. É possível importar sons e trajes, dando um poder de customização muito maior ao scratch.

3.png

Em 4 é sinalizado as abas das funções, divididas em categorias. Cada aba tem uma cor específica, de acordo com o uso, tornando-se mais fácil a memorização das suas funções.

4.png

Em 5 temos os blocos de acordo com as abas das funções.

5.png


Em 6 é indicada a área onde é possível renomear um sprite , assim como modificar algumas propriedades de posição e movimento.

6.png

Em 7 é mostrado uma área com botões que possuem algumas funcionalidades úteis. No primeiro ícone, ao lado do nome "Scratch", existe um globo, onde você pode mudar o idioma do scratch. Indo para a direita,temos um ícone em forma de disquete, que serve para salvar o atual projeto, seguindo o fluxo, temos o botão "compartilhar seu projeto", que, de acordo com seu nome, serve para compartilhar seu projeto no site oficial do scratch. Em cima do palco, existem quatro botões: no primeiro ícone, temos a opção de duplicar um bloco de comandos ou um sprite, O segundo é usado para apagar algo e os dois últimos servem para redimensionar um sprite. Por fim, no lado direito desses botões, existem outros três, que mudam a forma de visualização do palco.

7.png



Dando vida aos seus sprites

Começaremos trocando o traje do sprite padrão. Clique no sprite e vá até a aba "trajes". Feito isso, vá até "editar", logo após isso, clique em "importar". Inicialmente iremos usar o sprite do Darth Vader, que pode ser encontrado aqui. Voltando para a aba de comandos, clique em movimentos e arraste o bloquinho:


Mova.png


Note que quando o bloco é clicado, o sprite se move 10 passos. Perceba que existe um espaço que pode ser modificado, mudando o número de passos dados pelo sprite.

Agora, na mesma aba, localize o bloco:


Va.png


Veja que cada bloquinho tem um tipo de encaixe, no mesmo estilo Lego®. É possível acoplar vários comandos, criando blocos maiores. Com o comando já localizado, acople-o no bloco de mover. Preencha os espaços com (100,150).

Execute o bloco, clicando nele.

Os comandos são executados em "linhas", dando prioridade de execução aos bloco mais ao topo do bloco. Nesse exemplo, o sprite andou 'x' passos e depois foi para a posição (100,150).

Delete o bloco criado, arrastando-o para o canto esquerdo.

Sensores e controles

Agora usaremos a aba "sensores" em conjunto com a aba "controles", tornando nosso sprite mais interativo.

Na aba "controles", localize o bloco:


Flag.png


Arraste-o até a região de comandos. Esse bloco serve para iniciar seu programa quando o flag verde for clicado. Encontre o comando "vá para x: y:" e o "aponte para direção: " e coloque junto ao último bloco


Grande.png


Esse pequeno algoritmo serve para garantir que quando o flag for acionado, o sprite estará no centro do palco e na posição correta. Agora, na aba "controles", encontre o bloco:


Se.png


Coloque junto aos outros comandos. Note que nesse novo comando, tem um "formato" para encaixar algo ali. Para preencher esse espaço, iremos até a aba "sensores".

Pegue o bloco:


Tecla.png


Com esse comando, poderemos fazer com que o scratch perceba quais teclas apertaremos e atribuirá alguma tarefa a ela.

Coloque o bloco no espaço do bloco "se". Ele irá ficar assim:


Grandee.png


Vá até a aba de "movimentos" e pegue o bloco :


Direita.png


Coloque junto ao bloco "se"

Agora edite os espaços dos blocos.

em "vá para", coloque (0,0) ---> Como já vimos, o sprite irá para o centro do palco. em "aponte para a direção" ---> Mantenha 90°. no sensor de tecla, ponha "tecla direita" no comando "vire", coloque o que gira para direito. Mantenha 15°.

Execute-o.

Note que o algoritmo não funciona corretamente, mas porque? A lógica do scratch (assim como a maioria das linguagens de programação), é de executar comandos em linha, a principio apenas uma vez. Nosso algoritmo executa todos os blocos apenas uma vez, de maneira rápido, impossibilitando que movamos o sprite. Felizmente temos uma ferramenta para nos ajudar. Chama-se loop. Loops servem para mantermos que certos comandos se repitam infinitamente ou de maneira controlada pelo desenvolvedor através de repetições. Na aba "controle" temos algumas ferramentas para montar loops, mas iremos usar uma em especial para executar nosso algoritmo de maneira correta.

Encontre o bloco:

--- imagem bloco sempre ---

Com esse comando, iremos conseguir por nossa linha de comando em um loop infinito. Arraste todo o bloco a partir do comando "se" e acople dentro do bloco "sempre".

Clique no flag.

Veja que agora, graças ao "sempre", nós podemos girar nosso sprite para direita indefinidamente.

Exercício final

Agora que já entendemos como funcionam várias funções do scratch, estamos aptos a criar um joguinho, envolvendo todos os nossos conhecimentos atuais.

1 - Implemente um sprite que possa andar livremente no palco e mude de sprite a cada movimento.

2 - Implemente uma "sessão para uso do sabre de luz". Esse jogo consiste em criar um sabre de luz que se mexe livremente no palco e faça sons de acordo com cada movimento. Para a criação desse programa, uso os sprites e sons contidos nesse arquivo.

2 - Implemente um sprite que possa andar livremente no palco e

Aula 2

Operadores lógicos e numéricos

A aba "Operadores" nos da a opção de fazer operações matemáticas e usar controladores lógicos . Os operadores lógicos sempre podem nos retornar resposta ou verdadeiras ou falsas. As funções mais usadas são: menor, igual, maior, e , ou, não.

Operadores.png

Obs: Se você usar o operador , por exemplo o "menor", a resposta utilizada será verdadeira, mas caso você use-o m conjunto com o não, a resposta utilizada será falsa.

Variáveis

As variáveis funcionam como caixinhas, onde é possível armazenar informações. Para criar uma variável, vá até a aba "variáveis" , clique "em criar uma Variável". É possível criar dois tipos de variáveis:

Para todos os objetos: Todos os sprites podem ver essa variável. Chamada também de variável global.

Para este objeto apenas: Apenas o objeto selecionado pode ver. Chamada também de variável local.

Em programação (não importando a linguaguem usada para o desenvolvimento), é muito utilizado o conceito de “subproblemas”. Esse termo baseia-se na ideia de pegar um problema maior e dividí-lo em subproblemas. Por exemplo, você quer desenvolver um sistema de cadastro, mas quando pensamos na solução, temos ideias esparsas, mal organizadas. Qual a solução? Oras, faço com que fique fácil! Primeiramente, pense no programa de modo generalista. Bom, em um sistema de cadastro, precisamos de um algoritmo que leia a entrada de dados, um que processe esses dados e outro que retorno informações. Pronto! Você acabou de dividir seu programa em scripts menores. Tendo esse conceito em mente, faremos o mesmo para o exercício recomendado. Temos dois sprites no nosso jogo, portanto, já existe uma grande divisão nesse jogo. Devemos começar dividindo nosso programa. Os subprogramas do sprite do Luke serão:

- Um script que irá comandar todos os outros blocos.

- Um script para movimentos do sprite do Luke.

- Um script para a animação de bloqueio.

- Um scrirpt para a animação de ataque.

Agora os subprogramas do droid:

- Apenas um bloco para sprite aparecer.

Exercícios:

1 - Desenvolver todos os subprogramas listados.

2 – Crie um sistema que contabilize o número de droids destruídos.

3 – Implemente uma função de “vida” ao Luke. (Sugestão: usar o “cor x tocando na cor y”).