Você está na página 1de 35

SUMÁRIO

Introdução 3
Benefícios 5
Mitos 5
Conhecendo algumas ferramentas 6
Apresentando o Scratch 7
Meu primeiro jogo 19
Conclusão 34
O Autor 35

www.wagnerlssoares.com.br
INTRODUÇÃO
A cada dia que passa estamos consumindo
mais informação, entretenimento e nos
relacionando através das novas tecnologias
que estão disponíveis em nossas mãos e,
muitas vezes, não nos damos conta disso.

Passamos cada vez mais tempo consumindo


tecnologias e isso se dá pela popularização
da internet e dos aparelhos eletrônicos.

Primeiro vieram os PCs e NoteBooks, depois


vieram os tablets, até que chegaram os
SmartPhones que ficaram populares no início
dessa década e causaram uma grande
revolução no cenário tecnológico.

Vocês devem estar me perguntando, mas o


quê isso tem a ver com Programação? TUDO!
Pois, todas estas informações, entretenimento
e a forma como nos relacionamos estão
disponíveis para nós através de aplicativos.
Para construir estes aplicativos com certeza é
necessário um certo nível de conhecimento
em programação. Além disto, estes
aplicativos estão presentes em nossas vidas
de diversas formas, por exemplo, o
computador de bordo do carro nada mais é do
que um aplicativo interagindo com os
dispositivos eletrônicos do carro para nos
fornecer informações.

03
www.wagnerlssoares.com.br
Outro ponto que podemos destacar, é a
evolução da Internet das Coisas (IoT), que
nada mais é do que um conceito de interligar
as coisas do dia a dia com a internet, um
exemplo é a utilização do celular para
controlar os objetos da sua casa como o ar-
condicionado, tv, luzes etc. “Segundo
projeções da consultoria McKinsey, a conexão
do mundo físico com o mundo digital pode
gerar US$ 11,1 trilhões por ano em 2025.”

O Ministério da Ciência, Tecnologia,


Inovações e Comunicações (MCTIC),
divulgou na Futurecom de outubro de 2017
que a estimativa para o Brasil é que este
número fique em torno de 50 a 200 bilhões de
dólares.

Por estes motivos e por acreditar que a


programação estará cada vez mais presente
em nosso cotidiano, eu resolvi escrever este
e-book para lhe ajudar a começar a entender
como você pode aprender a programar de
uma forma simples e visual, para que você
não fique fora desta revolução que acontecerá
nos próximos anos.

Para alguns especialistas saber programar


será tão importante neste século como saber
ler e escrever foi para o século passado.

04
www.wagnerlssoares.com.br
Assista este vídeo e veja o que pessoas como Steve Jobs, Bill
Gates e Mark Zuckerberg entre outros pensam sobre este assunto.

https://youtu.be/nKIu9yen5nc

Benefícios
Desenvolve o raciocínio lógico e matemático.
o Estimula a criatividade e o pensamento crítico.
o Ensina a pensar de forma sistêmica e a resolver problemas.
o Estimula o trabalho em equipe e por projeto.

Mitos
o Todo mundo pode aprender a programar?
O primeiro passo é descontruir o conceito de que programar é uma
coisa de outro mundo, que foi feito para quem é um gênio ou para quem
nasceu com a predisposição para a área de exatas, ou até mesmo para
quem quer seguir na área de tecnologia da informação e se tornar um
programador, analista de sistema ou similar. Hoje em dia, existem várias
ferramentas que você pode usar para aprender a programar sem
escrever uma linha de código sequer, de forma visual, simples e de fácil
absorção e eu vou lhe provar isso mais a frente.

o Preciso de um alto investimento para começar a programar?


NÃO! Muitas dessas ferramentas são gratuitas e não precisam sequer
ser instalada na sua máquina para que você comece a programar.
Existem ferramentas que estão disponíveis online para você começar a
programar basta ter um computador com acesso à internet e criar um
login para acessar um destes ambientes. Feito isso, você pode começar
a criar seus projetos e dar asas a sua imaginação.

