LINGUAGEM ORIENTADA POR FORMAS GEOMTRICAS, VOLTADA AO ENSINO DE PROGRAMAO Jos Roque Voltolini da Silva1, Joyce Martins1, Oscar

Alcntara Jnior2
1

Departamento de Sistemas e Computao - Universidade Regional de Blumenau (FURB) Caixa Postal 1.507 89.010-971 Blumenau SC Brasil
2

Egresso do Curso de Cincias da Computao da Universidade Regional de Blumenau roque@inf.furb.br, joyce@inf.furb.br, oscar1@ibest.com.br

Resumo. Este artigo descreve a concepo e implementao (prottipo) de um ambiente de programao visual, com o intuito de facilitar o ensino de programao de computadores. O ambiente permite que o usurio crie desenhos com os sete tipos de figuras geomtricas que compem o jogo matemtico Tangram. Para tanto, usa uma linguagem de programao orientada por instrues para definir e visualizar movimentos dos desenhos. Os comandos da linguagem podem ser inseridos automaticamente a partir da manipulao das figuras, ou tambm podem ser digitados. Ainda, o ambiente trabalha tanto no modo esttico (comandos para criao de figuras) como no modo dinmico (comandos para movimentao).

1. INTRODUO Preocupados com o baixo rendimento no processo de ensino/aprendizagem, traduzido num nmero excessivo de reprovaes e em evaso escolar, e considerando que quando uma criana no aprende, antes de aceitar a concluso de que possua escassa capacidade, deve-se suspeitar primeiro que em alguma parte de seu ambiente de aprendizagem existem condies deficientes (MOSQUERA, 1985, p. 32), h algum tempo educadores tm buscado incessantemente ferramentas para auxiliar as atividades pedaggicas. A confeco e a disponibilizao destas ferramentas atravs do uso do computador tornam-se mais prticas. Ainda, segundo Rosemeire (1998), atualmente muito se tem discutido sobre o uso dos computadores em escolas e principalmente por crianas. A utilizao da informtica como instrumento de aprendizagem vem aumentando rapidamente de tal forma que a educao tem passando por mudanas estruturais e funcionais (ROSEMEIRE, 1998). O ensino e o interesse em computao tambm vem crescendo. Nota-se que cada vez mais cedo as crianas so inseridas neste contexto. Nesta direo, ferramentas especficas para o ensino de computao esto surgindo. O interesse das crianas hoje no somente por ferramentas direcionadas (editores, tutores, navegadores, entre outros), mas por ferramentas de desenvolvimento nas quais o seu poder criativo possa ser evidenciado. Entretanto, ferramentas para este fim, principalmente aquelas voltadas ao ensino/aprendizado de programao de computadores, apresentam aspectos considerados no atrativos pelas crianas, os quais acabam gerando desinteresse. Como exemplo destes aspectos pode-se citar:
VII Congresso Iberoamericano de Informtica Educativa 1176

