|
|
Linha 799: |
Linha 799: |
| ;15/10/2012 | | ;15/10/2012 |
| *Desenvolvimento de um ''banner'' para a mostra científica nacional. | | *Desenvolvimento de um ''banner'' para a mostra científica nacional. |
− | {{collapse bottom}}
| |
− |
| |
− | =Oficina AppInventor=
| |
− | ==Tutorial Calculadora:==
| |
− | ===Especificação===
| |
− | ;Inicia com o display mostrando o valor "0";
| |
− | ;Quando um botão-operador for clicado, armazena o valor do display numa variável ou lista e muda o display pra 0;
| |
− | ;Realizar as quatro operações básicas da matemática;
| |
− | ;Implementação da virgula;
| |
− | ;Máx. de dígitos: "-" + "," + 7 digítos.
| |
− |
| |
− | ==Planejamento das Oficinas==
| |
− | ===Análise Inicial===
| |
− | Este conteúdo possui como público alvo os alunos da disciplina [[PJI1-EngTel]] do curso de Engenharia de Telecomunicações do [http://www.sj.ifsc.edu.br/ Instituto Federal de Santa Catarina - Campus São José].
| |
− | ===Hierarquia de Objetivos das Lições===
| |
− | *Desenvolver programas/aplicações utilizando o [[AppInventor]] para futura implementação no [[PJI1-EngTel]].
| |
− | ====Lição I====
| |
− | '''1- Construir casos de usos para saber definir o que é uma aplicação e qual sua função.'''
| |
− | *1.1- Entender o que é uma Aplicação do ponto de vista computacional;
| |
− | *1.2- Descrever o comportamento de uma aplicação durante um caso de uso simples;
| |
− | *1.3- Relacionar conceitualmente procedimentos e eventos;
| |
− | *1.4- Utilizar diagramas de sequência para descrever os procedimentos realizados.
| |
− | '''2- "Explorar" o [[AppInventor]].'''
| |
− | *2.1- Consultar a [http://appinventor.mit.edu/explore/content/reference-documentation.html Documentação de Referência];
| |
− | *2.2- Criar um novo projeto;
| |
− | *2.3- Entender como funciona o [[AppInventor]]: O que são <tt>Designer</tt> e <tt>Blocks</tt>?;
| |
− | *2.4- Entender a funcionalidade do <tt>Designer</tt>;
| |
− | *2.5- Entender a funcionalidade do <tt>Blocks</tt>;
| |
− | *2.6- Salvar um projeto;
| |
− | *2.7- Importar e exportar projetos;
| |
− | *2.8- Transferindo um projeto para um sistema ''Android''.
| |
− | '''3- Conceitos Básicos.'''
| |
− | *3.1- Saber diferenciar conceitos básicos: Váriável, Lista, Procedimento, Evento, Componente e Propriedade;
| |
− | *3.2- Saber como criar/alterar os itens presentes em 3.1 no [[AppInventor]];
| |
− | *3.3- Entender a diferença entre a utilização de <tt>Sprites</tt> no [http://scratch.mit.edu/ Scratch] e a de Componentes no [[AppInventor]].
| |
− | **3.3.1- Entender o que é um <tt>Sprite</tt>;
| |
− | **3.3.2- Entender o que é um ''Script''.
| |
− | '''4- Entender como construir procedimentos baseados em eventos (''Script'').'''
| |
− | *4.1- Desenvolver o exemplo de caso: Tutorial Hello Purr;
| |
− | **4.1.1- Explorar as propriedade da <tt>Screen1</tt>;
| |
− | **4.1.2- Criar um <tt>Label</tt> e um <tt>Button</tt>;
| |
− | **4.1.3- Explorar as propriedades do <tt>Label</tt> e do <tt>Button</tt> recém-criados;
| |
− | **4.1.4- Carregar Mídias (imagem e som);
| |
− | **4.1.5- Utilizar mídias carregadas nas propriedades dos componentes;
| |
− | **4.1.6- Criar Blocos de eventos;
| |
− | **4.1.7- Desenvolver um ''Script'' que possua um evento como pré-requisito e um procedimento como consequência;
| |
− | **4.1.8- Conectar um Sistema ''Android''/emulador ao <tt>Blocks</tt>;
| |
− | **4.1.9- Testar aplicação.
| |
− | ***4.2- Aperfeiçoar HelloPurr alterando somente suas propriedades (não criando novos componentes).
| |
− | {| border="4" cellpadding="3"
| |
− | !ITEM
| |
− | !ATIVIDADE
| |
− | !OBJETIVO
| |
− | !MÉTODO
| |
− | !TEMPO
| |
− |
| |
− |
| |
− | |-
| |
− | | '''1'''
| |
− | ||Introduzir conceitos básicos de programação.
| |
− | ||1; 1.1; 1.2; 1.3; 1.4
| |
− | ||Apresentação de ''Slides''
| |
− | ||10 minutos
| |
− | |-
| |
− | | '''2'''
| |
− | ||Apresentação ''Light'' do [[AppInventor]], a funcionalidade básica da ferramenta deve ser apresentada (Diferenças entre o <tt>Blocks</tt> e o <tt>Designer</tt>).
| |
− | ||2; 2.1; 2.2; 2.3; 2.4; 2.5; 2.6; 2.7; 2.8; 2.8
| |
− | ||Utilizar o [[AppInventor]] no projetor
| |
− | ||15 minutos
| |
− | |-
| |
− | | '''3'''
| |
− | ||Traduzir conceitos básicos de programação para [[AppInventor]], "explorando" o <tt>Designer</tt> e o <tt>Blocks</tt>.
| |
− | ||3; 3.1; 3.2
| |
− | ||Utilizar o [[AppInventor]] no projetor e apresentação de ''Slides''
| |
− | ||5 minutos
| |
− | |-
| |
− | | '''4'''
| |
− | ||Diferenciar [http://scratch.mit.edu/ Scratch] de [[AppInventor]], a mudança de <tt>Sprites</tt> para componentes.
| |
− | ||3; 3.3; 3.3.1; 3.3.2
| |
− | ||Utilizar o [[AppInventor]] e [http://scratch.mit.edu/ Scratch] no projetor
| |
− | ||5 minutos
| |
− | |-
| |
− | | '''5'''
| |
− | ||Desenvolver o Tutorial HelloPurr.
| |
− | ||4; 4.1; 4.1.1; 4.1.2; 4.1.3; 4.1.4; 4.1.5; 4.1.6; 4.1.7; 4.1.8; 4.1.9
| |
− | ||Utilizar o [[AppInventor]] no projetor
| |
− | ||30 minutos
| |
− | |-
| |
− | | '''6'''
| |
− | ||Mostrar possibilidades de melhoramentos da aplicação HelloPurr, "enfeitando-o" (alterar as propriedades dos componentes já existentes.
| |
− | ||4; 4.2
| |
− | ||Utilizar o [[AppInventor]] no projetor
| |
− | ||Tempo restante
| |
− | |}
| |
− |
| |
− | ====Lição II====
| |
− | '''5- Praticar e expandir conhecimentos já adquiridos.'''
| |
− | *5.1- Desenvolver o exemplo de caso: Tutorial PaintPot.
| |
− | **5.1.1- Rever conceitos dos componentes <tt>Button</tt> e <tt>Screen</tt>;
| |
− | ***5.1.1.1- Editar propriedades "mais específicas" dos componentes <tt>Button</tt> e <tt>Screen</tt> (<tt>AlignHorizontal</tt>, <tt>ScreenOrientation</tt>, <tt>Scrollable</tt>, <tt>BackgroundColor</tt>, <tt>Shape</tt>...). Observação: Procurar utilizar a [http://appinventor.mit.edu/explore/content/reference-documentation.html Documentação de Referência] para as propriedades que possuem função desconhecida.
| |
− | **5.1.2- Entender a função de um <tt>ScreenArrangement</tt> e de suas variações (Horizontal, Vertical e ''Table'');
| |
− | **5.1.3- Criar um <tt>ScreenArrangement</tt>;
| |
− | ***5.1.3.1- Entender como expressar o valor das propriedades <tt>Width</tt> e <tt>Height</tt> de três maneiras possíveis e suas respectivas funções como propriedades de um componente.
| |
− | **5.1.4- Aprender a inserir componentes em <tt>ScreenArrangements</tt>;
| |
− | **5.1.5- Entender conceitualmente a função de um <tt>Canvas</tt>;
| |
− | **5.1.6- Criar um <tt>Canvas</tt> com uma área que se ajuste automaticamente ao tamanho da <tt>Screen</tt>;
| |
− | **5.1.7- Saber criar blocos de eventos relacionados a componentes <tt>Buttons</tt> e como "juntá-los" (encadeá-los) a procedimentos derivados do componente <tt>Canvas</tt> para formar um ''Script'';
| |
− | **5.1.8- Utilizar blocos de eventos do <tt>Canvas</tt> para realizar procedimentos de desenho no próprio <tt>Canvas</tt> (desenhar retas, círculos...);
| |
− | **5.1.9- Possibilidades de melhoramentos da aplicação PaintPot (adição de novas funcionalidades).
| |
− |
| |
− | {| border="4" cellpadding="3"
| |
− | !ITEM
| |
− | !ATIVIDADE
| |
− | !OBJETIVO
| |
− | !MÉTODO
| |
− | !TEMPO
| |
− |
| |
− |
| |
− | |-
| |
− | | '''1'''
| |
− | ||Iniciar o desenvolvimento do Tutorial PaintPot no <tt>Designer</tt> para recuperar conceitos vistos anteriormente.
| |
− | ||5; 5.1; 5.1.1; 5.1.1.1
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |-
| |
− | | '''2'''
| |
− | ||Entender e aplicar o conceito de <tt>ScreenArrangements</tt> e das propriedades <tt>Width</tt> e <tt>Height</tt> (no Tutorial PaintPot).
| |
− | ||5; 5.1; 5.1.2; 5.1.3; 5.1.3.1; 5.1.4
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |-
| |
− | | '''3'''
| |
− | ||Utilizar o componente <tt>Canvas</tt> e definir sua área (no Tutorial PaintPot).
| |
− | ||5; 5.1; 5.1.5; 5.1.6
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |-
| |
− | | '''4'''
| |
− | ||Criar um ''Script'' que "utilize" os componentes <tt>Canvas</tt> e <tt>Button</tt>. Utilize a relação Evento-Procedimento (no Tutorial PaintPot).
| |
− | ||5; 5.1; 5.1.7; 5.1.8
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |-
| |
− | | '''5'''
| |
− | ||Aplicar alterações na aplicação PaintPot que objetivem expandi-la (adicionar funcionalidades). Procurar usar a criatividade (botões que limpe a tela,façam triângulos, quadrados...).
| |
− | ||5; 5.1; 5.1.9
| |
− | ||Autônomo (sem auxílio), receber o resultado final para avaliação
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |}
| |
− |
| |
− | ====Lição III====
| |
− | '''6- Desenvolver Tutorial MoleMash para compreender a função de novos componentes (<tt>Clock</tt> e <tt>ImageSprite</tt>).'''
| |
− | *6.1- Saber criar um <tt>Canvas</tt> com um <tt>ImageSprite</tt> que possua uma <tt>BackgroundImage</tt> (delimitar a área de ambos);
| |
− | **6.1.1- Saber encadear o bloco de eventos <tt>Screen1.Initialize</tt> com um procedimento que reconfigure a área do <tt>Canvas</tt>;
| |
− | **6.1.2- Saber utilizar o bloco de eventos <tt>Screen1.Initialize</tt> para ajustar a área de um <tt>ImageSprite</tt> em função da área do <tt>Canvas</tt>. Exemplo: Área do <tt>ImageSprite</tt> = 1/10 Área do <tt>Canvas</tt>.
| |
− | *6.2- Saber criar botões que mostrem textos que expliquem sua função e que realizem procedimento(s) quando clicados;
| |
− | *6.3- Saber desenvolver UM <tt>Label</tt> que mostre o placar e que mostre um texto junto (apenas um);
| |
− | **6.3.1- Saber criar um ''Script'' que utilize o bloco <tt>Join</tt> (que pode ser encontrado na gaveta <tt>Text</tt>) para juntar um texto e o valor do placar. E exibir o resultado em no <tt>Text</tt> de um <tt>Label</tt> (Exemplo: Placar 0);
| |
− | **6.3.2- Saber criar uma variável que possua a função de um contador.
| |
− | *6.4- Saber desenvolver no <tt>Blocks</tt> um procedimento que faça com que um <tt>ImageSprite</tt> se mova de forma aleatória pelo <tt>Canvas</tt>.
| |
− | *6.5- Entender como encadear o bloco de evento <tt>ImageSprite.Touched</tt> com a execução de uma mídia (<tt>Sound</tt>).
| |
− |
| |
− | {| border="4" cellpadding="3"
| |
− | !ITEM
| |
− | !ATIVIDADE
| |
− | !OBJETIVO
| |
− | !MÉTODO
| |
− | !TEMPO
| |
− |
| |
− |
| |
− | |-
| |
− | | '''1'''
| |
− | ||Utilizar o <tt>Canvas</tt> como uma área de deslocamento de um <tt>ImageSprite</tt>.
| |
− | ||6; 6.1
| |
− | ||Utilizar o [[AppInventor]] no projetor
| |
− | ||5 minutos
| |
− | |-
| |
− | | '''2'''
| |
− | ||Relacionar o tamanho de um <tt>ImageSprite</tt> com o de um <tt>Canvas</tt>.
| |
− | ||6; 6.1; 6.1.1; 6.1.2
| |
− | ||Utilizar o [[AppInventor]] no projetor
| |
− | ||10 minutos
| |
− | |-
| |
− | | '''3'''
| |
− | ||Criar botões com funções especificadas em seus textos.
| |
− | ||6; 6.2
| |
− | ||Utilizar o [[AppInventor]] no projetor
| |
− | ||5 minutos
| |
− | |-
| |
− | | '''4'''
| |
− | ||Criar um <tt>Label</tt> que mostre um texto junto a um contador.
| |
− | ||6; 6.3; 6.3.1; 6.3.2
| |
− | ||Utilizar o [[AppInventor]] no projetor
| |
− | ||10 minutos
| |
− | |-
| |
− | | '''5'''
| |
− | ||Criar um procedimento que faça com que um <tt>ImageSprite</tt> se movimente de forma aleatória.
| |
− | ||6; 6.4
| |
− | ||Utilizar o [[AppInventor]] no projetor
| |
− | ||5 minutos
| |
− | |-
| |
− | | '''6'''
| |
− | ||Executar uma mídia a partir de um evento relacionado a um <tt>ImageSprite</tt>.
| |
− | ||6; 6.5
| |
− | ||Utilizar o [[AppInventor]] no projetor
| |
− | ||5 minutos
| |
− | |}
| |
− | ====Lição IV====
| |
− | '''7- Iniciar desenvolvimento do Tutorial Agenda Telefônica.'''
| |
− | *7.1- Saber criar independentemente de ajuda, uma interface para uma agenda telefônica;
| |
− | *7.2- Comparar a agenda criada com o modelo detido pelo professor;
| |
− | *7.3- Listar funções de uma agenda telefônica simples;
| |
− | **7.3.1- Modificar a agenda anterior, visando adequá-la as "novas" funcionalidades.
| |
− | *7.4- Desenvolver em um fluxograma (ou em [http://scratch.mit.edu/ Scratch]) uma sequência de instruções que indique os procedimentos que uma agenda telefônica deve realizar;
| |
− | **7.4.1- Comparar com os procedimentos-modelos detidos pelo professor;
| |
− | **7.4.2- Adequar instruções anteriores para que agreguem as incluídas no modelo (não copiar e excluir a feita inicialmente, adequar).
| |
− | *7.5- "Traduzir" os fluxogramas (ou instruções [http://scratch.mit.edu/ Scratch]) para um ''Script'' [[AppInventor]] (instruções em blocos);
| |
− | *7.6- Comparar com o modelo detido pelo professor e verificar se ambos satisfazem as funções de uma agenda telefônica comum.
| |
− | *7.6.1- Criar novos procedimentos que "incrementem" a agenda.
| |
− |
| |
− | {| border="4" cellpadding="3"
| |
− | !ITEM
| |
− | !ATIVIDADE
| |
− | !OBJETIVO
| |
− | !MÉTODO
| |
− | !TEMPO
| |
− |
| |
− |
| |
− | |-
| |
− | | '''1'''
| |
− | ||Criar a interface de uma agenda telefônica.
| |
− | ||7; 7.1
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |-
| |
− | | '''2'''
| |
− | ||Comparar interface-modelo com interface produzida.
| |
− | ||7; 7.2
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |-
| |
− | | '''3'''
| |
− | ||Conceituar os procedimentos mínimos de uma agenda telefônica.
| |
− | ||7; 7.3; 7.3.1; 7.4
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |-
| |
− | | '''4'''
| |
− | ||"Corrigir" conceitos de procedimentos.
| |
− | ||7; 7.4; 7.4.1; 7.4.2
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |-
| |
− | | '''5'''
| |
− | ||Criar blocos no <tt>Blocks</tt>.
| |
− | ||7; 7.5; 7.6
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |-
| |
− | | '''6'''
| |
− | ||Adicionar novas funcionalidades.
| |
− | ||7; 7.6; 7.6.1
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |}
| |
− |
| |
− | ====Lição V====
| |
− | '''8- Iniciar desenvolvimento do Tutorial Calculadora no <tt>Designer</tt>.'''
| |
− | *8.1- Estar apto a criar um arranjo de botões idêntico ao do modelo (detido pelo professor) utilizando apenas os componentes <tt>Button</tt>, <tt>ScreenArrangement</tt> e <tt>Label</tt>;
| |
− | **8.1.1- Saber Carregar Mídias na propriedade <tt>Image</tt> de cada <tt>Button</tt>;
| |
− | **8.1.2- Saber organizar os ''arrangements'' de forma que o botão "0" possua o dobro de comprimento dos outros e o botão de igual, o dobro de altura.
| |
− | *8.2- Saber criar um procedimento que, quando inicie a aplicação, ajuste a área dos <tt>Buttons</tt> e do <tt>Label</tt> ao da <tt>Screen1</tt>;
| |
− | **8.2.1- Saber utilizar o evento de mudança de orientação para reajustar a área dos componentes;
| |
− | **8.2.2- Saber criar uma combinação de blocos que mude a fonte do ''Label Display'' conforme o acréscimo de algarismos.
| |
− | *8.3- Ter completo domínio sobre as propriedades de um <tt>Label</tt>, suficiente para "enfeitar" os valores exibidos pelo ''Display'' (<tt>Label</tt>).
| |
− | **8.3.1- Saber utilizar a propriedade <tt>FontBold</tt> de um <tt>Button</tt> ou de um <tt>Label</tt>;
| |
− | **8.3.2- Saber utilizar a propriedade <tt>FontItalic</tt> de um <tt>Button</tt> ou de um <tt>Label</tt>;
| |
− | **8.3.3- Saber utilizar a propriedade <tt>FontTypeface</tt> de um <tt>Button</tt> ou de um <tt>Label</tt>;
| |
− | **8.3.4- Saber utilizar a propriedade <tt>TextAlignment</tt> de um <tt>Button</tt> ou de um <tt>Label</tt>.
| |
− |
| |
− |
| |
− | {| border="4" cellpadding="3"
| |
− | !ITEM
| |
− | !ATIVIDADE
| |
− | !OBJETIVO
| |
− | !MÉTODO
| |
− | !TEMPO
| |
− |
| |
− |
| |
− | |-
| |
− | | '''1'''
| |
− | ||Iniciar o desenvolvimento de uma calculadora utilizando o Tutorial Calculadora.
| |
− | ||8; 8.1; 8.1.1; 8.1.2
| |
− | ||Utilizar o [[AppInventor]] no projetor e apresentação de ''Slides''
| |
− | ||55 minutos
| |
− | |-
| |
− | | '''2'''
| |
− | ||Relacionar o evento ''Inicialização do aplicativo'' com um procedimento.
| |
− | ||8; 8.2; 8.2.1; 8.2.2
| |
− | ||Utilizar o [[AppInventor]] no projetor e um Fluxograma
| |
− | ||30 minutos
| |
− | |-
| |
− | | '''3'''
| |
− | ||"Dominar" as propriedades do <tt>Label</tt> (e do <tt>Button</tt>).
| |
− | ||8; 8.3; 8.3.1; 8.3.2; 8.3.3; 8.3.4
| |
− | ||Utilizar o [[AppInventor]] no projetor
| |
− | ||25 minutos
| |
− |
| |
− | |}
| |
− |
| |
− | ====Lição VI====
| |
− | '''9- Adicionando novas funcionalidades a Calculadora.'''
| |
− | *9.1- Modificar os blocos de instrução para toda vez que a calculadora for re-orientada, novas funcionalidades apareçam (comparar com modelo);
| |
− | **9.1.1- Opções de Novas Funcionalidades:
| |
− | ***Seno;
| |
− | ***Cosseno;
| |
− | ***Tangente;
| |
− | ***Raiz Quadrada;
| |
− | ***Expoente;
| |
− | ***Seno^-1;
| |
− | ***Cosseno^-1.
| |
− | **9.1.2- Entender e "traduzir" o ''Script'' de processamento de ''Strings'' do [http://scratch.mit.edu/ Scratch] para o [[AppInventor]].
| |
− | *9.2- Saber implementar parênteses;
| |
− | **9.2.1- Saber Configurar parênteses como prioridade durante um processamento de ''Strings''.
| |
− | *9.3- Saber incluir constantes (Pi, número de Euler).
| |
− |
| |
− |
| |
− |
| |
− | {| border="4" cellpadding="3"
| |
− | !ITEM
| |
− | !ATIVIDADE
| |
− | !OBJETIVO
| |
− | !MÉTODO
| |
− | !TEMPO
| |
− |
| |
− |
| |
− | |-
| |
− | | '''1'''
| |
− | ||Adicionar novas funcionalidades.
| |
− | ||9; 9.1; 9.1.1
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |-
| |
− | | '''2'''
| |
− | ||Implementar método de processamento de ''Strings''.
| |
− | ||9; 9.1; 9.1.2
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− | |-
| |
− | | '''3'''
| |
− | ||Implementar Constantes e parênteses.
| |
− | ||9; 9.2; 9.2.1; 9.3
| |
− | ||Autônomo (sem auxílio)
| |
− | ||Fora de aula (Sem limite de tempo)
| |
− |
| |
− | |}
| |
− |
| |
− | ====Lição VII====
| |
− | '''10- Iniciar desenvolvimento do Tutorial Calculadora no <tt>Blocks</tt>.'''
| |
− | *10.1- Saber criar um procedimento que realize pelo menos as quatro operações básicas da matemática (adição, subtração, multiplicação e divisão);
| |
− | *10.2- Saber criar blocos que deem uma função a botões não numéricos e nem operacionais (C, +/- e outros se houverem);
| |
− | *10.3- Saber alterar os blocos de instrução para implementar uma função que, quando o operador "=" for clicado mais de uma vez seguida, ele realize a mesma operação anterior;
| |
− | *10.4- Saber criar um procedimento que utilize a resposta de uma operação anterior para realizar outra;
| |
− | *10.5- Possibilidades e funcionalidades novas?;
| |
− | *10.6- Fechamento e conclusão das oficinas de AppInventor.
| |
− | {| border="4" cellpadding="3"
| |
− | !ITEM
| |
− | !ATIVIDADE
| |
− | !OBJETIVO
| |
− | !MÉTODO
| |
− | !TEMPO
| |
− |
| |
− |
| |
− | |-
| |
− | | '''1'''
| |
− | ||As 4 Operações básicas.
| |
− | ||10; 10.1; 10.2
| |
− | ||Utilizar o [[AppInventor]] no projetor
| |
− | ||30 minutos
| |
− | |-
| |
− | | '''2'''
| |
− | ||Novas funções.
| |
− | ||10; 10.3; 10.4; 10.5
| |
− | ||Utilizar o [[AppInventor]] no projetor
| |
− | ||30 minutos
| |
− | |-
| |
− | | '''3'''
| |
− | ||Conclusão das oficinas: O que foi aprendido e o que faltou?
| |
− | ||10; 10.6
| |
− | ||Apresentação de Slides e [[AppInventor]] no projetor
| |
− | ||50 minutos
| |
− |
| |
− | |}
| |
− | ====Lição VIII====
| |
− |
| |
− | ===DIA 01===
| |
− | Apresentação
| |
− | *Conceitos básicos (variável, script, sprite, eventos...).
| |
− | *Apresentação da estrutura básica do [[AppInventor]], <tt>Blocks</tt> e <tt>Components</tt>.
| |
− | *Utilização de tutoriais iniciantes produzidos pelo MIT para aplicar o pouco aprendido.
| |
− | {{collapse top|Introdução ao AppInventor}}
| |
− | ====Introdução ao AppInventor====
| |
− | Nesta oficina você aprenderá alguns conceitos básicos de programação e os utilizará para criar aplicativos utilizando a ferramenta [[AppInventor]]. O [[AppInventor]] é um software educacional criado pelo [http://web.mit.edu/ MIT] para auxiliar seus alunos a melhor compreender a funcionalidade da lógica de programação. Trabalharemos diversos conceitos que serão importantes quando tratados em outras linguagens, como Variáveis, Listas, <tt>Procedures</tt> e etc. Nesta primeira parte da oficina, aprenderemos um pouco mais sobre o [[AppInventor]].
| |
− | O [[AppInventor]] é uma ferramenta muito intuitiva, e por isso, de fácil compreensão. Ele é dividido em duas partes, o <tt>Designer</tt> e o <tt>Blocks</tt>. Na etapa <tt>Designer</tt>, trataremos <tt>Buttons</tt>, <tt>Labels</tt>, <tt>Canvas</tt> e até arquivos de mídia, como <tt>Sounds</tt>. Observe na imagem abaixo como a nomenclatura de cada seção (em inglês) indica exatamente sua função, como por exemplo, <tt>Viewer</tt> e <tt>Properties</tt>.
| |
− |
| |
− | [[Arquivo:AppInventorDesigner.png|800px|thumb|center]]
| |
− |
| |
− | Já no Blocks, criaremos <tt>Procedures</tt>, Listas, Variáveis e etc. Nesta parte desenvolveremos diversos blocos que detalharam o a funcionalidade do aplicativo, ou seja, o que os componentes do aplicativo devem fazer.
| |
− |
| |
− | [[Arquivo:AppInventorBlocks.png|800px|thumb|center]]
| |
− |
| |
− | Tanto o <tt>Designer</tt> como o <tt> Blocks</tt> possuem diversos conceitos que precisam ser abordados de uma maneira mais prática do que teórica. Para isso, enquanto introduzimos o básico de [[AppInventor]], iremos ver alguns conceitos comuns aos presentes em [http://scratch.mit.edu/ Scratch]. E esses conceitos, serão revistos através de tutoriais que iremos seguir ao longo desta oficina.
| |
− | {{collapse bottom}}
| |
− | {{collapse top|Tutorial Hello Purr}}
| |
− | ====Tutorial Hello Purr====
| |
− | Antes de começarmos a desenvolver nossa aplicação, precisamos ter certeza do que exatamente queremos. Como este é o nosso primeiro tutorial iremos seguir o <tt>HelloPurr Tutorial</tt> que pode ser encontrado na sua versão original no site do [http://beta.appinventor.mit.edu/learn/setup/hellopurr/hellopurrphonepart1.html AppInventor - MIT]. Este aplicativo é relativamente muito simples, ele conterá uma imagem de um gato que quando clicada com o botão esquerdo do mouse, deverá tocar o som de um miado e uma instrução que dirá "Clique no Gato".
| |
− | Faça o download da [http://beta.appinventor.mit.edu/learn/tutorials/hellopurr/HelloPurrAssets/kitty.png Imagem do Gato] e do [http://beta.appinventor.mit.edu/learn/tutorials/hellopurr/HelloPurrAssets/meow.mp3 Miado] antes de continuar.
| |
− | Para começar vá ao site do [http://beta.appinventor.mit.edu AppInventor - MIT] e entre com uma conta Gmail. A imagem abaixo mostra como deverá aparecer sua tela na primeira vez que você loga no site e destacado em vermelho o botão ''New'', que você deve clicar para criar um novo projeto:
| |
− |
| |
− | [[Arquivo:Novo Projeto.png|800px|thumb|center]]
| |
− |
| |
− | Em seguida crie um novo projeto e o nomeie <tt>HelloPurr</tt>. Assim que você cria um projeto, o [[AppInventor]], automaticamente, o redirecionará para o <tt>Designer</tt>, onde iniciaremos o desenvolvimento do projeto. Como vimos na Introdução, no <tt>Designer</tt>, "organizamos" o desenvolvimento do aplicativo, porque é nele em que são criados os <tt>Components</tt>. <tt>Component</tt> ou simplesmente Componente é um termo utilizado para representar um conjunto de funcionalidades. Uma aplicação pode ser formada apenas utilizando <tt>Components</tt>. Para o [[AppInventor]] os Componentes são objetos que podem conter métodos, eventos e/ou propriedades. A imagem abaixo mostra a tela inicial do <tt>Designer</tt> e destaca a posição de algumas de suas seções.
| |
− |
| |
− | [[Arquivo:AppInventor - Analizando o Designer.png|800px|thumb|center]]
| |
− |
| |
− | Perceba pela imagem que o <tt>Designer</tt> já inicia com um componente: a <tt>Screen1</tt>. Todo componente existente no aplicativo é listado na seção <tt>Components</tt>, e a sua direita, na seção <tt>Properties</tt>, estão as propriedades do componente selecionado. Agora, selecione o componente <tt>Screen1</tt> e altere sua propriedade <tt>Title</tt> (na seção <tt>Properties</tt>) para <tt>HelloPurr</tt>. A propriedade <tt>Title</tt> de uma <tt>Screen</tt> pode ser considerado como o título da mesma, neste caso, não teremos a necessidade de criar mais <tt>Screens</tt>, por isso o <tt>Title</tt> da nossa <tt>Screen1</tt> pode ser o do próprio aplicativo (ou seja, <tt>HelloPurr</tt>). Depois de titular a <tt>Screen1</tt>, nós adicionaremos um novo componente ao nosso aplicativo. Para adicionar um novo componente, vá até a seção <tt>Basic</tt>, abra a gaveta em que o componente se encontra, e o arraste até o vizualizador. Neste caso nós queremos criar uma imagem que ao receber um clique com o botão esquerdo do mouse, toque o som de um miado. Por isso nós adicionaremos ao vizualizador um componente <tt>Button</tt> (da gaveta <tt>Basic</tt>). Assim que o componente <tt>Button</tt> é criado, a seção <tt>Properties</tt> se "enche" de novas propriedades, agora referentes ao componente <tt>Button1</tt>. Antes de modificarmos as propriedades deste novo componente, vá até a seção <tt>Components</tt> e altere seu nome para <tt>ButtonGato</tt>, para que os componentes fiquem fáceis de se identificar.
| |
− | Apesar de este tutorial possuir poucos componentes é importante nomeá-los adequadamente. Para entender melhor a necessidade de se organizar os nomes dos componentes, leia [http://wiki.sj.ifsc.edu.br/index.php/Usu%C3%A1rio:Ernani.rs#Padroniza.C3.A7.C3.A3o Padronização].
| |
− | Agora que já possuímos um <tt>Button</tt> criado, precisamos fazer com que ele assuma a imagem do gato (link para download esta disponível no início deste tutorial). Selecione o componente <tt>ButtonGato</tt> e (na seção <tt>Properties</tt>) procure pela propriedade <tt>Image</tt>. A propriedade <tt>Image</tt> de um <tt>Button</tt> possui uma única função: Adicionar uma imagem de fundo a um componente. Como já possuímos a imagem do gato, precisamos carregá-la no <tt>Designer</tt>. Há duas formas de carregar uma mídia no <tt>Designer</tt>:
| |
− | *Logo abaixo da seção <tt>Properties</tt> há a seção <tt>Media</tt> clique na opção “Add...” e selecione o arquivo. Em seguida vá até a propriedade que você deseja carregar a mídia, e selecione o arquivo carregado.
| |
− | *Na própria seção <tt>Properties</tt>, quando for carregar um arquivo de mídia em uma propriedade, e este arquivo ainda não estiver carregado no <tt>Designer</tt>, você pode selecionar a opção “Add...” e selecionar o arquivo.
| |
− | Assim que você tiver a imagem carregada, o <tt>Designer</tt>, estará assim:
| |
− |
| |
− | [[Arquivo:AppInventor - Carregando Mídias.jpg|800px|thumb|center]]
| |
− |
| |
− | Pela imagem acima podemos perceber um problema no vizualizador: Por cima da imagem do gato aparece um texto, isso acontece porque a propriedade <tt>Image</tt> de um <tt>Button</tt> adiciona apenas uma imagem de fundo e não sobrepõe outras propriedades dos <tt>Buttons</tt> , como o <tt>Text</tt>. A propriedade <tt>Text</tt> possui uma função muito simples, adicionar um texto ao componente. Portanto a solução para o nosso "problema" é: Apagar o valor da propriedade <tt>Text</tt>. Assim que você tiver resolvido o problema do texto, nós já teremos a imagem do gato no nosso aplicativo pronta, agora é necessário adicionar uma pequena instrução que diga: Clique no Gato. Portanto, trabalharemos com outro componente, chamado <tt>Label</tt>. Os <tt>Labels</tt>, diferente da maioria dos componentes, possui apenas uma função: Exibir um texto. E é exatamente isso que precisamos, portanto, vamos até a gaveta <tt>Basic</tt> e arrastamos para o nosso vizualizador o componente <tt>Label</tt>. Em seguida altere o nome do <tt>Label1</tt> para <tt>LabelInstrucao</tt> (lembre-se que o [[AppInventor]] não aceita "ç" em nome de componentes). Agora, observe as propriedades do <tt>LabelInstrucao</tt>, como a função de um componente <tt>Label</tt> é apenas exibir um texto, é óbvio que todas as suas propriedades vão ser relativas a edição de texto.
| |
− | Por isso, vamos realizar uma série de alterações nas suas propriedade, para que o nosso texto ganhe maior visibilidade:
| |
− | *<tt>BackgroundColor</tt> = esta propriedade é muito semelhante ao <tt>Image</tt> dos <tt>Buttons</tt>, entretanto, ela não necessita de uma mídia carregada e só aceita as opções já disponíveis. Altere o valor desta propriedade para uma cor que destaque o texto. Exemplo: Magenta.
| |
− | *<tt>FontBold</tt> e <tt>FontItalic</tt> = são respectivamente as propriedades ''Negrito'' e ''Itálico'', comumente utilizadas em edição de textos. Ative-as.
| |
− | *<tt>FontSize</tt> = Tamanho da letra. Aumente a letra para que o texto seja mais visível. Sugestão: 30.
| |
− | *<tt>Text</tt> = Como já vimos anteriormente nos componentes <tt>Buttons</tt>, o valor desta propriedade é exibido pelo <tt>Label</tt> (é comum que diferentes componentes possuam propriedades que realizam a mesma função). Altere o valor desta propriedade para: Clique no Gato. Como foi especificado no início deste tutorial.
| |
− |
| |
− | [[Arquivo:AppInventor - Designer Pronto.jpg|800px|thumb|center]]
| |
− |
| |
− |
| |
− | Por enquanto nosso aplicativo não possui instruções, ou seja, não faz nada. Ele apenas é uma imagem de um gato com uma instrução em baixo. A imagem acima mostra a "cara" do <tt>Designer</tt> nesta etapa e destaca em vermelho aonde abrir o <tt>Blocks</tt>. Como vimos na Introdução, o <tt>Designer</tt> adiciona os componentes e os valores iniciais as suas propriedades (podem ser alterados futuramente). Já o <tt>Blocks</tt> dá instruções a esses componentes, e é exatamente isso que faremos a seguir (abra o <tt>Blocks</tt>). Assim que você clicar no botão ''Open Blocks Editor'' você fará o download de um arquivo java (execute-o).
| |
− | Certifique-se se o seu computador possui os requisitos necessário para abrir o <tt>Blocks</tt> no site [http://beta.appinventor.mit.edu/learn/setup/index.html AppInventor - MIT].
| |
− | O <tt>Blocks</tt> nos proporciona muitas possibilidades, podemos adicionar diversas funcionalidades ao nosso aplicativo. Entretanto como esse é o nosso primeiro tutorial, não iremos explorá-las. Na verdade, nos concentraremos na que foi descrita no início deste tutorial. O aplicativo possui a imagem do gato e uma instrução, só falta uma coisa: que quando eu clicar no gato ele toque o Miado. Mas para fazermos um arquivo de áudio ser executado no [[AppInventor]], é necessário que outro componente seja adicionado no <tt>Designer</tt>: O <tt>Sound</tt>. Volte ao <tt>Designer</tt>, vá até a gaveta <tt>Media</tt> e arraste um <tt>Sound</tt> para o vizualizador. Observe que o <tt>Sound</tt> é um arquivo invisível no <tt>Designer</tt> e que necessita de uma mídia carregada para ser executado (sem uma mídia nenhum som será tocado). Portanto altere o nome do componente <tt>Sound1</tt> para <tt>Miado</tt> e a propriedade <tt>Source</tt> para o arquivo de som baixado. Agora quando você instruir o aplicativo para executar o <tt>SoundMiado</tt> ele tocará o arquivo de som que foi carregado.
| |
− |
| |
− | [[Arquivo:AppInventor - Designer Sound.jpg|800px|thumb|center]]
| |
− |
| |
− | Sempre que o componente <tt>SoundMiado</tt> for tocado, o som do miado que carregamos será tocado. Entretanto agora temos de instruir o aplicativo de executar o <tt>SoundMiado</tt> quando o <tt>ButtonGato</tt> receber um clique, e é agora que utilizaremos o <tt>Blocks</tt>.
| |
− |
| |
− | [[Arquivo:AppInventor - Blocks.jpg|800px|thumb|center]]
| |
− |
| |
− | A imagem acima nos da um pequeno mapa para termos uma ideia de como criar instruções. A parte <tt>Blocks</tt> do desenvolvimento de um aplicativo, no início, nos parece mais complicada porque não possuímos um bom domínio de [[AppInventor]] e como consequência não sabemos "aonde" no <tt>Blocks</tt> buscar as instruções desejadas. Por isso durante o desenvolvimento das oficinas tentaremos abrangir um grande números de funcionalidades para que você tenha mais "ferramentas" para utilizar. Agora vamos adicionar as instruções que desejamos. Precisamos fazer com que quando o <tt>ButtonGato</tt> seja clicado ele execute o miado. Vá até o <tt>Blocks</tt> e na seção <tt>My Blocks</tt> clique na gaveta <tt>ButtonGato</tt>. Observe que assim que você abre a seção <tt>My Blocks</tt> são listadas a gaveta <tt>My Definitions</tt> e uma outra para cada componente que foi criado no <tt>Designer</tt>. Como nós queremos utilizar o <tt>ButtonGato</tt>, vamos clicar na sua gaveta e vizualizar as opções disponíveis. Dentro dessa gaveta existe a seguinte instrução:
| |
− |
| |
− | [[Arquivo:Button Gato click.jpg|thumb|center]]
| |
− |
| |
− | Arraste esta instrução para o centro da tela. Observe a cor deste bloco (verde escuro), somente os blocos de eventos possuem essa cor. Em [[AppInventor]], evento é uma ação ou acontecimento que desencadeia um <tt>Procedure</tt>. Como por exemplo, o clique do mouse é uma condição para que um objeto se movimente. No caso <tt>HelloPurr</tt> o evento é o clique do mouse sobre o <tt>ButtonGato</tt>. Essa instrução sugere que quando o evento ocorrer, haverá uma consequência. A consequência deve ser adicionada a instrução evento. A consequência que esperamos é o miado, ou seja, a execução do <tt>SoundMiado</tt>. Para isso acontecer, vá até a seção <tt>My Blocks</tt> e na gaveta <tt>SoundMiado</tt> procure pela seguinte instrução:
| |
− |
| |
− | [[Arquivo:Call Sound Miado.jpg|thumb|center]]
| |
− |
| |
− | Perceba que dentro deste bloco esta escrito: "call SoundMiado.Play". Os blocos [[AppInventor]] são autoexplicativos, dentro deles PODEM existir até três informações:
| |
− | *A função do bloco.
| |
− | *O componente em questão (o bloco pode estar relacionado a algo que não seja um componente, como um <tt>Procedure</tt>).
| |
− | *A consequência.
| |
− | Neste caso "call", traduzindo do inglês, significa "chamar", portanto o bloco esta chamando algo do componente <tt>SoundMiado</tt>, e "Play", significa "tocar" ou "executar". Como o componente em questão é um arquivo de som, se executarmos o <tt>SoundMiado</tt> teremos como resposta o miado que desejamos. Agora só o que temos de fazer é juntar o bloco de evento com o "call" arrastando o "call" para dentro do de evento. Este deverá ser o resultado:
| |
− |
| |
− | [[Arquivo:Instrucao HelloPurr.jpg|thumb|center]]
| |
− |
| |
− | Assim que você tiver combinado as duas instruções, abra o emulador ou conecte o <tt>Blocks</tt> a um dispositivo para testar o aplicativo. Esta deverá ser a aparência do aplicativo:
| |
− |
| |
− | [[Arquivo:HelloPurr final.jpg|thumb|center]]
| |
− | {{collapse bottom}}
| |
− | {{collapse top|Tutorial MoleMash}}
| |
− | ====Tutorial MoleMash====
| |
− | Este tutorial possui como pré-requisito o [http://wiki.sj.ifsc.edu.br/index.php/Usu%C3%A1rio:Ernani.rs#Tutorial_Hello_Purr Tutorial HelloPurr] e pode ser encontrado na sua versão original no site [http://beta.appinventor.mit.edu/learn/tutorials/molemash/molemash.html AppInventor - MIT].
| |
− | Agora que você tem uma noção de [[AppInventor]], iremos iniciar o <tt>MoleMash Tutorial</tt>. O <tt>MoleMash</tt> é um jogo muito simples, ele se resume em uma toupeira que se movimenta sobre uma área específica aleatoriamente, enquanto o jogador tenta tocá-la, e toda vez que o jogador a toca, recebe um ponto. Para começar, crie um projeto, nomeie-o <tt>MoleMash</tt> e altere o <tt>Title</tt> da <tt>Screen1</tt> para <tt>MoleMash</tt>. A seguir a primeira coisa que faremos, será criar a "área" sobre a qual a toupeira irá se deslocar. Para isso, utilizaremos um componente chamado <tt>Canvas</tt>. O <tt>Canvas</tt> é um retângulo bidimensional com área definida, utilizado para desenhar ou para mover <tt>Sprites</tt> (objetos exibidos em duas dimensões).
| |
− | *Vá até a gaveta <tt>Basic</tt> e arraste um <tt>Canvas</tt> para o vizualizador, nomeie-o <tt>CanvasArea</tt>.
| |
− | *Mude sua propriedade <tt>Width</tt> para <tt>Fill Parent</tt>.
| |
− | *Mude sua propriedade <tt>Height</tt> para <tt>300 pixels</tt>.
| |
− | Quando o valor das propriedades <tt>Width</tt> e <tt>Height</tt> de um componente são alterados, os limites horizontais e verticais, respectivamente, são redefinidos. Existem três modos de expressar o valor do <tt>Width</tt> ou <tt>Height</tt> de um componente no <tt>Designer</tt> (é possível fazer esta modificação no <tt>Blocks</tt> de outra forma):
| |
− | *Número de Pixels = É possível selecionar um número fixo de pixels.
| |
− | *<tt>Fill Parent</tt> = Quando esta opção for selecionada o espaço não utilizado pelo [[AppInventor]] passará a ser ocupado pelo componente em questão.
| |
− | *<tt>Automatic</tt> = O <tt>Designer</tt> determina os valores baseados em critérios próprios, por exemplo, se uma imagem de 40 pixels quadrados for adicionada como <tt>Image</tt> de um <tt>Button</tt> o <tt>Designer</tt> altera automaticamente os valores <tt>Width</tt> e <tt>Height</tt> para os da imagem.
| |
− | Agora que nossa área esta definida, precisamos acrescentar a toupeira ao jogo. Vamos utilizar outro novo componente: O <tt>ImageSprite</tt>. Um <tt>ImageSprite</tt> é um objeto que pode se locomover livremente por toda a área de um <tt>Canvas</tt>. Vá até a gaveta <tt>Basic</tt> e arraste um <tt>ImageSprite</tt> para dentro do <tt>CanvasArea</tt> (nomeie-o <tt>ImageSpriteToupeira</tt>). Em seguida, faça o download da [http://beta.appinventor.mit.edu/learn/tutorials/molemash/MoleMashAssets/mole.png Imagem] e a carregue na propriedade <tt>Picture</tt> do <tt>ImageSpriteToupeira</tt>, que possui a mesma função do <tt>Image</tt> dos <tt>Buttons</tt>. O cenário do jogo esta pronto, agora é necessário adicionarmos uma janela que indique o placar, e um botão para que possamos reiniciar o jogo. Para o placar, utilizaremos um <tt>Label</tt>, como já vimos anteriormente, o <tt>Label</tt> possui exatamente a função de exibir um texto. E como em nosso caso queremos exibir um placar, quem melhor? Já para criarmos um botão, utilizaremos novamente um <tt>Button</tt>. Portanto siga os passos abaixo para finalizarmos a parte <tt>Designer</tt> do aplicativo:
| |
− | *Crie o <tt>LabelPlacar</tt>.
| |
− | *Apague o valor da propriedade <tt>Text</tt> do <tt>LabelPlacar</tt>.
| |
− | *Aumente o valor da propriedade <tt>FontSize</tt> do <tt>LabelPlacar</tt> para 30.
| |
− | Observação: Quando o valor da propriedade <tt>Text</tt> do <tt>LabelPlacar</tt> for nulo, o <tt>Label</tt> desaparece do <tt>Designer</tt>. Justamente porque não há nenhum texto para mostrar, fato que mudará no <tt>Blocks</tt>.
| |
− | *Crie o <tt>ButtonIniciarNovoJogo</tt>.
| |
− | *Mude o valor da propriedade <tt>Text</tt> do <tt>ButtonIniciarNovoJogo</tt> para "Iniciar Novo Jogo".
| |
− | Assim que você tiver completado os passos acima, terá finalizado a parte <tt>Designer</tt>.
| |
− |
| |
− | [[Arquivo:MoleMash - Designer.jpg|800px|thumb|center]]
| |
− |
| |
− | Abra o <tt>Blocks</tt> para começarmos a desenvolver as instruções. A primeira instrução que devemos criar é o movimento da Toupeira (<tt>ImageSpriteToupeira</tt>). Para tal, iremos utilizar blocos diferentes dos que já utilizamos até então: Os <tt>Procedures</tt>. <tt>Procedure</tt> ou simplesmente procedimento, significa modo de agir ou proceder durante um evento. Podemos traduzir este conceito para programação se considerarmos “agir” como uma sequência de instruções a serem seguidas pela aplicação que esta sendo desenvolvida. Portanto o conceito de <tt>Procedure</tt> para [[AppInventor]] seria: Sequência de ações ou instruções a serem seguidas. Para criar um <tt>Procedure</tt> vá até a seção <tt>Built-In</tt>, e na gaveta <tt>Definitions</tt>, procure pelo seguinte bloco:
| |
− |
| |
− | [[Arquivo:Procedure.jpg|800px|thumb|center]]
| |
− |
| |
− | Arraste esse bloco para a Área de Trabalho do <tt>Blocks</tt> e altere o nome do procedimento para <tt>MovimentoToupeira</tt>.
| |
− |
| |
− | [[Arquivo:Procedure touperia.jpg|thumb|center]]
| |
− |
| |
− | Agora que o bloco de procedimento foi criado, é preciso adicionar "O QUE" o procedimento deve realizar. Como queremos fazer com que a Toupeira se desloque aleatoriamente...
| |
− |
| |
− | EM CONSTRUÇÃO
| |
− | {{collapse bottom}}
| |
− |
| |
− | ===DIA 02===
| |
− | Especificação
| |
− | *Relembrando o básico já visto.
| |
− | *Introdução a funcionalidade da calculadora (especificação).
| |
− | *Início do desenvolvimento na parte Components.
| |
− | ===DIA 03===
| |
− | Desenvolvimento
| |
− | *Término da parte Components.
| |
− | *Revisão dos conceitos básicos que serão utilizados (variáveis, listas, procedures...).
| |
− | *Início da parte do Block editor.
| |
− | ===DIA 04===
| |
− | *Conclusão e possibilidades de melhoramentos.
| |
| {{collapse bottom}} | | {{collapse bottom}} |
| | | |