05
Conhecendo algumas ferramentas.
Vamos conhecer algumas ferramentas disponíveis no mercado na qual
você pode utilizar para aprender a programar.
o Blockly - É uma ferramenta da Google de fácil aprendizado porque
utiliza um editor visual de programação, não é preciso escrever uma
linha de código. É uma ferramenta gratuita e não é necessário a
instalação no seu computador e é utilizado para gerar código para
Websites e aplicativos para dispositivos moveis.

o Kodu - Produzido pela Microsoft tem o objetivo de ensinar a criar


jogos em 3D e ao mesmo tempo programar. Utiliza ícones intuitivos
para programar os seus objetos. É indicado para crianças ou adultos
que querem aprender a criar jogos. É uma ferramenta gratuita e é
preciso baixar o software e instalar na máquina.

o Minecraft - Muito provável que você ou seu filho já tenha jogado


algum jogo que foi criado com esta ferramenta. Esta ferramenta foi
comprada pela Microsoft e é uma referência no mercado de jogos, ela
é uma ferramenta paga. Ela permite a criação de jogos em 3D através
de blocos sem necessidade de escrever código.

o Scratch - Foi criado pelo MIT (Instituto de Tecnologia de


Massachusets), ele é focado para crianças de 8 a 16 anos, mas pode
ser utilizado por pessoas de várias idades. Ele permite a criação de
animação e jogos sem a necessidade de escrever uma linha de
código. O Scracth é uma ferramenta gratuita e disponível em versão
on-line e off-line.

06
Bom a ferramenta que eu escolhi para detalhar um pouco mais para
você aqui foi o Scracth, você deve estar me perguntado por que o
Scracth? Pela minha experiência de programação e pelas minhas
pesquisas, ela é uma das ferramentas mais fáceis e intuitivas para
aprender a programar de forma visual, simples e lúdica. Ela também
permite que seus projetos sejam compartilhados com a comunidade
através do site www.scratch.mit.edu/ .

Apresentando o Scratch
1-Conhecendo o Scracth

1.1 - Palco, é o local onde visualizamos o Ator/Sprite, é nesse local que


visualizaremos a nossa estória, animação ou jogo;

1.2 - Nome do projeto, botões para iniciar (bandeira verde) e parar


(círculo vermelho) a execução do script;

1.3 - Botões, servem para duplicar ator(carimbo), apagar ator (tesoura),


aumenta o tamanho do ator (Setas para fora) e diminui o tamanho do
ator(setas para dentro);

07
1.4 - Seleção de script (locais onde ficaram os blocos de código que
você irá construir), fantasias (ou trajes são uma cópia do ator que pode
ser utilizado para dar ideia de movimento, por exemplo) e som.

1.5 - Categoria de comandos: Movimento, Aparência, Som, Caneta,


Controle, Sensores, Operadores, Variáveis;

1.6 - Bloco de comandos, ao escolher uma categoria de comando temos


várias opções de comandos;

1.7 - Área de edição (depende da aba selecionada – item anterior 4),


este é local onde montaremos os blocos de comando;

1.8 - Área que disponibiliza a seleção/criação do palco.

1.9 - Área que disponibiliza a seleção/criação dos Atores/Sprites.

2 – Conhecendo os comandos dos atores.


2.1- Movimento – Nesta categoria de comandos você irá programar seu
ator para se movimentar no palco considerando as coordenadas X e Y.

COMANDO DESCRIÇÃO

Move o ator para frente ou para


trás colocando número positivo
ou negativo.
Gire o ator no sentido horário x
graus.

Gire o ator no sentido anti-horário


x graus.

Aponte o ator para uma direção


especificada, x graus.
08
Move o ator até o ponteiro do
mouse.
Colocar o nome do site
Move o ator para a posição x e y
especifica.
Move o ator até o ponteiro do
mouse.
Deslize o ator para a posição
especificada no tempo
determinado.
Adicione um valor a posição x.

Leve o ator para a posição x na


horizontal.
Adicione um valor a posição y.

Leve o ator para a posição y na


vertical.
Quando o ator tocar na borda ele
vai retornar.
Muda o estilo de rotação do ator.

Permite visualizar no palco a


posição X que o ator se encontra.
Permite visualizar no palco a
posição y que o ator se encontra.
Permite visualizar a direção do
seu ator no palco.

2.2- Aparência – Nesta categoria você programará o ator para interagir


no jogo, na estória ou na animação. O ator poderá falar, se esconder ou
mudar de cor.