vocabulrio em lngua estrangeira; complexidade no seu manuseio, principalmente pelo uso de linguajar tcnico; ou ainda a falta de ligao direta de uma representao alternativa (linguagem formal) com a situao real expressada. Este ltimo aspecto entende-se como capacidade de abstrao. A capacidade de abstrao pela criana inicialmente pode ser reforada atravs de associaes diretas. Ainda, segundo Sebesta (2000, p. 19), a programao de computadores uma disciplina jovem, e as metodologias de projeto, as ferramentas de desenvolvimento de software e as linguagens de programao ainda esto em um estgio de contnua evoluo. Visto o acima descrito, este artigo mostra a concepo e implementao de um ambiente que objetiva facilitar o ensino/aprendizagem de programao de computadores por crianas alfabetizadas. O ambiente foi criado especificamente objetivando: a) permitir a criao de desenhos atravs de formas geomtricas, os quais podero ser visualizados estaticamente; b) recuperar o que foi desenhado a partir do cdigo gerado. Cada desenho criado gera um conjunto de comandos em uma linguagem de programao orientada por instrues, formando um programa, o qual poder ser salvo e depois recuperado para retornar ao desenho original; c) permitir a criao de movimentos dos objetos geomtricos, descrevendo-os atravs da incluso de comandos no cdigo previamente gerado, disponibilizando uma viso dinmica das figuras (animao); d) disponibilizar uma linguagem de programao, onde o agente programador poder fazer alteraes diretamente no cdigo, e essas alteraes surtiro efeito no programa grfico (desenhos). O ambiente composto de um editor de formas geomtricas pr-definidas. medida que as formas geomtricas forem utilizadas para construir desenhos, as mesmas sero convertidas para sua forma textual em uma linguagem de programao.As formas geomtricas escolhidas so as definidas pelo jogo Tangram. Tal escolha foi motivada por j existir um estudo pedaggico por trs deste jogo, que uma opo metodolgica utilizada em algumas escolas para o ensino de formas geomtricas, polgonos e fraes. O Tangram permite uma grande variedade de representaes geomtricas, como tambm representar letras e objetos do mundo real. Um trabalho na rea matemtica usando Tangram apresentado em Borchardt (2002). No ambiente implementado no foram aplicadas todas a regras do Tangram, a fim de flexibilizar o uso do mesmo.
VII Congresso Iberoamericano de Informtica Educativa 1177

A seguir, uma breve descrio do funcionamento do jogo Tangram, a linguagem de programao especificada e a operacionalidade do ambiente so apresentadas. No final so feitos consideraes e comentrios sobre o modelo proposto e sobre uma experincia inicial. Limitaes e sugestes de extenses no ambiente implementado so relatadas. 2. O TANGRAM J conhecido na China, por volta do sculo VII a.C. como as "Sete Taboas da Astcia", o Tangram um jogo figurativo, do qual no se conhece o autor, nem precisamente h quanto tempo existe. O Tangram composto por sete peas, de formas geomtricas simples, que juntas formam um quadrado (Figura 1). Essas peas podem ser arranjadas formando novas figuras.

Figura 1. Peas do Tangram separadas (adaptado de KONG, 2003)

As regras bsicas do Tangram so as seguintes (KONG, 2003): utiliza-se sete peas (tans), mostradas na Figura 1; os tans tm que estar deitados; os tans tm que se tocar; nenhum tan pode sobrepor-se a outro. 3. A LINGUAGEM DE PROGRAMAO Na linguagem orientada por formas geomtricas, um programa tambm chamado de desenho, podendo possuir uma ou mais figuras. Na criao de uma figura, o nome FIGURAi estabelecido para a mesma automaticamente pelo ambiente. O ndice i um nmero natural, iniciando com zero para a primeira figura criada. Uma figura composta por peas, sendo no mnimo uma e no mximo sete. Uma pea, chamada de tan no Tangram, um polgono identificado conforme mostrado na Figura 1. Toda pea possui uma cor, um ponto de origem (ponto central) e no mnimo trs e no mximo quatro pontos. Qualquer ponto possui um atributo de localizao, representado atravs da coordenada X e Y, no plano cartesiano. As figuras tm tanto uma representao grfica quanto uma representao textual, de tal forma que para cada figura criada gerado um conjunto de comandos na linguagem orientada por formas geomtricas. Os comandos existentes na linguagem so: cria, move, movePasso, rotaciona, piscar, mudaCor, espelho e repete (Tabela 1).
VII Congresso Iberoamericano de Informtica Educativa 1178

