projeto de aprendizagem

ii

Projeto de Aprendizagem

um Modelo de Interface Graacutefico-Pedagoacutegicade Conteuacutedos para e-Learning

Vacircnia Marins Nobre

Dissertaccedilatildeo submetida ao corpo docente da Coordenaccedilatildeo do Instituto deMatemaacutetica ndash IM e do Nuacutecleo de Computaccedilatildeo Eletrocircnica ndash NCE da UniversidadeFederal do Rio de Janeiro ndash UFRJ como parte dos requisitos necessaacuterios agraveobtenccedilatildeo do grau de Mestre em Informaacutetica

Aprovada por

Professora Claudia Lage Rebello da Motta DSc ndash Orientadora

Professor Marcos da Fonseca Elia PhD ndash Orientador

Professora Liacutegia Alves Barros DSc

Professor Marco Antonio Moreira PhD

Rio de Janeiro ndash BrasilOutubro de 2003

iii

NOBRE Vacircnia MarinsProjeto de Aprendizagem um Modelo de Interface Graacutefico-Pedagoacutegicade Conteuacutedos para e-Learning Vacircnia Marins Nobre Rio de JaneiroUFRJIMNCE 2003xiv111 pilDissertaccedilatildeo (Mestrado) ndash Universidade Federal do Rio de JaneiroIMNCE 2003 Orientadores Claacuteudia Lage Rebello da Motta e Marcosda Fonseca Elia1 Interface 2 Educaccedilatildeo a Distacircncia 3 e-LearningI Projeto de Aprendizagem um Modelo de Interface Graacutefico-Pedagoacutegica de Conteuacutedos para e-LearningII Dissertaccedilatildeo (Mestrado) UFRJIMNCE

iv

Dedico este trabalho agrave professora Iracema Marins Nobre minha filha semente que eu lancei

por amor nesta Terra

v

Agradecimentos

Em primeiro lugar agradeccedilo a Jesus Cristopor ter colocado no meu coraccedilatildeo este projetoaberto portas fornecido meios eenviado seus anjos para me ajudarAgradeccedilo aos anjos invisiacuteveis cujos nomes natildeo conheccedilo enominalmente aos visiacuteveisMarcos Elia e Claacuteudia Mottameus orientadores por acreditarem que eu conseguiria apoiando corrigindoincentivando e oferecendo ideacuteiasLaura Coutinhocolega de mestrado e amiga pelos momentos de estudos na sua casa conselhos eexemplos de desempenho que procuro imitarMarcus Vinicius Pereira Vera Abreu Vacircnia Seidel Edilene Noronha Iecircda SandeDaise Moreira Ana Blower e Rodrigo Gomesprofessores e colaboradoresMuito obrigada

vi

Resumo da Tese apresentada ao Instituto de Matemaacutetica ndash IM e Nuacutecleo deComputaccedilatildeo Eletrocircnica ndash NCE da Universidade Federal do Rio de Janeiro ndashUFRJ para obtenccedilatildeo do grau de Mestre em Ciecircncias (MSc)

Projeto de Aprendizagem - um Modelo de Interface Graacutefico-Pedagoacutegicade Conteuacutedos para e-Learning

Vacircnia Marins NobreOutubro de 2003Orientadores Claudia Lage R da Motta DSc e Marcos da Fonseca Elia PhDPrograma Informaacutetica

Este trabalho propotildee o Projeto de Aprendizagem um modelo de interface

graacutefico-pedagoacutegica de conteuacutedos para e-learning Seu principal objetivo eacute o de

pesquisar e desenvolver modelos de interfaces que sejam facilitadoras na

elaboraccedilatildeo de conteuacutedos pedagogicamente bem planejados significativos

visualmente atraentes e adequados para a publicaccedilatildeo na Internet

Nesta dissertaccedilatildeo satildeo apresentados os conceitos que selecionamos como

adequados e a materializaccedilatildeo do modelo proposto em uma ferramenta de suporte

ndash o Projeto de Aprendizagem que se destina a

(1) professores na elaboraccedilatildeo de conteuacutedos para e-learning e

(2) alunos em processos de e-learning usando os conteuacutedos criados pelos

professores

O presente estudo apresenta aleacutem do modelo e da descriccedilatildeo da

ferramenta uma pesquisa de desenvolvimento de software educativo incluindo

as fases de especificaccedilatildeo de prototipagem e de preacute-validaccedilatildeo Esta uacuteltima

realizada com professores em um estudo de caso qualitativo usando teacutecnicas de

observaccedilatildeo

Palavras-chave Educaccedilatildeo a distacircncia e-learning interface

vii

Abstract of The Thesis presented to Instituto de Matemaacutetica ndash IM and Nuacutecleo deComputaccedilatildeo Eletrocircnica ndash NCE of the Universidade Federal do Rio de Janeiro ndashUFRJ for the degree of Master of Science (MSc)

Learning Project - a Graphical and Pedagogical InterfaceModel for Contents of e-Learning

Vacircnia Marins NobreOctober de 2003Advisors Claacuteudia Motta DSc e Marcos da Fonseca Elia PhDDepartment Informatics

This work proposes the Learning Project a graphical and pedagogical

interface model for contents in e-Learning Its main goal is to search and to

develop interface models that facilitate the preparing pedagogical well design and

meaningful contents which fits to publish in the web

On this dissertation are presented the concepts collected as suitable and

the materialization of the proposed model as a supporting tool ndash the Learning

Project that aims at

(1) teachers on development of contents for e-learning and

(2) pupils in e-learning processes using the contents elaborated by the

teachers

This study presents besides a model and a tool description a search of

education software development including specification prototyping and

testing This last made with teachers through a qualitative case study using

observation techniques

Keywords Distance Education e-Learning interface

viii

Lista de Siglas

ASP Active Server Pages

CEDERJ Centro Universitaacuterio de Ensino a Distacircncia do Estado do Rio de

Janeiro

HTML HyperText Markup Language

UNIREDE Universidade Virtual do Brasil

CAPES Coordenaccedilatildeo de Aperfeiccediloamento de Pessoal de Niacutevel Superior

UFRJ Universidade Federal do Rio de Janeiro

NCE Nuacutecleo de Computaccedilatildeo Eletrocircnica

IM Instituto de Matemaacutetica

URL Universal Resorce Locator

HTTP Hypertext Transfer Protocol

WWW World Wide Web

PUC-Rio Pontifiacutecia Universidade Catoacutelica do Rio de Janeiro

ix

Lista de Ilustraccedilotildees

Figura 21 Exemplo de conteuacutedo apresentado no Learning SpaceFigura 22 Mecanismos de Coordenaccedilatildeo do AulaNetFigura 23 Exemplo de tela do Quantum com material de aprendizagemdiponibilizadoFigura 31 Interseccedilatildeo das camadas no Projeto de AprendizagemFigura 32 Hierarquizaccedilatildeo dos conceitos do conteuacutedo de aprendizagemFigura 33 Exemplo de Mapa Conceitual de ForccedilaFigura 34 O que aluno precisa saber para aprender os novos conceitos propostosno material de aprendizagemFigura 35 O que o aluno jaacute sabeFigura 36 Organizadores PreacuteviosFigura 37 Quadro 72 de MondrianFigura 38 Paacutegina do site da SunFigura 39 Homepage do site da MTVFigura 310 Homepage do site da MicrosoftFigura 311 Homepage da site da loja SandpiperFigura 312 Homepage do buscador GoogleFigura 313 Homepage do site do Van Gogh MuseumFigura 314 Homepage do site da Apple ComputersFigura 315 Paacutegina interna do site da Apple ComputersFigura 316 Barra de navegaccedilatildeo do site da Amazon BooksFigura 317 Homepage do site da loja RichardsFigura 318 Paacutegina interna do site da loja RichardsFigura 319 Visualizaccedilatildeo do buscador Google em 800 x 600 pixelsFigura 320 Visualizaccedilatildeo do buscador Google em 1024 x 768 pixelsFigura 321 Paacutegina do site sobre a figura de Che GuevaraFigura 322 A alteraccedilatildeo da cor de contorno das formas em vermelho mudandotodo o aspecto da padronagem

x

Figura 323 Alteraccedilatildeo na percepccedilatildeo do amarelo nos diversos fundosFigura 324 Alteraccedilatildeo na percepccedilatildeo do vermelho nos diversos fundosFigura 325 Efeitos oacuteticos desagradaacuteveisFigura 326 Detalhe dos iacutecones de percepccedilatildeo de conexatildeo ativa e inativa da barrainferior do WindowsFigura 327 Interface antiga do ICQFigura 41 Modelo ConceitualFigura 42 Navegaccedilatildeo do professor para a construccedilatildeo do Plano de Aula (amareloclaro) criaccedilatildeo das Aulas (amarelo escuro) e Aula criada (marron)Figura 43 Esquema da navegaccedilatildeo do aluno nas paacuteginas do Projeto deAprendizagem criado pelo professorFigura 44 Tela de abertura do Projeto de AprendizagemFigura 45 Tela CriarAlterar Plano de AulaFigura 46 Tela Visualizar Plano de AulaFigura 47 Tela Visualizar Plano de AulaFigura 48 Tela Visualizar Plano de AulaFigura 49 Tela de preenchimento da ApresentaccedilatildeoFigura 410 Tela de preenchimento da MotivaccedilatildeoFigura 411 Tela de preenchimento de ConteuacutedoFigura 412 Tela de preenchimento de AtividadeFigura 413 Tela Visualizar AulaFigura 414 Tela Excluir AulaFigura 51 Apresentaccedilatildeo do Curso de Ineacutercia usando um link externoFigura 52 Motivaccedilatildeo do Curso de Ineacutercia usando um link externoFigura 53 Apresentaccedilatildeo do Curso ldquoReflexotildees sobre a Educaccedilatildeo e o uso dasTecnologiasrdquo publicado na Plataforma Interativa para Internet ndash PiiFigura 54 Motivaccedilatildeo do Curso do Curso ldquoReflexotildees sobre a Educaccedilatildeo e o usodas Tecnologiasrdquo publicado na Plataforma Interativa para Internet ndash Pii

xi

Lista de Tabelas

Tabela 31 ndash Primeira Reflexatildeo

Tabela 32 ndash Segunda Reflexatildeo

Tabela 33 ndash Terceira Reflexatildeo

Tabela 34 ndash Quarta Reflexatildeo

Tabela 51ndash Planejamento do Estudo de Caso

xii

Sumaacuterio

Capiacutetulo I ndash Introduccedilatildeo

11 A Educaccedilatildeo a Distacircncia e a Internet 2

12 Demanda de Modelos e Interfaces para Conteuacutedo de e-Learning3

13 Projeto de Aprendizagem ndash um Modelo de Interface Graacutefico-Pedagoacutegica para

Conteuacutedos de e-Learning3

14 Matriz de Referecircncia 4

15 Apresentaccedilatildeo da Dissertaccedilatildeo 4

Capiacutetulo II ndash e-Learning

21 e-Learning6

22 Breve Histoacuterico8

23 Ambientes Virtuais de Aprendizagem 9

24 Conclusatildeo do Capiacutetulo 14

xiii

Capiacutetulo III ndash Interface

31 Camada Pedagoacutegica Conceito Pedagoacutegico Ausubel-Moreira uma heuriacutestica

para a elaboraccedilatildeo do material de aprendizagem para e-learning utilizando o

modelo de Moreira 18

32 Camada Graacutefica Conceitos de Usabilidade e Webdesign 32

33 Camada de Autoria Conceito de Autonomia e Flexibilidade 65


Capiacutetulo IV ndash Protoacutetipo

41 O Desenvolvimento do Projeto de Aprendizagem 67

42 Escopo da ferramenta do Projeto de Aprendizagem 68

43 Recursos da Ferramenta 68

44 Modelagem 69

45 Utilizaccedilatildeo da Ferramenta 71

46 Conceitos utilizados nas Interfaces da Ferramenta 73

47 Descriccedilatildeo das Interfaces da Ferramenta 76


Capiacutetulo V ndash Preacute-Validaccedilatildeo

51 Objetivos do Estudo de Caso 88

52 Resultados do Processo de preacute-Validaccedilatildeo 90


Capiacutetulo VI ndash Conclusatildeo 100

Referecircncias Bibliograacuteficas 103

Anexo 109

xiv

1

Capiacutetulo I - Introduccedilatildeo


O uso do computador e mais recentemente da Internet estaacute se tornando

presente em quase todos os aspectos da vida moderna bancos lojas

supermercados ambientes de trabalho eletrodomeacutesticos e lazer De diversos

modos o computador vem amplificando funccedilotildees cognitivas humanas e mudando

a maneira de o homem pensar sobre o mundo e sobre si mesmo

Niskier [1999] destaca o volume de informaccedilotildees e a hipervelocidade com

que satildeo veiculadas dentre as caracteriacutesticas fundamentais do mundo

contemporacircneo alertando para as transformaccedilotildees profundas em todos os niacuteveis

do conhecimento humano que elas acarretam

Em contrapartida a educaccedilatildeo na grande maioria dos ambientes escolares

apoacuteia-se em um paradigma institucionalizado e conservador de aprendizado que

segundo Leacutevy [1993] ldquohaacute cinco mil anos se baseia no falarditar do mestre na

escrita manuscrita do aluno e haacute quatro seacuteculos em um uso moderado da

impressatildeordquo Embora esta afirmaccedilatildeo de Pierre Leacutevy possa parecer radical e

questionaacutevel ela natildeo deixa de ser denunciadora

Educaccedilatildeo define Aureacutelio [2000] ldquoeacute processo de desenvolvimento da

capacidade fiacutesica intelectual e moral da crianccedila e do ser humano em geral

visando agrave sua melhor integraccedilatildeo individual e socialrdquo afirma tambeacutem que

educaccedilatildeo eacute o ldquoaperfeiccediloamento integral de todas as faculdades humanasrdquo

Ora podemos entatildeo inferir a partir dessa definiccedilatildeo que educaccedilatildeo eacute um

processo contiacutenuo cujas dimensotildees natildeo estatildeo restritas unicamente ao universo

acadecircmico e agrave sua temporalidade E concluir que a educaccedilatildeo e o direito _ acesso

2


a ela ndash estaacute e sempre esteve aleacutem da pedagogia e das tecnologias usadas na

escola e significa hoje mais do que nunca acesso agrave informaccedilatildeo

Prover meios de acesso agrave informaccedilatildeo a professores e a alunos usando a

tecnologia disponiacutevel parece ser uma das saiacutedas para as atuais demandas

educacionais e mais ainda um meio de modernizar as relaccedilotildees entre escola e

sociedade

Pensadores contemporacircneos como Pierre Leacutevy [2000] com os olhos

voltados para o impacto causado pelas novas tecnologias estatildeo apontando para o

ensino aberto e a distacircncia como uma soluccedilatildeo para as demandas de educaccedilatildeo da

sociedade contemporacircnea Tambeacutem Niskier [1999] aponta para a soluccedilatildeo da

educaccedilatildeo a distacircncia afirmando que ela eacute um instrumento de grandes

potencialidades para atrair e garantir qualidade na relaccedilatildeo ensino-aprendizagem

Eacute neste contexto que vemos a utilizaccedilatildeo da Internet na educaccedilatildeo como

uma proposta de democratizaccedilatildeo da informaccedilatildeo de possibilidade de publicaccedilatildeo

de baixo custo uma biblioteca viva e dinacircmica para professores e alunos um

oceano de diversidade e de informaccedilatildeo a um clique do mouse

11 A Educaccedilatildeo a Distacircncia e a Internet

Fuks e Lucena [2000 p53] definem educaccedilatildeo a distacircncia como sendo ldquoo

ensinoaprendizagem oferecido atraveacutes de miacutedia impressa ou eletrocircnica para

pessoas participantes em um processo de aprendizado em tempo e local

diferentes do(s) instrutor(es)rdquo

O ensino a distacircncia natildeo eacute algo novo ele aparece hoje instrumentalizado

mais poderosamente pelo uso dos computadores e da Internet O uso da miacutedia

eletrocircnica eacute um diferencial em relaccedilatildeo agrave modalidade de ensino a distacircncia

convencional (onde satildeo utilizados miacutedia impressa e telefone) por oferecer

recursos que aliam a capacidade de processamento armazenamento de dados e

utilizaccedilatildeo de multimiacutedias agrave interatividade e agraves possibilidades de comunicaccedilatildeo da

Internet

3


Esses novos valores agregados satildeo tatildeo significativos e diferenciais em

relaccedilatildeo ao modelo convencional de ensino a distacircncia que nos levaram a

escolher essa modalidade como objeto de estudo e utilizar no contexto deste

trabalho o termo e-learning1 para nomear o ensino a distacircncia que utiliza a miacutedia

eletrocircnica

12 Demanda de Modelos e Interfaces para Conteuacutedo de e-Learning

Sabemos que a aprendizagem a distacircncia usando a Internet o e-learning

eacute um processo que vai aleacutem da publicaccedilatildeo de conteuacutedos de informaccedilatildeo mas que

tambeacutem natildeo os dispensa E que ldquopara desenvolver conteuacutedos atraentes satildeo

necessaacuterias aleacutem do conhecimento do tema habilidades pedagoacutegicas e de design

graacuteficordquo [Fucks et al 2001] Elegemos esse aspecto do e-learning como objeto

de estudo por consideraacute-lo relevante e natildeo encontrarmos na literatura e nos

Ambientes Virtuais de Aprendizagem (Capiacutetulo II ndash e-Learning) modelos

pedagoacutegicos e graacuteficos de auxiacutelio ao professor

13 Projeto de Aprendizagem ndash um Modelo de Interface Graacutefico-

Pedagoacutegica para Conteuacutedos de e-Learning

O presente trabalho objetiva pesquisar e desenvolver modelos de

interfaces que sejam facilitadoras na elaboraccedilatildeo de conteuacutedos pedagogicamente

bem planejados significativos visualmente atraentes e adequados para a

publicaccedilatildeo na Internet

Nesta dissertaccedilatildeo satildeo apresentados os conceitos tanto graacuteficos quanto

pedagoacutegicos que selecionamos como adequados e tambeacutem a materializaccedilatildeo do

modelo que estamos propondo em uma ferramenta de suporte ndash o Projeto de

Aprendizagem que se destina a


(2) alunos em processos de aprendizagem atraveacutes do e-learning usando os

conteuacutedos criados pelos professores

1 Mais informaccedilotildees em httpwwwmhwcombr Acessado em 2003

4


14 Matriz de Referecircncia

O presente estudo apresenta aleacutem de um modelo e a descriccedilatildeo da


as fases de especificaccedilatildeo de prototipagem e de preacute-validaccedilatildeo Esta uacuteltima feita

com professores em um estudo de caso qualitativo usando teacutecnicas de


15 Apresentaccedilatildeo da Dissertaccedilatildeo

No Capiacutetulo I ndash Introduccedilatildeo apresentamos nosso objeto de estudo o e-

learning atraveacutes de uma reflexatildeo sobre o uso da Internet como facilitadora do

acesso agrave educaccedilatildeo

No Capiacutetulo II ndash e-Learning Nesse Capiacutetulo estaremos apresentamos um

conceito de e-learning alguns marcos significativos da educaccedilatildeo a distacircncia no

Brasil e como se daacute a publicaccedilatildeo de conteuacutedos em alguns ambientes virtuais de

aprendizagem que escolhemos como amostra AulaNet Learning Space

Quantum UniverSite TelEduc e Plataforma Pii

No Capiacutetulo III ndash Interface descrevemos os conceitos que foram

adotados no modelo desenvolvido para o Projeto de Aprendizagem

Na seccedilatildeo 31 Camada Pedagoacutegica Conceito Pedagoacutegico Ausubel-

Moreira uma heuriacutestica para a elaboraccedilatildeo do material de aprendizagem

para e-learning utilizando o modelo de Moreira discutimos o conceito de

aprendizagem significativa e as etapas de elaboraccedilatildeo de conteuacutedos didaacuteticos

propostas por David Ausubel segundo a interpretaccedilatildeo de Marco Antonio

Moreira

Na seccedilatildeo 32 Camada Graacutefica Conceitos de Usabilidade e Webdesign

comentamos os conceitos pesquisados na literatura que acreditamos serem

adequados para a criaccedilatildeo de interfaces graacuteficas para e-learning

Na seccedilatildeo 33 Camada de Autoria Conceito de Autonomia e

Flexibilidade ressaltamos a importacircncia do professor na elaboraccedilatildeo dos

5


conteuacutedos para educaccedilatildeo a distacircncia e o Projeto de Aprendizagem como uma

proposta de transiccedilatildeo para apropriaccedilatildeo das linguagens do e-learning pelo

professorado

No Capiacutetulo IV ndash Protoacutetipo apresentamos as fases de desenvolvimento

do protoacutetipo que materializa a proposta conceitual do Projeto de Aprendizagem

No Capiacutetulo V ndash Preacute-Validaccedilatildeo descrevemos um estudo de caso

qualitativo feito com professores usando teacutecnicas de observaccedilatildeo e os resultados

obtidos

No Capiacutetulo VI ndash Conclusatildeo apresentamos nossa contribuiccedilatildeo uma

reflexatildeo sobre o processo e enumeramos possiacuteveis trabalhos futuros

6



Nesse Capiacutetulo estaremos apresentamos um conceito de e-learning alguns

marcos significativos da educaccedilatildeo a distacircncia no Brasil e como se daacute a

publicaccedilatildeo de conteuacutedos em alguns ambientes virtuais de aprendizagem que

escolhemos como amostra AulaNet Learning Space Quantum UniverSite

TelEduc e Plataforma Pii

21 e-Learning

Niskier [1999] conta um total de nove citaccedilotildees para a educaccedilatildeo a distacircncia

na Lei de Diretrizes e Bases da Educaccedilatildeo Nacional [Lei nordm 939496] Estamos

presenciando um verdadeiro ldquoboomrdquo de iniciativas tanto puacuteblicas quanto

privadas em torno da educaccedilatildeo a distacircncia e podemos dizer com alguma

propriedade que ldquoA Educaccedilatildeo a Distacircncia estaacute na ordem do diardquo [Elia e

Sampaio 2001]

Parece-nos que este eacute um momento importante e ao mesmo tempo

delicado pois nossas produccedilotildees estaratildeo escrevendo o futuro desta modalidade de

educaccedilatildeo que acreditamos se bem utilizada pode ser um meio de vencer vaacuterias

distacircncias

Na definiccedilatildeo de Fuks e Lucena [2000 p53] jaacute citada agrave paacutegina dois _

ldquoeducaccedilatildeo a distacircncia eacute o ensinoaprendizagem oferecido atraveacutes de miacutedia

impressa ou eletrocircnica para pessoas participantes em um processo de

aprendizado em tempo e local diferentes do(s) instrutor(es)rdquo observamos que

duas variaacuteveis de aprendizagem aparecem flexibilizadas o tempo e o espaccedilo

Elia [2001] acrescenta a este enunciado a flexibilizaccedilatildeo de mais uma variaacutevel o

ritmo de aprendizagem Jaacute Leacutevy [1999] indo mais longe aponta a importacircncia

de educaccedilatildeo aberta e natildeo limitada ao contexto da educaccedilatildeo formal aleacutem de

7


consagrar as experiecircncias adquiridas durante a vida como aprendizagem que natildeo

pode ser descartada Sob o olhar desses autores podemos assegurar que a

educaccedilatildeo a distacircncia traz em seu bojo possibilidades bastante interessantes a

serem exploradas

Por natildeo ser uma coisa nova acreditamos que a alavanca desta onda de

otimismo satildeo as possibilidades oferecidas por esta nova visatildeo da educaccedilatildeo a

distacircncia o e-learning Segundo a definiccedilatildeo encontrada no site da empresa

Xerox que comercializa o ambiente para educaccedilatildeo a distacircncia UniverSite e-

learning1 eacute a modalidade de educaccedilatildeo que se vale de miacutedia eletrocircnica como

viacutedeos CDs Internet intranet para distribuir informaccedilatildeo que segundo

entendemos pode ser oferecido totalmente agrave distacircncia ou assumindo formas

hiacutebridas em que a disponibilizaccedilatildeo de materiais na rede e as interaccedilotildees entre

professore(s)aluno(s) funcionam como um suporte ao ensino presencial

Esta onda de otimismo em do torno do e-learning poreacutem natildeo chega a

cegar Niskier [1999] ao citar Michael Moore [1996] assinala os cuidados para

uma implantaccedilatildeo da educaccedilatildeo a distacircncia

ldquoEducaccedilatildeo a distacircncia eacute a aprendizagem planejada que geralmente

ocorre num local diferente do ensino e por causa disso requer teacutecnicas

especiais de desenho de curso teacutecnicas especiais de instruccedilatildeo meacutetodos

especiais de comunicaccedilatildeo atraveacutes da eletrocircnica e outras tecnologias bem como

arranjos essenciais organizacionais e administrativosrdquo [Moore apud

Niskier1999 p50]

Entre vantagens e cuidados natildeo podemos deixar de nos entusiasmar com

uma modalidade de ensino que oferece tantas possibilidades

1 Mais informaccedilotildees em httpwwwmhwcombr

8


22 Breve Histoacuterico

Se quisermos ir longe podemos dizer que a educaccedilatildeo a distacircncia comeccedilou

no seacuteculo XV quando Johannes Guttenberg inventou a imprensa Aqui no Brasil

natildeo existem relatos precisos mas em 1891 o Jornal do Brasil publicava na sua

primeira ediccedilatildeo na seccedilatildeo de classificados um anuacutencio oferecendo um curso de

datilografia por correspondecircncia [Alves 2003] Um outro marco relevante foi o

surgimento em 1941 do Instituto Universal Brasileiro que objetivava a

formaccedilatildeo profissional de niacutevel elementar e meacutedio [Alves 2003]

Merecem destaque o Projeto Minerva2 nos anos 70 o Projeto

TELECURSO3 veiculado pela televisatildeo a partir em 1978 que permanece ateacute

hoje [Andrade 2001] e o Projeto de Poacutes-Graduaccedilatildeo Tutorial a Distacircncia _

POSGRAD um convecircnio entre a CAPES4 e vaacuterias universidades brasileiras

dentre elas a UFRJ iniciado em 1979 e voltado para cursos de aperfeiccediloamento

e especializaccedilatildeo de docente que foi classificado como uma das mais bem-

sucedidas experiecircncias-piloto de ensino a distacircncia no Brasil

Utilizando a miacutedia eletrocircnica aleacutem de material impresso podemos destacar

os consoacutercios UNIREDE5 e CEDERJ6 criados com o objetivo de oferecer cursos

de extensatildeo graduaccedilatildeo e poacutes-graduaccedilatildeo

2 Projeto Minerva _ nasceu no Serviccedilo de Radiodifusatildeo Educativa do Ministeacuterio da Educaccedilatildeo e CulturaFoi iniciado em 1ordm de setembro de 1970 O objetivo maior do projeto atendia agrave Lei nordm569271 (CapiacutetuloIVartigos 24 a 28) que dava ecircnfase agrave educaccedilatildeo de adultos O parecer nordm 69972 determinava a extensatildeodesse ensino definindo claramente as funccedilotildees baacutesicas do ensino supletivo suplecircncia suprimentoqualificaccedilatildeo e aprendizagemInformaccedilotildees em httpwwwepsufscbrdisctecmcbahiagrupo8sitepag6htmbr