09
2.2- Aparência – Nesta categoria você programará o ator para interagir
no jogo, na estória ou na animação. O ator poderá falar, se esconder ou
mudar de cor.

COMANDO DESCRÇÃO
Colocar o nome do site

Mostre o texto por um tempo


determinado.
Mostre o texto em uma conversa.

Mostre o texto em um balão de


pensamento por um tempo
determinado.
Mostre o texto em um balão de
pensamento.
Faz o ator aparecer.

Faz o ator esconder.

Mude a fantasia do ator para a


escolhida.
Troca a fantasia para próxima.

Mude o fundo de tela para o


fundo escolhido.
Adiciona o efeito escolhido na
intensidade determinada.
Mude o efeito escolhido para a
intensidade determinada.
Apaga os efeitos gráficos dos
atores ou do palco.
Acrescenta ao ator o tamanho
determinado.
Acrescenta ao ator o tamanho
determinado.

10
COMANDO DESCRÇÃO

Altera o tamanho do ator para x%


dodotamanho
Colocar o nome site original.
Altera o posicionamento do ator
para frente caso haja
sobreposição.
Permite visualizar o número da
fantasia no palco.
Permite visualizar o nome do
pano de fundo.
Permite visualizar o tamanho do
ator.

2.3- Som – Nesta categoria você programará o som que o seu jogo,
estória ou animação estará emitindo.

COMANDO DESCRIÇÃO

Toque o som selecionado e


passe para o próximo bloco,
mesmo que não tenha terminado
de tocar.
Toque o som selecionado até que
termine e então segue para o
próximo bloco.
Pare de executar todos os sons.

Toque o som do tambor


selecionado durante o tempo
definido.
Pare de tocar pelo tempo
definido.
Toque a nota (Dó, ré, mi...)
selecionada durante o tempo
definido.
11
Define o instrumento selecionado
para
Colocar o nome tocar.
do site

Adiciona o valor digitado ao


volume.

Muda o volume em x%
especificado.
Mostra o volume.

Altera o tempo entre as batidas


de acordo com o valor definido.
Mude o tempo entre as batidas
para o valor definido.
Mostre o tempo.

2.4- Caneta – Nesta categoria você programará o ator para desenhar no


palco.

COMANDO DESCRIÇÃO

Limpe todos os traços e carimbos


do Palco.
Carimbe a imagem do ator no
Palco.

Abaixe a caneta do ator para


desenhar no Palco.

Tire a caneta do ator para não


desenhar no Palco.
Mude para a cor definida.

Adicione o valor definido a cor.

12
COMANDO DESCRÇÃO

Mude a cor da caneta para o


valor
Colocar o nome definido.
do site

Adicione à tonalidade da caneta


o valor definido.
Mude à tonalidade da caneta
para o valor definido.
Adicione o valor definido à
espessura da caneta.
Mude a espessura da caneta
para o valor definido.

2.5- Variáveis – Nesta categoria você conseguirá definir variáveis ou


lista de variáveis armazenar informações. Por exemplo: variável ponto
que será utilizada para somar e mostrar a quantidade de pontos que o
jogador fez.

COMANDO DESCRIÇÃO

Botão que cria as variáveis.

Variável chamada ponto que foi


criada como exemplo.

Mude o valor da variável para o


valor definido.

Adicione o valor definido à


variável.
Mostre a variável.

Esconda a variável.

Botão que permite criar uma lista


de variáveis.
Variável chamada nome criada
para guardar uma lista.
13
Insira o texto definido à lista.
Colocar o nome do site
Apague o conteúdo da posição
definida da lista.
Insira o texto definido na posição
selecionada da lista.
Substitua o texto da posição
definida pelo texto definido.
Retorna o texto armazenado na
posição definida.
Retorna o tamanho da lista.

Verifica se a lista contém o valor


especifico.
Mostre a lista.

Esconde a lista.

2.6- Eventos – Nesta categoria você defini qual condição será


necessária para que seu jogo, estória ou animação comece a executar.

COMANDO DESCRIÇÃO

Execute o script quando a


bandeira verde for clicada.

Execute o script quando a tecla


selecionada for pressionada.

Execute o script do ator quando


for clicado no Palco.

Execute o script quando o plano