Tabela 1. Comandos da linguagem Comando cria FIGURA0.P1 (0, 0) move FIGURA0.P1(10,10) move FIGURA0 (10,10) movePasso FIGURA0.P1(10,10) movePasso FIGURA0 (10,10) rotaciona FIGURA1.P1(1, +45) rotaciona FIGURA1(P1.1, +45) piscar (1000) mudaCor FIGURA1.P1 preto mudaCor FIGURA1 preto mudaCor fundo preto espelho FIGURA1.P1 repete x vezes inicio ... fim Comentrios cria pea P1 da FIGURA0 no ponto (0,0) move pea P1 da FIGURA0 para o ponto (10,10) move FIGURA0 para o ponto (10,10) desloca pea P1 da FIGURA0 do ponto de origem (X,Y) para o ponto (X+10, Y+10) desloca FIGURA0 do ponto de origem (X,Y) para o ponto (X+10, Y+10) rotaciona pea P1 da FIGURA1 45 graus no sentido antihorrio em relao ao ponto 1 rotaciona FIGURA1 45 graus no sentido anti-horrio em relao ao ponto 1 da pea P1 aguarda 1000 milissegundos antes de executar o prximo comando muda cor da pea P1 da FIGURA1 para preto muda cor da FIGURA1 para preto muda cor do fundo do desenho para preto inverte os pontos da pea P1 da FIGURA1 repete x vezes um bloco de comandos