3 Projeto TELECURSO _ iniciativa da Fundaccedilatildeo Roberto Marinho em parceria com outras entidades eempresas atuando no ensino profissionalizante e supletivo do Ensino Fundamental e do Ensino MeacutedioAo completar o cursoo aluno pode obter certificaccedilatildeo atraveacutes dos exames supletivos oferecidos pelasSecretarias Estaduais de Educaccedilatildeo Informaccedilotildees em httpwwwtelecurso2000orgbr

4 CAPES ndash Coordenaccedilatildeo de Aperfeiccediloamento de Pessoal de Niacutevel Superior Informaccedilotildees emhttpwwwcapesgovbr

5 UNIREDE ndash Universidade Virtual do Brasil _ eacute um consoacutercio formado por mais de 70 instituiccedilotildees deensino federal entre universidades e escolas teacutecnicas que objetiva democratizar o acesso agrave educaccedilatildeo dequalidade por meio da oferta de cursos a distacircncia A proposta abrange os niacuteveis de graduaccedilatildeo poacutes-graduaccedilatildeo extensatildeo e educaccedilatildeo continuada Fazem parte da UNIREDE instituiccedilotildees como UFRJUNIRIO UNB dentre outras Informaccedilotildees em httpwwwuniredebr

9


22 Ambientes Virtuais de Aprendizagem

Um nuacutemero significativo de softwares de apoio ao e-learning estaacute sendo

colocado no mercado Esses ambientes podem ser chamados de AVAs ndash

Ambientes Virtuais de Aprendizagem [Almeida et al 2001] WBT ndash Web Based

Training ou LMS ndash Learning Manegement System7 e se caracterizam por possuir

ferramentas de comunicaccedilatildeo e de gerenciamento

Escolhemos uma amostra de ambientes virtuais de aprendizagem entre os

mais comentados na literatura para mostrar como eacute feita neles a inclusatildeo de

conteuacutedos que eacute o foco desta pesquisa

221 Lotus Learning Space Application Suite

O Lotus Learning Space8 eacute um ambiente de aprendizado a distacircncia

baseado no ambiente para trabalho cooperativo e colaborativo Lotus Notes Ele

oferece suporte para a autoria de conteuacutedos sem que seja preciso que o professor

conheccedila HTML mas natildeo oferece nenhum modelo graacutefico para auxiliar o

professor cabendo a ele desenvolver seu proacuteprio layout O modelo pedagoacutegico

poreacutem fica apoiado nas ferramentas de trabalho cooperativo Segundo o relato

de uma professora usuaacuteria

ldquoHaacute uma pasta chamada Central em que vocecirc se jaacute for cadastrada

cria um curso Basta ir seguindo o roteiro dando as devidas informaccedilotildees

Depois os textos satildeo colocados no Centro de Recursos onde fica todo o

material que na Programaccedilatildeo seraacute arrumado na ordem que vocecirc quiser Haacute

tambeacutem a Sala de Aula onde pode haver discussatildeo entre os alunos e

6CEDERJ - Centro Universitaacuterio de Ensino a Distacircncia do Estado do Rio de Janeiro ndash eacute um consoacutercioque reuacutene as universidades puacuteblicas sediadas no Rio de Janeiro UENF UERJ UFF UFRJ UFRRJ eUNIRIO Informaccedilotildees em httpwwwcederjrjgovbr


8 Mais informaccedilotildees em httpwwwlotuscominstitute Acessado em 2003

10


professores ou exerciacutecios avaliaccedilotildees etc Ainda tem um quarto ambiente

chamado perfis onde temos tudo sobre os alunos e professores eacute o lugar do

cadastroldquo 9

A Figura 21 mostra um exemplo de conteuacutedo de aprendizagem publicado

Figura 21 Exemplo de conteuacutedo apresentado no Learning Space

222 AulaNet

O AulaNet10 eacute um ambiente de aprendizagem cooperativa (modelo

pedagoacutegico) baseado na web desenvolvido no Laboratoacuterio de Engenharia de

Software - LES - do Departamento de Informaacutetica da Pontifiacutecia Universidade

Catoacutelica do Rio de Janeiro - PUC-Rio O ambiente de criaccedilatildeo e de manutenccedilatildeo

de cursos apoiados em tecnologia de Internet pode ser utilizado tanto para ensino

a distacircncia como para complementaccedilatildeo agraves atividades de educaccedilatildeo presencial e

treinamento de profissionais O AulaNet baseia-se nas relaccedilotildees de trabalho

9 Professora entrevistada em 200310 Mais informaccedilotildees em httpanauelceadpuc-riobraulanet Acessado em 2001

11


cooperativo focando as interaccedilotildees dos aprendizes com seus mediadores com

outros e com os conteuacutedos didaacuteticos [Fuks e Lucena 2001]

Tambeacutem o AulaNet natildeo oferece ferramentas de autoria e modelos graacuteficos

ldquoEacute importante enfatizar que a menos da ferramenta de geraccedilatildeo de provas natildeo

existem ferramentas de autoria no AulaNet pois jaacute existem ferramentas de

prateleira que satildeo convenientesrdquo [Fuks e Lucena 2000 volI p116] Os

materiais de aprendizagem devem ser preparados nos formatos PPT RM PDF

ou HTML GIF JPG RM AVI MOV e inseridos no ambiente atraveacutes do Plano

de Aula A Figura 22 mostra os mecanismos de coordenaccedilatildeo do AulaNet

Figura 22 Mecanismos de Coordenaccedilatildeo do AulaNet

12


223 Quantum

O Quantum11 eacute um sistema para aplicaccedilatildeo de cursos atraveacutes da web onde

Professores e Alunos podem entrar em contato tirar duacutevidas etc segundo

definiccedilatildeo de seus criadores

Da mesma forma que o AulaNet o Quantum necessita que o professor

crie seus conteuacutedos utilizando ferramentas externas de autoria Pode ser inserido

qualquer tipo de arquivo que possibilite um link na Internet por exemplo

HTML arquivos de texto imagens JPG ou GIF filme MPEG etc Ele natildeo

sugere nenhum modelo pedagoacutegico ou graacutefico

Figura 23 Exemplo de tela do Quantum com material de aprendizagem

publicado

11 Mais informaccedilotildees em httpwwwsemearcom Acessado em 2002

13


224 UniverSiteregcopy

O UniverSite12 eacute um ambiente produzido pela empresa Xerox Segundo

informaccedilotildees obtidas no site da empresa ele funciona como uma universidade

virtual criando um ambiente intuitivo muito proacuteximo ao do ensino tradicional

em sala de aula O conteuacutedo educacional eacute ministrado por meio de recursos

multimiacutedia hipertextos e links A principal preocupaccedilatildeo do desenvolvimento do

UniverSite foi detectar uma filosofia pedagoacutegica que seguisse os moldes do

ensino presencial natildeo permitindo que a soluccedilatildeo se diferenciasse do meacutetodo de

ensino com o qual o aluno estaria acostumado a ter nas escolas e universidades

nas presenciais Ele oferece ferramentas de comunicaccedilatildeo os usuaacuterios contam

com programa de E-mail FAQ Foacuterum de Discussatildeo Quadro de Notas e Sala de

Chat

Tambeacutem natildeo possui ferramenta de autoria necessitando que o professor

autor desenvolva seus conteuacutedos externamente

225 TelEduc

O TelEduc13 eacute um ambiente para a criaccedilatildeo a participaccedilatildeo e a

administraccedilatildeo de cursos na web Foi concebido tendo como alvo o processo de

formaccedilatildeo de professores para informaacutetica educativa baseado na metodologia de

formaccedilatildeo contextualizada desenvolvida por pesquisadores do NIED (Nuacutecleo de

Informaacutetica Aplicada agrave Educaccedilatildeo) da Unicamp e possui como elemento central a

ferramenta que disponibiliza Atividades

Segundo seus autores isso possibilita o aprendizado de conceitos em

qualquer domiacutenio do conhecimento a partir da resoluccedilatildeo de problemas (modelo

pedagoacutegico) com o subsiacutedio de diferentes materiais didaacuteticos como textos

referecircncias na Internet dentre outros que podem ser colocados para o aluno

usando ferramentas como material de apoio leituras perguntas frequumlentes etc

12 Mais informaccedilotildees em httpwwwmhwcombruniversite Acessado em 200313 Mais informaccedilotildees em httpteleducniedunicampbrteleduc Acessado em 2003

14


Tambeacutem no TelEduc os conteuacutedos precisam ser desenvolvidos externamente

para depois serem inseridos no ambiente

226 Plataforma Interativa para Internet ndash Pii

A Pii ndash Plataforma Interativa para Internet14 eacute uma plataforma para

educaccedilatildeo a distacircncia que faz parte de uma proposta de pesquisa-accedilatildeo [Elia e

Sampaio 2001] do programa de poacutes-graduaccedilatildeo do Nuacutecleo de Computaccedilatildeo

Eletrocircnica na Universidade Federal do Rio de Janeiro ndash NCEUFRJ

A plataforma Pii como a maioria dos ambientes de educaccedilatildeo a distacircncia

oferece ferramentas de gerenciamento e de comunicaccedilatildeo Os conteuacutedos de

aprendizagem podem ser incluiacutedos tanto nos formatos de texto PDF HTML

apresentaccedilotildees PPT AVI MOV GIF e JPG como em outros ambientes O

diferencial da Pii por ser um ambiente de pesquisa-accedilatildeo estaacute em abrir espaccedilo

para a pesquisa de modelos pedagoacutegicos e graacuteficos para educaccedilatildeo a distacircncia A

plataforma Pii jaacute conta com o meacutetodo Keller [Keller 1968] e com o Projeto de

Aprendizagem que estamos descrevendo nesta dissertaccedilatildeo

23 Conclusatildeo do Capiacutetulo

Nos ambientes virtuais de aprendizagem que tomamos como universo de

estudo observamos que em trecircs deles existe uma indicaccedilatildeo de estrateacutegia

pedagoacutegica a cooperaccedilatildeo e a colaboraccedilatildeo no Learning Space e no AulaNet e a

aprendizagem baseada em soluccedilatildeo de problemas no TelEduc O Quantum e o

UniverSite natildeo sugerem nenhuma estrateacutegia

Embora em trecircs dos ambientes observados exista uma sugestatildeo de

estrateacutegia de aprendizagem embutida em nenhum deles poreacutem encontramos

modelos graacuteficos ou pedagoacutegicos para a autoria dos conteuacutedos que ficam sempre

a cargo do professor-autor e de uma equipe de profissionais

14 A plataforma Pii estaacute acessiacutevel em httpwwwnceufrjbrpii Acessado em 2003

15


Inserido na plataforma Pii um ambiente aberto agrave experimentaccedilatildeo o

Projeto de Aprendizagem estaacute buscando um ideal de autonomia para o professor-

autor oferecendo-lhe formaccedilatildeo e informaccedilatildeo atraveacutes de uma ferramenta e de um

modelo de elaboraccedilatildeo de conteuacutedos com os quais ele possa desenvolver uma

praacutetica em e-learning

16

Capiacutetulo III - Interface


Neste capiacutetulo descrevemos os conceitos que foram adotados no modelo

desenvolvido para o Projeto de Aprendizagem

Uma interface eacute um mediador Segundo Laurel [1990] eacute uma superfiacutecie

de contato como a maccedilaneta eacute a interface entre as pessoas e a porta O mouse o

teclado o microfone e a tela do monitor satildeo portanto exemplos de interfaces

pois satildeo mediadores entre o homem e a maacutequina

O ator mais importante em se tratando de interfaces eacute o usuaacuterio

Interfaces natildeo satildeo criadas para designers muito menos para programadores

Interfaces devem ser criadas para seus usuaacuterios finais Uma boa interface deve

atender a seus usuaacuterios em seus objetivos de uso suas necessidades e suas

limitaccedilotildees

Os esforccedilos dos designers de interface devem objetivar a oferta de maior

nuacutemero possiacutevel de opccedilotildees e facilidades sem que haja uma sobrecarga cognitiva

para os usuaacuterios Laurel adverte-nos que ldquo o excesso de opccedilotildees e de convenccedilotildees

que eu devo aprender para que eu possa me tornar proficiente no uso de uma

interface me deixa confusa e cansada Os psicoacutelogos chamam isso de

sobrecarga cognitiva Eu chamo de problemardquo [Laurel1990 pxi]

Uma interface eacute tanto melhor quanto mais atenda ao seu usuaacuterio tiacutepico ou

seja uma interface torna- se tanto mais eficiente quanto mais ela eacute faacutecil de usar

por seus usuaacuterios tiacutepicos quando natildeo satildeo necessaacuterios grandes esforccedilos para

apreendecirc-la quando o usuaacuterio sente- se agrave vontade nela e quando ele consegue

tirar proveito de todas as funcionalidades oferecidas pelo sistema daiacute o conceito

17


de usabilidade que vem sendo empregado para avaliar sistemas A proacutepria

palavra jaacute o define ndash usaacutevel apropriada para o uso

Santos [2003] entende que as interfaces educacionais devem seguir os

mesmos princiacutepios para o projeto de interfaces em geral e que tambeacutem deveriam

se fundamentar em alguma teoria de como as pessoas aprendem

Definimos entatildeo nosso modelo conceitual objetivando contemplar esses

aspectos desejaacuteveis para um software educacional acrescentado mais um que eacute a

participaccedilatildeo do professor no momento em que ele elabora o conteuacutedo O modelo

conceitual do Projeto de Aprendizagem ficou definido atraveacutes de uma interface

construiacuteda em trecircs camadas

(1) A primeira camada sendo a expressatildeo do saber pedagoacutegico

(2) A segunda a expressatildeo do visual graacutefico e da usabilidade em

interfaces para a web e

(3) A terceira a expressatildeo do subjetivismo bom senso criatividade e da

competecircncia especiacutefica do professor-autor que satildeo manifestadas no momento em

que constroacutei o conteuacutedo de aprendizagem que seraacute publicado para os alunos Eacute a

autoria do professor

Mas natildeo pensamos essas camadas como superpostas e independentes

Embora cada uma delas possua um conceito proacuteprio queremos dizer que elas

foram concebidas como camadas integradas e interpenetradas pois planejamos

todas as interfaces de maneira que possuiacutessem a expressatildeo dos trecircs conceitos

adotados A Figura 41 mostra um modelo que tenta se aproximar da interaccedilatildeo

que eacute pretendida com as trecircs camadas da interface

O conceito pedagoacutegico escolhido foi o da Aprendizagem Significativa de

David Ausubel segundo a leitura de Marco Antonio Moreira O conceito graacutefico

foi elaborado a partir de referees de usabilidade em interfaces web e webdesign

O conceito de autoria foi pensado no sentido de dar autonomia ao professor e

flexibilidade de uso

18


Figura 31 Interseccedilatildeo das camadas no Projeto de Aprendizagem

Este capiacutetulo descreve os conceitos que foram selecionados para compor

as camadas a interface do Projeto de Aprendizagem

31 Camada Pedagoacutegica

Conceito pedagoacutegico Ausubel-Moreira Heuriacutestica para a elaboraccedilatildeo do

material de aprendizagem para e-learning utilizando o modelo de Moreira

O referencial pedagoacutegico escolhido para orientar o Projeto de

Aprendizagem foi ldquoAprendizagem Significativardquo de David Ausubel segundo a

leitura de Marco Antonio Moreira aqui denominado modelo Ausubel-Moreira

A inclusatildeo dos subsiacutedios de Moreira [Moreira1983] no modelo deve-se a

nosso ver agrave sua capacidade em condensar os principais aspectos da obra de

Ausubel em uma linguagem mais acessiacutevel aos natildeo especialistas da aacuterea

inclusive com exemplos que enfatizam sua espinha dorsal e seus aspectos mais

praacuteticos no processo de ensino-aprendizagem Portanto a dimensatildeo pedagoacutegica

do Projeto de Aprendizagem consiste em uma adaptaccedilatildeo para o e-learning dos

trabalhos de Moreira que foram escritos para professores em um contexto de

ensino presencial

A ldquoAprendizagem Significativardquo de Ausubel eacute uma teoria reconhecida e

dispensaria aqui uma apresentaccedilatildeo detalhada poreacutem a sua escolha para um

19


contexto de e-learning merece algumas consideraccedilotildees e justificativas que seratildeo

dadas a seguir

Escolhemos construir um projeto de ensino-aprendizagem baseado no

modelo cognitivo de Ausubel por reconhecermos nele princiacutepios que podem ser

aproveitados em educaccedilatildeo a distacircncia apoiada por computadores e-learning a

saber

(1) Em e-learning eacute preciso que o conteuacutedo seja organizado de modo que

venha a facilitar aprendizagem e a motivar o aluno uma vez que ele estaraacute a

maior parte do tempo trabalhando sozinho Em princiacutepio adotamos a teoria

pedagoacutegica de David de Ausubel como base da camada pedagoacutegica do Projeto de

Aprendizagem porque ela defende que um corpo de conhecimento eacute muito mais

faacutecil de compreender e lembrar se for relacionaacutevel (ancoraacutevel) a ideacuteias

preexistentes na estrutura cognitiva do aluno a ldquoAprendizagem Significativardquo

(2) Aleacutem disso porque a teoria ldquoausubelianardquo oferece um sistema de

referecircncia de aprendizagem que natildeo necessita alterar substancialmente o atual

modelo de ensino-aprendizagem A estrutura educacional tradicional em sala de

aula estaacute voltada para o que Ausubel denomina de aprendizagem verbal receptiva

de um corpo grande de conhecimento por parte do aluno

A teoria de Ausubel portanto oferece uma formataccedilatildeo de conteuacutedo para

e-learning sem que precisemos fugir radicalmente da estrutura existente

permitindo assim a coexistecircncia por algum tempo entre o ldquovelhordquo e o ldquonovordquo

pois de nada adianta uma mudanccedila radical isolada

(3) Um outro aspecto favoraacutevel agrave utilizaccedilatildeo computacional da teoria

pedagoacutegica de Ausubel eacute que ela eacute centrada no aluno Ausubel afirma que as

melhores estrateacutegias de ensino satildeo as que permitem que seja alterado tanto pelo

professor quanto pelo aluno o tempo de ensino-aprendizado Esta afirmaccedilatildeo

reforccedila o uso de computadoresInternet na educaccedilatildeo e principalmente lanccedila

expectativas em relaccedilatildeo ao e-learning pois uma das vantagens incontestaacuteveis

20


dessas novas tecnologias em um contexto educacional eacute dar ao aluno a

possibilidade de aprender em ritmo proacuteprio e com um conteuacutedo adaptado agraves suas

necessidades

(4) Acreditamos tambeacutem que a utilizaccedilatildeo de uma estrateacutegia de

organizadores preacutevios ldquoausubelianosldquo eacute uma possibilidade de flexibilizaccedilatildeo na

exposiccedilatildeo do material de aprendizagem uma opccedilatildeo de adaptaccedilatildeo que pode ser

explorada computacionalmente Os organizadores preacutevios podem ser usados para

suprir as deficiecircncias de um aluno apenas favorecendo uma aprendizagem mais

personalizada ou de um grupo de alunos desde que tenham sido previamente

observados os padrotildees de aprendizagem do aluno ou do grupo de alunos

ldquoDescobertas gerais com respeito ao papel dos organizadores

cognitivos pareceriam ter implicaccedilotildees significativas quanto a aspectos da

individualizaccedilatildeo do ensino relacionados ao problema das preconcepccedilotildees

Suponhamos que organizadores antecipados possam ser usados de forma

natildeo individualizada em geral para preencher a lacuna entre o que os

alunos jaacute sabem e o que eles tecircm que aprender num dado momento

[Ausubel 1980 p312]

(5) Por fim julgamos que seria relevante a utilizaccedilatildeo deste modelo numa

proposta experimental uma vez que ainda natildeo existem modelos pedagoacutegicos

para e-learning consagrados

311 Resumo da Teoria

Segundo Moreira a teoria de David Ausubel eacute uma teoria cognitiva e

portanto busca explicar teoricamente a aprendizagem sobre a oacutetica do

cognitivismo Ausubel descreve cogniccedilatildeo como um termo geneacuterico referente a

processos mentais que levam o indiviacuteduo agrave aquisiccedilatildeo de conceitos compreensatildeo

21


de sentenccedilas resoluccedilatildeo de problemas retenccedilatildeo significativa julgamento e assim

por diante

A estrutura cognitiva eacute constituiacuteda pelo que o indiviacuteduo jaacute sabe Ausubel

vecirc a estrutura cognitiva humana como sendo altamente organizada e

hierarquizada na qual informaccedilotildees mais especiacuteficas estatildeo ligadas a conceitos

ideacuteias proposiccedilotildees mais gerais Isso nos leva a acreditar que esta eacute a melhor

maneira de organizar o material didaacutetico ou seja de maneira hierarquizada em

que conceitos mais abrangentes e inclusivos devem ser apresentados no iniacutecio e

os mais especiacuteficos no final

O conceito fundamental da teoria de Ausubel eacute o da aprendizagem

significativa que pode ser entendida como um processo no qual a nova

informaccedilatildeo interage de maneira natildeo arbitraacuteria com um conceito ou ideacuteia jaacute

existente na estrutura cognitiva do aluno Esta ideacuteia conceito ou proposiccedilatildeo

ldquosubsunccedilorrdquo [Moreira 1983] ou ldquoideacuteia acircncorardquo deve ser capaz de servir de

ancoradouro a uma nova informaccedilatildeo de modo que ela adquira significado para o

aluno Portanto a aprendizagem significativa caracteriza-se por uma interaccedilatildeo e

natildeo uma simples associaccedilatildeo do novo conhecimento que estaacute sendo exposto para

ser aprendido com ideacuteias ou conceitos relevantes que estejam disponiacuteveis na

estrutura cognitiva do aluno Estas ideacuteias ou conceitos satildeo ditos relevantes

porque devem possuir uma ligaccedilatildeo loacutegica com a nova informaccedilatildeo

Importante ressaltar que ocorrer a aprendizagem significativa se exige

tanto uma disposiccedilatildeo por parte do aluno quanto uma preparaccedilatildeo do material de

aprendizagem com este objetivo (o material eacute potencialmente significativo)

O processo cognitivo a que Ausubel se refere pode ser entendido como

uma constante reorganizaccedilatildeo dos conteuacutedos de informaccedilatildeo os conceitos e as

novas informaccedilotildees interagem com as ideacuteias preexistentes na estrutura cognitiva

e de tal forma que no final do processo de assimilaccedilatildeo jaacute natildeo eacute possiacutevel

distinguir o conceito inicial do que foi incorporado Natildeo eacute difiacutecil se perceber que

as informaccedilotildees mais facilmente lembradas satildeo aquelas que estatildeo ligadas a

alguma coisa que seja relevante por exemplo a maneira que criamos nossa

22


senha bancaacuteria estaacute invariavelmente relacionada com alguma coisa que jaacute faz

parte do nosso conhecimento e que acreditamos facilitaraacute a recordaccedilatildeo A ideacuteia a

que estamos ligando a nova informaccedilatildeo a senha da conta bancaacuteria eacute o que

Ausubel define como ideacuteia acircncora A metodologia proposta por Ausubel de

preparaccedilatildeo de material de aprendizagem visando agrave aprendizagem significativa

estaacute baseada neste processo de ancoragem

A aprendizagem significativa defendida por Ausubel difere da

aprendizagem automaacutetica ou mecacircnica pois nesta praticamente natildeo haacute interaccedilatildeo

entre a nova informaccedilatildeo e os conceitos existentes na estrutura cognitiva do aluno

A aprendizagem mecacircnica pode ser exemplificada como aquela em que a

memorizaccedilatildeo eacute o fator predominante e a transferecircncia de aprendizagem natildeo se daacute

com facilidade

A seguir roteirizamos a elaboraccedilatildeo de um material de aprendizagem

potencialmente significativo segundo a perspectiva pedagoacutegica de

AusubelMoreira

312 Roteiro para a elaboraccedilatildeo do material de aprendizagem


AusubelMoreira

O objetivo deste roteiro eacute maximizar a aprendizagem significativa atraveacutes

de um correto planejamento do material didaacutetico Segundo Ausubel um dos

caminhos promissores para facultar condiccedilotildees mais satisfatoacuterias ao aprendizado

eacute aperfeiccediloar e dinamizar estes materiais Em e-learning principalmente o

material didaacutetico deve ser planejado com rigorosa e especial atenccedilatildeo pois como

jaacute nos referimos anteriormente o aluno estaraacute a maior parte do tempo

trabalhando sozinho Cada passo do roteiro descrito abaixo consiste em uma

reflexatildeo uma proposta de accedilatildeo e um exemplo

23


a Primeira reflexatildeo organizaccedilatildeo do conteuacutedo

A primeira tarefa eacute mapear a estrutura conceitual e proposicional do

conteuacutedo de aprendizagem [Moreira 1983] O professor deve identificar os

conceitos organizadores baacutesicos do conteuacutedo que pretende publicar e organizaacute-

los hierarquicamente dos mais inclusivos para os mais especiacuteficos Observe o

esquema na Figura 32 e o resumo da primeira reflexatildeo na Tabela 31

Figura 32 Hierarquizaccedilatildeo dos conceitos do conteuacutedo de aprendizagem


Reflexatildeo Accedilatildeo

Identificar os conceitos e princiacutepios

com maior poder explanatoacuterio e

hierarquizaacute-los dos mais inclusivos

para os mais especiacuteficos

Construccedilatildeo de um Mapa Conceitual

ou Lista Hierarquizada de Conceitos

Segundo Ausubel [Ausubel apud Moreira 1983] o planejamento de

ensino deve procurar introduzir os conceitos ou proposiccedilotildees principais no iniacutecio

do curso para servir de base cognitiva para a aprendizagem seguinte Ausubel

defende que eacute preciso identificar os conceitos mais abrangentes e organizaacute-los

hierarquicamente de modo que se inicie pelos mais gerais e inclusivos ateacute chegar

aos mais especiacuteficos O professor deve portanto identificar ou mapear os

conceitos e proposiccedilotildees mais relevantes da mateacuteria de aprendizagem distinguir

os mais gerais os mais abrangentes dos menos especiacuteficos e organizaacute-los

hierarquicamente

24


Embora natildeo sendo propostos explicitamente por Ausubel os Mapas

Conceituais seriam uma accedilatildeo altamente recomendaacutevel para esta primeira

reflexatildeo Mapas Conceituais satildeo diagramas que organizam hierarquicamente os

conceitos de um corpo de conhecimentos e indicam as relaccedilotildees que existem entre

eles [Moreira1983] Eles expressam uma interpretaccedilatildeo da organizaccedilatildeo

hieraacuterquica de um corpo de conhecimento portanto natildeo existe rdquoo Mapa

Conceitualrdquo e sim ldquoMapas Conceituaisrdquo Estes diagramas podem ter mais de

uma dimensatildeo e podem ser traccedilados para todo um conteuacutedo ou para um toacutepico

especiacutefico Observe na Figura 33 um exemplo da hierarquizaccedilatildeo de conceitos

expressa em um Mapa Conceitual

Figura 33 Exemplo de Mapa Conceitual de Forccedila [Moreira 1983 p78]

b Segunda Reflexatildeo ldquosubsunccediloresrdquo [Moreira 1983]