de fundo mudar para o fundo
definido.
14
COMANDO DESCRÇÃO

Execute o script quando a opção


selecionada
Colocar o nome do site for maior do que o
valor definido.
Execute o script quando receber
a mensagem definida.

Envie a mensagem definida para


todos e continue executando o
próximo bloco.
Envie a mensagem definida para
todos e espere o retorno.

2.7- Controle – Nesta categoria você irá definir as condições de


controles necessárias para que seu jogo, estória ou animação execute
do jeito que você está pensando.

COMANDO DESCRIÇÃO

Espere até que a condição seja


verdadeira para executar próximo
bloco.
Repete o bloco de comandos o
número de vezes definido.

Execute o bloco de comandos e


só pare se for clicado ou se
houver um comando para parar.
Execute o bloco de comandos se
a condição for verdadeira.

Execute o bloco de comandos se


a condição for verdadeira, caso o
contrário execute o bloco de
comandos contidos no senão.

15
COMANDO DESCRÇÃO

Espere até que a condição seja


satisfeita
Colocar o nome do site para executar o
próximo bloco.

Repita o bloco de comandos até


que a condição seja satisfeita.

Pare a execução de todos os


scripts.
Começa a executar o bloco de
comandos quando o clone (cópia
do ator) for criado.
Crie um clone do ator, uma cópia.

Apague um determinado clone


do ator.

2.8- Sensores – Nesta categoria você programará o ator para interagir


no palco ou com o usuário.

COMANDO DESCRIÇÃO

Retorna verdadeiro se o ator


estiver tocado na opção
selecionada.
Retorna verdadeiro se o ator
estiver tocando na cor
selecionada.
Retorna verdadeiro se a primeira
cor selecionada estiver tocando a
segunda cor selecionada.
Retorna a distância do ator até a
opção selecionada.

16
COMANDO DESCRÇÃO

Apresenta uma pergunta na tela


e do
Colocar o nome espera
site pela resposta a ser
digitada no teclado, somente
após o clique do Enter o
programa continuará a execução.
Retorna o valor digitado no
teclado no caso do comando
acima (pergunta).
Retorna verdadeiro se a tecla
selecionada for pressionada.
Retorna verdadeiro se o mouse
for pressionado.
Retorna a posição do mouse em
relação ao eixo x.
Retorna a posição do mouse em
relação ao eixo y.
Habilita o microfone do
computador para absorver o
ruído.
Retorna o movimento do que
está sendo filmado.
Liga e desliga a câmera de vídeo
do computador.
Altera a transparência do vídeo
de acordo com o percentual
definido.
Mostra o cronometro.

Zera o cronometro.

Mostra a posição x do ator.

Mostra a informação atual de


data ou hora selecionada.
17
COMANDO DESCRÇÃO

Retorna o número de dias desde


o do
Colocar o nome anosite
2000.

Retorna o nome do usuário


logado no scracth.

2.9-Operadores – Nesta categoria você programará as operações


matemáticas ou condições.

COMANDO DESCRIÇÃO

Soma dois números.

Subtrai dois números.

Multiplica dois números.

Divide dois números.

Retorna um número aleatório


entre os dois números definidos.
Verifica se o primeiro número é
menor do que o segundo
número.
Verifica se o primeiro número é
igual ao segundo número.
Verifica se o primeiro número é
maior do que o segundo número.
Verifica se as duas condições
são satisfeitas.
Verifica se pelo menos uma das
condições é satisfeita.
Retorna verdadeiro quando a
condição não for satisfeita.

18
COMANDO DESCRÇÃO

Junta os dois textos digitados.


Colocar o nome do site
Retorna a letra da posição
definida.
Retorna o tamanho do texto
digitado.
Retorna o resto da divisão do
primeiro número pelo segundo.
Retorna o arredondamento do
número definido.
Retorna a raiz quadrada do
número definido

2.10- Mais Blocos – Nesta categoria de comandos você poderá criar seu
próprio bloco ou até mesmo adicionar um hardware como extensão. Mas
este item é considerado avançado e não indicado para quem está
começando a conhecer o Scratch.

Meu primeiro jogo


