Projeto Forma-Engenharia

De MediaWiki do Campus São José
Ir para navegação Ir para pesquisar

Instalação do Scratch

Download do scratch

O Scratch é um software interativo criado pelo MIT usado tanto para o ensino/aprendizagem de lógica de programação tanto para a criação de aplicativos simples. Ele possui uma interface simples e direta e iremos trabalhar com ele nesse projeto.

Primeiramente você vai precisar instalar o software na sua máquina. Clique Aqui para acessar a pagina de downloads do Scratch. Siga o passo-a-passo abaixo verificando qual seu sistema operacional.

Para Ubuntu
Central de Programas do Ubuntu

Clique em "Install Scratch with Software Center" em "Scratch Instaler for Debian / Ubuntu". Selecione a Central de Programas para a instalação. Clique em instalar no canto superior direito da página. Aguarde o programa ser instalado.

Para Windows

Clique para download

Aula 1

Interface do Scratch

Interface do Scratch

O Scratch apresenta uma interface simples e fácil de se entender. Utilize a imagem ao lado para localizar-se dentro da interface do Scratch.

Em 1 temos o palco junto com os sprites. O palco é o local onde você pode ver o que foi programado em forma gráfica. Sprites são geralmente objetos que você pode mover, desaparecer, desenhar e outras coisas. No caso temos o sprite default(padrão) que é o gatinho símbolo do scratch. Em cima ainda podemos ver o botão da bandeira verde que da inicio aos comandos e o botão vermelho que para o comando.

Em 2 temos a área em que ficam os comandos, ou seja, basicamente é a área onde você vai colocar uma série de comandos que ao serem executados, seus resultados aparecerão no palco. Existem ainda as abas de trajes e de sons. Trajes são como "roupas" para um sprite. Já na aba sons você pode utilizar diversos efeitos sonoros em seus comandos. Também é possível a importação de outros sons e trajes.

Em 3 apresenta-se todas as categorias de comandos do Scratch. Cada categoria é divida em cores, sendo assim fácil de perceber a qual categoria cada bloco de comando pertence.

Em 4 temos os blocos de comandos. Ao selecionar a categoria, é nessa parte que aparecerão os comandos para serem utilizados. Em breve veremos sobre eles.

Em 5 temos a área onde você pode ver todos os sprites criados. ao clicar em um sprite, será aberta uma área de comando que será referido a ele. também temos os botoes de adicionar e editar sprites.

Em 6 temos a área onde podemos renomear um sprite e modificar algumas propriedades quando ao movimento dele, tanto como analisar qual sua posição.

Por fim em 7 temos uma área alguns botões. Na esquerda ao clicar num globo, você pode mudar o idioma do scratch, a direita dele você tem um botão para salvar e outros para compartilhar seu projeto no site do scratch. Depois existem 4 abas com algumas funcionalidades secundárias. A direita de ajuda temos 4 botões. O primeiro serve para duplicar algo, seja um bloco de comando ou um sprite. O segundo serve para apagar. O terceiro e quarto servem para aumentar ou diminuir o tamanho de um sprite, respectivamente. A direita temos 3 botões que vão mudar a forma em que o palco é apresentado. Cada modo tem suas vantagens dependendo do que você está fazendo no momento.

Comandos básicos de Movimentação

Nesta primeira parte vamos aprender sobre como mover os sprites que estão no palco. A princípio utilizaremos o sprite do gato. Selecione a aba de comandos Movimento arraste a opção 'Mova .. passos' e jogue-a na área de comandos.

Mover passos

Digite um número de passos que você desejar e clique nesse botão. Observe que no palco o gato se moveu uma quantidade de passos referente ao comando. Basicamente é isso que este comando faz, movimenta seu objeto para frente uma determinada quantidade de passos.

Agora pegue o bloco aponte para a direção e o encaixe abaixo do bloco feito anteriormente. Note que eles se encaixaram e agora funcionam como um só, sendo assim, ao executar esse bloco maior, os 2 comandos serão realizados, 1 por vez.

Aponte para..

Selecione a posição que o sprite apontará e execute-o clicando nele. Note que o gato moveu-se e no final, apontou para a posição desejada. Veja que se o gato já estiver apontando para a posição escolhida, nada acontecerá.

Agora delete o bloco aponte para a direção . Você conseguirá fazer isso arrastando-o para fora do bloco completo e soltando-o na área de comandos. Escolha, arraste e encaixe um dos 2 blocos de vire..graus . A caixa de numeração que você pode escrever refere-se a quantidade de ângulo em graus que o sprite(gato) vai girar. Escolha um ângulo e execute para ver como funciona.