A especificao da sintaxe dos comandos da linguagem foi feita utilizado a notao BNF estendida, apresentada na Figura 2. Na especificao apresentada utilizada a seguinte notao: palavras reservadas e smbolos especiais so escritos em negrito; identificadores e nmeros so escritos em itlico; [R]+ indica ocorrncia de R uma ou mais vezes e [R]? indica ocorrncia de R zero ou uma vez. Observa-se tambm que um identificador inicia com uma letra seguida ou no por outras letras ou dgitos; um nmeroSemSinal uma seqncia de um ou mais dgitos e um nmeroComSinal um nmeroSemSinal precedido ou no por um sinal unrio (+ ou -).
<programa> ::= inicio identificador [<comando>]+ fim . <comando> ::= <cria> | <move> | <movePasso> | <rotaciona> | <piscar> | <repete> | <mucaCor> | <espelho> <cria> ::= cria <figura> . <pea> ( <X> , <Y> ) <move> ::= move <figura> [ . <pea> ]? ( <X> , <Y> ) <movePasso> ::= movePasso <figura> [ . <pea> ]? ( <X> , <Y> ) <rotaciona> ::= rotaciona <figura> [ . <pea> ( <pto> | ( <pea> . <pto> ] , <graus> ) <piscar> ::= piscar ( nmeroSemSinal ) <repete> ::= repete nmeroSemSinal vezes inicio [<comando>]+ fim <mudaCor> ::= mudaCor [ <figura> [ . <pea> ]? | fundo ] <cor> <espelho> ::= espelho <figura> . <pea> <figura> ::= identificador <pea> ::= identificador <X> ::= nmeroComSinal <Y> ::= nmeroComSinal <pto> ::= nmeroSemSinal <graus> ::= nmeroComSinal <cor> ::= amarelo | azul | azulMarinho | azulPiscina | branco | cinza | marrom | oliva | prata | preto | rosa | verde | verdePiscina | verdeLima vermelho | violeta

Figura 2. BNF estendida da linguagem

Na Figura 3 tem-se um exemplo de programa, obedecendo especificao descrita na Figura 2.

VII Congresso Iberoamericano de Informtica Educativa

1179

inicio novoPrograma cria FIGURA1.P1(0,0) repete 2 vezes inicio piscar(1000) rotaciona FIGURA1.P1(0,+45) mudaCor FIGURA1.P1 azul repete 2 vezes inicio piscar(1000) fim mudaCor FIGURA1.P1 vermelho fim fim.

Figura 3. Exemplo de um programa

4. O AMBIENTE DE PROGRAMAO VISUAL No ambiente de programao visual, visto na Figura 4, o usurio utiliza as peas do Tangram para criar desenhos, podendo constru-los atravs da insero/manipulao de figuras no editor grfico, sendo os comandos correspondentes gerados automaticamente, ou a partir da digitao dos comandos no editor de texto. Qualquer comando, gerado ou digitado, pode ser alterado diretamente no editor de texto. O editor grfico representa o plano cartesiano, sendo o centro equivalente ao ponto com coordenada zero para X e zero para Y.
lista de cores

barra de menus

FIGURA0 pea P3 da FIGURA1

modo de operao estrutura do desenho

editor grfico

ponto (0,0)

editor de texto

peas P1, P2 e P7 da FIGURA1

Figura 4. Ambiente de programao visual

No editor de texto da Figura 4 tem-se primeiramente os comandos para criao das setes peas que compem a FIGURA0 desenhada na parte superior esquerda do editor grfico, em seguida os comandos para criao das peas P1, P2 e P7 da FIGURA1 desenhada na parte inferior direita do editor grfico e os comandos para criao da pea P3 da FIGURA1 no ponto (0,0). Ainda, o ambiente disponibiliza informaes sobre a estrutura do desenho. So mostradas todas as figuras componentes, com suas respectivas peas. Para cada pea so visualizadas as seguintes informaes: cor, ponto de origem, localizao do ponto1,
VII Congresso Iberoamericano de Informtica Educativa 1180

localizao do ponto2, ... localizao do ponton.Como exemplo tem-se a pea P3 da FIGURA1 cuja cor vermelho, o ponto de origem (0,0), a localizao do ponto1 (0,40), a localizao do ponto2 (-40,0) e a localizao do ponto3 (40,0). O ambiente possui tambm dois modos de operao: o modo esttico e o modo dinmico. No modo esttico, quando uma pea inserida no editor grfico, so gerados automaticamente os comandos cria, tendo como ponto de origem (parmetro) a coordenada zero para X e zero para Y. Quando alguma pea movimentada, o ponto de origem do comando cria correspondente alterado considerando a nova posio da pea. Qualquer outra manipulao de peas no editor grfico no gera comandos. J no modo dinmico, alm dos comandos cria, comandos de manipulao das peas podem ser adicionados automaticamente no programa. Isto , quando no editor grfico realizada a manipulao de uma pea, o comando correspondente inserido no programa apenas se o usurio desejar. Os comandos de manipulao que podem ser gerados so: move, rotaciona, mudaCor e espelho. Para mover uma pea, basta arrast-la para a posio desejada. Para rotacionar uma pea, basta pressionar o boto direito do mouse sobre a mesma. Para mudar a cor, deve-se selecionar uma cor na lista de cores e pressionar a tecla ctrl juntamente com o boto esquerdo do mouse em cima da pea escolhida. Para fazer um espelhamento, pressiona-se a tecla shift juntamente com o boto esquerdo do mouse sobre a pea selecionada. Por fim, na Figura 4 tem-se uma barra com os menus Desenho, Figuras, Peas, Ferramentas e Sobre. No menu Desenho, o usurio tem as opes Pegar desenho, usada para recuperar o cdigo de um desenho previamente salvo; Guardar desenho, para salvar o cdigo de um desenho criado ou modificado, sendo que a qualquer desenho deve ser atribudo um nome; Guardar desenho com o nome... para salvar um desenho com outro nome diferente daquele dado anteriormente; Apagar desenho, que apaga todo o desenho no editor grfico, todo o cdigo no editor de texto e todas as informaes sobre a estrutura do desenho; Mostrar pontos, usada para visualizar todos os pontos das figuras e seus respectivos valores no editor grfico, sendo essa opo habilitada ou desabilitada cada vez que escolhida; e Sair, que fecha o ambiente de programao. Estas opes podem ser vistas na Figura 5. Ainda, observa-se na Figura 5 que, para facilitar a visualizao, foram mostrados apenas os pontos da pea P4 da FIGURA1.

VII Congresso Iberoamericano de Informtica Educativa

1181

Figura 5. Menu Desenho

No menu Figuras tem-se a opo Criar figura cuja funo, como seu nome j diz, criar uma nova figura. Uma vez selecionada essa opo, as informaes sobre a nova figura a ser criada comeam a ser inseridas na estrutura do desenho. Alm disso, as opes disponveis no menu Peas ficam habilitadas, permitindo que sejam inseridas na figura no mximo sete peas. A Figura 6 ilustra o estado do ambiente antes da seleo da opo Criar figura e a Figura 7 ilustra o estado aps a seleo.

Figura 6. Opes do menu Peas desabilitadas

Figura 7. Opes do menu Peas habilitadas

Ainda tem-se o menu Ferramentas com opes para Verificar escrita e Executar. A primeira opo pode ser usada para fazer a verificao do cdigo do desenho antes de executlo. Erros de escrita so diagnosticados com mensagens indicando, para cada erro, a linha onde se encontra e o tipo de erro detectado. A segunda opo pode ser usada para executar o cdigo do desenho que est no editor de texto. Executar um desenho tem como efeito mostrar sua representao grfica. O menu Ferramentas pode ser visto na Figura 8.

VII Congresso Iberoamericano de Informtica Educativa

1182

Figura 8. Menu Ferramentas

5. CONSIDERAES FINAIS O ambiente concebido tem como objetivo facilitar o ensino/aprendizagem de programao por crianas alfabetizadas, sendo composto por dois editores, um grfico e outro de texto. Para representar os desenhos no editor grfico foram utilizadas as peas do jogo Tangram, pois a partir das sete peas que compem o mesmo, pode-se representar uma grande variedade de figuras do mundo real. Ainda, o uso do Tangram justifica-se no trabalho em funo do estudo pedaggico j existente por trs deste jogo. O jogo Tangram de domnio pblico e conhecido internacionalmente (PR-SABER, 2003). Um relacionamento de objetos reais (ou desenhos que se aproximam destes) com comandos em uma linguagem formal disponibilizado, reforando a noo de abstrao. A facilidade na criao de programas possibilitada pelo ambiente atravs da gerao automtica de comandos a partir da manipulao direta do desenho no editor grfico. Alm disso, atravs da linguagem orientada por formas geomtricas, possvel desenvolver programas para representar imagens em movimento (animaes). Pode-se utilizar basicamente os comandos movePasso, repete, rotaciona e piscar para visualizar uma cena dinmica. O comando piscar usado para determinar o tempo existente entre a execuo de comandos, que alteram o contexto. Este recurso faz com que o usurio consiga descrever cenas que se aproximam das existentes no mundo real. Com isto, pretende-se aguar a noo de tempo nas crianas. O software, num momento inicial, foi disponibilizado para trs crianas, em nvel de 4a. e 5a. srie do primeiro grau. Informaes bsicas foram explanadas com relao ao jogo Tangram
VII Congresso Iberoamericano de Informtica Educativa 1183

e ao ambiente. Verificou-se um grande interesse das crianas, sendo que novas cenas foram criadas pelas mesmas. Salienta-se que nenhuma metodologia especfica nesta etapa inicial foi utilizada. Todo o processo foi conduzido informalmente. Uma programao do uso do ambiente est prevista para o primeiro semestre de 2004, com um conjunto maior de usurios. Para tanto, uma metodologia est sendo proposta. Inicialmente sugere-se o uso de um quadro branco no qual as peas do Tangram possam ser fixadas (quadro e peas imantados). Neste quadro as crianas (usurios) montariam as figuras usando as peas do Tangram. Neste momento, as restries com relao a representaes de animaes devem ser enfatizadas. Num segundo momento, usar-se- o software para realizar os mesmos procedimentos anteriores, representando as animaes no ambiente automatizado atravs da linguagem proposta. Atravs da utilizao da ferramenta proposta, espera-se: a) despertar a criatividade; b) reforar a noo de abstrao atravs da representao de uma situao, preferencialmente do mundo real, em uma forma alternativa, no caso, a linguagem de programao (linguagem formal); c) evidenciar a importncia da formalizao, mostrando que uma vez que uma situao descrita de forma precisa, no existem problemas de interpretao e tem-se a possibilidade de simulao atravs de um computador. Salienta-se que a simulao permite a validao daquilo que se deseja expressar; d) motivar o interesse pelo estudo da matemtica, principalmente geometria. Um ambiente com finalidade equivalente, que se chama LOGO (VALENTE, 1988), j existe. Uma linguagem tambm definida para este ambiente. Esta linguagem interage com o ambiente grfico do LOGO, atravs de comandos de movimentao de um desenho de uma tartaruga existente. O usurio informa comandos para que a tartaruga mova-se para direes diferentes na tela e, para cada movimento, um rastro deixado, objetivando formar um desenho. O ambiente aqui apresentado difere do LOGO, visto que o usurio constri desenhos com formas geomtricas pr-definidas e, na medida que se vai desenhando, o cdigo da linguagem vai sendo gerado. Este cdigo poder ser alterado diretamente no texto, surtindo efeito no desenho. A implementao comentada nesse artigo foi realizada durante a confeco de um Trabalho Concluso de Curso (TCC) por Alcntara (2003). O ambiente de programao DELPHI foi utilizado na implementao do software.