Em seguida o professor deve pensar no que o aluno deve conhecer

previamente para aprender os conceitos e proposiccedilotildees que foram identificados no

conteuacutedo de aprendizagem Segundo Ausubel [Ausubel apud Moreira 1983]

efetua-se a aprendizagem significativa quando o novo conhecimento interage

com a estrutura cognitiva do aluno ou seja com o que ele jaacute sabe Aqui natildeo

25


estamos falando apenas de simples preacute-requisitos acadecircmicos estamos pensando

em acircncoras cognitivas pois natildeo basta pensar neste conhecimento preacutevio que o

aluno deve possuir somente em termos de preacute-requisitos eacute importante identificaacute-

lo em termos de ideacuteias e conceitos relevantes as chamadas ldquoideacuteias acircncorardquo ou

ldquosubsunccediloresrdquo como chama Moreira Observe e esquema na Figura 34 e o

resumo da segunda reflexatildeo na Tabela 32

Figura 34 O que aluno precisa saber para aprender os novos conceitos

propostos no material de aprendizagem



Identificar quais os conceitos relevantes

que o aluno deveraacute ter disponiacuteveis para

que se decirc a aprendizagem significativa

Incluir os conceitos relevantes no

mapa conceitual ou em lista

hierarquizada

ldquoA aprendizagem significativa ocorre quando a tarefa de aprendizagem

implica em relacionar de forma natildeo arbitraacuteria e substantiva (natildeo literal) uma

nova informaccedilatildeo a outras com as quais o aluno jaacute esteja familiarizado

(subsunccedilores) e quando o aluno adota uma estrateacutegia correspondente para

assim procederrdquo [Moreira 1983 p 25]

Exemplificando Segundo Moreira [1983] em Fiacutesica se os conceitos de

forccedila e campo jaacute existem na estrutura cognitiva do aluno eles serviratildeo de

ldquosubsunccediloresrdquo para novas informaccedilotildees referentes a certos tipos de forccedila como

26


forccedila e campo eletromagneacuteticos O mapeamento do conteuacutedo que estamos

propondo nesta reflexatildeo objetiva a identificaccedilatildeo dos conceitos ou proposiccedilotildees

que o aluno deve saber para aprender significativamente

c Terceira reflexatildeo o que o aluno jaacute sabe

Aqui o professor deve a partir de uma anaacutelise preacutevia do seu grupo de

alunos descobrir dentre suas experiecircncias e conhecimentos o que pode vir a ser

uacutetil para esse aprendizado e realizar uma avaliaccedilatildeo diagnoacutestica dos

conhecimentos preacutevios do aluno atraveacutes de preacute-testes entrevistas elaboraccedilatildeo de

mapas conceituais pelo aluno e pesquisando sobre as ldquoconcepccedilotildees alternativasrdquo

que podem existir na literatura a respeito do corpo de conhecimento que ele

pretende expor Observe o esquema na Figura 35 e o resumo da segunda

reflexatildeo na Tabela 33

Figura 35 O que o aluno jaacute sabe



Verificar se o aluno possui os

conceitos ou ideacuteias acircncoras necessaacuterias

para o corpo de conhecimentos que vai

ser proposto

Avaliaccedilatildeo diagnoacutestica dos conhecimentos

preacutevios do aluno (ou seja o que ele jaacute

sabe) atraveacutes de instrumentos adequados

27


ldquoSe tivesse que reduzir toda a psicologia educacional em um soacute

princiacutepio diria o seguinte o fator isolado mais importante influenciando a

aprendizagem eacute o que o aluno jaacute sabe Determine isso e ensine-o de acordordquo

[Ausubel apud Moreira1980 p18]

ldquoO que o aluno jaacute saberdquo eacute aqui uma referecircncia agrave estrutura cognitiva do

aluno que deve ser entendida como a totalidade do corpo de conhecimento do

aluno e a proacutepria organizaccedilatildeo interna desse conhecimento

Isso significa que o planejamento da aprendizagem requer tambeacutem um

mapeamento dos conceitos e das habilidades que o aluno jaacute possui e que satildeo

relevantes para assimilar os novos conceitos que seratildeo propostos no material de

aprendizagem Segundo Ausubel [Ausubel apud Moreira 1983] o ritmo do

aprendizado eacute bastante influenciado a partir desta anaacutelise preacutevia que natildeo deve

ser entendida como um simples preacute-requisito e sim de modo mais amplo

visando refletir de maneira mais proacutexima possiacutevel a estrutura cognitiva do aluno

O mais importante aqui eacute constatar se ele dispotildee das ldquoideacuteias acircncorasrdquo em sua

estrutura cognitiva ou seja dos conhecimentos necessaacuterios para a aprendizagem

do corpo de conhecimento que lhe seraacute proposto e que foram identificadas na

reflexatildeo anterior Eacute desta forma que eacute obtida a ligaccedilatildeo entre o conteuacutedo a ser

aprendido e a sua estrutura cognitiva

O potencial significativo do material a ser aprendido varia natildeo somente

em relaccedilatildeo agrave experiecircncia educacional do aluno mas tambeacutem a fatores tais como

idade ocupaccedilatildeo aptidatildeo intelectual e condiccedilotildees socioculturais Traccedilar um perfil

do aluno eacute tambeacutem importante para a escolha da linguagem a ser usada nos

textos das imagens e das miacutedias pois um dos aspectos mais criticados eacute a

utilizaccedilatildeo de material didaacutetico sem a devida adaptaccedilatildeo ao grupo social a que se

destina

A avaliaccedilatildeo diagnoacutestica dos conhecimentos preacutevios do aluno pode ser

feita atraveacutes de diversas maneiras

28


(1) O professor pode utilizar por exemplo informaccedilotildees colhidas na

literatura especializada sobre as chamadas ldquoconcepccedilotildees alternativas que os

alunos apresentam diante dos conceitos ldquooficiaisrdquo que lhes satildeo ensinados sobre

um determinado conteuacutedo da mateacuteria

(2) Coletar essas informaccedilotildees por meio de um teste diagnoacutestico jaacute

existente e validado ou por meio de um teste que ele mesmo constroacutei

(3) Solicitar aos alunos que faccedilam um Mapa Conceitual

d Quarta Reflexatildeo organizaccedilatildeo do material de aprendizagem

() ldquoCom base nessa estrutura (primeira reflexatildeo do roteiro) passa-se agrave

organizaccedilatildeo sequumlencial do conteuacutedo levando-se em conta as relaccedilotildees naturais

de dependecircncia entre os vaacuterios toacutepicos ou unidades de estudo que compotildeem o

conteuacutedo em questatildeordquo [Moreira 1983 p123]

Elaboradas as etapas de identificaccedilatildeo dos organizadores baacutesicos do

conteuacutedo a determinados os conceitos relevantes que o aluno deve possuir e o

que ele jaacute sabe o professor pode passar agrave organizaccedilatildeo do conteuacutedo Ausubel

[Ausubel apud Moreira 1983] toma por hipoacutetese princiacutepios relativos agrave

programaccedilatildeo do conteuacutedo que podem ser aplicaacuteveis segundo ele em qualquer

aacuterea de conhecimento a saber diferenciaccedilatildeo progressiva reconciliaccedilatildeo

integrativa organizaccedilatildeo sequumlencial e consolidaccedilatildeo

A diferenciaccedilatildeo progressiva eacute um princiacutepio de organizaccedilatildeo e

hierarquizaccedilatildeo do conteuacutedo onde os conceitos mais gerais e inclusivos devem

preceder os mais especiacuteficos como foi que sugerido na primeira reflexatildeo deste

roteiro Ausubel [Ausubel apud Moreira 1983] tambeacutem sugere que o conteuacutedo

natildeo deve ser unicamente exposto obedecendo a este criteacuterio Eacute preciso tambeacutem

que os conceitos e as ideacuteias sejam relacionados entre si Isto eacute por ele

denominado de reconciliaccedilatildeo integrativa ou seja deve-se comeccedilar do mais ldquo

geralrdquo para o mais particular e depois voltar mostrando as relaccedilotildees destes

conceitos mais especiacuteficos com os de mais alta hierarquia (descendo e subindo)

29


Tambeacutem eacute preciso ressaltar que o ldquogeralrdquo natildeo significa o ldquomais geralrdquo e

que a hierarquia proposta natildeo eacute ldquoardquo hierarquia mas uma hierarquia que faccedila

sentido e esteja coerente com a capacidade do aluno e com os objetivos de

aprendizagem

A organizaccedilatildeo sequumlencial consiste em organizar os conteuacutedos e as suas

partes de forma a obedecer aos princiacutepios da diferenciaccedilatildeo progressiva e agrave

reconciliaccedilatildeo integrativa Ausubel [Ausubel apud Moreira 1983] tambeacutem

aponta para a necessidade de consolidaccedilatildeo do que foi apresentado ao aluno antes

que novos conteuacutedos sejam oferecidos A necessidade de consolidaccedilatildeo do

conteuacutedo estaacute em harmonia com o pressuposto ldquoausubelianordquo de que o que mais

influencia a aprendizagem eacute o que o aluno jaacute sabe

Quando os conceitos relevantes para que se decirc a aprendizagem

significativa natildeo estatildeo presentes na estrutura cognitiva do aluno Ausubel

[Ausubel apud Moreira 1983] aconselha o uso de Organizadores Preacutevios Eles

satildeo sua a principal estrateacutegia para manipular a estrutura cognitiva dos alunos e

facilitar-lhes a aprendizagem significativa Moreira [1983] cita um estudo

realizado por [Ausubel 1960] ldquono qual o material de aprendizagem tratava das

propriedades metaluacutergicas do accedilo carbocircnico e foi usado como organizador

preacutevio expositivo um texto introdutoacuterio que enfatizava as principais diferenccedilas e

similaridades entre metais e ligas metaacutelicas as suas respectivas vantagens e

limitaccedilotildees e as razotildees de fabricaccedilatildeo e uso de ligas metaacutelicasrdquo [Ausubel apud

Moreira 1983 p 91] Define-se portanto

ldquoOrganizadores Preacutevios satildeo materiais introdutoacuterios apresentados antes

do proacuteprio material a ser aprendido poreacutem em um niacutevel mais alto de abstraccedilatildeo

generalidade e inclusividade do que esse material Natildeo satildeo sumaacuterios

introduccedilotildees ourdquo visotildees gerais do assunto [Moreira 1983 p 30]

30


Figura 36 ndash Organizadores Preacutevios



Organizar o conteuacutedo segundo os

princiacutepios da diferenciaccedilatildeo progressiva a

reconciliaccedilatildeo integrativa a organizaccedilatildeo

sequumlencial e a consolidaccedilatildeo

Fornecer ao aluno os conceitos que ele natildeo

conhece ou trazer agrave tona os conceitos

relevantes utilizando Organizadores

Preacutevios

Seleccedilatildeo eou criaccedilatildeo de

Organizadores Preacutevios

Uma vez determinados os conceitos que o aluno deveria saber e que natildeo

sabe o professor pode lanccedilar matildeo dos Organizadores Preacutevios Estes

organizadores satildeo introduzidos antes do material de aprendizagem propriamente

dito e satildeo usados para facilitar o estabelecimento de uma disposiccedilatildeo significativa

31


para a aprendizagem Os organizadores natildeo devem ser confundidos com

esquemas introdutoacuterios comuns Segundo Ausubel [Ausubel apud Moreira

1983] os Organizadores Preacutevios devem ser elaborados em termos de linguagem

e de conceitos jaacute familiares ao aluno usando sempre que possiacutevel ilustraccedilotildees e

analogias apropriadas Natildeo devem conter informaccedilotildees sobre o proacuteprio material

de aprendizagem e podem ser segundo Moreira [1983] textos escritos

discussotildees simulaccedilotildees ou demonstraccedilotildees (experimentos de laboratoacuterio) filmes

etc Observamos que conteuacutedos apresentados anteriormente e devidamente

consolidados na estrutura cognitiva nos alunos funcionam como organizadores

preacutevios para novos conteuacutedos Observe e esquema na Figura 36 e o resumo da

segunda reflexatildeo na Tabela 34

Finalmente tambeacutem eacute importante dentro do modelo proposto uma

avaliaccedilatildeo isso por uma questatildeo de coerecircncia com a consolidaccedilatildeo do

conhecimento e para que na sequumlecircncia da aprendizagem sejam cada vez mais

oferecidos conceitos que ancorem novos conceitos

314 Refletindo sobre Conceitos

A organizaccedilatildeo do conteuacutedo em conceitos e sua hierarquizaccedilatildeo dos mais

gerais e inclusivos para os mais especiacuteficos natildeo eacute trivial A proacutepria definiccedilatildeo do

que eacute um conceito natildeo eacute tatildeo simples Segundo Novak1 [2001] ldquowe define

concept as a perceived regularity in events or objets or records of events or

objets designated by a label the label for most concepts is a word Tagard

[1998] diz que conceitos satildeo importantes tipos de representaccedilotildees mentais e que

em parte correspondem agraves palavras que usamos para falar e escrever Jaacute Ausubel

[Ausubel apud Moreira1980 p33] define conceitos como ldquoobjetos eventos

situaccedilotildees ou propriedades que possuem atributos criteriais comuns e satildeo

designados em uma dada cultura por algum signo ou siacutembolo aceitordquo

1 Mais informaccedilotildees em httpwwwcoginstuwfeduusersacanas Acessado em 2001

32


Apenas para ilustrar esse ponto Platatildeo acreditava que os conceitos satildeo

inatos e que a aprendizagem apenas nos lembra do que jaacute sabiacuteamos ldquoO que eacute

justiccedilardquo ou ldquoO que eacute o conhecimentordquo e demonstrava que conceitos como

justiccedila e conhecimento satildeo difiacuteceis de serem definidos Ou entatildeo podemos partir

de um outro extremo como por exemplo das visotildees de Locke e Hume que

argumentavam que os conceitos satildeo aprendidos atraveacutes da experiecircncia sensorial

visotildees estas que foram posteriormente desenvolvidas por outros pesquisadores

como Piaget para citar apenas um dos mais importantes do nosso tempo

Segundo Tagard [1998] termos como frame schema e script satildeo usados

para descrever visotildees da natureza dos conceitos Um script descreve uma

ocorrecircncia tiacutepica como ir a um restaurante um schema de representaccedilatildeo define

natildeo a essecircncia do conceito como o de catildeo mas o que eacute tiacutepico nos catildees um frame

designa algo que pode ser representado como um conjunto de lacunas a serem

preenchidas como no conceito de curso possui um professor os alunos se

graduam no final possui uma avaliaccedilatildeo um horaacuterio lugar etcTagard conclui

que conceitos natildeo satildeo definiccedilotildees exatas mas podem ser vistos como

caracteriacutesticas ou situaccedilotildees tiacutepicas

32 Camada graacutefica

Conceitos de Usabilidade e Webdesign

Laurel [1990] diz que o designer de sistemas interativos seraacute um

superdesigner com as habilidades de um engenheiro de um artista e de um

psicoacutelogo Um engenheiro porque deve entender e traduzir os procedimentos do

sistema um psicoacutelogo porque ele precisa conhecer as necessidades e os modos

de agir dos usuaacuterios e um artista porque precisa ser criativo nas soluccedilotildees

33


O design eacute em princiacutepio uma atividade artiacutestica os conceitos considerados

vaacutelidos satildeo subjetivos e partem da experiecircncia de profissionais consagrados

Modernamente podemos dizer que design eacute a ldquoatividade responsaacutevel pela

elaboraccedilatildeo de objetos de uso e sistemas de informaccedilatildeo O designer determina

materiais tecnologias de fabricaccedilatildeo formas cores volumes texturas imagens

tipografia e incorpora recomendaccedilotildees ergonocircmicasrdquo2

Oren [1990] oferece uma sugestatildeo interessante de ser seguida

principalmente para quem vai projetar para a web eacute importante ter vivecircncia de

navegaccedilatildeo em sites com bom design Ele aconselha

ldquoOs projetistas de interfaces graacuteficas de sistemas interativos podem obter

ideacuteias (inspiraccedilatildeo) prestando atenccedilatildeo agraves soluccedilotildees encontradas por artistas de

vanguarda em seus trabalhos Estas observaccedilotildees podem ser um guia para a

construccedilatildeo das proacuteximas geraccedilotildees de interfaces Eacute bem melhor desenvolver

novas formas do que replicar as antigasrdquo [Oren apud Laurel 1990 p479]

Hurlburt [1986] reitera a validade da sugestatildeo de Oren [1990] quando

observa as contribuiccedilotildees de artistas plaacutesticos no design graacutefico como eacute o caso da

pintura de Mondrian (Figura 36) que segundo ele contribuiu de maneira

significativa para o desenho graacutefico na pureza e na simplicidade com que tratou a

superfiacutecie bidimensional de suas pinturas Encontramos um exemplo de paacutegina

web que retrata esta influecircncia note a semelhanccedila entre o Quadro 72 de

Mondrian (Figura 37) e o design utilizado no site da empresa Sun System3

(Figura 38) tanto no uso das cores como nas formas geomeacutetricas

A interface graacutefica eacute dotada de mais um atributo quando eacute uma interface

para a web os conceitos pertinentes agraves interfaces graacuteficas podem ser acrescidos

de mais um o hipertexto A linguagem da web eacute o hipertexto [Silva 1999] ou

2 Folheto publicitaacuterio distribuiacutedo pela Pontifiacutecia Universidade Catoacutelica do Rio de Janeiro 20033 httpwwwsuncom Acessado em 2003

34


seja a natildeo linearidade da informaccedilatildeo a informaccedilatildeo dentro da informaccedilatildeo a

interatividade

Figura 37 Quadro 72 de Mondrian

Figura 38 Paacutegina do site da Sun

Nesta seccedilatildeo descrevemos os conceitos de usabilidade e webdesign

selecionados na literatura para a criaccedilatildeo da camada graacutefica do Projeto de

35


Aprendizagem Foram pesquisados na literatura conhecida conceitos de

usabilidade webdesign elaboraccedilatildeo de conteuacutedos para a Internet bem como

algumas consideraccedilotildees para a publicaccedilatildeo de conteuacutedos didaacuteticos em materiais

impressos que consideramos vaacutelidos pois a metaacutefora usada aqui eacute a da paacutegina

impressa e tambeacutem

321 Organizaccedilatildeo da informaccedilatildeo proximidade e afastamento

Organizar a informaccedilatildeo eacute o objetivo do desenho graacutefico Podemos organizar a

informaccedilatildeo criando uma relaccedilatildeo entre os elementos atraveacutes da proximidade Itens

ou conjuntos de informaccedilotildees que possuem alguma relaccedilatildeo devem ser

aproximados e de maneira inversa itens ou conjuntos de informaccedilotildees que natildeo

estatildeo relacionados natildeo devem estar proacuteximos [Williams 1995] Observe como o

site da Figura 38 agrupou as informaccedilotildees em caixas aproximando as que

possuem relaccedilatildeo entre si oferecendo ao usuaacuterio uma referecircncia visual da paacutegina

Figura 39 Homepage do site da MTV 4

4 httpwwwmtvcombr Acessado em 2003

36


322 Organizaccedilatildeo da informaccedilatildeo contraste

Uma maneira de dar destaque agrave informaccedilatildeo e oferecer um atrativo visual agrave

paacutegina eacute criar situaccedilotildees de contraste Para que o contraste seja realmente eficaz

ele deve ser forte [Williams 1995]

Podemos alcanccedilar o contraste de vaacuterias maneiras Uma letra grande pode

ser contrastada com uma fonte pequena uma fonte em estilo antigo com uma em

negrito um fio fino com um grosso uma cor fria com uma quente uma textura

aacutespera com uma lisa um elemento horizontal (uma longa linha de texto) com um

elemento vertical (uma coluna estreita de texto) Um exemplo de contraste eacute o

uso de fonte maior e em negrito para os tiacutetulos e subtiacutetulos

Observe na Figura 310 o contraste causado pelo tamanho da fonte dos

tiacutetulos em relaccedilatildeo agrave fonte do texto Podemos destacar tambeacutem como satildeo

agrupados os assuntos seguindo o princiacutepio da proximidade da seccedilatildeo anterior

Figura 3 10 Homepage do site da Microsoft 5

5 httpwwwmicrosoftcom Acessado em 2003

37


323 Organizaccedilatildeo da informaccedilatildeo equiliacutebrio simeacutetrico e assimeacutetrico

Da mesma forma que a proximidade o alinhamento eacute uma forma de

organizaccedilatildeo Um bom desenho faz com que cada elemento da paacutegina tenha

alguma ligaccedilatildeo visual com outro elemento Ao alinhar os elementos em uma

paacutegina eacute criada uma linha invisiacutevel que os une

O alinhamento objetiva tambeacutem equilibrar os elementos da paacutegina O

centralizado eacute a forma mais intuitiva e mais segura de alinhar os elementos Ele

parte do equiliacutebrio simeacutetrico da paacutegina e segundo Hurlburt [1986] eacute faacutecil de

entender e simples de se produzir criando uma aparecircncia formal poreacutem comum

e sem criatividade Observando revistas livros de arte e websites com

diagramaccedilatildeo de qualidade podemos notar que layouts sofisticados natildeo utilizam

textos centralizados Alinhamentos imprevisiacuteveis e assimeacutetricos satildeo utilizados

para dinamizar o design e provocar interesse no leitor

Na paacutegina mostrada na Figura 311 observe o movimento causado pelo

alinhamento da navegaccedilatildeo agrave direita como as fotos estatildeo alinhadas pelas bordas

em nenhum momento foi utilizado texto centralizado

Figura 311Homepage do site da loja Sandpiper 6

6 httpwwwsandipipercombr Acessado em 2003

38


324 Simplicidade a meta do design de paacutegina

ldquoA simplicidade deve ser a meta do design da paacuteginardquo [Nielsen 2000 p

97] Primeiro porque a velocidade de acesso deve ser de longe o principal

criteacuterio do design Segundo Nielsen [2000] as demoras de tempo de resposta satildeo

o principal determinante da usabilidade da web Por isso reduzir ao maacuteximo a

complexidade do design eacute uma meta a ser alcanccedilada para acelerar download de

paacutegina

Nielsen [2000] aponta para uma meta miacutenima de dez segundos para os

tempos de resposta para se obter uma paacutegina pois segundo ele esse eacute o limite

da capacidade humana de prestar atenccedilatildeo enquanto espera Para que seja possiacutevel

manter as paacuteginas pequenas e aqui tamanho se refere agrave quantidade de kilobytes

o nuacutemero de elementos graacuteficos deve ser reduzido e os efeitos de multimiacutedia

devem ser usados apenas quando realmente ajudam o usuaacuterio a compreender a

informaccedilatildeo a recomendaccedilatildeo eacute manter o tamanho das paacuteginas em torno de 34

kilobytes Mesmo em se tratando de ambientes educacionais aconselhamos natildeo

contar com uma toleracircncia de espera maior pois a demora eacute sempre um fator

desmotivante

Poreacutem a simplicidade no desenho natildeo eacute apenas questatildeo tempo de

download ela tambeacutem proporciona uma sensaccedilatildeo de clareza da informaccedilatildeo Por

isso Black [1997] recomenda a reduccedilatildeo da variedade de elementos graacuteficos e do

nuacutemero de fontes utilizadas Segundo ele deve ser usado uma ou duas famiacutelias

de fontes apenas

Um exemplo de design simples e de download raacutepido eacute o buscador

Google Figura 312 Ele tambeacutem eacute um exemplo de alinhamento centralizado

bem- sucedido a extrema funcionalidade dispensa um layout mais sofisticado

39


Figura 312 Homepage do buscador Google 7

325 Mas nem tatildeo simples assim bom desenho significa credibilidade

ldquoUma das principais metas do webdesign excelente eacute estabelecer

credibilidaderdquo [Nielsen 2000 p 92]

ldquoProdutores comerciais descobriram que as primeiras impressotildees dos

usuaacuterios a respeito da miacutedia satildeo muito importantes para levaacute-los a adotaacute-la

(compraacute-la) Os designers de materiais impressos para leitores tiacutepicos deveriam

ser espertos o suficiente para desenhar seus produtos visando criar uma

primeira impressatildeo favoraacutevel Um bom design ajuda a obter e a manter a tenccedilatildeo

do leitor estabelecendo credibilidade em relaccedilatildeo ao sucesso no uso do

materialrdquo [Keller and Burkman 1999 p 31]

Nielsen [2000] admite que o design graacutefico elegante provavelmente tem

relativamente pouco impacto na usabilidade poreacutem a aparecircncia visual eacute

literalmente a primeira coisa que o usuaacuterio vecirc e visuais atraentes satildeo uma grande

oportunidade de estabelecer credibilidade Ele aconselha que natildeo se use nas

40


paacuteginas o que ele chama de ldquolixo amadoriacutesticordquo como fundos ldquogifsrdquo animados e

palavras piscando

Conteuacutedos educacionais podem aproveitar-se da qualidade graacutefica para

atrair a atenccedilatildeo e motivar os alunos A credibilidade dos materiais em e-learning

eacute um aspecto dos mais relevantes uma vez que o aluno estaacute sem a presenccedila fiacutesica

do professor

Observe na Figura 313 como fundo branco confere sobriedade e

elegacircncia a este site a simplicidade do design usada com bom gosto e

criatividade confere credibilidade Tambeacutem podemos notar a semelhanccedila na

cores e na diagramaccedilatildeo geomeacutetrica com o quadro 72 de Mondrian da Figura 36

Figura 313 Homepage do site do Van Gogh Museum 8

326 Eficiecircncia a web eacute cultura da impaciecircncia

Aplicaccedilotildees eficientes executam o maacuteximo de trabalho com um miacutenimo de

informaccedilatildeo dos usuaacuterios [Torgnazzini 2003] A quantidade de etapas que o

7 httpwwwgooglecombr Acessado em 20038 httpwwwvangoghmuseumnl Acessado em 2002

41


usuaacuterio deve executar para acessar o que deseja deve ser reduzida ao miacutenimo O

desenho da interface deve proporcionar ao usuaacuterio o maacuteximo de eficiecircncia e

conforto com o miacutenimo de aprendizado e de fadiga utilizando a experiecircncia

anterior do usuaacuterio O buscador Google Figura 312 eacute um bom exemplo de

paacutegina de interface simples e de download raacutepido onde os usuaacuterios rapidamente

podem conseguir a informaccedilatildeo que desejam

327 Consistecircncia o ambiente visualmente orientado

Os elementos da interface devem ser consistentes em todas as telas do site

[Torgnazzini 2003] A repeticcedilatildeo de elementos graacuteficos oferece consistecircncia agrave

paacutegina Algum aspecto do desenho repetindo-se no material inteiro oferece um

sentido de unidade o elemento repetido pode ser uma fonte em negrito um fio

grosso um elemento de desenho algum formato especiacutefico relaccedilotildees espaciais

barra superior quando possuir uma etc Um exemplo de repeticcedilatildeo eacute a criaccedilatildeo de

tiacutetulos com o mesmo tamanho de fonte e o mesmo peso O recurso da repeticcedilatildeo eacute

muito uacutetil em peccedilas de uma soacute paacutegina e eacute essencial em documentos de muitas

paacuteginas

A consistecircncia dos elementos que nada mais eacute do que a sua padronizaccedilatildeo