Agora chegou a grande hora, está preparado?
Vamos construir nosso primeiro projeto?
Para este primeiro projeto eu selecionei um exercício bem legal, vamos
programar um jogo simples chamado Pong, se você for adulto com
certeza vai lembrar desse jogo.

Programando este jogo iremos dar os primeiros passos com o scracth.


Vamos ao que interessa, primeiro entre no site do scratch
https://scratch.mit.edu.

Se você já é cadastrado no Scracth clique em Entrar e faça seu login,


caso o contrário clique no botão Aderir ao Scratch e entre com seus
dados, é bem simples e rápido.
19
Clique no botão Criar que irá abrir a tela que vimos no item 3.5.

A primeira coisa a se fazer é apagar o ator gatinho, clique com o botão


direito em cima dele e selecione a opção apagar.

20
Vamos selecionar nosso palco, clique no botão Escolher Pano de
Fundo da Biblioteca.

Selecione a categoria Outro, depois selecione o fundo neon tunnel e


clique no botão OK.

21
A sua tela deve ficar assim:

Agora vamos selecionar o primeiro ator e começar a programá-lo.


Clique no botão Escolher Ator da Biblioteca.

Selecione a categoria todos, depois selecione o ator Ball e clique no


botão OK.

22
Feito isso selecione o ator Ball.

Selecione a Aba Script depois selecione a categoria de comandos


Eventos.

Clique com o botão esquerdo do mouse na opção Quando clicar em iiii


e arraste para a área de edição.

Continuado a programação, selecione na Aba Script a categoria de


comandos Controle.
23
Clique com o botão esquerdo do mouse na opção Sempre e arraste
para a área de edição.

Selecione na Aba Script a categoria de comandos Movimento.

Clique com o botão esquerdo do mouse na opção mova 10 passos


Sempre e arraste para a área de edição, faça o mesmo para a opção se
tocar na borda, volte. Altere 10 passos para 15 passos.

24
Com este primeiro bloco você acabou de programar seu ator (a bola)
para movimentar na tela.

Precisamos ainda mudar a direção que o ator Ball se movimenta na tela,


para isso cliquei no i do ator que irá abrir a tela abaixo, ajuste a direção
para 60º e o estilo de rotação

Quando clicar na opção Quando clicar em o bloco começará a


execução. O controle Sempre executará todos os comandos que
estiverem dentro dele até que o botão seja clicado, neste caso vai
mover 15 passos e se tocar na borda o ator irá retornar.

Faça o teste, clique na .

Agora vamos incluir e programar o segundo Ator do nosso jogo.

Cliquei no botão Novo Ator e Selecione a categoria coisas, depois


selecione o ator Paddle e clique no botão OK.

25
Clique no Ator Paddle e arraste ele para a parte inferior do palco.

Inclua os comandos Quando clicar em , Sempre e mude x para 0.


Selecione na Aba Script a categoria de comandos Sensores.

Clique com o botão esquerdo do mouse na opção posição de x do


mouse e arraste para a área de edição dentro do comando mude x
para 0.

26
Quando clicar na opção Quando clicar em o bloco começará a
execução o ator Paddle se movimentara dentro do palco seguindo o
mouse. Faça o teste, clique na .

Agora vamos voltar ao ator Ball e programar seu segundo bloco de


comandos.

Inclua os comandos: Quando clicar em , Sempre, Se então,


tocando em ponteiro do mouse, gire em 15 graus, mova 10 passos
e espere 1 seg.

Comando devidamente incluídos vamos as alteração:


o No tocando em ponteiro do mouse mude para paddle;
o no gire em 15 graus mude para 180 graus;
o no mova 10 passos mude para 15 passos;
o no espere 1 seg mude para 0,5 seg.

27
Quando clicar na opção Quando clicar em o bloco começará a
execução e quando o ator ball tocar no ator padlle ele irá:
Mudar a direção em 180 graus, Mover 15 passos para que o ator ball
não fique preso ao paddle e Esperar meio segundo para executar
novamente o comando Se então.

Feito isso, agora precisamos definir o término do jogo nos casos em que
o jogador atinja o objetivo ou no caso em que perca o jogo.

Vamos incluir mais três atores. Primeiro vamos incluir uma linha que irá
delimitar o fim do jogo caso o ator ball toque-a.

Clique em Pintar Novo Ator.