VII Congresso Iberoamericano de Informtica Educativa

1184

6. LIMITAES E EXTENSES O editor grfico implementado tem algumas limitaes. Como exemplo cita-se o tamanho da rea do desenho, que hoje fixa. A rea utilizada poderia ter um tamanho dinmico. Uma soluo para aumentar a rea de desenho separar a tela do editor grfico do editor de textos, deixando-as em locais distintos. Para facilitar o manuseio das coordenadas no editor grfico, foi criada uma opo onde so mostrados os pontos das peas que esto desenhadas. Isto poderia ser aprimorado com a criao de uma grade, dividindo o editor grfico em pequenas regies. Alm disso, no ambiente, quando se arrasta uma pea no editor grfico, no se tem um posicionamento preciso. Sugere-se a criao de um mecanismo que facilite este procedimento. Para fazer qualquer manipulao com a figura, sempre toma-se como base uma pea da mesma, sendo que o prottipo no oferece opo para selecionar uma figura. No editor de texto existem algumas limitaes. Uma delas seu tamanho reduzido, visualizando poucas linhas de programa. Para visualizar outras partes do programa, utiliza-se da facilidade de rolagem do texto disponibilizada. Ainda, algumas melhorias poderiam ser feitas no ambiente, como a criao de links visuais entre os comandos textuais e as peas no editor grfico. Por fim, os menus criados satisfazem o uso bsico do prottipo nas suas principais funcionalidades, porm no foi implementado um menu Ajuda. 7. REFERNCIAS Alcntara Jr, O. (2003). Prottipo de uma linguagem de programao de computadores orientada por formas geomtricas, voltada ao ensino de programao. Trabalho de Concluso de Curso, Cincias da Computao, Universidade Regional de Blumenau, Blumenau, Brasil. Borchardt, S. (2002). Materiais ldicos: Tangram no ensino da geometria.. Monografia, PsGraduao em Nvel de Especializao em Educao Matemtica, Universidade Regional de Blumenau, Blumenau, Brasil. Kong, A. M. (2003). Pititi. Extrado em 4 fevereiro, 2003 de http://www.pititi.com/jogos/Tangram/Tangram.htm. Mosquera, J.J.M. (1985). B.F. SKINNER: uma anlise polmica do comportamento humano. Em M. Moreira et al, Aprendizagem: perspectivas tericas (pp. 14-52). Porto Alegre, RS: Editora da UFRGS. PR-SABER (2003). Centro de estudos psicopedaggicos. Extrado em 13 fevereiro, 2004 de http://www.prosaber.org.br/jogos/9anos.asp. Rosemeire (1998). Rose home page. Extrado em 23 julho, 2003 de http://www.geocities.com/athens/ithaca/8750. Sebesta, R. W. (2000). Conceitos de linguagens de programao. Porto Alegre, RS: Bookman.
VII Congresso Iberoamericano de Informtica Educativa 1185

Valente, J. A. & Valente, A. B. (1988). Logo: conceitos, aplicaes e projetos. So Paulo, SP: ITAUTEC Informtica.

VII Congresso Iberoamericano de Informtica Educativa

1186