no site inteiro eacute importante para a orientaccedilatildeo do usuaacuterio A utilizaccedilatildeo de coacutedigos

jaacute apreendidos anteriormente facilita a compreensatildeo da interface agiliza os

procedimentos da navegaccedilatildeo proporciona conforto visual ao usuaacuterio e libera a

atenccedilatildeo para outras tarefas Um exemplo de boa orientaccedilatildeo em e-learning eacute a

utilizaccedilatildeo de referecircncias para que o aluno saiba em que parte do curso ele se

encontra

Observe nas Figuras 314 e 315 como as paacuteginas do site da Apple

Computers oferecem orientaccedilatildeo atraveacutes da barra de navegaccedilatildeo na parte superior

da paacutegina Ela eacute consistente em todo o site (com o mesmo desenho) e indica com

uma aba de cor diferente em que paacutegina o usuaacuterio se encontra Esse tipo de

navegaccedilatildeo atraveacutes de barra com abas jaacute eacute um padratildeo para os usuaacuterios de

42


interfaces windows como as planilhas Excel o que facilita a compreensatildeo da

interface

Figura 314 Homepage do site da Apple Computers 9

Figura 315 Paacutegina interna do site da Apple Computers

9 httpwwwapplecom Acessado em 2003

43


328 Uso de Padrotildees reduccedilatildeo do custo cognitivo

ldquoNa verdade o usuaacuterio natildeo precisa aprender nada desde que o elemento

de interface comporte-se exatamente da forma que o usuaacuterio estaacute acostumadordquo

[Nielsen 2000 p188] Depois que algo passa a ser suficiente e amplamente

usado torna-se uma convenccedilatildeo A utilizaccedilatildeo de elementos de conhecimento dos

usuaacuterios reduz o tempo de aprendizagem das funccedilotildees oferecidas pela interface

Figura 316 Barra de navegaccedilatildeo do site da Amazon Books10

Um bom exemplo de convenccedilatildeo na web eacute o uso do desenho de um

carrinho de compras em sites de comeacutercio eletrocircnico como estaacute sendo mostrado

nas Figura 316 Uma vez aprendida esta metaacutefora do mundo real torna-se

desnecessaacuterio criar outra Outro exemplo do uso de convenccedilotildees estaacute na

utilizaccedilatildeo em paacuteginas web dos iacutecones que jaacute satildeo conhecidos nas interfaces

Microsoft tais como pastas para arquivos envelopes para correspondecircncia de e-

mail impressoras para indicar texto para impressatildeo etc

Nielsen [2000] relata em seus estudos de usabilidade que os usuaacuterios

queixam-se quando um site tenta usar interface de navegaccedilatildeo que seja muito

diferente das que passaram a esperar da maioria dos sites

329 Layout espaccedilos em branco

ldquoPaacuteginas com bom design fazem uso de muito espaccedilo em branco ndash como

margens espaccedilos de separaccedilatildeo entre o cabeccedilalho e o corpo do texto ()rdquo

10 httpwwwamazoncom Acessado em 2003

44


[Misanchuk 1992 p174] Especialistas em design graacutefico recomendam natildeo

ocupar com texto todo o espaccedilo da tela deixando espaccedilos em branco O objetivo

desta praacutetica eacute natildeo sobrecarregar visualmente o leitor orientar o olhar e ajudar os

usuaacuterios a entender o agrupamento de informaccedilotildees Uma maneira de obter

espaccedilos em branco em paacuteginas HTML eacute usar margens largas ou dispor o texto

em uma tabela de duas colunas de aproximadamente metade do espaccedilo

disponiacutevel na tela deixando que uma fique em branco

As Figuras 317 e 318 mostram paacuteginas do site da Richards uma loja de

roupas masculinas que usa margens largas para permitir espaccedilos em branco

Tambeacutem podemos observar a repeticcedilatildeo da palavra Richards e do fio que a

sublinha em todas as paacuteginas criando unidade o layout consistente

Figura 317 Homepage do site da loja Richards11

11 httpwwwrichardscombr Acessado em 2002

45


Figura 318 Paacutegina interna do site da loja Richards

3210 Layout largura da paacutegina

Nielsen [2000] recomenda paacuteginas com 600 pixels de largura isso para

que os usuaacuterios com monitores de 14 polegadas natildeo precisem rolar a tela

horizontalmente Segundo ele a maioria das paacuteginas da web funciona bem em

um monitor de 17 polegadas com uma resoluccedilatildeo de pelo menos 1024 x 768

pixels observa-se poreacutem que muitos usuaacuterios utilizam monitores de 14

polegadas com resoluccedilatildeo de 800 x 600 pixels A melhor opccedilatildeo neste caso eacute criar

layouts de paacutegina que funcionem bem em tamanhos de janela diferenciados

Uma opccedilatildeo que vem sendo utilizada eacute a criaccedilatildeo de dois tipos de layout um para

cada tipo de resoluccedilatildeo ndash 800 x 600 pixels e 1024 x 768 pixels ndash permitindo que

o usuaacuterio escolha o de sua preferecircncia O site do Google nas Figuras 319 e 320

eacute um exemplo de adaptabilidade de layout para esses dois tipos de resoluccedilatildeo A

primeira imagem foi capturada com resoluccedilatildeo de tela de 1024 x 768 pixels e a

46


segunda com resoluccedilatildeo de 800 x 600 pixels Note que satildeo as margens das

paacuteginas que diminuem

Figura 319 Visualizaccedilatildeo do buscador Google em 800 x 600 pixels


47


3211 Legibilidade o conteuacutedo a ser aprendido

ldquoTudo ndash design velocidade conteuacutedo ndash falha quando os usuaacuterios natildeo

conseguem ler o textordquo [Nielsen 2000 p125] A legibilidade eacute um dos aspectos

mais importantes se natildeo eacute o mais importante Isso em qualquer miacutedia a natildeo ser

que se queira obter apenas uma imagem plaacutestica do texto Em e-learning com

muito mais razatildeo ainda se o aluno tiver dificuldade em ler o texto com certeza

ficaraacute desmotivado e isso iraacute prejudicar sua aprendizagem

As consideraccedilotildees a respeito da legibilidade de um texto vatildeo desde o

tamanho da fonte o contraste da fonte com o fundo agrave boa redaccedilatildeo agrave largura que

ele ocupa na tela e agrave quantidade que eacute disponibilizada em tela

Nielsen [2000] concluiu em seus estudos de usabilidade que a leitura em

monitores de computador eacute 25 mais lenta que em textos impressos em papel

Isso eacute causado pela sua baixa resoluccedilatildeo pois a maioria dos monitores exibe

imagens com 72 pontos por polegada enquanto que os textos impressos em uma

impressora comum possuem uma resoluccedilatildeo de aproximadamente 150 pontos por

polegad ndash soacute para que se possa ter uma comparaccedilatildeo Por isso um dos primeiros

aspectos a serem pensados no desenho de conteuacutedos para e-learning diz

respeito agrave quantidade de texto disponibilizado em tela Kilian [1999] aconselha

que textos muito grandes devem ser deixados para download

A escolha do tamanho da fonte deve levar em conta a variaccedilatildeo da

resoluccedilatildeo de tela utilizada (1024 x 768 pixels 800 x 600 pixels as mais comuns)

a existecircncia de pessoas com problemas visuais ou a preferecircncia das pessoas mais

idosas por tamanhos de fonte maiores O tipo padratildeo de dois pontos parece ser a

escolha mais acertada embora se observe uma tendecircncia na web para a utilizaccedilatildeo

de fontes menores

A legibilidade de um texto tambeacutem tem relaccedilatildeo ao comprimento de suas

linhas Kilian [1999] sustenta que linhas de texto muito longas dificultam a

leitura pois os leitores podem ter dificuldade de encontrar o iniacutecio da proacutexima

48


linha (observe Figura 321) Para obtenccedilatildeo de linhas de texto menores pode ser

utilizado o artifiacutecio descrito na subseccedilatildeo 329

Outro aspecto relevante na questatildeo da legibilidade diz respeito ao uso da

cor Black [1997] e Nielsen [2000] recomendam o uso de tipos pretos sobre

fundo branco Em primeiro lugar por uma questatildeo de contraste em segundo por

uma questatildeo de haacutebito pois estamos acostumados a ler texto com letras pretas

em fundo branco nos materiais impressos Para quebrar a monotonia do texto

preto em fundo branco os mesmos recomendam que podem ser usadas cores

claras para fundo de paacutegina como o amarelo claro azul claro lilaacutes etc

Eles tambeacutem natildeo recomendam o uso de papel de parede cujos motivos

dificultem a leitura os elementos graacuteficos de fundo interferem na capacidade do

olho de decompor a linha em caracteres e de reconhecer a forma das palavras

Fundo preto tambeacutem deve ser evitado Bem como combinaccedilotildees de cores que

causem efeitos visuais desagradaacuteveis como eacute o caso do uso de letras vermelhas

sobre fundos azuis ou verdes

Nielsen [2000] tambeacutem recomenda que o texto natildeo deve mover ou piscar

isso tambeacutem dificulta a leitura Sugere que o texto deva ser justificado agrave esquerda

de modo que exista um ponto de partida constante para o olhar leitor comeccedilar a

percorrer a linha do texto Textos alinhados a esquerda permitem uma leitura

muito mais raacutepida do que o texto centralizado ou justificado agrave direita

Nielsen [2000] e Black [1997] tambeacutem afirmam que em decorrecircncia da

baixa resoluccedilatildeo dos monitores o texto fica mais legiacutevel em tipos sem serifa12

como Arial e Verdana Eles advertem que deve ser evitada a fonte default Times

New Roman Segundo eles a serifa eacute apenas um elemento de poluiccedilatildeo visual na

tela uma vez que natildeo possui funccedilatildeo alguma Tambeacutem observam que a leitura do

texto todo em maiuacutesculas eacute 10 mais lenta pois eacute mais difiacutecil para o olho

reconhecer a forma das palavras e os caracteres na aparecircncia mais uniforme seu

uso natildeo eacute recomendado

49


Observe o exemplo deste texto todo em maiuacutesculas NAtildeO USE TEXTO

EM MAIUacuteSCULAS A LEITURA DO TEXTO TODO EM MAIUacuteSCULAS Eacute

10 MAIS LENTA POIS Eacute MAIS DIFIacuteCIL PARA O OLHO RECONHECER

A FORMA DAS PALAVRAS E OS CARACTERES NA APAREcircNCIA MAIS

UNIFORME

Tambeacutem deve ser evitado o espaccedilamento maior entre as letras que o do

default como no exemplo de texto a seguir l e t r a s m a i s e

s p a ccedil a d a s q u e d e f a u l t

Figura 321 Paacutegina do site sobre a figura de Che Guevara13 Um exemplo de

design ruim observe as linhas do texto ocupando toda a largura da tela e a cor

de fundo com tom muito forte

12 Serifas ndash satildeo os pequenos traccedilos que se projetam dos cantos das letras de certas tipologias Estes traccedilossatildeo remanescentes dos desenhos caracteriacutesticos das letras entalhadas nos documentos do ImpeacuterioRomano Por isso os tipos com serifa satildeo muitas vezes chamados de tipos Romanos[Jardin 1996]13 httpwwwinformagiovaniitchehtm Acessado em 2003

50


3212 Consideraccedilotildees sobre o uso de cor nas interfaces

A cor estaacute impregnada de informaccedilatildeo Associamos significado agraves cores

que vemos nas aacutervores no ceacuteu na aacutegua nos alimentos e assim por diante

Tambeacutem atribuiacutemos valores simboacutelicos agraves cores o vermelho que associamos agrave

raiva passou tambeacutem para a capa vermelha que se agita diante do touro

A cor constitui uma fonte de valor inestimaacutevel para os comunicadores

visuais e portanto para os designers de interface Nesta subseccedilatildeo discutiremos

alguns aspectos relevantes como harmonia contexto e simbologia das cores

Comeccedilaremos pelas caracteriacutesticas das cores

3213 Caracteriacutesticas das cores

As cores caracterizam-se pelo seu matiz que eacute o que define e distingue

uma cor tom que se refere agrave maior ou agrave menor quantidade de luz presente na

cor e intensidade que diz respeito ao brilho da cor

Vermelho verde ou azul satildeo exemplos de matizes Obtemos escalas tonais

mais claras adicionando branco e mais escuras adicionando preto Um matiz de

intensidade alta ou forte eacute dito saturado enquanto o de intensidade baixa ou fraca

caracteriza as cores apagadas as chamadas cores pasteacuteis Caracteriacutesticas mais

subjetivas [Kandinsky 1954] como calor ou frio da cor podem ser entendidas

como a tendecircncia geral de uma cor para o amarelo ou para o azul as cores

quentes satildeo os vermelhos amarelos e as demais em que eles predominem e as

frias satildeo os azuis verdes e as demais em que eles predominem

3214 Teorias de uso da cor

Segundo Pedrosa [1977] cor geratriz primaacuteria ou fundamental eacute cada

uma das trecircs cores indecomponiacuteveis que misturadas produzem todas as outras

Para os que trabalham com cor-luz como eacute o caso da televisatildeo e dos monitores

de computador as primaacuterias satildeo vermelho verde e azul-violetado Para os

51


artistas e todos que trabalham com cor-pigmento as cores indecomponiacuteveis satildeo

o vermelho o amarelo e o azul

A partir desta classificaccedilatildeo vaacuterios pintores e estudiosos de arte e cores

como Leonardo da Vinci e Delacroix criaram modelos e normas para alcanccedilar

harmonia no uso das cores tentando desta maneira sistematizar o que se costuma

chamar de intuiccedilatildeo ou inspiraccedilatildeo artiacutestica Entretanto em que pese o renome de

tais autores esses modelos se mostraram ineficientes pela sua complexidade

pois eacute muito grande o nuacutemero de variaacuteveis e porque a utilizaccedilatildeo das cores

depende de outros fatores como por exemplo aacuterea forma preenchida

proximidade eou superposiccedilatildeo de outras cores [Pedrosa 1977] A seguir

citamos alguns estudiosos que se manifestaram contra os sistemas de

combinaccedilatildeo de cores

ldquoOra a harmonia eacute realmente necessaacuteria no sentido amplo de que todas

as cores de uma composiccedilatildeo devem se ajustar num todo unificado se eacute que

devem se relacionar uma com as outrasO que eacute muito menos provaacutevel eacute que

as cores usadas pelos artistas em muitos casos estejam de acordo com

quaisquer regras bastante simples como as sugeridas pelos sistemas de

harmonia de cor Que destino miseraacutevel para um pintor que gosta de lourasrdquo

disse Picasso a Christian Zervos ldquoter que deixar de colocaacute-las num quadro

porque natildeo combinam com a cesta de frutas rdquo [Arnheim 1954 p338]

ldquoNossa conclusatildeo no momento podemos duvidar de todas essas normas

empiacutericas de cores complementares Nenhum sistema mecacircnico de cores eacute

bastante flexiacutevel para calcular de antematildeo os muacuteltiplos fatores de interaccedilatildeo de

cores dentro uma soacute receita preestabelecidaldquo [Albers 1985 p58]

ldquoUma combinaccedilatildeo de cores nunca eacute errada Qualquer combinaccedilatildeo de

cores transmite uma determinada sensaccedilatildeo mesmo que for de ldquomau gostordquo A

sensibilidade cromaacutetica do ser humano varia muito ldquo [Tausz 1976 p3]

52


Por concordarmos com essas argumentaccedilotildees natildeo estaremos discutindo

aqui teorias de uso de cor

3215 Cor e Contexto

ldquo a luz de uma dada cor afetaraacute diferentes cores de um quadro Natildeo se

pode falar como uma cor realmente eacute num sentido seguro ela eacute sempre

determinada por seu contextordquo [Pedrosa 1977 p199] Natildeo se pode pensar na

cor isoladamente Eacute preciso observar os efeitos causados pelas cores que lhe

estatildeo proacuteximas Com isso podemos escolher combinaccedilotildees que valorizem e

destaquem as cores e principalmente evitar efeitos oacuteticos desagradaacuteveis

A seguir selecionamos alguns exemplos de como a cor se comporta em

relaccedilatildeo a outras cores

A Figura 322 mostra que a mudanccedila de apenas uma cor o

contorno branco pelo preto altera todo o aspecto da padronagem

Figura 322 A alteraccedilatildeo da cor de contorno das formas em vermelho mudando

todo o aspecto da padronagem

53


Na Figura 323 notamos que o amarelo fica pouco visiacutevel quando

aplicado sobre fundo branco Sobre fundo preto ganha forccedila e vibraccedilatildeo Em

contraste com o cinza se enriquece em qualidade cromaacutetica

Figura 322 Alteraccedilatildeo na percepccedilatildeo do amarelo nos diversos fundos

Na Figura 323 podemos observar que o vermelho parece mais

brilhante sobre o fundo preto do que sobre o fundo branco e neste assume uma

aparecircncia escura e terrosa Em contraste com o laranja parece sem vida em

contraste com o verde azulado exibe brilho Note como o quadrado vermelho

parece mais largo sobre o preto do que sobre as outras cores

Figura 323 Alteraccedilatildeo na percepccedilatildeo do vermelho nos diversos fundos

Na Figura 325 temos um exemplo de um efeito desagradaacutevel com

a superposiccedilatildeo de cores o vermelho aplicado em pequenas porccedilotildees sobre fundo

verde ou azul agita-se e causa desagradaacutevel sensaccedilatildeo de crepitaccedilatildeo

Figura 325 Efeitos oacuteticos desagradaacuteveis

54


3216 Reaccedilatildeo agrave cor

A cor eacute um elemento importante de comunicaccedilatildeo visual Ela nos fornece

informaccedilotildees sobre o mundo que nos cerca Eacute pela cor que identificamos se um

fruto estaacute verde ou maduro se um documento estaacute envelhecido se uma

superfiacutecie estaacute suja A cor tambeacutem pode ser usada para conferir um aspecto

agradaacutevel aos alimentos tornando-os mais apetitosos

As cores estatildeo carregadas de uma expressividade que se baseia em

associaccedilotildees Diz-se que o vermelho eacute excitante porque faz lembrar fogo e

sangue o verde eacute tranquumlilizante porque estaacute presente na natureza nas grandes

extensotildees de matas e que o azul lembra o frescor da aacutegua Segundo Pedrosa

[1977] a simbologia da cor nasceu destas analogias representativas para soacute

depois por desdobramentos comparativos atingir o niacutevel de relativa

independecircncia que temos hoje Ainda que a simbologia das cores tenha se

afastado das associaccedilotildees que lhe deram origem observa-se que muito do seu uso

possui esta aproximaccedilatildeo como eacute o caso do vermelho que eacute usado para sinalizar

perigo nos sinais de tracircnsito

As pessoas poreacutem podem usar as cores por inuacutemeras outras razotildees como

gosto pessoal questotildees culturais religiosas etc Solomon [1990] nos oferece uma

reflexatildeo interessante

ldquoA maioria das pessoas acredita que o vermelho desperta reaccedilotildees

fortes noacutes acreditamos que o vermelho eacute uma das cores mais frequumlentemente

usada por razotildees pessoais Ele pode ser usado por uma variedade de razotildees

nenhuma delas diretamente relacionada com perigo Parece-nos um engano

atribuir um significado uacutenico a uma cor especiacuteficardquo [Wagner and Solomon

apud Solomon 1990 p273]

Segundo alguns pesquisadores a expressividade das cores tambeacutem

desperta reaccedilotildees fiacutesicas e psiacutequicas

55


ldquoObservaccedilotildees feitas por Kurt Goldstein demonstraram em sua praacutetica

neuroloacutegica por exemplo que uma paciente portadora de um distuacuterbio do

cerebelo sofria perda do sentido de equiliacutebrio tornando-se atordoada e em

perigo de cair quando usava vestido vermelho ndash sintomas que desapareciam

quando usava verderdquo [Goldstein apud Arnheim 1954 p 358]

ldquoFegravere descobriu que a forccedila muscular e a circulaccedilatildeo sanguumliacutenea

aumentam com a luz colorida na sequumlecircncia que vai do azul (menos) passando

pelo verde amarelo alaranjado ateacute o vermelhordquo [Fegravere apud Arnheim 1954

p358]

O conhecimento das reaccedilotildees e das sensaccedilotildees provocadas pelas cores eacute um

importante instrumento de comunicaccedilatildeo que tem sido usado pelas miacutedias e deve

ser colocado agrave disposiccedilatildeo dos educadores para enriquecer a interface didaacutetica

Este conhecimento eacute de grande valia para a adequaccedilatildeo das interfaces ao contexto

social e a faixa etaacuteria dos alunos Exemplificando o rosa eacute uma cor juvenil

[Pedrosa 1977] assim como o violeta jaacute o vermelho [Kandinsky 1954] evoca

forccedila energia alegria e triunfo

Para refletirmos um pouco mais sobre as sensaccedilotildees provocadas pelas

cores selecionamos Wassily Kandinsk [1954] e Israel Pedrosa [1977] ambos

professores pintores e estudiosos do uso das cores o primeiro na Bauhaus na

Alemanha (19221933) e o segundo aqui no Brasil na Universidade Federal

Fluminense (19691972) Compilamos algumas de suas visotildees a este respeito que

se encontram no Anexo 1

3217 Variaccedilotildees tonais das cores

A luz ambiente afeta a aparecircncia das cores assim como a variaccedilatildeo na

calibragem dos monitores Isso natildeo garante que uma combinaccedilatildeo particular seraacute

vista da mesma maneira em outros monitores principalmente quando satildeo usados

56


tons muito proacuteximos de um mesmo matiz Eacute recomendaacutevel uma fase de

observaccedilatildeo das paacuteginas em outros monitores para minimizar este problema

3218 Cor usada em elementos de percepccedilatildeo

No desenho de interfaces a cor pode funcionar como um elemento de

percepccedilatildeo Um exemplo disso eacute o uso de cores diferentes para link disponiacutevel e

visitado outro exemplo eacute mostrado na Figura 326 o desenho dos computadores

em verde sinalizando que a conexatildeo estaacute ativa e com um ciacuterculo vermelho e um

ldquoxrdquo para mostrar que estaacute inativa

Figura 326 Detalhe dos iacutecones de percepccedilatildeo de conexatildeo ativa e inativa na

barra inferior do Windows

3219 Uso de convenccedilotildees de cor preestabelecidas auxiliando a

percepccedilatildeo

Na subseccedilatildeo 328 discutimos alguns aspectos relativos agrave forma como eacute o

caso do carrinho de compras em sites de comeacutercio eletrocircnico Aqui estamos

discutindo padrotildees de cores que jaacute funcionam como convenccedilatildeo na web e

consequumlentemente em e-learning

Segundo Salomon [1990] os coacutedigos satildeo aprendidos com o tempo

atraveacutes de condicionamento cultural Eacute recomendaacutevel aproveitar coacutedigos jaacute

conhecidos a cor dos links eacute outro exemplo de coacutedigo de cor dominado pelos

usuaacuterios da web a saber azul para os links ativos e roxo para os jaacute visitados Por

57


esse motivo Borges [2000] e Nielsen [2000] aconselham que essas cores sejam

mantidas

Convenccedilotildees de cor como vermelho indicando ldquoparerdquo ou ldquoperigordquo e

verde para ldquoavanccedilarrdquo tambeacutem satildeo usadas de forma redundante colorindo um

elemento ou um texto A redundacircncia eacute utilizada para reforccedilar a mensagem A

interface antigado ICQ na Figura 327 usava uma margarida nas cores

vermelho e verde para alternar a informaccedilatildeo connected e desconnected esta

convenccedilatildeo era tambeacutem usada para mostrar dentre as pessoas cadastradas quem

estava conectado ou desconectado

Figura 327 Interface antiga do ICQ14

3220 Cor usada em elementos de consistecircncia

Como elemento de consistecircncia usamos a cor em elementos de funccedilotildees

similares que se repetem em todo o site por exemplo em uma barra superior no

14 httpwwwmirabiliscom Acessado em 2000

58


tiacutetulo do capiacutetulo ou do curso Um design consistente orienta o usuaacuterio durante a

navegaccedilatildeo evitando que ele se perca

3221 Uso de Metaacuteforas e temas visuais

Metaacuteforas satildeo poderosas ferramentas semacircnticas usadas para transmitir

similaridades entre situaccedilotildees familiares e novas [Mountford 1990] A facilidade

no uso das interfaces graacuteficas estaacute bastante relacionada com a semelhanccedila dos

usos e comportamentos dos objetos da interface como documentos pastas de

arquivo lixeira com seus correspondentes no mundo real

Metaacuteforas satildeo uacuteteis por duas razotildees oferecem uma estrutura unificadora

ao design e facilitam o aprendizado ao permitir que os usuaacuterios usem o

conhecimento que jaacute possuem acerca do sistema de referecircncia Boas metaacuteforas

satildeo histoacuterias que criem imagens na mente Exemplos de metaacuteforas incluem

galerias quadrinhos canais de televisatildeo controles remotos de TV revistas

tabloacuteides ambientes de loja museus estantes de cartotildees postais parques o

interior de coisas como computadores o corpo humano construccedilotildees e assim

por diante

Aleacutem do uso de metaacuteforas Black [1977] sugere o emprego de temas

visuais para atrair e guiar o visitante e oferecer ao site uma aparecircncia familiar

Exemplos de temas pinturas arte primitiva fotografias imagens juvenis art

deacuteco arte tipograacutefica futurista e assim por diante Segundo ele um bom site

temaacutetico eacute um exerciacutecio de sutileza bom design de informaccedilatildeo e consistecircncia

Tambeacutem as interfaces educacionais podem valer-se do uso de metaacuteforas

para facilitar o entendimento do usuaacuterio criar unidade e motivaccedilatildeo A utilizaccedilatildeo

de temas visuais para criar uma ambientaccedilatildeo de aprendizagem pode ser de

grande valia em interfaces para a educaccedilatildeo

3222 Iacutecones

Iacutecones satildeo imagens ou sinais graacuteficos que possuem as propriedades de um

objeto uma accedilatildeo ou uma ideacuteia que eles representam [Misanchuk 1992] O uso

59


de iacutecones em interfaces objetiva ajudar o usuaacuterio a localizar mais rapidamente a

informaccedilatildeo pois satildeo elementos de percepccedilatildeo

Os iacutecones podem fazer parte da metaacutefora utilizada como eacute o caso das

pastas de arquivo lixeira etc que citamos anteriormente usaacute-los em funccedilotildees

semelhantes pode reduzir tempo de aprendizado das funcionalidades da interface

pelos usuaacuterios

3223 Homepage

A Homepage ou paacutegina principal eacute a entrada do site Segundo Kilian

[1999] ela deve orientar o leitor sobre o que se trata o site como ele estaacute

organizado e como se daacute a navegaccedilatildeo Nielsen [2000] observa a inutilidade de

Splash na Homepage

Da mesma forma a paacutegina principal de sistemas para e-learning deve ser

utilizada para fazer uma apresentaccedilatildeo do curso e mostrar quais satildeo os seus

objetivos educacionais bem como a sua navegaccedilatildeo

3224 Navegaccedilatildeo

A navegaccedilatildeo deve ajudar os usuaacuterios a responder agraves trecircs perguntas