28
Depois de criado o novo ator clique em linha e desenhe uma linha
vermelha na parte inferior do palco.

Caso a linha não esteja na posição correta, clique e arraste para a


posição desejada. Você também pode alterar a espessura da linha.

Clique duas vezes no botão Pintar Novo Ator.

No Ator 2 você vai selecionar a caixa de texto e digitar GANHOU.


No ator 3 você também vai selecionar a caixa de texto e digitar GAME
OVER.

29
Feito isso, concluímos a inclusão de atores, vamos concluir a
programação.

Vamos programar a linha vermelha:


Crie uma variável para controlar o fim do jogo caso o jogador tenha
perdido o jogo. Clique em criar variável, de um nome a esta variável,
neste caso vamos nomeá-la de Game Over, deixe selecionado a Opção
“Para todos atores”, com isso, todos os atores poderam acessar seu
conteúdo e clique em OK.

30
Inclua os comandos: Quando clicar em , Vá para X: Y:, Sempre, Se
então, tocando em ponteiro do mouse e adicione Acabou 1.

Comando devidamente incluídos vamos as alteração:


o No Vá para X: Y: mude os valores de X para 0 e Y para -170
o No tocando em ponteiro do mouse mude para ball.
o Desmarque a variável acabou para que ela não seja exibida no palco.

Não deixe de testar o jogo.

Vamos programar o ator Ganhou:


Crie uma variável para controlar os pontos e determinar um limite para o
jogador vencer o jogo, siga os mesmos passos que utilizou para a
variável Game Over.

Inclua os comandos: Quando clicar em , Esconda, Espere até,


Operador >, mostre e Pare todos.

Inclua a variável Pontos no Operador > e altere o valor para 5.


Selecione a variável pontos para aparecer no palco.

31
Vamos programar o ator Game Over:
As únicas diferenças entre o Ganhou e o Game Over são os
operadores, que neste caso utilizaremos o igual e a variável que será a
Game Over.

Ops, Não deixe de testar, mais uma vez.

32
Bom, agora com todos os atores e variáveis criados e programados,
precisamos voltar ao ator Ball e concluir a programação do mesmo.

Inclua os comandos: mude Pontos para 0, mude Game Over para 0 e


Esconda, Espere até, Operador >, mostre e Pare todos.

Mais uns testes... e é só começar a jogar e usar sua criatividade para


incrementar este jogo simples, mas que lhe ensinou os primeiros passos
em programação de jogo com scratch.

33
Conclusão
Como vocês podem notar em pouco tempo conseguimos criar um jogo
bem simples e dar os primeiros passos na programação.

Aprendemos o que é uma variável, uma condição, uma estrutura de


repetição e operadores, além disso, apesar de não tocarmos no assunto
aprendemos coordenadas (X e Y), aplicamos conceitos básicos de ator
e palco do scracth.

Aprendemos isto tudo nos divertindo e brincando...


Ah! Podemos compartilhar nosso jogo com outras pessoas no próprio
scracth.

Se você quer aprender mais sobre como programar brincando nos


acompanhe no Facebook, Instagram e youtube estaremos postando
constantemente dicas, ensinando a fazer jogos bem divertidos e caso
tenha alguma dúvida envie para nosso e-mail de contato que terei o
maior prazer de responder todas e quem sabe não gravo um vídeo com
sua dúvida.

34
O Autor
Wagner Soares é especialista em TI e
gerenciamento de projetos, apaixonado
por programação, idealizador da Play
Coding, que ensina programação para
crianças e adolescente através de
criação de jogos e animações.

Wagner teve seu primeiro contato com programação aos 17 anos.


Começou sua vida profissional aos 19 anos, desde então programou em
várias linguagens atuando em vários projetos de diversos segmentos.

Wagner e seu time da Play Coding acreditam que saber linguagem de


programação ajudará as crianças e os adolescentes a desenvolverem
uma série de habilidades essências para qualquer carreira que venham
a escolher ou até mesmo ajudar a lidar com a enxurrada de tecnologia
que estar por vir nas próximas décadas, por isso, resolvemos levar este
conhecimento ao maior número de pessoas possíveis ajudando-as a em
seu desenvolvimento e crescimento.

“Aprender a programar nos ensina a pensar.” Steve Jobs

35

Você também pode gostar