Girar

Vamos ver agora uma função um tanto interessante e muito aplicável quando queremos utilizar a interação em tempo real do usuário com o programa. Na aba de Movimento, pegue o bloco vá para... e selecione para ir para o ponteiro do mouse. Clique nele e veja que o sprite tenta mover-se na direção do mouse. Para deixar isso um pouco mais interessante, vamos utilizar alguns blocos da aba 'Controle'. Vá na aba Controle e selecione o bloco sempre. Veja que podemos encaixar blocos dentro dele, e nele que vamos colocar o 'vá para o ponteiro do mouse'. Execute e mexa o mouse no palco.

Vá para

Como utilizamos o comando sempre, perceba que ele nunca para de ser executado, criando o que chamamos de loop infinito. Para parar o comando, aperte no botão vermelho na parte superior direita.


Desenhando

Ao movimentar um sprite, você tem a opção de deixar uma espécie de rastro, fazendo assim um desenho. Essa função pode ser obtida na aba Caneta com os blocos abaixe caneta e levante caneta .


Abaixar e Levantar Caneta

Coloque o bloco abaixe caneta e utilizando os comandos de movimenta vistos anteriormente faça o gatinho movimentar-se pelo palco, deixando o rastro. Ao final do bloco, sempre coloque o comando levantar caneta e caso queira, use o comando limpe para apagar todo o desenho feito. Você pode mudar a cor da caneta com o comando mude a cor da caneta . Para selecionar a cor, clique no quadrado e escolha a cor desejada. Veja o exemplo completo:

Desenhando1


Desafio 1

Tente montar um sistema de blocos capaz de fazer desenhos utilizando o mouse. Tente utilizar não só os blocos vistos, porém alguns outros para deixar o programa mais interessante.

Sons

Vamos utilizar agora a aba Som . Nela podemos nos utilizar de diversos sons, desde efeitos dos sprites, como um miado, até notas musicais de diferentes instrumentos. Nos blocos de toque o som, temos como padrão os sons do sprite, mas podemos importar outros sons, até mesmo gravar caso tivermos um microfone. Em toque o tambor, podemos escolher entre diversos instrumentos de percussão. No toque a nota, escolhemos uma nota musical para ser tocada, e no mude instrumento escolheremos o instrumentos que tocará essa nota.

Desafio 2

Construa um programa que faça o gato se mover miando.

Comandos de aparência

Na aba aparência temos comandos que interferem diretamente em como o sprite está sendo mostrado. Podemos mudar sua cor, seu traje, tamanho, etc. Vamos fazer um teste para entender melhor. Pegaremos esse código como exemplo:

Passos do gato

Note que o gato possui 2 trajes, assim quando o bloco 'próximo traje' for ativado, ele mudará para outro traje, parecendo que ele está caminhando. Também, utilizamos o bloco de controle de esperar segundos, que neste caso serviu para melhorar a impressão que temos do gato ao movimentar-se.

Outros comandos úteis são os de mensagens: pensamento e fala. Com eles você pode fazer o sprite enviar uma mensagem escrita, como se ele estivesse falando ou pensando, utilizando balões de falas ou nuvens. Veja o exemplo:

Pensando e Falando

Veja que foi utilizado comandos que ficam por um determinado tempo. Caso fosse escolhido o bloco sem tempo, o balão ficaria lá até um outro bloco ordenasse ele a sumir.

Temos também os blocos que mudam a aparência do sprite. Eles são o mude o efeito . Com eles podemos mudar a cor básica do sprite, fazer um efeito girando a imagem, mosaico e diversos outros. Existem 2 blocos desse tipo. O que diz mudar por, vai incrementar por um valor a distorção que você vai fazer. O que diz mudar para, vai mudar o efeito para aquele valor, podendo reduzir o efeito da distorção. Para limpar todos os efeitos, temos o bloco limpe os efeitos gráficos .

Exercícios

1. Construa um programa que desenhe um triângulo, depois um retângulo e um quadrado.

2. Refaça o exercício anterior fazendo com que cada lado da figura geométrica tenha uma cor diferente.

3. Construa um programa que desenhe um círculo. DICA consulte a ajuda dos blocos de movimento.

4. Faça com que o gato se mova mudando de traje, tentando deixá-lo o mais realista possível para parecer que ele está mexendo as patas. Utilize-se de qualquer ferramente do Scratch.

5. Utilizando o exercício 2, faça com que as 3 figuras sejam feitas ao mesmo tempo no palco, sendo que o gato(ou a figura que você desejar usar) diga qual cor será usada.