fundamentais (1) Onde estou (2) Onde estive (3) Aonde posso ir

Nielsen [2000] recomenda que a navegaccedilatildeo deve ser consistente ou seja

que suas ferramentas devem possuir o mesmo desenho em todo o site Ela deve

ser determinada pelas tarefas que os usuaacuterios desejam ou precisam realizar E

como a Internet eacute inerentemente natildeo-linear uma navegaccedilatildeo linear eacute muitas vezes

um sinal de alerta de maacute usabilidade

3225 Desenho do Conteuacutedo

Conteuacutedos educativos podem aproveitar recomendaccedilotildees gerais para

conteuacutedos na web da mesma forma que a interface graacutefica se utilizou de

conceitos de usabilidade das interfaces em geral Nielsen [2000] destaca que

conteuacutedo de qualidade eacute um dos determinantes mais importantes da usabilidade

60


na Internet Segundo ele eacute de suma importacircncia apresentar o conteuacutedo de forma

atraente para os leitores

Kilian [1999] observa que a web eacute boa para dois tipos de informaccedilatildeo

leituras raacutepidas e download Jaacute Nielsen [2000] explicando o porquecirc desta

afirmaccedilatildeo alerta que a leitura em telas de computadores eacute cerca de 25 mais

lenta do que em papel como jaacute mencionamos na subseccedilatildeo 3211 desta seccedilatildeo

Por conta disto o texto deve ser criado tendo em vista a facilidade de leitura

A elaboraccedilatildeo de textos para a Internet para Kilian [1999] e

consequumlentemente para e-learning deve observar os seguintes aspectos

Os textos devem ser pequenos com blocos natildeo muito longos

preferencialmente com paraacutegrafos curtos subtiacutetulos e listas com bullets Textos

longos devem ser deixados para download

A linguagem deve ser simples com estruturas sentenciais simples

Sentenccedilas simples satildeo muito mais faacuteceis de ler e a escrita com floreios e palavras

complexas dificulta mais ainda a leitura

Os tiacutetulos devem ser significativos

Recomenda-se natildeo usar afastamento para a primeira linha do

paraacutegrafo um espaccedilo duplo entre os paraacutegrafos favorece a leitura

Paacuteginas longas com rolagem de tela tambeacutem natildeo satildeo

recomendadas Black [1999] e Nielsen [2000] sugerem como paracircmetro natildeo

escrever mais do que 50 do texto que se escreveria para tratar do mesmo

assunto em uma publicaccedilatildeo impressa

Tambeacutem eacute observado que os usuaacuterios costumam imprimir

documentos grandes para leitura off-line portanto recomenda-se gerar duas

versotildees de todos os documentos longos uma otimizada e outra completa para

download ou impressatildeo Natildeo eacute recomendaacutevel usar textos no formato PDF para

leitura on-line pois a resoluccedilatildeo das fontes fica mais comprometida ainda

O hipertexto natildeo deve ser usado para segmentar um artigo longo e

linear em vaacuterias paacuteginas Ele deve ser usado para aprofundar pontos da leitura

61


Kilian [1999] adverte para natildeo hifenizar as palavras ndash alteraccedilotildees no

tamanho das telas podem mover o texto e deixaacute-lo sem sentido Tambeacutem natildeo se

deve sublinhar o texto na internet texto sublinhado eacute padratildeo para link

Em e-learning a proposta de sugerir links para outras paacuteginas eacute bastante

relevante mas a escolha desses links deve ser criteriosa para natildeo afastar o aluno

do foco da aprendizagem Segundo Nielsen [2000] eacute melhor vincular um

nuacutemero reduzido de paacuteginas externas altamente relevantes do que todos os

possiacuteveis sites alternativos na web Como em vaacuterios aspectos do design mais

significa menos Um outro aspecto relevante eacute incluir texto adicional que

explique de que se trata o link e sua relevacircncia para o assunto Podemos sugerir

indicaccedilotildees do tipo visita obrigatoacuteria recomendaacutevel bastante recomendaacutevel e

assim por diante para que o professor possa direcionar a pesquisa

3226 Imagens Estaacuteticas

No tocante ao uso de imagens podemos dizer que a primeira coisa que

vemos em uma paacutegina seja ela impressa ou eletrocircnica eacute a imagem que ilustra o

texto se ele possuir uma A publicidade recebeu um grande impulso com a

invenccedilatildeo da fotografia A maioria do material impresso e eletrocircnico que temos

contato eacute fartamente ilustrada Embora o uso de ilustraccedilotildees tenha sido bastante

pesquisado seus resultados ainda natildeo foram conclusivos e isso se daacute por causa

do grande nuacutemero de variaacuteveis envolvidas o tipo de ilustraccedilatildeo sua relaccedilatildeo com

o texto sua localizaccedilatildeo dimensotildees estilo etc [Misanchuk 1992]

O uso adequado de imagens na Internet estaacute relacionado com as demoras

causadas por arquivos muito grandes Imagens costumam possuir um nuacutemero

consideraacutevel de bytes e quanto menor o tamanho do arquivo (em kbytes) mais

raacutepida eacute a sua transferecircncia para visualizaccedilatildeo da paacutegina (download)

O tratamento de imagens para o uso na Internet visa obter o menor

tamanho de arquivo mantendo uma boa visualizaccedilatildeo em tela Como as telas de

computador possuem em sua maioria uma resoluccedilatildeo de 72 pixels imagens com

resoluccedilotildees maiores soacute aumentaratildeo o tamanho do arquivo Nielsen [2000]

62


recomenda manter o tamanho das paacuteginas em torno de 34 kbytes e como o texto

fica em torno de 4 kbytes as imagens devem ser mantidas em torno dos 30 kbytes

Um outro procedimento para acelerar o download da paacutegina eacute minimizar a

quantidade de elementos graacuteficos Elementos graacuteficos gratuitos devem ser

descartados

Eacute recomendado que todas imagens utilizadas possuam legendas

descritivas E que sejam vistas por inteiro na paacutegina natildeo deve ser necessaacuterio

rolar a paacutegina para vecirc-las

Felice e Nace [Felice e Nace apud Misanchuk 1992] afirmam que

ilustraccedilotildees possuem duas funccedilotildees expandir e elaborar o assunto exposto no

texto e oferecer agrave paacutegina um apelo visual Do ponto de vista da aprendizagem o

apelo visual eacute a funccedilatildeo menos importante contudo natildeo podemos desvalorizar

este aspecto As imagens podem ser utilizadas para quebrar a monotonia de uma

paacutegina soacute de texto e despertar interesse no leitor

Levie [Levie apud Misanchuk 1987] afirma que os estudantes preferem

estudar em materiais ilustrados e Dweyracutes [Dweyracutes apud Misanchuk 1992]

que imagens satildeo de bastante ajuda quando os objetivos educacionais estatildeo

vinculados a discriminaccedilotildees visuais como eacute o caso do estudo das partes do corpo

humano

Duchastel [Duchastel apud Misanchuk 1992] sugere trecircs regras para o

uso das ilustraccedilotildees

(1) Chamar a atenccedilatildeo e motivar o leitor

(2) Explicar o conteuacutedo do texto e

(3) Promover maior retenccedilatildeo atraveacutes do uso redundante da informaccedilatildeo

atraveacutes da linguagem verbal e da graacutefica

Duchastel e Waller [Duchastel e Waller apud Misanchuk 1992] dividem

as ilustraccedilotildees segundo sete funccedilotildees De acordo com eles essa tipologia pode ser

uacutetil na escolha de que tipo de ilustraccedilotildees se aplica melhor ao texto se um ou

mais desses requisitos satildeo preenchidos pela ilustraccedilatildeo desse modo entatildeo ela

pode ser usada caso contraacuterio ela natildeo deve ser incluiacuteda As imagens podem ser

63


Descritivas quando ilustram o que estaacute descrito no texto um

exemplo desta forma de uso eacute acrescentar uma foto da pessoa que estaacute

falando ou de quem se estaacute falando

Expressivas quando despertam a sensibilidade do leitor por

exemplo fotos mostrando os horrores da guerra

Estruturais quando mostram como as partes se relacionam com o

todo como nas visotildees explodidas dos objetos

Funcionais quando mostram visualmente relaccedilotildees entre conceitos

como nos mapas conceituais

Loacutegico-matemaacuteticas como nos graacuteficos

Algoriacutetmicas em graacuteficos de fluxos

Exposiccedilatildeo de dados graacuteficos tipos pizza ou barra etc

3228 Imagens em movimento

ldquo() qualquer coisa que se movimente na visatildeo perifeacuterica domina nossa

consciecircncia eacute extremamente difiacutecil concentrar-se em ler um texto no meio de

uma paacutegina se houver um logotipo que gira no canto superiorrdquo [Nielsen 2002

p 143]

Natildeo eacute recomendado portanto o uso de animaccedilotildees do tipo ldquoblinksrdquo

mensagens em movimento ou ldquogifsrdquo animados que possam distrair a atenccedilatildeo do

aluno do foco da aprendizagem Antes de utilizar uma animaccedilatildeo verifique se o

ponto seria tatildeo bem comunicado por um elemento graacutefico estaacutetico

Segundo Nielsen [2000] em interfaces a animaccedilatildeo pode ser usada para as

seguintes finalidades

Mostrar continuidade nas transiccedilotildees (o uso da ampulheta nas

interfaces windows para mostrar que o processamento ainda estaacute ocorrendo)

Indicar dimensionalidade nas transiccedilotildees (quanto falta para terminar

a instalaccedilatildeo ou o download mostrado com quadradinhos preenchendo uma

lacuna)

64


Ilustrar mudanccedila de campo (passagem de um arquivo de uma pasta

para outra)

Chamar a atenccedilatildeo (se sua meta eacute chamar a atenccedilatildeo para um

elemento no meio de vaacuterios ou alertar os usuaacuterios quanto a informaccedilotildees

atualizadas um tiacutetulo animado daraacute resultado)

3229 O uso de viacutedeo

ldquoDevido agraves restriccedilotildees de largura de banda o uso de viacutedeo dever ser

minimizadordquo [Nielsen 2000 p149] Essa recomendaccedilatildeo eacute bastante pertinente

Qualquer pessoa pode atestar por experiecircncia proacutepria as dificuldades para o

download de paacuteginas com viacutedeos e com animaccedilotildees SWF (feitas em Flash)

Sugerimos que os viacutedeos sejam deixados preferencialmente para download a

menos que sejam arquivos de tamanho bastante reduzido

Quando usados recomenda-se oferecer aos alunos resumos das cenas do

viacutedeo que os ajudem a determinar seu interesse caso o professor natildeo o considere

como de conteuacutedo obrigatoacuterio Tambeacutem eacute bom incluir uma ou duas fotos

estaacuteticas extraiacutedas e um resumo sobre o conteuacutedo para ilustrar e despertar

interesse O formato e o tamanho do arquivo devem ser indicados ao lado do link

para que os alunos possam ter uma estimativa do tempo do download

Uma recomendaccedilatildeo relevante para o uso de qualquer miacutedia em paacuteginas

web arquivos maiores devem ser deixados para download

3230 O uso de aacuteudio

As recomendaccedilotildees para o uso de viacutedeo tambeacutem valem para aacuteudio Um

exemplo de uso de aacuteudio em educaccedilatildeo eacute a utilizaccedilatildeo de falas gravadas de pessoas

citadas nos textos pois funciona como um elemento motivacional para os alunos

3231 A educaccedilatildeo do olhar

Eacute muito importante para quem pretende projetar para a Internet possuir

vivecircncia de navegaccedilatildeo Visitar sites de qualidade tanto educativos como

65


comerciais eacute a praacutetica inicial recomendada por dois motivos primeiro para que

as boas soluccedilotildees de desenho sejam fontes de inspiraccedilatildeo segundo para que

observando o tipo de navegaccedilatildeo a que os usuaacuterios estatildeo acostumados projete-se

baseado na cultura jaacute instalada

33 Camada de Autoria

Conceitos de Autonomia e Flexibilidade

As camadas graacutefica e pedagoacutegica natildeo teriam sentido sem a composiccedilatildeo do

conteuacutedo feita pelo professor Eacute a autoria dele que vai certamente dar o

acabamento final Desta forma abrimos espaccedilo em nosso modelo para mais uma

camada de interface e pesquisamos os conceitos que estariam mais adequados a

ela

Lucena [1999] observa que o maior problema encontrado pelos

professores que desejam publicar seus materiais na Internet eacute o aprendizado de

linguagens de programaccedilatildeo necessaacuterias a esta tarefa e reforccedila a ideacuteia de que ao

professor basta dominar sua aacuterea de conhecimento Fuks [2001] afirma que

ldquopara desenvolver conteuacutedos atraentes satildeo necessaacuterios aleacutem do conhecimento

do tema habilidades pedagoacutegicas e de design graacuteficordquo A essas afirmaccedilotildees noacutes

acrescentariacuteamos que a preparaccedilatildeo de bons conteuacutedos para e-learning tambeacutem

requer uma linguagem apropriada para a Internet Um conjunto de habilidades

que natildeo fazem parte da formaccedilatildeo dos professores daiacute a dificuldade encontrada

por eles pelo menos ateacute agora

A alternativa que temos observado para suprir esta falta ou dificuldade eacute a

utilizaccedilatildeo de equipes de trabalho Misanchuk [1992 p2] no contexto do design

de materiais impressos oferece-nos uma outra ideacuteia afirmando que ldquoNatildeo eacute

esperar demais dos educadores que eles produzam materiais com aparecircncia

profissional E isso eacute o que eles desejam quando tecircm a oportunidade de fazecirc-lordquo

66


Ele acredita que os educadores natildeo devem perder a oportunidade de criarem eles

mesmos seus materiais de aprendizagem Refletindo sobre estas afirmaccedilotildees

sentiacutemo-nos estimulados a caminhar na direccedilatildeo proposta por Misanchuk [1992]

sem desconsiderar as dificuldades e as necessidades reais para a elaboraccedilatildeo de

um bom material de aprendizagem para a web

Observamos uma tendecircncia das interfaces graacuteficas de cada vez mais

oferecer autonomia ao usuaacuterio comum Quem utilizou computadores antes do

surgimento das interfaces graacuteficas deve estar lembrado de que era necessaacuterio

memorizar um bom nuacutemero de comandos para operar o sistema operacional

(DOS) e os softwares de processamento de textos (como por exemplo o Carta

Certa) O que presenciamos hoje com o advento das interfaces graacuteficas e dos

dispositivos plug-and-play eacute uma acessibilidade bem maior Eacute nesta linha que

estamos pensamos a autoria para o e-learning e preparamos nosso modelo

seguindo esta tendecircncia de oferecer autonomia ao usuaacuterio comum

Aleacutem de possibilitar uma maior autonomia natildeo tornamos nosso modelo

uma camisa-de-forccedila mas procuramos sugerir passos com liberdade sem

restringir o professor em sua criatividade e seu saber pedagoacutegico Por isso

incorporamos agrave interface de autoria o conceito de flexibilidade

Foi possiacutevel oferecer autonomia e flexibilidade ao professor porque

existem as camadas pedagoacutegica e graacutefica satildeo elas oferecem suporte com as

habilidades definidas como fundamentais no iniacutecio desta seccedilatildeo


ldquo() a primeira e a mais importante pergunta a fazer eacute o que o usuaacuterio

deseja fazer rdquo [Laurel 1999 pxiii] Neste capiacutetulo respondemos a essa

pergunta fazendo uma revisatildeo na literatura e lanccedilando hipoacuteteses sobre a camada

de autoria

67

Capiacutetulo IV - Protoacutetipo


Nesse Capiacutetulo apresentaremos o processo de desenvolvimento e a

descriccedilatildeo do protoacutetipo do Projeto de Aprendizagem que eacute a materializaccedilatildeo do

modelo proposto

41 O Desenvolvimento do Projeto de Aprendizagem

A materializaccedilatildeo do modelo do Projeto de Aprendizagem foi desenvolvida

de forma pouco metoacutedica Contudo depois do caminho percorrido podemos

agora fazecirc-lo de volta organizando e refletindo sobre os passos dados e

organizando as etapas cumpridas

Nosso primeiro passo foi pensar nas interfaces do protoacutetipo do Projeto de

Aprendizagem a partir dos conceitos que escolhemos para nosso modelo Mas

natildeo queriacuteamos somente usaacute-los pretendiacuteamos que eles estivessem expressos nas

interfaces da ferramenta Um outro aspecto que consideramos relevante foi a

facilidade no uso gostariacuteamos de uma ferramenta simples que atendesse dos

usuaacuterios mais experientes aos menos experientes

A primeira ideacuteia foi desenvolver uma ferramenta para a publicaccedilatildeo de

conteuacutedos a partir de templates do tipo que satildeo usados no Power Point Como

uma de nossas metas era a facilidade de uso decidimos natildeo oferecer opccedilotildees de

alteraccedilatildeo no layout dos templates isso por uma advertecircncia de Laurel [1990]

(Seccedilatildeo 31 do Capiacutetulo III ndash Interface) quando ela diz que muitas opccedilotildees

confundem o usuaacuterio Definimos entatildeo um modelo de layout onde todas as

especificaccedilotildees de diagramaccedilatildeo (tamanho e cor de fontes de texto e de tiacutetulos cor

de fundo etc) estivessem fixos sem oferecer ao usuaacuterio a possibilidade de

alteraacute-lo

68


Como estaacutevamos criando interfaces para a web pensamos em desenvolver

esses templates em HTML dinacircmica A ideacuteia de se usar templates dinacircmicos natildeo

eacute uma ideacuteia original eacute uma estrateacutegia que jaacute vem sendo usada para a geraccedilatildeo e

atualizaccedilatildeo de conteuacutedo Um exemplo deste uso pode ser encontrado nos sites de

hospedagem gratuita kitnet1 e hpg2

Tambeacutem quisemos que a ferramenta pudesse ser usada isoladamente por

um professor que quisesse publicar seu conteuacutedo na Internet ou inserida em

Ambientes Virtuais de Aprendizagem participando de um contexto de

aprendizagem mais amplo

Quando comeccedilamos a projetar os templates nosso design foi sendo

depurado de tal forma ateacute atingirmos um design despojado no qual nada pudesse

atrapalhar o foco da aprendizagem Cada aspecto do design das interfaces do

Projeto de Aprendizagem encontra-se justificado no Capiacutetulo III ndash Interface

Podemos entatildeo definir a materializaccedilatildeo do modelo Projeto de

Aprendizagem como uma ferramenta interativa desenvolvida a partir de

templates de HTML dinacircmica para a autoria de conteuacutedos de e-learning

42 Escopo da Ferramenta do Projeto de Aprendizagem

O Projeto de Aprendizagem pode ser utilizado isoladamente ou inserido

em um ambiente de apoio ao e-learning desde que sejam feitos os ajustes

necessaacuterios Em contextos de aprendizagem a distacircncia ou como suporte ao

ensino presencial por professores na elaboraccedilatildeo e publicaccedilatildeo de conteuacutedos de

aprendizagem ou por alunos em atividades de fixaccedilatildeo e avaliaccedilatildeo da

aprendizagem pois segundo Fuks e Lucena [1999] a criaccedilatildeo de paacuteginas para a

web pelos alunos eacute uma forma de complementaccedilatildeo do conteuacutedo

43 Recursos da Ferramenta

A ferramenta do Projeto de Aprendizagem oferece os seguintes recursos

1 httpkitnetglobocom2 httpwwwhpgcombr

69


(1) Uma ferramenta pedagoacutegica de apoio para a elaboraccedilatildeo de um Plano

de Aula que atraveacutes de um roteiro conduz o professor a refletir sobre a

organizaccedilatildeo do conteuacutedo de acordo com a perspectiva pedagoacutegica de David

Ausubel

(2) Interfaces semiprontas do tipo templates onde o professor pode

inserir dinamicamente (usando o conceito de paacuteginas dinacircmicas) seus conteuacutedos

sem que precise conhecer a linguagem de marcaccedilatildeo HTML ou seus editores

44 Modelagem

O Projeto de Aprendizagem foi desenvolvida em HTML dinacircmico

interpretado (ASP) isto eacute formado por paacuteginas interativas com scripts de

programaccedilatildeo embutidos Tanto o Plano de Aula como os conteuacutedos inseridos nos

templates satildeo enviados para um Banco de Dados

A implementaccedilatildeo do protoacutetipo foi feita primeiramente atraveacutes da

preparaccedilatildeo de paacuteginas HTML estaacuteticas seguindo as especificaccedilotildees de ordem

pedagoacutegica graacutefica e de autoria Em seguida foi feita a modelagem do Banco de

Dados definindo-se para cada objeto da ferramenta os seus atributos e

procedimentos Por uacuteltimo foi feita a programaccedilatildeo dos scripts para tornar as

paacuteginas interativas e dinacircmicas A URL do Projeto de Aprendizagem eacute

http146164250184ausubelindexasp onde ele pode provisoriamente ser

acessado

Quando o professor acessa a paacutegina principal da ferramenta ele pode

escolher entre duas accedilotildees baacutesicas accedilotildees relativas ao Plano de Aula ou agrave Aula A

criaccedilatildeo da Aula exige que anteriormente seja criado um Plano de Aula portanto

caso ele natildeo tenha sido criado ainda esta seraacute a uacutenica accedilatildeo disponiacutevel

Cada Plano de Aula eacute uacutenico No momento em que o professor insere um

tiacutetulo na paacutegina CriarAlterar Plano de Aula imediatamente eacute criado um

Identificador que fica armazenado em Banco de Dados a partir desse ID todos

os relacionamentos seratildeo feitos entre as tabelas do Banco

70


O modelo da Figura 41 expressa os relacionamentos entre as tabelas do

Banco de Dados o da Figura 42 as accedilotildees possiacuteveis do professor na ferramenta e

o da Figura 43 a navegaccedilatildeo do aluno nas paacuteginas das aulas criadas

Figura 41 Modelo Conceitual

Figura 42 Navegaccedilatildeo do professor para a construccedilatildeo do Plano de Aula

(amarelo claro) criaccedilatildeo das Aulas (amarelo escuro) e Aula criada

(marron)

71


Figura 43 Esquema da navegaccedilatildeo do aluno nas paacuteginas do Projeto de

Aprendizagem criado pelo professor

45 Utilizaccedilatildeo da Ferramenta

A criaccedilatildeo de conteuacutedos para publicaccedilatildeo em Internet do Projeto de

Aprendizagem eacute um processo que engloba duas etapas

Etapa (1) Criaccedilatildeo do Plano de Aula

A primeira etapa compreende a organizaccedilatildeo do conteuacutedo utilizando a

perspectiva pedagoacutegica de David Ausubel

Etapa (2) Criaccedilatildeo das Aulas

A segunda etapa compreende a criaccedilatildeo das paacuteginas de conteuacutedo de

aprendizagem a serem publicadas na Internet para os alunos

(1) Plano de Aula ndash O Plano de Aula oferece ao professor um roteiro

interativo de base ldquoausubelianardquo que tem por objetivo auxiliaacute-lo a elaborar um

Plano de Aula (Subseccedilatildeo 312 do Capiacutetulo ndash Interface) Esse caracteriza-se pela

determinaccedilatildeo e estruturaccedilatildeo hieraacuterquica dos conceitos relevantes do conteuacutedo de

aprendizagem relacionando-os com seus respectivos ldquosubsunccediloresrdquo [Moreira

1983] Outrossim nesta etapa o professor dispotildee de um formulaacuterio para enviar

uma tarefaperguntas aos alunos Este procedimento cumpre a indicaccedilatildeo de

Ausubel de conhecer o que o aluno jaacute sabe a respeito do que se pretende ensinar

72


O processo de elaboraccedilatildeo do Plano de Aula usa a metaacutefora de organizaccedilatildeo

de arquivos em pastas aproveitando um padratildeo que jaacute eacute amplamente conhecido

Eacute tambeacutem possiacutevel usar um software para a criaccedilatildeo de mapas conceituais (um

freeware para a criaccedilatildeo de Mapas Conceituais o CMap pode ser obtido atraveacutes

de download por um link disponibilizado na proacutepria tela do Plano de Aula) e

inserir a imagem exportada (GIF ou JPG) Esses Planos de Aula ficam

arquivados em Banco de Dados e podem ser utilizados em consultas ou

reutilizados em na montagem de outras Aulas

(2) Criaccedilatildeo da Aula - O processo inicia-se com seleccedilatildeo de um dos

estilos de diagramaccedilatildeo oferecidos os templates O professor entatildeo inclui

dinamicamente em paacuteginas contendo campos de preenchimento textos

imagens perguntas multimiacutedias para download e links que daratildeo origem agrave Aula

um site composto de Apresentaccedilatildeo Motivaccedilatildeo (Organizador Preacutevio) Conteuacutedo

propriamente dito e Atividade Esta etapa soacute se torna disponiacutevel para o professor

se ele tiver cumprido a primeira pois somente a partir da seleccedilatildeo de um plano de

aula eacute que fica disponiacutevel a paacutegina de escolha dos templates Todas as paacuteginas

possuem espaccedilo para a inclusatildeo de uma imagem e sua respectiva legenda O

acesso dos alunos agraves paacuteginas do curso eacute livre e natildeo-linear e eacute formado por um

conjunto de paacuteginas que pode ornar-se disponiacutevel em qualquer plataforma para

e-learning atraveacutes da inserccedilatildeo de um link que eacute gerado pela proacutepria ferramenta

A Aula eacute composta de

a Apresentaccedilatildeo paacutegina inicial na qual o professor insere os objetivos do

curso um texto introdutoacuterio e uma pergunta (preacute-teste) a ser respondida pelo

aluno em um campo de formulaacuterio

b Motivaccedilatildeo espaccedilo destinado agrave inclusatildeo de um Organizador Preacutevio

[Moreira 1983]

c Conteuacutedo (1n) onde o professor inclui os conteuacutedos de

aprendizagem propriamente ditos (eacute possiacutevel incluir mais de uma paacutegina de

conteuacutedo) e

73


d Atividade onde eacute proposta uma atividade e uma pergunta (poacutes-teste)

que como na apresentaccedilatildeo pode ser respondida atraveacutes da proacutepria paacutegina em um

campo de formulaacuterio

46 Conceitos utilizados nas Interfaces da Ferramenta

Os conceitos de usabilidade e de design pesquisados foram usados tanto

nas interfaces do Plano de Aula como nos templates que daratildeo origem agraves Aulas

Eles estatildeo descritos abaixo com as referecircncias das subseccedilotildees do Capiacutetulo III -

Interface

461 O design das interfaces

O design das interfaces do Plano de Aula das telas de preenchimento dos

templates e das Aulas que satildeo criadas segue um estilo despojado que objetiva

atender ao conceito de simplicidade [Subseccedilatildeo 324 Simplicidade] e de natildeo

interferecircncia no foco da aprendizagem

As telas da ferramenta bem como as das aulas produzidas foram criadas

com fundo branco [Subseccedilatildeo 3211 Legibilidade] utilizando fontes na cor preta

sem serifa (Arial) com tamanho dois para texto e trecircs para tiacutetulo [3211

Legibilidade e 322 Organizaccedilatildeo da informaccedilatildeo contraste]

Foram utilizados retacircngulos em cinza claro para dar destaque aos campos

de preenchimento do Plano de Aula oferecendo uma diferenciaccedilatildeo em relaccedilatildeo

ao fundo da paacutegina

As cores escolhidas satildeo claras e objetivam dar ao ambiente uma aparecircncia

suave Foram mantidas as cores-padratildeo para os links [Subseccedilatildeo 328 Uso de

Padrotildees]

As telas de preenchimento dos templates possuem uma barra de

orientaccedilatildeo com alccedilas em cinza claro com o nome das paacuteginas que estatildeo sendo

preenchidas Estas alccedilas satildeo alteradas dinamicamente para o laranja informando

ao professor qual eacute a paacutegina do conjunto que estaacute sendo preenchida [Subseccedilatildeo

327 Consistecircncia]

74


A Barra Superior do Plano de Aula funciona como elemento de

consistecircncia pois estaacute presente em todas as suas telas possuindo tambeacutem uma

imagem que funciona como marca do Projeto localizada no canto superior

esquerdo [Subseccedilatildeo 327 Consistecircncia] e de percepccedilatildeo pois informa o nome

da accedilatildeo que estaacute sendo executada no canto superior direito Um menu dropdown

possibilita o acesso natildeo-linear agraves funcionalidades da ferramenta

Na paacutegina de inclusatildeo do Plano de Aula as funccedilotildees satildeo acessadas atraveacutes

de iacutecones [Subseccedilatildeo 3222 Iacutecones] que foram escolhidos dentro de padrotildees jaacute

conhecidos como pastas fichaacuterios envelopes de correspondecircncia [Subseccedilatildeo

328 Uso de Padrotildees] Todos os iacutecones possuem um componente ALT que

informa a funccedilatildeo que estaacute sendo executada

O Plano de Aula possui afastamentos laterais para mostrar a hierarquia

entre os conceitos [Subseccedilatildeo 321 Organizaccedilatildeo da informaccedilatildeo proximidade e

afastamento]

As telas da ferramenta e as paacuteginas das aulas produzidas foram preparadas

para uma boa visualizaccedilatildeo tanto em monitores com resoluccedilatildeo de 800 x 600

pixels quanto nos de 1024 x 768 pixels [Subseccedilatildeo 3210 Largura da Paacutegina]

Nas paacuteginas das Aulas foram usados links nas cores e no forjmato padratildeo

com texto sublinhado [Subseccedilatildeo 328 Uso de Padrotildees] ao inveacutes de utilizar

elementos graacuteficos essa escolha objetiva agilizar o download uma vez

quenestas paacuteginas o professor estaraacute incluindo uma imagem e isso vai

aumentar o tamanho do arquivo

O tiacutetulo da aula eacute obtido a partir do tiacutetulo que o professor insere no Plano

de Aula e se repete em todas as paacuteginas funcionando como elemento de

consistecircncia Os subtiacutetulos referentes aos assuntos tratados em cada paacutegina

possuem cores diferentes objetivando com isso dar uma diferenciaccedilatildeo nas

paacuteginas e assim orientar o aluno [Subseccedilatildeo 327 Consistecircncia] Foi utilizado um

corpo maior de fonte em Negrito nos tiacutetulos [Subseccedilatildeo 322 Organizaccedilatildeo da

informaccedilatildeo contraste]

75


Os alinhamentos foram estudados para oferecer um aspecto equilibrado agraves

paacuteginas [Subseccedilatildeo 333 Organizaccedilatildeo da informaccedilatildeo equiliacutebrio simeacutetrico e

assimeacutetrico] A navegaccedilatildeo estaacute alinhada com a imagem e sua respectiva legenda

agrave direita o tiacutetulo do conteuacutedo e o texto estatildeo alinhados tambeacutem agrave direita

ocupando um pouco mais que a metade da paacutegina [329 Layout espaccedilos em

branco] o tiacutetulo da aula estaacute alinhado com o texto pela esquerda Os assuntos das

paacuteginas foram agrupados e todos possuem um tiacutetulo em destaque por exemplo

links objetivos arquivo para download [Subseccedilatildeo 321 Organizaccedilatildeo da

informaccedilatildeo proximidade e afastamento]

Todas as paacuteginas possuem espaccedilo para inserir uma ilustraccedilatildeo e sua

respectiva legenda [Subseccedilatildeo 3226 Imagens Estaacuteticas] Os links recomendados

e os arquivos deixados para download possuem um espaccedilo lateral para

comentaacuterios [Subseccedilatildeo 3225 Desenho do Conteuacutedo]

Quanto agraves imagens que seratildeo inseridas pelo professor-autor o Projeto de

Aprendizagem exige que elas tenham um tamanho maacuteximo de 240 pixels de

largura Recomendamos que todas as imagens possuam 72 dpi de resoluccedilatildeo que

eacute a resoluccedilatildeo da maioria dos monitores de computador pois quanto menor a

resoluccedilatildeo menor seraacute o tamanho do arquivo e consequumlentemente mais raacutepido eacute o

seu download As imagens tambeacutem devem ser salvas com a compressatildeo JPG ou

GIF para que possam ser visualizadas nos Browsers [Subseccedilatildeo 3226 Imagens

Estaacuteticas] Programas de processamento de imagens como o Photoshop na

versatildeo 70 jaacute oferecem otimizaccedilatildeo para a web na opccedilatildeo de salvar para a web

Um outro aspecto que estamos considerando no design das paacuteginas das

aulas eacute a disponibilizaccedilatildeo de todos os recursos de aprendizagem como textos

miacutedias e links escolhidos pelo professor nas paacuteginas de conteuacutedo Acreditamos

com isso que estaremos evitando a dispersatildeo e diminuindo o tempo de acesso

uma vez que o aluno natildeo vai precisar acessar outras paacuteginas

47 Descriccedilatildeo das Interfaces da Ferramenta

471 Tela de Abertura

76


A tela de abertura do Projeto de Aprendizagem apresenta um menu

dropdown para acesso agraves funcionalidades oferecidas (1) Tutorial (2)

Funcionalidades do Plano de Aula CriarAlterar Plano de Aula Visualizar Plano

de Aula Excluir Plano de Aula e (3) Funcionalidades da Criaccedilatildeo de AulaCurso

Visualizar Aula e Excluir Aula

Figura 44 Tela de abertura do Projeto de Aprendizagem

472 Telas do Plano de Aula

77


4721 Tela CriarAlterar Plano de Aula

Agrave esquerda satildeo encontrados iacutecones para a seleccedilatildeo das funccedilotildees de criar

Plano de Aula (em destaque com moldura laranja) e os iacutecones para a inserccedilatildeo de

conceito de niacutevel 1 conceito de niacutevel 2 conceito de niacutevel 3 pergunta e lista de

e-mails Nesta tela satildeo criados o Plano de Aula as perguntas e a lista de

endereccedilamento das perguntas

Figura 45 Tela CriarAlterar Plano de Aula

4722 Tela Visualizar Plano de Aula

78


No alto da tela uma lista dropdown daacute acesso agrave escolha do Plano de Aula

e depois desta accedilatildeo ele eacute visualizado na mesma tela

Figura 46 Tela Visualizar Plano de Aula

4723 Tela Excluir Plano de Aula

79


Da mesma forma que na visualizaccedilatildeo um menu dropdown daacute acesso agrave

escolha do Plano de Aula que se deseja excluir A tela expotildee o Plano de Aula e

pede confirmaccedilatildeo para a exclusatildeo Quando eacute excluiacutedo um Plano de Aula

tambeacutem eacute excluiacuteda a Aula que estaacute vinculada a ele


473 Tela da Criaccedilatildeo de AulaCurso

4731 Escolha do Template

80


Nesta tela estatildeo disponiacuteveis para o professor os vaacuterios estilos de templates

para a criaccedilatildeo de conteuacutedos (no momento do Projeto de Aprendizagem dispotildee de

apenas um estilo)

Soacute eacute possiacutevel escolher um template de aula depois de ter sido criado seu

respectivo Plano de Aula Decidimos vincular o Plano de Aula com a Aula por

uma questatildeo de organizaccedilatildeo no arquivamento desses dois produtos gerados pela

ferramenta Tambeacutem o tiacutetulo da Aula eacute criado dinamicamente a partir do tiacutetulo

do Plano de Aula


474 Telas de Preenchimento do Conteuacutedo

81


As telas de preenchimento possuem lacunas para inserccedilatildeo dos conteuacutedos e

um botatildeo que possibilita a visualizaccedilatildeo do que se inseriu O Projeto de

Aprendizagem tambeacutem permite a inserccedilatildeo de links no meio do texto atraveacutes do

uso das tags HTML Para orientar o professor nesta tarefa eacute oferecido um

pequeno glossaacuterio com as tags mais usadas

a Preenchimento da Paacutegina de Apresentaccedilatildeo

Na paacutegina de Apresentaccedilatildeo o professor possui espaccedilos para inserir um

tiacutetulo e um texto para a apresentaccedilatildeo da AulaCurso seus objetivos uma imagem

e sua respectiva legenda e uma pergunta (preacute-teste) para ser respondida atraveacutes

da proacutepria paacutegina

Figura 49 Tela de preenchimento da Apresentaccedilatildeo

b Preenchimento da Paacutegina de Motivaccedilatildeo

82


Na paacutegina de Motivaccedilatildeo o professor apresenta um Organizador Preacutevio

Nela ele encontra espaccedilos para inserir um texto e seu tiacutetulo uma imagem e sua

respectiva legenda links e um arquivo para download Ao lado dos links e do

arquivo para download eacute oferecido um espaccedilo para um texto descritivo sobre a

importacircncia do link e do conteuacutedo do arquivo [Subseccedilatildeo 3225 Desenho do

Conteuacutedo]

Figura 410 Tela de preenchimento da Motivaccedilatildeo

c Preenchimento da Paacutegina de Conteuacutedo

83


Na paacutegina de Conteuacutedo o professor insere o conteuacutedo da aula

propriamente dito ele pode criar mais de uma paacutegina de conteuacutedo Nela ele

encontra espaccedilos para inserir um texto e seu tiacutetulo uma imagem e sua respectiva

legenda links e um arquivo para download Como na paacutegina de motivaccedilatildeo ao

lado dos links e do arquivo para download existe um espaccedilo para um texto

descritivo

Figura 411 Tela de preenchimento de Conteuacutedo

d Preenchimento da Paacutegina de Atividade

84


Na paacutegina de Atividade o professor possui espaccedilos para inserir um tiacutetulo

e um texto para a atividade da aula uma imagem e sua respectiva legenda e uma

pergunta (poacutes-teste) para ser respondida atraveacutes da proacutepria paacutegina

Figura 412 Tela de preenchimento de Atividade

4733 Tela Visualizar Aula

85


Esta tela permite ao professor a visualizaccedilatildeo das aulas criadas da mesma

forma que o botatildeo visualizar nas paacuteginas de preenchimento Ela tambeacutem

disponibiliza um link de acesso agrave aula criada que pode ser inserido em uma

paacutegina HTML do professor ou em um ambiente virtual de aprendizagem Este

link possui o seguinte formato [alunoaspid=8] onde alunoasp eacute a paacutegina

dinacircmica que gera a aula (Apresentaccedilatildeo Motivaccedilatildeo Conteuacutedo e Atividade) e o

id=8 a referecircncia do Plano de Aula criado

Figura 413 Tela Visualizar Aula

4734 Tela Excluir Aula

86


Esta tela permite ao professor exclua as aulas criadas Diferente da

exclusatildeo do Plano de Aula que exclui automaticamente a Aula que estaacute

vinculada a ele a exclusatildeo da Aula permite que seja mantido o Plano de Aula e

caso o professor deseje excluiacute-lo tambeacutem deve acessar a paacutegina Excluir Plano de

Aula no menu dropdown

Figura 414 Tela Excluir Aula

474 Tutorial

O tutorial do Projeto de Aprendizagem disponibilizaraacute esta dissertaccedilatildeo de

mestrado em formato PDF objetivando oferecer os conceitos do modelo do

Projeto de Aprendizagem bem como esclarecimentos sobre o uso da ferramenta


87


No desenvolvimento do protoacutetipo do Projeto de Aprendizagem natildeo

seguimos nenhum modelo especiacutefico embora tenham sido cumpridas as etapas

de prototipagem a seguir depois de criadas as interfaces eram testadas pelos

usuaacuterios as sugestotildees dadas por eles consideradas relevantes eram

implementadas e os erros corrigidos Este processo foi repetido vaacuterias vezes ateacute

que todos usuaacuterios e desenvolvedores estivessem satisfeitos com a ferramenta

88



Nesse Capiacutetulo apresentaremos as observaccedilotildees que foram realizadas com

professores a tiacutetulo de preacute-validaccedilatildeo e os resultados obtidos

51 Objetivos das Observaccedilotildees

O Projeto de Aprendizagem com as caracteriacutesticas e as funcionalidades

que lhe foram atribuiacutedas deve passar pela busca de evidecircncias que ajudem a

responder agraves seguintes questotildees

(1) O Projeto de Aprendizagem cumpre o seu papel de ajudar o professor a

elaborar seu conteuacutedo refletindo a pedagogia de Ausubel Oferece ao professor

opccedilotildees de apresentaccedilatildeo graacutefica deste conteuacutedo

(2) Os alunos aleacutem de se sentirem motivados conseguem ter um melhor

desempenho de aprendizagem quando interagem com conteuacutedos da mateacuteria

organizados pelo seu professor usando o Projeto de Aprendizagem

A presente avaliaccedilatildeo refere-se agraves investigaccedilotildees relativas agrave primeira

questatildeo acima pois ela eacute condiccedilatildeo necessaacuteria para a segunda

Foram realizadas observaccedilotildees com uma amostra de professores usando o

Projeto de Aprendizagem na preparaccedilatildeo de uma aula atraveacutes de entrevistas semi-

estruturadas Todos os professores observados possuem experiecircncia significativa

no uso das tecnologias de informaccedilatildeo e de comunicaccedilatildeo Os professores que

participaram do processo de preacute-validaccedilatildeo foram divididos em dois grupos tendo

como base o conhecimento da pedagogia de David Ausubel No grupo (1) foram

colocados os professores familiarizados com a pedagogia e no grupo (2) os natildeo-

familiarizados A Tabela 51 mostra como o planejamento das observaccedilotildees foi

estruturado

89


Tabela 51 ndash Planejamento das Observaccedilotildees

1 Preparaccedilatildeo da Observaccedilatildeo

11 Definir a tarefa Os professores seratildeo solicitados a elaborar

uma aulacurso usando o Projeto de

Aprendizagem

12 Demonstrar o uso do

equipamento e do uso do Projeto de

Aprendizagem

Seratildeo usados computadores com acesso agrave

Internet e agrave Plataforma Pii [Melia e Sampaio

2001] onde o Projeto de Aprendizagem estaacute

inserido

13 Explicar sumariamente a

proposta de Ausubel e a adaptaccedilatildeo

da referida teoria representada pelo


Padronizar as explicaccedilotildees baacutesicas sobre o que

os professores pesquisados devem saber

2 Protocolo da Observaccedilatildeo

21 Pertinecircncia a A interface do Projeto de Aprendizagem

espelha a pedagogia de Ausubel

b Aprovanatildeo aprova a ideacuteia do Projeto de

Aprendizagem Interesse em avaliar a

proposta

c Usarianatildeo usaria no dia-a-dia de sua praacutetica

docente

22 Eficaacutecia para melhorar o niacutevel

de aprendizagem

a Acredita natildeo acredita que o Projeto de

Aprendizagem possa contribuir de forma

significativa para melhorar o niacutevel de

aprendizagem

b Aspectos do Projeto de Aprendizagem que

julga mais e menos positivos a esse respeito

c Sugestotildees para melhorar a eficaacutecia

90


23 Interface do Projeto de

Aprendizagem

Dificuldades e facilidades encontradas no

entendimento das interfaces do Projeto de

Aprendizagem

a Interface graacutefica Navegaccedilatildeo

b Interface pedagoacutegica Divisatildeo do conteuacutedo

em conceitos hierarquizados e Criaccedilatildeo de


c Interface de autoria Criaccedilatildeo das Aulas

uso das imagens dos textos links e miacutedias

24 Impressotildees gerais a Grau de percepccedilatildeo e empatia com o Projeto

de Aprendizagem

b Criacuteticas e sugestotildees sobre as interfaces

3 Conclusatildeo do processo de


Ao final da observaccedilatildeo seraacute explicado aos

usuaacuterios participantes o que se pretendia com

a pesquisa seratildeo respondidas suas questotildees e

discutido qualquer comportamento

interessante que possa ter havido Tambeacutem

seratildeo questionados sobre suas impressotildees

gerais ou sobre algum detalhe que tenham

considerado relevante

52 Resultados do Processo de preacute-Validaccedilatildeo

Por que estamos chamando de preacute-validaccedilatildeo Porque para considerarmos

validado o Projeto de Aprendizagem precisariacuteamos de muito mais tempo pessoas

e recursos do que dispomos O proacuteprio programa de poacutes-graduaccedilatildeo foi um

agente limitante uma vez que determina um prazo para a conclusatildeo do projeto

Poreacutem as observaccedilotildees que estamos nomeando de preacute-validaccedilatildeo contribuiram

sobremaneira fornecendo subsiacutedios para o design do Projeto de Aprendizagem

como veremos a seguir

91


O processo de preacute-validaccedilatildeo das interfaces graacutefica e pedagoacutegica do

protoacutetipo do Projeto de Aprendizagem natildeo foi um momento estanque Natildeo

apresentamos aos professores uma interface acabada pois ela foi sendo

construiacuteda com criacuteticas sugestotildees e observaccedilotildees de uso Apoacutes as reuniotildees de

avaliaccedilatildeo com os professores as criacuteticas e sugestotildees apresentadas eram

avaliadas E as sugestotildees consideradas relevantes eram implementadas e

submetidas novamente agrave apreciaccedilatildeo

521 Observaccedilotildees realizadas com professor familiarizado

Leciona a disciplina de Fiacutesica tem 4 anos de magisteacuterio conhece a

pedagogia de David Ausubel Este professor participou ativamente desde o

iniacutecio da concepccedilatildeo das interfaces do Projeto de Aprendizagem com sugestotildees e

criacuteticas

Comentaacuteriosdecisotildees

A participaccedilatildeo desse professor comeccedilou tatildeo logo criamos o modelo do

Projeto de Aprendizagem e nossa primeira interface Ele esteve presente em

muitos momentos e fez sugestotildees e criacuteticas que contribuiacuteram muito para a

construccedilatildeo da ferramenta como um todo

O professor aprova a ideacuteia de Projeto de Aprendizagem mas sua proposta

de uso seria em um contexto de educaccedilatildeo semipresencial funcionando como

suporte Sua ideacuteia eacute utilizar as aulas elaboradas como Organizador Preacutevio e natildeo

apenas a paacutegina de Motivaccedilatildeo que eacute destinada a esse uso Sua proposta eacute a de que

aluno leia o conteuacutedo na Internet e depois assista agrave aula correspondente

Afirma tambeacutem que seriam necessaacuterios experimentos com os alunos

para avaliar se o Projeto de Aprendizagem contribui para melhorar o niacutevel de

aprendizagem

Uma das sugestotildees oferecidas por ele foi a inserccedilatildeo de uma pergunta com

possibilidade de interaccedilatildeo (resposta) nas telas da Apresentaccedilatildeo (preacute-teste) e

Atividade (poacutes-teste) Observou que o aluno deveria poder responder agraves

perguntas a partir de qualquer computador e natildeo apenas do software de e-mail do

92


aluno Esse professor fez essa sugestatildeo por conta da experiecircncia que possui com

o uso de conteuacutedos disponiacuteveis em Internet Ponderou que nem todos os alunos

possuem seu proacuteprio computador e podem estar utilizando computadores de um

laboratoacuterio ou do proacuteprio trabalho (sem usar software de correio eletrocircnico) Tal

sugestatildeo originou a inclusatildeo de um componente para esta finalidade

Observou que o aspecto mais positivo e enriquecedor do Projeto de

Aprendizagem eacute a utilizaccedilatildeo de perguntas e respostas dentro do conteuacutedo de

aprendizagem pois oferece aos alunos mais uma possibilidade de interaccedilatildeo com

o professor aleacutem da propiciada pelas perguntas contidas no Plano de Aula

Ele natildeo teve problemas com a navegaccedilatildeo nem com o uso de textos e de

imagens nem com a organizaccedilatildeo de seu conteuacutedo em conceitos no Plano de

Aula poreacutem natildeo utilizou a hierarquia de conceitos de niacutevel 3

Abaixo nas Figuras 51 e 52 mostramos algumas das telas produzidas

Figura 51 Apresentaccedilatildeo do Curso de Ineacutercia usando um link externo

93


Figura 52 Motivaccedilatildeo do Curso de Ineacutercia usando um link externo


Tem 28 anos de magisteacuterio conhece a pedagogia de David Ausubel

professora de Portuguecircs Literatura e Informaacutetica aplicada agrave Educaccedilatildeo

(preparaccedilatildeo de professores) e proficiente no uso do computador e da Internet

No primeiro dia foi demonstrado o uso do Projeto de Aprendizagem

como previsto e no segundo dia a professora trouxe os textos que seriam

incluiacutedos um plano de aula descrito no roteiro descrito abaixo

Oficina Reflexotildees sobre a educaccedilatildeo e o uso das tecnologias

1 Apresentaccedilatildeo

Nome

O que faz

Quais suas expectativas

2 Objetivos

Aprofundar o estudo sobre o uso das tecnologias na educaccedilatildeo

Refletir as implicaccedilotildees da comunicaccedilatildeo na praacutetica docente

94


Analisar questotildees relativas aos recursos didaacuteticos

3 Conteuacutedo (textos)

Introduccedilatildeo falar em material didaacutetico falar em educaccedilatildeo

O professor e a questatildeo da educaccedilatildeo

Tecnologia aplicada agrave educaccedilatildeo para quecirc

Por que planejar a praacutetica educativa Que relaccedilotildees existem entre o uso de

materiais didaacuteticos e o planejamento didaacutetico

4 Perguntas

O que vocecirc entende por material didaacutetico

Por que eacute necessaacuterio discutir o contexto educacional na abordagem sobre os

materiais didaacuteticos

Que importacircncia tem o material didaacutetico na praacutetica docente Quais as suas

funccedilotildees

Que implicaccedilotildees a questatildeo da comunicaccedilatildeo pode trazer para a praacutetica do

professor E como se relacionam com os recursos didaacuteticos

Qual a importacircncia que vocecirc atribui ao planejamento em seu cotidiano

escolar


No item 1 Apresentaccedilatildeo a professora gostaria de que os alunos tivessem

um espaccedilo para se apresentarem uns aos outros interativamente e que esses dados

ficassem disponiacuteveis na apresentaccedilatildeo do curso Foi explicado que esta funccedilatildeo natildeo

faz parte da proposta do Projeto de Aprendizagem e sim da plataforma de

gerenciamento do curso Foi reafirmado a ela que o Projeto de Aprendizagem se

limita agrave preparaccedilatildeo de conteuacutedos para e-learning

Ela utilizou todas as possibilidades da interface inserindo e excluindo

dados para testaacute-las Como possui jaacute bastante familiaridade com o uso da

Internet natildeo teve nenhuma dificuldade nas inclusotildees a natildeo ser nas de

familiarizaccedilatildeo com as funcionalidades da ferramenta Tambeacutem natildeo houve

95


dificuldade com a organizaccedilatildeo do conteuacutedo em conceitos apenas foi observada a

natildeo utilizaccedilatildeo de conceitos de niacutevel 3

Quando questionada se o Projeto de Aprendizagem espelha a pedagogia

de David Ausubel ela achou muito forte o termo ldquoespelhardquo e preferiu dizer que o

Projeto de Aprendizagem permite que esta pedagogia seja usada e que isso

depende muito do professor

A possibilidade de visualizaccedilatildeo do conteuacutedo inserido pelo professor nas

telas de inserccedilatildeo surgiu tambeacutem em uma das observaccedilotildees feitas com essa

professora Ela sentia necessidade de ver o trabalho concluiacutedo em cada paacutegina

que preenchia Ela preferiu visualizar a ferramenta com a resoluccedilatildeo de 800 x 600

pixels

A professora tambeacutem apontou para a necessidade de inserccedilatildeo de links

externos e utilizaccedilatildeo de negrito de itaacutelico e de mudanccedila de cor das fontes do

texto dos conteuacutedos Essa solicitaccedilatildeo natildeo foi implementada por questotildees

conceituais uma vez que escolhemos natildeo permitir muitas opccedilotildees objetivando

deixar a interface o mais simples e faacutecil possiacutevel Essas alteraccedilotildees no texto no

entanto natildeo satildeo impossiacuteveis de serem conseguidas pois como todo Browser

interpreta HTML existe a possibilidade da inserccedilatildeo das tags HTML no corpo do

texto dentro das caixas de inserccedilatildeo dos conteuacutedos Para facilitar esse trabalho as

paacuteginas de inserccedilatildeo de conteuacutedo receberam um pequeno glossaacuterio de tags que

pode ser acessado a partir de um botatildeo

O Projeto de Aprendizagem foi aprovado como ferramenta e a professora

afirmou que o usaria na sua praacutetica docente Para responder agrave questatildeo de que esta

formataccedilatildeo de conteuacutedo contribui ou natildeo para melhorar o niacutevel de aprendizagem

ela observou serem necessaacuterios testes a esse respeito Procede a observaccedilatildeo

O aspecto que ela considerou mais positivo foi o Plano de Aula

observando que eacute bem-vinda uma ferramenta de apoio ao professor no

planejamento de suas aulas Tambeacutem elogiou a rapidez com que o Projeto de

Aprendizagem acessa o Banco de Dados

96


A princiacutepio a inserccedilatildeo do conteuacutedo deveria ser concluiacuteda de uma soacute vez

Todavia as observaccedilotildees feitas com a professora mostraram que o acesso agraves telas

de inserccedilatildeo natildeo deveria ser linear Isto foi implementado em seguida

Ela natildeo utilizou nenhuma imagem nos textos que inseriu ndash esta observaccedilatildeo

reitera a proposta de elaborar templates para outros usos (ver trabalhos futuros no

Capiacutetulo VI ndash Conclusatildeo)

Abaixo nas Figuras 53 e 54 mostramos algumas telas produzidas

Figura 53 Apresentaccedilatildeo do Curso ldquoReflexotildees sobre a Educaccedilatildeo e o uso das

Tecnologiasrdquo publicado na Plataforma Interativa para Internet ndash Pii

97


Figura 54 Motivaccedilatildeo do Curso do Curso ldquoReflexotildees sobre a Educaccedilatildeo e o uso

das Tecnologiasrdquo publicado na Plataforma Interativa para Internet ndash Pii

523 Observaccedilotildees realizadas com as cinco professoras de Informaacutetica

Educativa do Nuacutecleo de Tecnologia Educacional-NTE da Escola Estadual

Amaro Cavalcanti no Rio de Janeiro

As professoras do NTE fazem parte do grupo de usuaacuterios que natildeo estatildeo

familiarizados com a pedagogia de David Ausubel Elas conhecem apenas a

organizaccedilatildeo de conceitos em Mapas Conceituais


Cumprida a primeira etapa de demonstraccedilatildeo do sistema tivemos alguns

problemas com o acesso agrave Internet na escola e precisamos adiar a segunda fase