Dica de leitura adicional

Aula 2

Utilizando perguntas e respostas

Uma função muito simples e interessante de se executar é a de você poder fazer uma pergunta ao usuário e conseguir capturar a resposta que ele vai dar. Isso é muito útil, por exemplo, quando você quer fazer um programa que execute uma determinada função no qual os dados devem ser entrados pelo usuário. Primeiramente vamos aprender a como utilizar-se desta função.

Abra a aba Sensores . Ao utilizar o bloco pergunte e espere você fará uma pergunta que aparecerá no palco juntamente com um espaço para escrever. A partir daí o seu programa é pausado esperando que uma mensagem seja escrita nesse espaço. Quando o usuário entrar com uma resposta, ela será salva numa variável(veremos mais em frente sobre varáveis e como criá-las) padrão chamada resposta e o programa continuará a se executar. Assim ao invés de utilizar uma informação pré-definida, você utiliza o valor da resposta. Faça o exemplo e veja como fica:

Pergunta

Veja que se a resposta não for um número, gato não se moverá, porém é possível utilizar letras para responder coisas, como uma senha para o acesso á algo(veremos isso adiante). Após utilizar essa função, a resposta ficará gravada na variável até que essa função seja executada novamente.

Note que na aba dos sensores você pode marcar uma caixa ao lado da variável resposta fazendo assim que ela apareça no palco.


Aplicações de perguntas

O bloco de perguntas e respostas tem muitas aplicações. Desde a criação de mini-games até programas didáticos para química, física ou matemática. Vamos mostrar uma implementação de um exercício anterior.

Fazendo um quadrado utilizando pergunta e resposta

Nesse caso, temos uma implementação do programa de fazer um quadrado. Com o sistema de pergunta e resposta podemos escolher qual o tamanho do quadrado que vai ser construído. No bloco mova , utilizamos o número de passos da resposta da pergunta feita antes. O programa vai considerar o bloco resposta como um número que vai ser definido quando o usuário definir.


Operadores numéricos e lógicos

Na aba Operadores são encontrados blocos capazes de fazerem operações numéricas e lógicas. Focaremos nas operações lógicas já que as numéricas supomos que já são conhecidas(adição, multiplicação, raiz...). Os operadores lógicos sempre nos darão uma entre 2 respostas: verdadeiro ou falso. Entre eles temos as igualdades e desigualdades( maior que, igual, menor que ), o e , ou e o nao . As igualdades e desigualdades funcionam do mesmo modo que aprendemos na aula, caso seja igual(no caso do =) é verdadeiro, do contrario é falso. Já o e, ou e não funcionam de outra forma:

  • Se um argumento é falso e ele é acompanhado de um não, ele torna-se verdadeiro. Se ele é verdadeiro, torna-se falso.
  • No caso do 'e', note que usamos 2 argumentos, ele somente dará verdadeiro se os 2 argumentos forem verdadeiro. Caso contrario, o resultado será falso.
  • No caso do 'ou' ele somente dará falso se os 2 argumentos sejam falsos. Caso contrario, o resultado será verdadeiro.

Igual.png Naoigual.png


Desafio 1
  • Faça um programa que perguntará o tamanho do lado de um quadrado que o usuário deseja, que desenhe o quadrado e que diga ao final o valor da área do quadrado. OBS: Área do quadrado = lado.lado ou (lado)².


Comandos de decisão: se e senão (if else)

No mundo da programação, umas da funções mais famosas são o se e senão . Você vai encontrar esses blocos na aba de controle. Perceba que ao lado do bloco se temos um espaço. Nele devemos colocar um argumento lógico. Caso ele seja verdadeiro, o comando que está dentro do bloco se vai se executar. Caso seja falso, ele irá para o próximo comando, ignorando o que está dentro. Vejamos o exemplo:

If.png

Veja que utilizamos usamos o bloco de perguntas e como argumento para o se utilizamos a resposta igualada a 25, ou seja, o que está dentro do se só será executado caso o valor da resposta seja 25.

Já com o bloco se/senão perceba que temos espaço para 1 argumento porém temos 2 espaços para colocar comandos, um abaixo do se e outro abaixo do senão. Do mesmo modo que o bloco visto anteriormente, caso o argumento seja verdadeiro, executaremos o que se encontra abaixo do se, porém caso seja falto, executaremos o que está abaixo do senão. Veja o exemplo:

Ifelse.png