98


por trecircs vezes Observamos que houve interesse pela ferramenta durante a

demonstraccedilatildeo das suas funcionalidades

Houve um bom entendimento da interface Acreditamos que em parte

isso se deve ao fato de que elas satildeo usuaacuterias de computadores e professoras de

informaacutetica educativa Elas consideraram a ferramenta faacutecil de ser usada e

acreditam na possibilidade do seu uso nas escolas puacuteblicas Uma delas aventou a

possibilidade de o Projeto de Aprendizagem ser utilizado para a publicaccedilatildeo de

conteuacutedos de disciplinas em que haja falta de professores como eacute o caso de

Fiacutesica na rede puacuteblica A maioria delas preferiu visualizar a ferramenta com a

resoluccedilatildeo de 800 x 600 pixels

Houve criacuteticas agrave simplicidade do template oferecido e a sugestatildeo dada foi

a da criaccedilatildeo de outros mais ldquocoloridosrdquo segundo elas os alunos natildeo ficariam

motivados com tal simplicidade Respondemos que esta intenccedilatildeo jaacute existe Nesse

primeiro momento o protoacutetipo do Projeto de Aprendizagem soacute apresenta este

modelo de template mas a proposta comporta a criaccedilatildeo de outros modelos de

layout natildeo soacute objetivando a variedade no design como tambeacutem atendendo

outras necessidades dos cursos (ver trabalhos futuros no Capiacutetulo VI ndash

Conclusatildeo) Argumentamos outrossim que a inserccedilatildeo de uma imagem visa

motivar o aluno e ela oferece um pouco desse ldquocoloridordquo

Todas aprovam a ideacuteia de utilizar o Projeto a exceccedilatildeo de uma professora

que teve duacutevidas se o usaria Uma delas natildeo aprovou o uso da metaacutefora das

pastas de arquivo para marcar a hierarquia dos conceitos Aleacutem disso achou

confusa a inserccedilatildeo do tiacutetulo do Plano de Aula Com isso achamos conveniente

mudar a frase do menu dropdown de ldquoTiacutetulo de Plano de Aulardquo para ldquoInsira o

Tiacutetulo do Plano de Aula ao lado gtgtrdquo

Uma das professoras criticou a natildeo vinculaccedilatildeo do Plano de Aula agraves aulas a

serem criadas e sugeriu que cada conceito relacionado no Plano de Aula apareccedila

nas telas de inserccedilatildeo de conteuacutedo Segundo a professora isso agregaria valor ao

Plano de Aula pois na forma em que estaacute concebido o mesmo fica solto e sem

funccedilatildeo A resposta a criacutetica feita fundamenta-se no conceito de flexibilidade que

99


foi adotado na concepccedilatildeo do Projeto de Aprendizagem a funccedilatildeo do Plano de

Aula eacute ajudar o professor a refletir e organizar o conteuacutedo de aprendizagem em

termos de conceitos como sugere Ausubel e natildeo amarraacute-lo



deseja fazer rdquo [Laurel 1999 pxii] Neste capiacutetulo os proacuteprios usuaacuterios

professores nos deram as respostas que se seguem

Nenhum professor observado chegou a usar o niacutevel 3 para os conceitos

Observamos uma preferecircncia pela resoluccedilatildeo de tela que possibilita a

visualizaccedilatildeo maior dos elementos da interface tanto de fontes como de iacutecones

(800 x 600 pixels) Acreditamos que isso se deve a dificuldades na visatildeo por

causa do fator idade uso de monitores de 14 polegadas e pouca vivecircncia de

navegaccedilatildeo

De maneira geral houve parecer favoraacutevel ao uso da ferramenta pois

com ela segundo os professores eacute mais faacutecil criar os conteuacutedos do que fazecirc-lo

em editores de HTML do tipo Dreamweaver

Aleacutem disso foi unacircnime a afirmaccedilatildeo de que o sucesso da aula criada no

Projeto de Aprendizagem depende muito mais do professor do que da interface

proposta Estamos plenamente de acordo

100

Capiacutetulo VI ndash Conclusatildeo


ldquoO designer de sistemas interativos seraacute um superdesigner com as

habilidades de um engenheiro de um artista e de um psicoacutelogordquo [Laurel 1999

pxiii] Reescrevendo esta afirmaccedilatildeo de Laurel [1999] no contexto da Educaccedilatildeo

podemos dizer que um designer de sistemas educacionais interativos deve

possuir as habilidades de um engenheiro de um artista de um psicoacutelogo e de um

pedagogo Foi no papel de artista que iniciamos

Foi uma agradaacutevel surpresa como arquiteta entender por que as metaacuteforas

usadas para se navegar na Internet satildeo metaacuteforas espaciais sites satildeo lugares que

natildeo satildeo lidos satildeo visitados porque paacuteginas virtuais natildeo satildeo apenas espaccedilos onde

a informaccedilatildeo se organiza mas representam espaccedilos em que sensaccedilatildeo de imersatildeo

se daacute Essa sensaccedilatildeo de imersatildeo forma-se atraveacutes da interatividade [Silva 1999]

Igualmente agradaacutevel foi perceber os Ambientes Virtuais de

Aprendizagem como espaccedilosescolas virtuais onde a aprendizagem se daacute

Estaacutevamos entatildeo ldquoprojetandordquo uma interface para um espaccedilo virtual de

aprendizagem Deste espaccedilo virtual de aprendizagem escolhemos a exposiccedilatildeo do

conteuacutedo por observarmos que este elemento ainda estaacute pouco explorado e

demandando modelos Projetamos assim um modelo para a elaboraccedilatildeo de

conteuacutedos e construiacutemos uma ferramenta de autoria nomeando os ambos de


Acreditamos que o Projeto de Aprendizagem do jeito que o concebemos ndash

um modelo e uma ferramenta ndash oferece ao professor a oportunidade de atuar em

um espaccedilo de e-learning da maneira autocircnoma que objetivaacutevamos No dizer de

uma das professoras observadas ldquoeacute mais que uma folha em branco para se

comeccedilarrdquo

101


Durante esta pesquisa tivemos a oportunidade de interagir com teacutecnicos

artistas pedagogos e com uma classe de usuaacuterios finais os professores

Queremos no entanto destacar a entrevista com o professor pintor e

especialista no uso de cores Israel Pedrosa que na oportunidade nos advertiu

que para saber usar bem as cores se precisa educar o olhar ter vivecircncia de

atelier Estendemos esse conselho aos professores afirmando que para se criar

para a web eacute preciso ter vivecircncia neste espaccedilo natildeo se pode projetar para um

espaccedilo que natildeo se conhece e por onde ainda natildeo se caminhou Acreditamos ser

este um primeiro preacute-requisito para o professor que deseja participar de alguma

forma da educaccedilatildeo a distacircncia em meio eletrocircnico

Este trabalho poreacutem de forma alguma esgota ou pretendeu esgotar as

investigaccedilotildees em relaccedilatildeo a um modelo para conteuacutedos de e-learning Com o

Projeto de Aprendizagem pretendemos ainda

Dar continuidade agraves investigaccedilotildees para validaccedilatildeo e aperfeiccediloamento

das interfaces do Projeto de Aprendizagem junto aos professores

Observar a utilizaccedilatildeo das aulas criadas pelos professores junto aos

alunos para responder agrave segunda questatildeo da preacute-validaccedilatildeo (Subseccedilatildeo 51 do

Capiacutetulo V Preacute-Validaccedilatildeo) Os alunos aleacutem de se sentirem motivados

conseguem ter um melhor desempenho de aprendizagem quando interagem com

conteuacutedos da mateacuteria organizados pelo seu professor usando o Projeto de

Aprendizagem

Pesquisar outros estilos de layout que explorarem a particularidade de

cada aacuterea de conhecimento como por exemplo o uso de mapas em Geografia e

Histoacuteria textos em Portuguecircs uso mais abundante de imagens em Histoacuteria da

Arte etc

Explorar mais a interatividade e o hipertexto nos templates

Fazer um experimento com professores sem informar o conceito

pedagoacutegico utilizado e observar se a camada pedagoacutegica por si mesma induz agrave

elaboraccedilatildeo de conteuacutedos potencialmente significativos (sugestatildeo de um dos

professores que participou do estudo de caso)

102


Introduzir outros conceitos pedagoacutegicos no modelo como o de

Vygostky [Vygostky 1978] para uma aprendizagem colaborativa ou com base

na teoria do ensino individualizado de Keller [Keller 1968] ou ainda ldquoLearning

Styles1rdquo [Felder 2003]

No iniacutecio desta pesquisa fomos interpelados por esta indagaccedilatildeo Como

poderiacuteamos garantir que o modelo que estaacutevamos construindo produziria uma

aula ou um curso que realmente refletisse a pedagogia de David Ausubel

(Aprendizagem Significativa) que estaacutevamos escolhecircramos

Mais que oferecer uma possibilidade de uso ou de controlar um processo

pensamos em conduzir e dar suporte ao professor Com estes objetivos criamos

um modelo utilizando a imagem de trecircs camadas de conceitos integradas e

interconectadas Buscamos expressar em todas as interfaces e em todas as accedilotildees

do Projeto de Aprendizagem (do Plano de Aula da inserccedilatildeo dos conteuacutedos e da

AulaCurso finalizada) os conceitos escolhidos

Agora que terminamos podemos responder afirmando que natildeo podemos

nem desejamos garantir um produto Queremos sim com o modelo e a

ferramenta de autoria que desenvolvemos contribuir para que o professor possa

atraveacutes deste exerciacutecio apropriar-se da linguagem do e-learning e construir ele

mesmo seus proacuteprios modelos

1 Mais informaccedilotildees wwwuhiacukils Acessado em 2003

103

Referecircncias Bibliograacuteficas


ALBERS Josef La Interaccioacuten del Color Madri Alianza Forma Alianza

Editorial 1985 p115

ALMEIDA C Vieira M LucianoN Ambiente Virtual de Aprendizagem uma

proposta para autonomia e cooperaccedilatildeo na disciplina de informaacutetica Artigo

completo In Simpoacutesio Brasileiro de Informaacutetica Aplicada agrave Educaccedilatildeo - SBIE 2001

Rio de Janeiro

ALVES J R M Educaccedilatildeo a Distacircncia e as novas tecnologias de informaccedilatildeo e

aprendizagem Disponiacutevel em httpwwwengenheiro2001orgbrprogramas

980201a1htm Acessado em 2001

ANDRADE Leila Cristina Vasconcelos GD-IBIS Grupo de Discussatildeo para

Web no Contexto de Educaccedilatildeo a Distacircncia Dissertaccedilatildeo - Mestrado Nuacutecleo de

Computaccedilatildeo Eletrocircnica Instituto de Matemaacutetica Universidade Federal do Rio

Janeiro Rio de Janeiro 2001 p 114

ARNHEIM Rudolf Arte e Percepccedilatildeo Visual Satildeo Paulo Visual Editora 1954

p503

AUSUBEL D P NOVAK J D HANESIAN H Psicologia Educacional Rio

de Janeiro Editora Interamericana 1980 p625

BLACK R Websites que funcionam Satildeo Paulo Quark Editora 1997 p237

104


BORGES Roberto C M Consideraccedilotildees sobre o uso de cores em interfaces www

In III WORKSHOP SOBRE FATORES HUMANOS EM SISTEMAS

COMPUTACIONAIS Porto Alegre Anais Porto Alegre Impa Artes Graacuteficas

Ltda 2000 p43-54

ELIA M F SAMPAIO F F Plataforma Interativa para Internet (Pii) Uma

Proposta de Pesquisa-Accedilatildeo a Distacircncia para Professores Artigo completo In

SIMPOacuteSIO BRASILEIRO DE INFORMAacuteTICA APLICADA Agrave EDUCACcedilAtildeO -

SBIE 2001 Vitoacuteria Brasil 2001

ERICKSON Thomas D Working with Interface Metaphors In LAUREL Brenda

The Art of Human Computer Interface Design USA Addison-Wesley

Publishing Company USA 1990 p65-71

FELDER Richard M SILVERMAN Linda K Learning Styles Disponiacutevel em

wwwuhiacukils Acessado em 2003

FLEMING Malcom LEVIE W H Instructional Message Design Englewood

Cliffs Educational Technology Publications 1993 p331

GEROSA M Aureacutelio LUCENA C J P FUKS H Tecnologias de Informaccedilatildeo

Aplicadas agrave Educaccedilatildeo ndash construindo uma rede de aprendizagem usando o

ambiente AulaNet Laboratoacuterio de Engenharia de Software (LES) ndash Departamento

de Informaacutetica Pontifiacutecia Universidade Catoacutelica Rio de Janeiro 2000

HULBURT Allen Layout do design da paacutegina impressa Satildeo Paulo Editora

Nobel 1986 p159

105


JARDIN Joseacute Curso de Teacutecnicas de Editoraccedilatildeo Eletrocircnica Rio de Janeiro

MULTIMODUS Soluccedilatildeo em Editoraccedilatildeo EletrocircnicaApostila 1996 p122

KANDINSKY Wassily Do Espiritual na Arte Portugal Publicaccedilotildees Dom

Quixote 1954 p130

KELLER F Good-Bye Teacher USA Journal of Applied Behaviour Analysis

No 1 1968 p 78-89

KELLER J BURKMAN E Chapter1 Motivation Principles In FLEMING M

and LEVIE WH Instructional Message Design ndash Principles from the

Behavioral and Cognitive Scienses New Jersey Educational Technology

Publications Englewood Cliffs p3-49

KILIAN Crawford Writing for the web USACanadaacute International Self-Counsel

Press Ltd1999 p139

LAUREL Brenda Introduction In LAUREL Brenda The Art of Human

Computer Interface Design USA Addison-Wesley Publishing Company 1990

pxi-xvi

LUCENA JP FUKS H MILIDIU R etal AulaNet Ajudando Professores a

Fazerem seu Dever de Casa Anais do XIX Congresso Nacional da Sociedade

Brasileira de Computaccedilatildeo PUC-Rio 1999 volI p106-117

LEacuteVY Pierre Cibercultura Satildeo Paulo Editora 34 2000 p260

MISANCHUK Earl R Preparing Instructional Text - Document Design Using

Desktop Publishing New Jersey Educational Technology Publications 1992

p307

106


MOREIRA Marco Antonio Porto Alegre Uma Abordagem Cognitivista do

Ensino de Fiacutesica Editora da Universidade 1983 p183

MOUNTFORD S Joy Tools and Techniques for Creative Design In LAUREL

Brenda The Art of Human Computer Interface Design USA Addison-Wesley

Publishing Company 1990 p18-30

NIELSEN Jakob Projetando Websites Rio de Janeiro Editora Campus 2000

p416

NISKIER Arnaldo Educaccedilatildeo a Distacircncia ndash A Tecnologia da Esperanccedila Satildeo

Paulo Ediccedilotildees Loyola1999 p414

NOVAK Joseph D The Theory Underlying Concept Maps and How to

Construct Them Cornell University Disponiacutevel em httpwwwcoginstuwfedu

usersacanas Acessado em 2001

Novo Aureacutelio Seacuteculo XXI o dicionaacuterio da Liacutengua Portuguesa Rio de Janeiro

Nova Fronteira 2000

OLIVEIRA Joatildeo B A MAGALHAtildeES Maria ABT Relatoacuterio Final do Projeto

de Poacutes-Graduaccedilatildeo Tutorial a Distacircncia ndash POSGRAD Rio de Janeiro Convecircnio

CAPES - ABR 1985

OREN T Designing a New Medium In LAUREL Brenda The Art of Human


p467-479

PEDROSA Israel Da cor a cor inexistente Rio de Janeiro Leacuteo Christiano

Editorial Ltda 1977 p219

107


PONTIFIacuteCIA UNIVERSIDADE CATOacuteLICA ndash RIO DE JANEIRO Folheto

publicitaacuterio distribuiacutedo pela Pontifiacutecia Universidade Catoacutelica do Rio de Janeiro Rio

de Janeiro 2003

SALOMON Gitta New Uses for Color In LAUREL Brenda The Art of Human


p269-278

SANTOS Neide Interfaces de Ambientes Educacionais Diretrizes de Projeto

Disponiacutevel em httpwwwimeuerjbrprofessoresneidenewInterfaceshtm

Acessado em 2003

SILVA Adriana Araujo de Souza Design como Interface da

Contemporaneidade Rio de Janeiro UFRJDissertaccedilatildeo - Mestrado Escola de

Comunicaccedilatildeo da Universidade Federal do Rio Janeiro 1999 p168

TAUSZ Bruno A Linguagem das Cores Rio de Janeiro Ediccedilotildees MG Ltda

Centro de Pesquisa e Arte 1976 p

THAGARD Paul Mind ndash Introdution to Cognitive Science London

Cambridge Massachusetts Bradford Book The MIT Press1998 p189

TORGNAZZINI Bruce AskTog ndash Pratical real-world design Disponiacutevel em

httpwwwasktogcom Acessado em 2003

VYGOTSKY LS et al Mind in Society the development of

higherpsychological processes Cambridge MA Harvard University Press 1978

Disponiacutevel em httpfacultywebcortlandeduandersmdVYGVYGhtml Acessado

em 2001

WILLIAMS Robin Design para quem natildeo eacute designer Satildeo Paulo Cllis Editora

1995 p144

109

Anexo

Anexo

Anexo I ndash Sensaccedilotildees provocadas pelas cores segundo as visotildees de Kandinsk [1954] e Pedrosa [1977]

Kandinsk Pedrosa

Amarelo O amarelo possui o movimento de prender o olhare de saltar todos os limites expande forccedila agrave suavolta atormenta o homem excita-o Com tomesverdeado expressa um caraacuteter doentioComparado com os estados de alma poderia ser arepresentaccedilatildeo cromaacutetica da loucura natildeo damelancolia mas de um acesso de raiva de deliacuterioRepresenta o calor a energia e a claridade

O amarelo parece sempre maior do que eacute devido a suacaracteriacutestica expansiva Entre os cristatildeos eacute a cor daeternidade e da feacute Eacute o siacutembolo do desespero por ser intensoviolento e agudo ateacute a estridecircncias Quando misturado ao azulesfria-se e produz o verde

110

Anexo

Azul O azul eacute a cor tipicamente celeste O azulprofundo projeta o homem para o infinitodesperta-lhe o desejo de pureza e uma sede desobrenatural Quando desliza para o preto tinge-se de tristeza Um quadro em tons de azul possuialgo de frio

O azul eacute a mais profunda das cores eacute a proacutepria cor do infinitoe dos misteacuterios da alma Tambeacutem estaacute ligado agrave ideacuteia de purezaPela sua ideacuteia de superioridade sugerida em comparaccedilatildeo comoutras cores o azul foi escolhido como a cor da nobrezaoriginando a expressatildeo designativa ldquosangue azulrdquo Umambiente azul acalma e tranquumliliza

Verde O verde absoluto eacute a cor mais tranquumlila queexiste Natildeo possui qualquer movimento natildeoconteacutem alegria tristeza ou paixatildeo Para os tonsclaros predomina a indiferenccedila para os escuros orepouso Adicionando-lhe o amarelo anima-seganha juventude e alegria transmite uma forccedilaativa Predominando o azul torna-se seacuterio epensativo

Eacute a cor da esperanccedila da forccedila da longevidade assim como daimortalidade simbolizada por ramos verdes Nas palavras deVan Gogh ldquoEu procurei exprimir com o vermelho e o verde asterriacuteveis paixotildees humanasrdquo

Branco O branco eacute a natildeo cor representa a alegria e apureza imaculada Em nossa alma atua como osilecircncio absoluto Eacute um nada pleno de alegriajuvenil um nada anterior ao nascimento aqualquer comeccedilo Representa a alegria e a purezaimaculada

Ele representa morte e nascimento ou ressurreiccedilatildeo daiacute a ideacuteiaprimitiva do branco como cor da morte e do luto Neste sentidoeacute ainda empregado em todo o Oriente e durante muito temposignificou o luto na Europa o luto negro soacute tomou maiorpopularidade em Portugal no seacuteculo XVI O branco eacute a cor dapureza campo que natildeo originou ainda uma cor definida que eacutecomo uma promessa a expectativa de um fato a sedesenvolver O branco em nosso seacuteculo representa a paz

111

Anexo

Preto Qualquer outra cor mesmo as mais clarasadquirem quando sobre fundo negro uma novaforccedila e vivacidade O negro representa a tristezamais profunda eacute o siacutembolo da morte Um ldquonadardquosem possibilidades morto depois de o sol morrercomo um silecircncio eterno sem esperanccedila defuturo

O preto costuma ser empregado como elemento de contrastepara ressaltar a qualidade dos matizes (vermelho amareloazul violeta etc) que quando contornadas ganhamluminosidade e vibraccedilatildeo Evocando o caos o nada o ceacuteunoturno as trevas terrestres o mal a anguacutestia a tristeza oinconsciente e a morte o preto eacute o siacutembolo maior da frustraccedilatildeoe da impossibilidade Representa renuacutencia agrave vaidade destemundo originando os mantos negros proclamaccedilatildeo da feacute nocristianismo

Cinza O cinzento eacute o equiliacutebrio do branco e do preto Eacuteimoacutevel diferente do verde o cinzento eacuteimobilidade sem esperanccedila

O cinza eacute uma cor neutra por excelecircncia eacute o equiliacutebriomecacircnico do branco e do preto

Vermelho O vermelho eacute uma cor ilimitada e essencialmentequente age interiormente como uma cortransbordante de um vida fogosa e agitada Overmelho claro e quente evoca forccedila energiadecisatildeo alegria e triunfo O vermelho meacutedioperpetua certos estados de alma intensos comouma paixatildeo incandescente e regular

O vermelho possui elevado grau de cromaticidade e eacute a maissaturada das cores decorrendo daiacute sua maior visibilidade emcomparaccedilatildeo com as demais Eacute a cor que mais se destacavisualmente e a mais rapidamente distinguida pelos olhos Cordo fogo e do sangue o vermelho eacute a mais importante das corespara muitos povos por ser a mais intimamente ligada aoprinciacutepio da vida Em todos os paiacuteses do mundo o vermelhosignifica perigo e sinal fechado para o tracircnsitoQuandomisturado ao branco produz o rosa cor eminentemente juvenil

Laranja O laranja eacute o vermelho intensificado peloamarelo transformando-o em irradiaccedilotildees emexpansatildeo

O amarelo quando misturado ao vermelho exalta-seproduzindo o laranja

112

Anexo

Marromocre eterras

Os tons castanhos satildeo cores duras e estagnantes Significa penitecircncia sofrimento afliccedilatildeo e humildadePodemos observar esse uso na representaccedilatildeo dos trajes de SatildeoFrancisco de Assis

Violeta O violeta eacute vermelho arrefecido no sentido fiacutesicoe psiacutequico do termo Existe nele algo de doentiode extinto de triste

O violeta eacute a cor da temperanccedila Reuacutene as qualidades das coresque lhe datildeo origem vermelho e azul simbolizando a lucidez aaccedilatildeo refletida o equiliacutebrio entre a terra e o ceacuteu os sentidos e oespiacuterito a paixatildeo e a inteligecircncia o amor e a sabedoria Emtons escuros o violeta estaacute ligado agrave ideacuteia de saudade ciuacutemeanguacutestia e melancolia tornando-se deprimente Em tons claroseacute alegre e aproxima-se das propriedades do rosa

Nota O branco o preto e o cinza satildeo cores ditas neutras porque se harmonizam com quaisquer outras

113

Anexo

iii

NOBRE Vacircnia MarinsProjeto de Aprendizagem um Modelo de Interface Graacutefico-Pedagoacutegicade Conteuacutedos para e-Learning Vacircnia Marins Nobre Rio de JaneiroUFRJIMNCE 2003xiv111 pilDissertaccedilatildeo (Mestrado) ndash Universidade Federal do Rio de JaneiroIMNCE 2003 Orientadores Claacuteudia Lage Rebello da Motta e Marcosda Fonseca Elia1 Interface 2 Educaccedilatildeo a Distacircncia 3 e-LearningI Projeto de Aprendizagem um Modelo de Interface Graacutefico-Pedagoacutegica de Conteuacutedos para e-LearningII Dissertaccedilatildeo (Mestrado) UFRJIMNCE

iv



v

Agradecimentos


vi














professores







vii













teachers






viii

Lista de Siglas



Janeiro









WWW World Wide Web


ix



x


xi

Lista de Tabelas






xii

Sumaacuterio









21 e-Learning6




xiii












44 Modelagem 69











Anexo 109

xiv

1

























2







sociedade






















Internet

3






eletrocircnica
























4
























Moreira






5




professorado





obtidos



6








21 e-Learning






Sampaio 2001]




distacircncias









7





serem exploradas


















Niskier1999 p50]




8
























9



























10




cadastroldquo 9



222 AulaNet









11












12


223 Quantum










publicado


13













Chat



225 TelEduc













14




























15







16

























17






























18


















ensino presencial



19



dadas a seguir




saber























20




necessidades














[Ausubel 1980 p312]









21



por diante





























22













com facilidade



AusubelMoreira



AusubelMoreira









23

























hierarquicamente

24



















25

















hierarquizada









26




















ser proposto




27



























destina



28






























29





aprendizagem























30












Preacutevios







31





























32


























33




























34



interatividade





35

















36

















37




















38








paacutegina










desmotivante





de fontes apenas




39

















40



palavras piscando




do professor










41

















paacuteginas







encontra






42



interface




43























44















45
















46






47


























de fontes menores




48






























49






UNIFORME








50




























51





























52




3215 Cor e Contexto













53
















54





























55










p358]


















56













percepccedilatildeo









57



mantidas













58

















por diante










3222 Iacutecones



59







pelos usuaacuterios

3223 Homepage




Splash na Homepage

















60































61































62






descartados














humano












63


















p 143]











lacuna)

64



para outra)


























65












ela
















66



























de autoria

67





modelo proposto




















alteraacute-lo

68





























69





Ausubel




44 Modelagem












acessado









70








(marron)

71





















72



























[Moreira 1983]



conteuacutedo) e

73









Interface















Padrotildees]






74















afastamento]
















75































76









77










78






79









80




apenas um estilo)





do Plano de Aula



81














82







Conteuacutedo]



83







descritivo



84







85











86








474 Tutorial





87








88

























estruturado

89






Aprendizagem



Aprendizagem




inserido












proposta


docente


de aprendizagem




aprendizagem




90



Aprendizagem



Aprendizagem








de Aprendizagem




















91













criacuteticas













aprendizagem





92
















93












Nome

O que faz


2 Objetivos



94









4 Perguntas





funccedilotildees




escolar












95












pixels



















96











97













98
































99














navegaccedilatildeo







100


























comeccedilarrdquo

101






















Aprendizagem




Arte etc






102






















103




Editorial 1985 p115




Rio de Janeiro









p503




104





Ltda 2000 p43-54

















Nobel 1986 p159

105





Quixote 1954 p130


No 1 1968 p 78-89






Press Ltd1999 p139



pxi-xvi







p307

106








p416







Nova Fronteira 2000



CAPES - ABR 1985



p467-479



107




de Janeiro 2003



p269-278



Acessado em 2003













em 2001


1995 p144

109

Anexo

Anexo


Kandinsk Pedrosa



110

Anexo







111

Anexo









112

Anexo