Exercícios

  • 1. Faça um programa que perguntará ao usuário o número de um mês do ano e deverá ter como resposta o mês do ano escrito por extenso.
  • 2. Faça um teste de erro para o exercício anterior para que, caso o usuário digite um número que não refere-se a um mês ou não digite um número, apareça uma mensagem de erro.
  • 3. Faça um programa que pergunte ao usuário o lado de um triângulo equilátero, faça o desenho dele e diga o valor da área. Caso o tamanho do lado seja maior que 100, calcule a área mas não desenhe e de uma mensagem de "Lado muito grande para o desenho!".

Área do triângulo equilátero: AreaTE.jpg

  • 4. Faça um programa que terá um número definido por você e que o usuário terá que adivinhar qual número é esse. Caso o número seja maior ou menor, dê uma mensagem sinalizando('número maior' ou 'número menor') e se acertar dê uma mensagem dizendo que o número está correto.

Aula 3

Variáveis

Temos por variáveis espécies de caixas que contém um valor, tanto numérico até uma palavra ou frase. Até hoje aprendemos um tipo de variável: o bloco 'resposta'. Agora, porém, vamos aprender a como utilizar diversas variáveis ao mesmo tempo.

Utilizar várias variáveis ao mesmo tempo nos dá muitas facilidades. Podemos conseguir guardar vários valores para serem utilizados em um outro momento e também interagir um com o outro.

Para criar uma variável, devemos ir na aba variáveis , clicar em criar uma Variável e selecionar o nome e o tipo de variável. Existem dois tipos de variáveis:

  • Para todos os objetos: É válida para todos os sprites do programa porém ocupa um maior espaço de memória(variável global).
  • Para este objeto apenas: É válida apenas para o objeto selecionado, não podendo ser usada em outro objeto e até podendo criar uma variável de mesmo nome em outro objeto(variável local).

Ao criar uma variável, as seguintes opções aparecem(veja imagem):

Variáveis


  • 1: Ao marcar a caixa, faz aparecer o nome da variável e o seu valor no palco;
  • 2: Muda o valor da variável para um certo valor especificado;
  • 3: Soma ou diminui(no caso de ser um número negativo) o valor da variável;
  • 4 e 5: Fazem aparecer ou desaparecer o nome e o valor da variável como no numero 1 porém de forma que pode ser implementada e feita automaticamente.


Desafio 1
  • Faça um programa capaz de calcular a área de um retângulo com os lados entrados pelo usuário. Caso os lados sejam iguais, o programa deverá dizer que a figura é um quadrado e calcular sua área normalmente.

Exercícios

  • 1 Faça um programa que o usuário entre com 3 números e ele calcule a média entre eles.
  • 2 Faça um programa que o usuário entre com 3 números e ele diga os números em ordem crescente(do menor para o maior).


Aula 4

Aula reservada para resolução exercícios e revisão geral

Essa aula foi reservada para a resolução de todos os exercícios propostos até hoje, para tirar dúvidas e apresentação de um projeto para os bolsistas.


Aula 5

Listas

Nessa aula aprenderemos como funcionam e a utilizar listas e suas funções, lembrando que as usaremos no projeto citado na aula passada. As listas no Scratch funcionam de modo que você pode guardar informações como em uma variável. Porém, cada lista pode possuir infinitos índices(posições) no qual podemos colocar várias informações em uma mesma lista, separando-as nas suas devidas posições. Tendo tais informações contidas em uma lista, podemos acessa-las facilmente informações como o conteúdo de um índice e o tamanho da lista, tanto como podemos modificar as os índices e/ou suas posições.

Opções Lista

Para criar uma lista devemos ir na aba das variáveis e clicar no botão de criar uma lista. As mesmas opções de quando você cria uma variável aparecem. Ao criar a lista aparecerá, na aba de variáveis, opções para a manipulação e acesso de dados das listas. A seguir temos o que cada bloco faz:

  • 1: Adiciona o que está escrito no espaço no fim da lista.
  • 2: Apaga um item da lista. O número no bloco refere-se a índice do item que deve ser apagado. Caso não exista esse índice, nada acontece.
  • 3: Adiciona o que está escrito no espaço na posição indicada e 'empurra' os itens que estiverem abaixo desse item 1 posição para baixo.
  • 4: Substitui o que está escrito no índice pedido por outro item.
  • 5: Retorna o valor escrito no índice pedido.
  • 6: Retorna o tamanho da lista.
  • 7: Retorna verdadeiro ou falso dependendo se a lista contem em algum índice o valor escrito.