Marromocre eterras





113

Anexo

iv



v

Agradecimentos


vi














professores







vii













teachers






viii

Lista de Siglas



Janeiro









WWW World Wide Web


ix



x


xi

Lista de Tabelas






xii

Sumaacuterio









21 e-Learning6




xiii












44 Modelagem 69











Anexo 109

xiv

1

























2







sociedade






















Internet

3






eletrocircnica
























4
























Moreira






5




professorado





obtidos



6








21 e-Learning






Sampaio 2001]




distacircncias









7





serem exploradas


















Niskier1999 p50]




8
























9



























10




cadastroldquo 9



222 AulaNet









11












12


223 Quantum










publicado


13













Chat



225 TelEduc













14




























15







16

























17






























18


















ensino presencial



19



dadas a seguir




saber























20




necessidades














[Ausubel 1980 p312]









21



por diante





























22













com facilidade



AusubelMoreira



AusubelMoreira









23

























hierarquicamente

24



















25

















hierarquizada









26




















ser proposto




27



























destina



28






























29





aprendizagem























30












Preacutevios







31





























32


























33




























34



interatividade





35

















36

















37




















38








paacutegina










desmotivante





de fontes apenas




39

















40



palavras piscando




do professor










41

















paacuteginas







encontra






42



interface




43























44















45
















46






47


























de fontes menores




48






























49






UNIFORME








50




























51





























52




3215 Cor e Contexto













53
















54





























55










p358]


















56













percepccedilatildeo









57



mantidas













58

















por diante










3222 Iacutecones



59







pelos usuaacuterios

3223 Homepage




Splash na Homepage

















60































61































62






descartados














humano












63


















p 143]











lacuna)

64



para outra)


























65












ela
















66



























de autoria

67





modelo proposto




















alteraacute-lo

68





























69





Ausubel




44 Modelagem












acessado









70








(marron)

71





















72



























[Moreira 1983]



conteuacutedo) e

73









Interface















Padrotildees]






74















afastamento]
















75































76









77










78






79









80




apenas um estilo)





do Plano de Aula



81














82







Conteuacutedo]



83







descritivo



84







85











86








474 Tutorial





87








88

























estruturado

89






Aprendizagem



Aprendizagem




inserido












proposta


docente


de aprendizagem




aprendizagem




90



Aprendizagem



Aprendizagem








de Aprendizagem




















91













criacuteticas













aprendizagem





92
















93












Nome

O que faz


2 Objetivos



94









4 Perguntas





funccedilotildees




escolar












95












pixels



















96











97













98
































99














navegaccedilatildeo







100


























comeccedilarrdquo

101






















Aprendizagem




Arte etc






102






















103




Editorial 1985 p115




Rio de Janeiro









p503




104





Ltda 2000 p43-54

















Nobel 1986 p159

105





Quixote 1954 p130


No 1 1968 p 78-89






Press Ltd1999 p139



pxi-xvi







p307

106








p416







Nova Fronteira 2000



CAPES - ABR 1985



p467-479



107




de Janeiro 2003



p269-278



Acessado em 2003













em 2001


1995 p144

109

Anexo

Anexo


Kandinsk Pedrosa



110

Anexo







111

Anexo









112

Anexo

Marromocre eterras





113

Anexo

v

Agradecimentos


vi














professores







vii













teachers






viii

Lista de Siglas



Janeiro









WWW World Wide Web


ix



x


xi

Lista de Tabelas






xii

Sumaacuterio









21 e-Learning6




xiii












44 Modelagem 69











Anexo 109

xiv

1

























2







sociedade






















Internet

3






eletrocircnica
























4
























Moreira






5




professorado





obtidos



6








21 e-Learning






Sampaio 2001]




distacircncias









7





serem exploradas


















Niskier1999 p50]




8
























9



























10




cadastroldquo 9



222 AulaNet









11












12


223 Quantum










publicado


13













Chat



225 TelEduc













14




























15







16

























17






























18


















ensino presencial



19



dadas a seguir




saber























20




necessidades














[Ausubel 1980 p312]









21



por diante





























22













com facilidade



AusubelMoreira



AusubelMoreira









23

























hierarquicamente

24



















25

















hierarquizada









26




















ser proposto




27



























destina



28






























29





aprendizagem























30












Preacutevios







31





























32


























33




























34



interatividade





35

















36

















37




















38








paacutegina










desmotivante





de fontes apenas




39

















40



palavras piscando




do professor










41

















paacuteginas







encontra






42



interface




43























44















45
















46






47


























de fontes menores




48






























49






UNIFORME








50




























51





























52




3215 Cor e Contexto













53
















54





























55










p358]


















56













percepccedilatildeo









57



mantidas













58

















por diante










3222 Iacutecones



59







pelos usuaacuterios

3223 Homepage




Splash na Homepage

















60































61































62






descartados














humano












63


















p 143]











lacuna)

64



para outra)


























65












ela
















66



























de autoria

67





modelo proposto




















alteraacute-lo

68





























69





Ausubel




44 Modelagem












acessado









70








(marron)

71





















72



























[Moreira 1983]



conteuacutedo) e

73









Interface















Padrotildees]






74















afastamento]
















75































76









77










78






79









80




apenas um estilo)





do Plano de Aula



81














82







Conteuacutedo]



83







descritivo



84







85











86








474 Tutorial





87








88

























estruturado

89






Aprendizagem



Aprendizagem




inserido












proposta


docente


de aprendizagem




aprendizagem




90



Aprendizagem



Aprendizagem








de Aprendizagem




















91













criacuteticas













aprendizagem





92
















93












Nome

O que faz


2 Objetivos



94









4 Perguntas





funccedilotildees




escolar












95












pixels



















96











97













98
































99














navegaccedilatildeo







100


























comeccedilarrdquo

101






















Aprendizagem




Arte etc






102






















103




Editorial 1985 p115




Rio de Janeiro









p503




104





Ltda 2000 p43-54

















Nobel 1986 p159

105





Quixote 1954 p130


No 1 1968 p 78-89






Press Ltd1999 p139



pxi-xvi







p307

106








p416







Nova Fronteira 2000



CAPES - ABR 1985



p467-479



107




de Janeiro 2003



p269-278



Acessado em 2003













em 2001


1995 p144

109

Anexo

Anexo


Kandinsk Pedrosa



110

Anexo







111

Anexo









112

Anexo

Marromocre eterras





113

Anexo

vi














professores







vii













teachers






viii

Lista de Siglas



Janeiro









WWW World Wide Web


ix



x


xi

Lista de Tabelas






xii

Sumaacuterio









21 e-Learning6




xiii












44 Modelagem 69











Anexo 109

xiv

1

























2







sociedade






















Internet

3






eletrocircnica
























4
























Moreira






5




professorado





obtidos



6








21 e-Learning






Sampaio 2001]




distacircncias









7





serem exploradas


















Niskier1999 p50]




8
























9



























10




cadastroldquo 9



222 AulaNet









11












12


223 Quantum










publicado


13













Chat



225 TelEduc













14




























15







16

























17






























18


















ensino presencial



19



dadas a seguir




saber























20




necessidades














[Ausubel 1980 p312]









21



por diante





























22













com facilidade



AusubelMoreira



AusubelMoreira









23

























hierarquicamente

24



















25

















hierarquizada









26




















ser proposto




27



























destina



28






























29





aprendizagem























30












Preacutevios







31





























32


























33




























34



interatividade





35

















36

















37




















38








paacutegina










desmotivante





de fontes apenas




39

















40



palavras piscando




do professor










41

















paacuteginas







encontra






42



interface




43























44















45
















46






47


























de fontes menores




48






























49






UNIFORME








50




























51





























52




3215 Cor e Contexto













53
















54





























55










p358]


















56













percepccedilatildeo









57



mantidas













58

















por diante










3222 Iacutecones



59







pelos usuaacuterios

3223 Homepage




Splash na Homepage

















60































61































62






descartados














humano












63


















p 143]











lacuna)

64



para outra)


























65












ela
















66



























de autoria

67





modelo proposto




















alteraacute-lo

68





























69





Ausubel




44 Modelagem












acessado









70








(marron)

71





















72



























[Moreira 1983]



conteuacutedo) e

73









Interface















Padrotildees]






74















afastamento]
















75































76









77










78






79









80




apenas um estilo)





do Plano de Aula



81














82







Conteuacutedo]



83







descritivo



84







85











86








474 Tutorial





87








88

























estruturado

89






Aprendizagem



Aprendizagem




inserido












proposta


docente


de aprendizagem




aprendizagem




90



Aprendizagem



Aprendizagem








de Aprendizagem




















91













criacuteticas













aprendizagem





92
















93












Nome

O que faz


2 Objetivos



94









4 Perguntas





funccedilotildees




escolar












95












pixels



















96











97













98
































99














navegaccedilatildeo







100


























comeccedilarrdquo

101






















Aprendizagem




Arte etc






102






















103




Editorial 1985 p115




Rio de Janeiro









p503




104





Ltda 2000 p43-54

















Nobel 1986 p159

105





Quixote 1954 p130


No 1 1968 p 78-89






Press Ltd1999 p139



pxi-xvi







p307

106








p416







Nova Fronteira 2000



CAPES - ABR 1985



p467-479



107




de Janeiro 2003



p269-278



Acessado em 2003













em 2001


1995 p144

109

Anexo

Anexo


Kandinsk Pedrosa



110

Anexo







111

Anexo









112

Anexo

Marromocre eterras





113

Anexo

vii













teachers






viii

Lista de Siglas



Janeiro









WWW World Wide Web


ix



x


xi

Lista de Tabelas






xii

Sumaacuterio









21 e-Learning6




xiii












44 Modelagem 69











Anexo 109

xiv

1

























2







sociedade






















Internet

3






eletrocircnica
























4
























Moreira






5




professorado





obtidos



6








21 e-Learning






Sampaio 2001]




distacircncias









7





serem exploradas


















Niskier1999 p50]




8
























9



























10




cadastroldquo 9



222 AulaNet









11












12


223 Quantum










publicado


13













Chat



225 TelEduc













14




























15







16

























17






























18


















ensino presencial



19



dadas a seguir




saber























20




necessidades














[Ausubel 1980 p312]









21



por diante





























22













com facilidade



AusubelMoreira



AusubelMoreira









23

























hierarquicamente

24



















25

















hierarquizada









26




















ser proposto




27



























destina



28






























29





aprendizagem























30












Preacutevios







31





























32


























33




























34



interatividade





35

















36

















37




















38








paacutegina










desmotivante





de fontes apenas




39

















40



palavras piscando




do professor










41

















paacuteginas







encontra






42



interface




43























44















45
















46






47


























de fontes menores




48






























49






UNIFORME








50




























51





























52




3215 Cor e Contexto













53
















54





























55










p358]


















56













percepccedilatildeo









57



mantidas













58

















por diante










3222 Iacutecones



59







pelos usuaacuterios

3223 Homepage




Splash na Homepage

















60































61































62






descartados














humano












63


















p 143]











lacuna)

64



para outra)


























65












ela
















66



























de autoria

67





modelo proposto




















alteraacute-lo

68





























69





Ausubel




44 Modelagem












acessado









70








(marron)

71





















72



























[Moreira 1983]



conteuacutedo) e

73









Interface















Padrotildees]






74















afastamento]
















75































76









77










78






79









80




apenas um estilo)





do Plano de Aula



81














82







Conteuacutedo]



83







descritivo



84







85











86








474 Tutorial





87








88

























estruturado

89






Aprendizagem



Aprendizagem




inserido












proposta


docente


de aprendizagem




aprendizagem




90



Aprendizagem



Aprendizagem








de Aprendizagem




















91













criacuteticas













aprendizagem





92
















93












Nome

O que faz


2 Objetivos



94









4 Perguntas





funccedilotildees




escolar












95












pixels



















96











97













98
































99














navegaccedilatildeo







100


























comeccedilarrdquo

101






















Aprendizagem




Arte etc






102






















103




Editorial 1985 p115




Rio de Janeiro









p503




104





Ltda 2000 p43-54

















Nobel 1986 p159

105





Quixote 1954 p130


No 1 1968 p 78-89






Press Ltd1999 p139



pxi-xvi







p307

106








p416







Nova Fronteira 2000



CAPES - ABR 1985



p467-479



107




de Janeiro 2003



p269-278



Acessado em 2003













em 2001


1995 p144

109

Anexo

Anexo


Kandinsk Pedrosa



110

Anexo







111

Anexo









112

Anexo

Marromocre eterras





113

Anexo

viii

Lista de Siglas



Janeiro









WWW World Wide Web


ix



x


xi

Lista de Tabelas






xii

Sumaacuterio









21 e-Learning6




xiii












44 Modelagem 69











Anexo 109

xiv

1

























2







sociedade






















Internet

3






eletrocircnica
























4
























Moreira






5




professorado





obtidos



6








21 e-Learning






Sampaio 2001]




distacircncias









7





serem exploradas


















Niskier1999 p50]




8
























9



























10




cadastroldquo 9



222 AulaNet









11












12


223 Quantum










publicado


13













Chat



225 TelEduc













14




























15







16

























17






























18


















ensino presencial



19



dadas a seguir




saber























20




necessidades














[Ausubel 1980 p312]









21



por diante





























22













com facilidade



AusubelMoreira



AusubelMoreira









23

























hierarquicamente

24



















25

















hierarquizada









26




















ser proposto




27



























destina



28






























29





aprendizagem























30












Preacutevios







31





























32


























33




























34



interatividade





35

















36

















37




















38








paacutegina










desmotivante





de fontes apenas




39

















40



palavras piscando




do professor










41

















paacuteginas







encontra






42



interface




43























44















45
















46






47


























de fontes menores




48






























49






UNIFORME








50




























51





























52




3215 Cor e Contexto













53
















54





























55










p358]


















56













percepccedilatildeo









57



mantidas













58

















por diante










3222 Iacutecones



59







pelos usuaacuterios

3223 Homepage




Splash na Homepage

















60































61































62






descartados














humano












63


















p 143]











lacuna)

64



para outra)


























65












ela
















66



























de autoria

67





modelo proposto




















alteraacute-lo

68





























69





Ausubel




44 Modelagem












acessado









70








(marron)

71





















72



























[Moreira 1983]



conteuacutedo) e

73









Interface















Padrotildees]






74















afastamento]
















75































76









77










78






79









80




apenas um estilo)





do Plano de Aula



81














82







Conteuacutedo]



83







descritivo



84







85











86








474 Tutorial





87








88

























estruturado

89






Aprendizagem



Aprendizagem




inserido












proposta


docente


de aprendizagem




aprendizagem




90



Aprendizagem



Aprendizagem








de Aprendizagem




















91













criacuteticas













aprendizagem





92
















93












Nome

O que faz


2 Objetivos



94









4 Perguntas





funccedilotildees




escolar












95












pixels



















96











97













98
































99














navegaccedilatildeo







100


























comeccedilarrdquo

101






















Aprendizagem




Arte etc






102






















103




Editorial 1985 p115




Rio de Janeiro









p503




104





Ltda 2000 p43-54

















Nobel 1986 p159

105





Quixote 1954 p130


No 1 1968 p 78-89






Press Ltd1999 p139



pxi-xvi







p307

106








p416







Nova Fronteira 2000



CAPES - ABR 1985



p467-479



107




de Janeiro 2003



p269-278



Acessado em 2003













em 2001


1995 p144

109

Anexo

Anexo


Kandinsk Pedrosa



110

Anexo







111

Anexo









112

Anexo

Marromocre eterras





113

Anexo

ix



x


xi

Lista de Tabelas






xii

Sumaacuterio









21 e-Learning6




xiii












44 Modelagem 69











Anexo 109

xiv

1

























2







sociedade






















Internet

3






eletrocircnica
























4
























Moreira






5




professorado





obtidos



6








21 e-Learning






Sampaio 2001]




distacircncias









7





serem exploradas


















Niskier1999 p50]




8
























9



























10




cadastroldquo 9



222 AulaNet









11












12


223 Quantum










publicado


13













Chat



225 TelEduc













14




























15







16

























17






























18


















ensino presencial



19



dadas a seguir




saber























20




necessidades














[Ausubel 1980 p312]









21



por diante





























22













com facilidade



AusubelMoreira



AusubelMoreira









23

























hierarquicamente

24



















25

















hierarquizada









26




















ser proposto




27



























destina



28






























29





aprendizagem























30












Preacutevios







31





























32


























33




























34



interatividade





35

















36

















37




















38








paacutegina










desmotivante





de fontes apenas




39

















40



palavras piscando




do professor










41

















paacuteginas







encontra






42



interface




43























44















45
















46






47


























de fontes menores




48






























49






UNIFORME








50




























51





























52




3215 Cor e Contexto













53
















54





























55










p358]


















56













percepccedilatildeo









57



mantidas













58

















por diante










3222 Iacutecones



59







pelos usuaacuterios

3223 Homepage




Splash na Homepage

















60































61































62






descartados














humano












63


















p 143]











lacuna)

64



para outra)


























65












ela
















66



























de autoria

67





modelo proposto




















alteraacute-lo

68





























69





Ausubel




44 Modelagem












acessado









70








(marron)

71





















72



























[Moreira 1983]



conteuacutedo) e

73









Interface















Padrotildees]






74















afastamento]
















75































76









77










78






79









80




apenas um estilo)





do Plano de Aula



81














82







Conteuacutedo]



83







descritivo



84







85











86








474 Tutorial





87








88

























estruturado

89






Aprendizagem



Aprendizagem




inserido












proposta


docente


de aprendizagem




aprendizagem




90



Aprendizagem



Aprendizagem








de Aprendizagem




















91













criacuteticas













aprendizagem





92
















93












Nome

O que faz


2 Objetivos



94









4 Perguntas





funccedilotildees




escolar












95












pixels



















96











97













98
































99














navegaccedilatildeo







100


























comeccedilarrdquo

101






















Aprendizagem




Arte etc






102






















103




Editorial 1985 p115




Rio de Janeiro









p503




104





Ltda 2000 p43-54

















Nobel 1986 p159

105





Quixote 1954 p130


No 1 1968 p 78-89






Press Ltd1999 p139



pxi-xvi







p307

106








p416







Nova Fronteira 2000



CAPES - ABR 1985



p467-479



107




de Janeiro 2003



p269-278



Acessado em 2003













em 2001


1995 p144

109

Anexo

Anexo


Kandinsk Pedrosa



110

Anexo







111

Anexo









112

Anexo

Marromocre eterras





113

Anexo

x


xi

Lista de Tabelas






xii

Sumaacuterio









21 e-Learning6




xiii












44 Modelagem 69











Anexo 109

xiv

1

























2







sociedade






















Internet

3






eletrocircnica
























4
























Moreira






5




professorado





obtidos



6








21 e-Learning






Sampaio 2001]




distacircncias









7





serem exploradas


















Niskier1999 p50]




8
























9



























10




cadastroldquo 9



222 AulaNet









11












12


223 Quantum










publicado


13













Chat



225 TelEduc













14




























15







16

























17






























18


















ensino presencial



19



dadas a seguir




saber























20




necessidades














[Ausubel 1980 p312]









21



por diante





























22













com facilidade



AusubelMoreira



AusubelMoreira









23

























hierarquicamente

24



















25

















hierarquizada









26




















ser proposto




27



























destina



28






























29





aprendizagem























30












Preacutevios







31





























32


























33




























34



interatividade





35

















36

















37




















38








paacutegina










desmotivante





de fontes apenas




39

















40



palavras piscando




do professor










41

















paacuteginas







encontra






42



interface




43























44















45
















46






47


























de fontes menores




48






























49






UNIFORME








50




























51





























52




3215 Cor e Contexto













53
















54





























55










p358]


















56













percepccedilatildeo









57



mantidas













58

















por diante










3222 Iacutecones



59







pelos usuaacuterios

3223 Homepage




Splash na Homepage

















60































61































62






descartados














humano












63


















p 143]











lacuna)

64



para outra)


























65












ela
















66



























de autoria

67





modelo proposto




















alteraacute-lo

68





























69





Ausubel




44 Modelagem












acessado









70








(marron)

71





















72



























[Moreira 1983]



conteuacutedo) e

73









Interface















Padrotildees]






74















afastamento]
















75































76









77










78






79









80




apenas um estilo)





do Plano de Aula



81














82







Conteuacutedo]



83







descritivo



84







85











86








474 Tutorial





87








88

























estruturado

89






Aprendizagem



Aprendizagem




inserido












proposta


docente


de aprendizagem




aprendizagem




90



Aprendizagem



Aprendizagem








de Aprendizagem




















91













criacuteticas













aprendizagem





92
















93












Nome

O que faz


2 Objetivos



94









4 Perguntas





funccedilotildees




escolar












95












pixels



















96











97













98
































99














navegaccedilatildeo







100


























comeccedilarrdquo

101






















Aprendizagem




Arte etc






102






















103




Editorial 1985 p115




Rio de Janeiro









p503




104





Ltda 2000 p43-54

















Nobel 1986 p159

105





Quixote 1954 p130


No 1 1968 p 78-89






Press Ltd1999 p139



pxi-xvi







p307

106








p416







Nova Fronteira 2000



CAPES - ABR 1985



p467-479



107




de Janeiro 2003



p269-278



Acessado em 2003













em 2001


1995 p144

109

Anexo

Anexo


Kandinsk Pedrosa



110

Anexo







111

Anexo









112

Anexo

Marromocre eterras





113

Anexo

xi

Lista de Tabelas






xii

Sumaacuterio









21 e-Learning6




xiii












44 Modelagem 69











Anexo 109

xiv

1

























2







sociedade






















Internet

3






eletrocircnica
























4
























Moreira






5




professorado





obtidos



6








21 e-Learning






Sampaio 2001]




distacircncias









7





serem exploradas


















Niskier1999 p50]




8
























9



























10




cadastroldquo 9



222 AulaNet









11












12


223 Quantum










publicado


13













Chat



225 TelEduc













14




























15







16

























17






























18


















ensino presencial



19



dadas a seguir




saber























20




necessidades














[Ausubel 1980 p312]









21



por diante





























22













com facilidade



AusubelMoreira



AusubelMoreira









23

























hierarquicamente

24



















25

















hierarquizada









26




















ser proposto




27



























destina



28






























29





aprendizagem























30












Preacutevios







31





























32


























33




























34



interatividade





35

















36

















37




















38








paacutegina










desmotivante





de fontes apenas




39

















40



palavras piscando




do professor










41

















paacuteginas







encontra






42



interface




43























44















45
















46






47


























de fontes menores




48






























49






UNIFORME








50




























51





























52




3215 Cor e Contexto













53
















54





























55










p358]


















56













percepccedilatildeo









57



mantidas













58

















por diante










3222 Iacutecones



59







pelos usuaacuterios

3223 Homepage




Splash na Homepage

















60































61































62






descartados














humano












63


















p 143]











lacuna)

64



para outra)


























65












ela
















66



























de autoria

67





modelo proposto




















alteraacute-lo

68





























69





Ausubel




44 Modelagem












acessado









70








(marron)

71





















72



























[Moreira 1983]



conteuacutedo) e

73









Interface















Padrotildees]






74















afastamento]
















75































76









77










78






79









80




apenas um estilo)





do Plano de Aula



81














82







Conteuacutedo]



83







descritivo



84







85











86








474 Tutorial





87








88

























estruturado

89






Aprendizagem



Aprendizagem




inserido












proposta


docente


de aprendizagem




aprendizagem




90



Aprendizagem



Aprendizagem








de Aprendizagem




















91













criacuteticas













aprendizagem





92
















93












Nome

O que faz


2 Objetivos



94









4 Perguntas





funccedilotildees




escolar












95












pixels



















96











97













98
































99














navegaccedilatildeo







100


























comeccedilarrdquo

101






















Aprendizagem




Arte etc






102






















103




Editorial 1985 p115




Rio de Janeiro









p503




104





Ltda 2000 p43-54

















Nobel 1986 p159

105





Quixote 1954 p130


No 1 1968 p 78-89






Press Ltd1999 p139



pxi-xvi







p307

106








p416







Nova Fronteira 2000



CAPES - ABR 1985



p467-479



107




de Janeiro 2003



p269-278



Acessado em 2003













em 2001


1995 p144

109

Anexo

Anexo


Kandinsk Pedrosa



110

Anexo







111

Anexo









112

Anexo

Marromocre eterras





113

Anexo

xii

Sumaacuterio









21 e-Learning6




xiii












44 Modelagem 69











Anexo 109

xiv

1

























2







sociedade






















Internet

3






eletrocircnica
























4
























Moreira






5




professorado





obtidos



6








21 e-Learning






Sampaio 2001]




distacircncias









7





serem exploradas


















Niskier1999 p50]




8
























9



























10




cadastroldquo 9



222 AulaNet









11












12


223 Quantum










publicado


13













Chat



225 TelEduc













14




























15







16

























17






























18


















ensino presencial



19



dadas a seguir




saber























20




necessidades














[Ausubel 1980 p312]









21



por diante





























22













com facilidade



AusubelMoreira



AusubelMoreira









23

























hierarquicamente

24



















25

















hierarquizada









26




















ser proposto




27



























destina



28






























29





aprendizagem























30












Preacutevios







31





























32


























33




























34



interatividade





35

















36

















37




















38








paacutegina










desmotivante





de fontes apenas




39

















40



palavras piscando




do professor










41

















paacuteginas







encontra






42



interface




43























44















45
















46






47


























de fontes menores




48






























49






UNIFORME








50




























51





























52




3215 Cor e Contexto













53
















54





























55










p358]


















56













percepccedilatildeo









57



mantidas













58

















por diante










3222 Iacutecones



59







pelos usuaacuterios

3223 Homepage




Splash na Homepage

















60































61































62






descartados














humano












63


















p 143]











lacuna)

64



para outra)


























65












ela
















66



























de autoria

67





modelo proposto




















alteraacute-lo

68





























69





Ausubel




44 Modelagem












acessado









70








(marron)

71





















72



























[Moreira 1983]



conteuacutedo) e

73









Interface















Padrotildees]






74















afastamento]
















75































76









77










78






79









80




apenas um estilo)





do Plano de Aula



81














82







Conteuacutedo]



83







descritivo



84







85











86








474 Tutorial





87








88

























estruturado

89






Aprendizagem



Aprendizagem




inserido












proposta


docente


de aprendizagem




aprendizagem




90



Aprendizagem



Aprendizagem








de Aprendizagem




















91













criacuteticas













aprendizagem





92
















93












Nome

O que faz


2 Objetivos



94









4 Perguntas





funccedilotildees




escolar












95












pixels



















96











97













98
































99














navegaccedilatildeo







100


























comeccedilarrdquo

101






















Aprendizagem




Arte etc






102






















103




Editorial 1985 p115




Rio de Janeiro









p503




104





Ltda 2000 p43-54

















Nobel 1986 p159

105





Quixote 1954 p130


No 1 1968 p 78-89






Press Ltd1999 p139



pxi-xvi







p307

106








p416







Nova Fronteira 2000



CAPES - ABR 1985



p467-479



107




de Janeiro 2003



p269-278



Acessado em 2003













em 2001


1995 p144

109

Anexo

Anexo


Kandinsk Pedrosa



110

Anexo







111

Anexo









112

Anexo

Marromocre eterras





113

Anexo

projeto de aprendizagem

Documents