Exercícios para a aula

  • 1: Fazer um programa em que o usuário poderá entrar com valores em uma lista toda vez que for acionado.
  • 2: Fazer um programa em que o usuário poderá entrar com valores em uma lista, podendo escolher em qual índice ele irá adicionar, toda vez que for acionado.
  • 3: Fazer um programa capaz de apagar um valor de um índice de uma lista.
  • 4: Utilizando os 2 programas feitos anteriormente, faça um programa que seja capaz de inserir e apagar itens na lista, sendo que o usuário irá escolher qual ação deverá ser feita. DICA: Utilize um sistema com a 'pergunta' para ver o que é desejado. Se 1, executa o exercícios 2. Se 2 ele executa o exercício 3.

Aula 6

Anunciando eventos

Imagine caso você tenha uma lista com nomes de pessoas. Você quer poder adicionar e remover nomes das pessoas usando o bloco de perguntas e respostas escrevendo "adicionar" e "remover". Toda vez que quisermos adicionar(ou remover) iremos executar uma mesma série de comandos(perguntar o nome da pessoa, inserir na lista, etc). Para termos um programa mais limpo e organizado, podemos usar o bloco 'Anuncie para todos'(ou anuncie para todos e espere) e o 'Quando eu ouvir'. Note que o bloco 'Quando ouvir' serve para uma iniciação de programa, semelhante à bandeira verde e o 'Quando tecla pressionada'. Esses blocos são muito utilizados em programas mais elaborados onde você quer poder executar várias tipos de tarefas diferentes em um mesmo programa.


Vamos utilizar o exemplo feito anteriormente sobre adicionar e remover na lista. Primeiramente vamos tentar simplificar totalmente o programa. Ele vai iniciar, vamos fazer uma pergunta sobre o que a pessoa deseja fazer: adicionar ou remover. Dependendo da resposta, o programa vai adicionar ou remover. Assim usamos um bloco de "Anunciar para todos e espere"(note que existem dois desse tipo, porém agora vamos usar o Anuncie e espere), clique na fecha e crie um novo evento. Vamos chama-lo de Adicionar. Repita o processo e crie um chamado Remover. Agora utilizando os blocos de decisão(se e senão) defina qual opção o usuário escolheu fazer e ponha os anunciar dentro desses blocos. Se tudo foi seguido, o seu programa deve estar semelhante a isso:


Agora, vamos começar um novo bloco. Esse bloco vai servir somente para adicionar um nome na lista. Para iniciá-lo, coloque o bloco "Quando eu ouvir Adicionar" e implemente abaixo um 'mini-programa' para adicionar um nome na lista conforme o usuário desejar(como já deve ter sido feito em aulas anteriores). Agora façamos o mesmo com o Remover. Com tudo feito, inicie o programa e tente perceber por onde o programa está passando. Veja que ao chegar a um anuncie, ele se desloca do bloco principal para o Adicionar ou Remover, executa todo o processo la e volta ao programa principal. Basicamente criamos uma espécie de menu(principal) e os blocos de anunciar são as aplicações que o programa deve fazer. Veja que com o anunciar fica muito fácil de conseguir fazer um loop onde você pode executar a mesma atividade de adicionar e remover quantas vezes quiser de uma maneira bem organizada.

Aula 7: Placa Picoboard

O que é?

A placa Picoboard é um hardware alimentado via usb no computador no qual você tem diversas formas de interação com o Scratch. Com ela podemos ter uma interação mais interessante com o usuário e conseguir usar mais a criatividade para a criação de programas. Os kits vem acompanhados de:

  • Uma placa Picoboard.
  • Um cabo USB para a conexão com o computador e para sua alimentação;
  • 4 conectores para medição de resistência com, na ponta, pares jacarés(garrinhas);
Picoboard

Composição

Embutido na placa temos uma série de componentes que podemos interagir com o computador. Entre eles:

  • Sensor de som(Sound sensor): Funciona como uma variável que vai variar de 0 a 100 dependendo do quão ruidoso estiver o ambiente próximo. Quanto mais barulho, maior é o valor;
  • Sensor de luz(Light sensor): Funciona como uma variável que vai variar de 0 a 100 dependendo da quantidade de luz que o sensor está captando. Quando mais luz, maior é o valor;
  • Deslizados(Slider): Espécie de barra deslizando que vai variar o valor de uma variável conforme a posição que se encontra. O valor varia de 0 a 100;
  • Botão pressioável(Push button): Botão no qual é possível pressionar. No Scratch vai funcionar como uma variável que vai ser se o botão está ou nao está pressionada(verdadeiro ou falso);
  • Entradas de resistência(Inputs for resistence): 4 entradas(acomnpanha os conectores) que serve para medir a resistência entre 2 pontos. O valor varia de 0 a 100 e não varia linearmente(curva logarítimica).