Memorial Descritivo - Eureka - Repensando o Ambiente Virtual de Aprendizagem da PUCPR by Alan Guimarães

Agradeço a Deus e aos meus familiares, em especial, a meu pai e minha mãe, cujos esforços me fizeram chegar até este momento, a passagem de estudante para profissional. Alan Guimarães Machado da Silva

Curitiba 2015

Eureka é a primeira pessoa do singular do perfeito do indicativo do verbo heuriskein (encontrar), significa portanto, encontrei. A palavra “Eureka” usa-se hoje em dia como celebração de uma descoberta, um achado ou o fim de uma busca.

REPENSANDO O AMBIENTE VIRTUAL DE APRENDIZAGEM DA PUCPR

Memorial

SUMÁRIO

INTRODUÇÃO

BRIEFING

PÚBLICO ALVO

BRAINSTORM

MAPA CONCEITUAL

PESQUISAS MERCADOLÓGICAS

ANÁLISE DE ESTATÍSTICAS DE USO

ANÁLISE DE CONCORRENTES

BENCHMARKING

CRIAÇÃO DA INTERFACE

ESTRATÉGIA E SOLUÇÕES

PALETA CROMÁTICA E FONTES

PROTOTIPAÇÃO

CONSIDERAÇÕES FINAIS

INTRODUÇÃO A internet atualmente vem atuando de maneira ativa na educação. As escolas e as universidades ultrapassam o espaço físico e cada vez mais estão presentes também no espaço virtual, as pessoas se intercomunicam, trocam informações, dados e pesquisas. A educação continuada é facilitada pela possibilidade de integração de várias mídias e também pela facilidade de colocar em contato direto, professores e alunos. Assim surgem os AVA’s, Ambiente Virtual de Aprendizagem, um AVA é um sistema que reúne uma série de recursos e ferramentas através de uma interface gráfica, permitindo e potencializando sua utilização em atividades de aprendizagem através da Internet. O Eureka é o AVA da PUCPR, foi um sistema desenvolvido de maneira interna onde a própria Universidade criou uma equipe responsável pelo projeto. Hoje o ambiente é utilizado por praticamente todos os alunos e docentes da PUCPR, e tornou-se parte do processo de ensino-aprendizagem da Universidade. Este projeto desenvolve uma proposta de alteração na interface do Eureka, repensando a sua estética para que tenha maior apelo visual, a hierarquia das informações para que o torne mais intuitivo, melhorando a usabilidade e adaptando a interface também para outros dispositivos. Analisado como uma ferramenta em potencial, foi preciso realizar estudos e pesquisas com o objetivo de entender de forma aprofundada as necessidades do público que utiliza este sistema.

BRIEFING E PÚBLICO ALVO

“O que realmente necessitamos para planejar é olhar os extremos, desde a pessoa mais fraca até a mais forte, porque se entendemos como funciona os extremos, a média se resolve sozinha.

BRIEFING PROBLEMA E JUSTIFICATIVA

OBJETIVOS

Interfaces com baixa qualidade de uso trazem

diversos problemas, dentre os quais:

pelos usuários e adaptar a interface as

Requerem treinamento excessivo;

Desmotivam a exploração;

Confundem os usuários;

Induzem os usuários ao erro;

Geram insatisfação;

Diminuem a produtividade.

A interface atual do Eureka data do início

Verificar as dificuldades encontradas

necessidades deste público; -

Melhorar a estética da interface;

Repensar a hierarquia das informações, a

usabilidade e a intuitividade da interface; -

Torná-lo acessível para qualquer tipo de

dispositivo.

METODOLOGIA

de 2008*, desde então, os padrões web

Design Thinking é o conjunto de métodos e

e a tecnologia evoluiram muito. Com base

processos para abordar problemas, análise

em pesquisas realizadas com os usuários,

de conhecimento e propostas de soluções.

estes, ao se depararem com o Eureka,

Como uma abordagem, é considerada a

têm dificuldade em utilizar a sua interface e

capacidade para combinar empatia em um

encontrar as informações que desejam.

contexto de um problema, de forma a colocar

Consequentemente, este ambiente criado para ensino-aprendizagem, encontra-se com

as pessoas no centro do desenvolvimento de um projeto.

problemas de infraestrutura e comunicação.

Ao criar um design para a internet, um

Nesta realidade pergunta-se:

termo também recorrente é a experiência

Como a interface pode melhorar a experiência do usuário com o Eureka? Dito isto, o desafio foi repensar a interface do Eureka, focando principalmente nos seus usuários.

do usuário, não adianta ser bonito e não ser funcional. Uma interface usável sem uma identidade e uma estética agradável ao usuário, jamais será uma boa interface gráfica. Assim como o design altamente estético, mas com falhas evidentes de uso, será um fracasso.

* MATOS, Elizete Lúcia Moreira. O Eureka da PUCPR: Uma grande ideia. Curitiba: PUCPR, 2004.

PÚBLICO ALVO O público alvo divide-se da seguinte forma: -

Foto Divulgação: Colégio Marista

Estudantes de graduação e pós-

graduação da PUCPR. -

Estudantes de cursos técnicos da

TECPUC. -

Estudantes dos colégios Marista;

Estudantes das instituições parceiras da

PUCPR como Expoente, Santa Maria entre outras -

Funcionários de empresas parceiras da

PUCPR que utilizam o Eureka para cursos online, repositório ou gestão de projetos -

Professores que lecionam na PUCPR

ou nas instituições parceiras da PUCPR que utilizam o Eureka.

Foto Divulgação: TECPUC

“O que realmente necessitamos para planejar é olhar os extremos, desde a pessoa mais fraca até a mais forte, porque se entendemos como funciona os extremos, a média se resolve sozinha.” Dan Formosa

Foto Divulgação: TECPUC

Foto Divulgação: PUCPR

METODOLOGIA

O Design Thinking inova principalmente ao introduzir novos significados aos produtos e serviĂ§os. Uma vez que â&#x20AC;&#x153;as coisas devem ter forma para serem vistas, mas devem fazer sentido para serem entendidas e usadasâ&#x20AC;?.

PESQUISAS

“A cultura do século 19 foi definida pelo romance, a cultura do século 20 foi definida pelo cinema e a cultura do século 21 será definida pela interface”

PESQUISAS MERCADOLÓGICAS PESQUISA QUALITATIVA Pesquisa realizada para aferir aspectos qualitativos de alguma questão, a pesquisa foi feita com o objetivo de entender de forma profunda o público que utiliza essa ferramenta, quais suas necessidades e o que deve ser melhorado ou repensado no Eureka. Quando questionados sobre os pontos positivos do Eureka, a maioria descreveu a facilidade de comunicação entre professor e aluno como uma das principais funcionalidades do sistema. Constatouse também que a possibilidade de entrega de atividades on-line, o acesso ao conteúdo dado em sala e textos de apoio, o armazenamento e compartilhamento de arquivos, a sala virtual acessível de qualquer lugar e a segurança para aluno e professor com o registro de atividades entregues são outros pontos positivos. Quanto aos pontos negativos, as principais reclamações foram quanto a lentidão do

“Não há usabilidade e arquitetura de informação no sistema, o que prejudica o usuário” “Informações e funções escondidas e interface ultrapassada” “Prefiro utilizar outras ferramentas como o chat do face e o google drive“ “O problema do eureka, é que existe muita informação e nenhuma explicação de uso” “Muitos espaços que realizam as mesmas funções (ou muito parecidas) tornando confusa a navegação” “Deve ser simples intuitivo e rápido, que tenha um calendário simples de visualizar“ “Seria ótimo se todos os professores usassem o plano de ensino“

sistema, navegação confusa, falta de intuitividade, arquitetura e hierarquia de informação mal planejada, dificuldade de achar o que se deseja, tamanho limite para upload, repetição dos menus, agenda desorganizada, falta de acesso mobile.

PESQUISA QUANTITATIVA Pesquisa realizada com o objetivo de traduzir em números as opiniões e informações. O papel da pesquisa quantitativa foi o de

O que você acha da velocidade de resposta? 5

1.4% Muito Bom

8.5% Bom

constatar a necessidade de implementação

35.2% Regular

de melhorias, para isso a pesquisa foi

33.8% Ruim

21.1% Muito Ruim

realizada com 71 pessoas, dentre elas alunos e professores da PUCPR com o objetivo de encontrar padrões identificáveis que

O que você acha do visual da interface?

ajudem através de uma lógica que permita a compreensão do problema em questão. Dentre os participantes, 59 são alunos e

1.4% Muito Bom

12 são professores, 60,6% são mulheres.

11.3% Bom

53,5% são da Escola de Arquitetura e Design,

26.8% Regular

12,67% a Comunicação e Artes, 8.45%

29.6% Ruim

a Escola de Medicina, 9.85% a Escola de Saúde e Biociências e o restante pertencem

31% Muito Ruim

as demais escolas. Quanto a intuitividade da interface?

Foi elaborado um questionário em que os participantes deveriam mensurar notas de 1 a 5 quanto as funcionalidades do Eureka. O que você acha do funcionamento geral do Eureka ?

4.2% Muito Bom

25.4% Bom

42.3% Regular

22.5% Ruim

2.8% Muito Bom

8.5% Bom

7% Regular

52.1% Ruim

29.6% Muito Ruim

5.6% Muito Ruim

Quanto a disposição e hierarquia das informações? 5

2.8% Muito Bom

14.1% Bom

14.1% Regular

40.8% Ruim

28.2% Muito Ruim

ANÁLISE DE ESTATÍSTICAS DE USO Através do código de rastreamento do Google Analytics, ferramenta que cria estatísticas de visitação em sites da internet, obtivemos os seguintes dados de acesso as ferramentas do Eureka. Número total de acessos 2014 (01/01/2014 até 31/12/2014)

Número total de acessos 2013 (01/01/2013 até 31/12/2013)

Analisando os dados de acessos por ferramentas dos anos de 2014 e 2013 respectivamente, fica evidente que algumas ferramentas do sistema não estão sendo devidamente utilizadas.

Neste outro gráfico temos em percentagem o uso das principais ferramentas nos anos de 2010, 2011, 2012 e 2013 respectivamente.

Pode-se notar o que se repete nos 2 gráficos anteriores. A ferramenta Plano de Trabalho ( agora chamada de Plano de Ensino) e a ferramenta Material Didático Online são pouco utilizadas pelos alunos ou mal exploradas pelos docentes. Porém, como se pode notar, o Plano de Ensino apresenta uma curva ascendente de acessos.

ANÁLISE DE SIMILARES A sigla LMS é utilizada globalmente, e em inglês quer dizer Learning Management System (Sistema de Gestão do Aprendizado). No Brasil, e em muitos países de língua espanhola, também se utiliza AVA (Ambiente Virtual de Aprendizagem). AVA ou LMS é o local no qual são publicados os conteúdos dos cursos e os alunos podem realizar suas atividades. Portanto, é uma espécie de sala de aula virtual.

Blackboard Learn Pontos positivos: -

Notificações das atividades recentes das

salas. -

Rede de contatos, possui a opção de

adicionar contatos, trocar mensagens e criar grupos de discussão.

WebAula LMS Mobile Pontos positivos: -

A página inicial chamada de Meu

Painel possui um link direto para todas as ferramentas do sistema. -

Interface com um ‘Flat’ Design baseado

no novo Microsoft Windows.

Moodle Pontos positivos: -

Software Livre (Opensource)

Desenvolvimento colaborativo por uma

comunidade virtual -

Evolui constantemente adequando-se as

necessidades dos seus utilizadores. -

Interface totalmente customizável

AVA Univirtus Pontos positivos: -

É um Ambiente Virtual muito interessante,

justamente pelo fato de ser focado para o ensino totalmente à distância, é muito estruturado e intuitivo. -

Interface limpa e visualmente agradável

LMS Atena Atena é um AVA de gestão do conhecimento, com foco em treinamento para o varejo. Pontos positivos: -

Interface simples, direta e intuitiva

BENCHMARKING Foi realizada uma pesquisa com os principais Ambientes Virtuais de Aprendizagem presentes no mercado a fim de saber quais eram os seus principais atrativos, visando implantá-los no Eureka. O novo AVA da WebAula, denominado WebAula Mobile, é compatível com os principais dispositivos móveis e adapta-se para diferentes tamanhos de tela. Possui uma interface totalmente reformulada quando comparada ao antigo WebAula, e muito prática. O AVA Univirtus, utilizado pelo grupo Uninter, é extremamente prático, todas as informações

“Benchmarking é simplesmente o método sistemático de procurar os melhores processos, as idéias inovadoras e os procedimentos de operações mais eficazes que conduzam a um desempenho superior”

que o usuário precisa se encontram a poucos cliques.

(Christopher E. Bogan)

Tanto o Moodle quanto o Univirtus contam com uma espécie de página inicial da matéria, onde se concentra o conteúdo de todas as aulas, o material de apoio e links. No Blackboard Learn a seção ‘My Blackboard’ é uma experiência inteiramente nova, agora todas as informações acadêmicas mais importantes são agrupadas de um modo simples e de fácil acesso.

CRIAÇÃO

“Quando as formas são desenvolvidas com mentalidade e não arbitrariamente, parece quase como inevitável, parece quase sem design”

CRIAÇÃO DA INTERFACE CONCEITO

RAFES

Desenvolver uma interface com foco na

Tela de login

experiência do usuário, com uma navegação simples e intuitiva. Priorizando a hierarquia das informações, não as deixando em locais de difícil localização, evitar botões que levam ao mesmo local, afinal, isso apenas polui o visual e dificulta encontrar as informações. Tudo pensado para o público que utiliza a interface, a disposição das informações na página é o que vai dar sentido e guiar

Página interna sala virtual

o usuário intuitivamente do que é mais ou menos relevante. A escolha correta das cores também é parte fundamental, as cores devem ter coerência no design e fazer sentido na cabeça do usuário. É impossível pensar na interface e não imaginar sua versão para tablets e smartphones, essa adaptação do formato de desktop para versão mobile se chama design resposivo.

“É isto que estamos buscando quando projetamos, os modos que podemos fazer com que as pessoas usem as coisas, de forma a melhorar sua vida cotidiana, sem que nem percebam ou pensem nisso” Davin Stowell

INTERFACE ATUAL

ALTERNATIVA 1

ALTERNATIVA 2

ALTERNATIVA 3 - VERSÃO ESCOLHIDA PARA PROTOTIPAÇÃO

TELA DE LOGIN - ESCOLHIDA PARA PROTOTIPAÇÃO

TELA DE LOGIN - ALTERNATIVA 2

ESTRATÉGIA E SOLUÇÕES BARRA LATERAL Como solução principal, foi pensado em uma barra lateral com um menu vertical linkando diretamente para as principais páginas do Ambiente Virtual. Essa barra pode ser “encolhida” em notebooks e tablets e totalmente oculta em smartphones. Foram criadas novas aplicações com objetivo de ajudar o usuário a se organizar, são elas: -

Bloco de Anotações - para o usuário

escrever rascunhos de aulas e informações importantes. -

Minhas Listas - aplicação para gerenciar

listas, pode ser usava para gerir vários projetos e trabalhos, pode ser compartilhada com outros alunos. Além da comunicação por email, também é possível a comunicação interna clicando em Mensagens no menu.

CENTRAL DE NOTIFICAÇÕES O Eureka só exibe notificações quando o usuário acessa uma sala virtual, e mesmo assim, ele notifica apenas as alterações feitas pelos professores. A criação de uma central de notificações facilita os usuários, tornando possível eles terem acesso a toda a atividade de todas as salas virtuais, seja de alunos ou professores, em um único lugar.

MENU DE CONFIGURAÇÕES Para ter acesso as configurações do sistema, editar suas informações pessoais e ter ajuda do sistema, o usuário conta com um menu oculto, no canto superior direito.

PALETA CROMÁTICA E FONTES INTERFACE

BADGES E MENU

BOOTSTRAP - BOTÕES E ALERTAS

PROTOTIPAÇÃO

“Os consumidores reagem muito positivamente quando as coisas são claras e compreensíveis”

PROTOTIPAÇÃO ESTUDO DE PROTOTIPAGEM A interface será prototipada com páginas estáticas, apenas simulando o conteúdo. O protótipo também não será conectado a um banco de dados e não terá como gerar conteúdo. Será desenvolvida utilizando a linguagem de marcação HTML e a linguagem CSS e tera como base o framework Bootstrap. Bootstrap é um framework front-end que facilita a vida dos desenvolvedores web a criar sites com tecnologia mobile (responsivo) sem ter que digitar uma linha de CSS para “fazer e acontecer”. Não é a toa que o termo “Bootstrap” em inglês significa “inicialização”, algo que possui um ponto de partida.

PROTÓTIPO INICIAL

A página de login é a página inicial do Eureka. Nesta página o usuário tem os avisos importantes da Instituição como datas para inscrição do Projeto Comunitário, Avaliação Institucional, Manutenção do AVA, entre outros. Também é possível escolher o idioma do sistema. Opções de recuperar usuário e senha. Opções em um menu superior como tour pelo AVA, suporte e uma opção para escolher a instituição.

INÍCIO - MEU PAINEL

Meu Painel é a página de boas vindas da proposta do novo Eureka. Nesta página o usuário recebe notificações de atividades atrasadas, pendentes e com vencimento em até no máximo 24 horas. Possui também um calendário com todas as atividades cadastradas nos planos de ensino das salas em que participa. O usuário tem a opção de cadastrar eventos pessoais e filtrar os eventos das salas. No canto direito, o usuário conta com um atalho das aplicações Lista de Tarefas e Bloco de Notas, onde ele pode fazer anotações rápidas e criar tarefas.

MENSAGENS

Página para troca de mensagens e comunicação interna no Ambiente Virtual. O usuário tem a possibilidade de trocar mensagens com qualquer outro usuário que participa das mesmas salas.

Email interno do novo Eureka. Tem a possibilidade de trocar emails com qualquer integrante das salas virtuais em que o usuário participa. É possível também configurar para receber as mensagens no seu email externo.

AVISOS

Nesta página o usuário receberá os avisos da Instituição. O usuário tem a opção de filtrar estes avisos por tipo e também a opção de não mostrar mais este aviso.

NOTIFICAÇÕES

Está página é a Central de Notificações. Ao clicar no ícone do “sino” no topo da página, o usuário visualiza as últimas notificações. Ao clica em “ver todas” ele é redirecionado para a central de notificações onde é exibida toda a atividade recente nas páginas em que participa, mensagens recebidas, atividades pendentes, interações em fóruns entre outras.

PERFIL

Página para alterar os dados pessoais. Nesta página o usuário pode alterar todos os seus dados pessoais, informações de contato e foto do perfil, ele tem a opção também de escolher o que será divulgado para outros usuários.

AJUSTES

Página de Ajustes do AVA. Nesta página o usuário configura todas as suas preferências no sistema, que tipo de notificações deseja receber, que mensagens de email deseja receber entre outras opções.

LISTA DE TAREFAS

Página Lista de Tarefas. A Lista de Tarefas é uma nova aplicação para o Eureka, é destinada para o usuário anotar informações importantes, datas de provas, etapas de um projeto entre outras possibilidades.

BLOCO DE NOTAS

Página Bloco de Notas. Esta nova aplicação é destinada para o usuário escrever rascunhos de aulas e informações importantes.

PASTA PESSOAL

A pasta pessoal é onde o usuário pode armazenar seus dados, por exemplo, ao fazer um trabalho de aula em um laboratório de informática, o usuário tem a possibilidade de enviar o arquivo para a pasta pessoal e finalizá-lo em casa.

SALA

A página da Sala, sofreu algumas modificações, o menu lateral que era uma proposta da interface, no protótipo tomou uma nova forma, agora ele se localiza ao lado do nome da sala, assim, o usuário tem ainda mais espaço de visualização do conteúdo da sala. Os itens do menu como Avaliação Online, Material Didático, Fórum entre outros, agora estão todos dentro do Plano de Ensino. Assim o usuário só tem acesso a essas ferramentas quando o professor cria uma atividade deste tipo.

Prot贸tipo: http://tinyurl.com/novoeureka

CONSIDERAÇÕES FINAIS Após diversas etapas, desde a pesquisa cientifica, brainstorms, mapas conceituais, pesquisas com o público alvo, constatou-se que estes ao se depararem com o Eureka muitos têm dificuldade em utilizar a sua interface e encontrar as informações que desejam. O desafio foi repensar a interface do Eureka, focando principalmente nos seus usuários. Verificando as dificuldades encontradas e adaptando a interface as necessidades deste público. Após o desenvolvimento da interface e durante a prototipação foram detectadas algumas falhas no projeto, e possíveis melhorias, outras ideias sofreram adaptações do esboço para o protótipo final e foram implementadas da melhor forma possível para que o usuário tenha a experiência desejada para o uso do Ambiente Virtual de Aprendizagem. Considera-se que este projeto cumpriu com sua proposta, a alteração de toda a interface do Eureka, desde sua estética e hierarquia das informações, com o intuito de torná-lo mais intuitivo, repensando a sua usabilidade e adaptando a interface para dispositivos portáteis e móveis.

REFERÊNCIAS

MATOS, Elizete Lúcia Moreira (Org.); GOMES, Péricles Varella (Org.). Uma experiência de virtualização universitária: O Eureka da PUCPR. Curitiba: Champagnat, 2003. MATOS, Elizete Lúcia Moreira. O Eureka da PUCPR: Uma grande ideia. Curitiba: PUCPR, 2004. Manual do Eureka - Aluno, Disponível em: < https://eureka.pucpr.br/manual/manual. pdf>. Acesso em: 13 abr 2014. Manual do Eureka - Professor, Disponível em: < https://eureka.pucpr.br/manual/ Professor.pdf>. Acesso em: 13 abr 2014. VIANNA, Maurício; VIANNA, Ysmar; ADLER, Isabel K.; LUCENA, Brenda; RUSSO, Beatriz. Design Thinking: Inovação em negócios. Rio de Janeiro: MJV Press, 2012. GOMES, Daniel. Porque é que as tabelas para formatação são desaconselhadas em web design?, 2011. Disponível em: < http://visibilidade.net/tutorial/tabelasHTMLFormatacao.html>. Acesso em 16 out 2014.

ANEXOS

ANÁLISE DE SIMILARES

REPENSANDO O AMBIENTE VIRTUAL DE APRENDIZAGEM DA PUCPR

Artigo

PONTIFÍCIA UNIVERSIDADE CATÓLICA DO PARANÁ ESCOLA DE ARQUITETURA E DESIGN CURSO DE DESIGN DIGITAL

ALAN GUIMARÃES MACHADO DA SILVA

EUREKA: REPENSANDO O AMBIENTE VIRTUAL DE APRENDIZAGEM DA PUCPR

CURITIBA 2014

ALAN GUIMARÃES MACHADO DA SILVA

EUREKA: REPENSANDO O AMBIENTE VIRTUAL DE APRENDIZAGEM DA PUCPR

Artigo apresentado ao curso de Design Digital da Pontifícia Universidade Católica do Paraná, como requisito à obtenção do título de bacharel. Orientadores: Luciane Hilu.

CURITIBA 2014

Prof.

Juliana

Sousa

EUREKA: REPENSANDO O AMBIENTE VIRTUAL DE APRENDIZAGEM DA PUCPR

EUREKA: RETHINKING THE VIRTUAL LEARNING ENVIRONMENT PUCPR Autor: Alan Guimarães Machado da Silva Orientador: Prof. Juliana Sousa e Luciane Hilu

RESUMO

As Tecnologias de Informação e Comunicação (TIC) baseadas na Internet estabelecem novas alternativas no campo da educação, proporcionando inovação por parte dos professores e alunos em sua relação ensino-aprendizagem. Entendese por Ambiente Virtual de Aprendizagem como um espaço virtual que permite a interação social e cognitiva; um meio virtual onde pessoas com objetivos em comum e demais envolvidos no processo de ensino-aprendizagem, constroem conhecimento através de uma série de recursos e ferramentas disponibilizadas através da Internet. Este estudo tem como objetivo conhecer a fundo e repensar o Ambiente Virtual de Aprendizagem da PUCPR –Eureka, analisando o processo de virtualização da Universidade, a criação do Ambiente Virtual, a eficácia do sistema, a experiência dos alunos e professores e como objetivo principal, desenvolve uma proposta de mudança, repensando a parte estética para que tenha maior apelo visual, a hierarquia das informações para que se torne mais intuitivo, melhorando a usabilidade, os aspectos ergonômicos e a interface como um todo, adaptando-a também para as novas tecnologias como o HTML5 e CSS3. Palavras-chave: PUCPR, Design Digital, Eureka, Redesign, Ambiente Virtual de Aprendizagem

ABSTRACT

The Information and Communication Technologies, based on the internet, supply new alternatives for the education environment, providing a new perspective among the professors and students about teaching and learning relations. As a Virtual Learning Environment, we shall see that's a place where allows social interaction and cognitive; this environment helps users with common goals and those involved in the teaching and learning process, to build a knowledge through all the resources and tools available on the internet. So this review intent to experience deeplyand rebuild the Virtual Learning Environment of PUCPR-Eureka, by analysing the whole process of changing the University to this new Virtual system, the foundation of the Virtual Environment, system capacity, the experience between professors and students and as the major purpose,a visual update and also upgrading the emplacement of the

information, to favour the application, and adapt to the new technologies as HTML5 and CSS3. Key-words: Environment

PUCPR,

Digital

Design,

Eureka,

Redesign,

Virtual

Learning

LISTA DE ILUSTRAÇÕES E TABELAS

Quadro 1: Exemplos de AVA....................................................................................... 7 Quadro 2: Exemplos de AVA (Atualizado) .................................................................. 8

Figura 1: Hierarquia dos menus e informações ......................................................... 10 Figura 2: Estrutura Eureka 2014 ............................................................................... 14 Figura 3: Número total de acessos por ferramentas 2014 ........................................ 14 Figura 4: Número total de acessos por ferramentas 2013 ........................................ 15 Figura 5: Ferramentas em porcentagem de uso (2010 à 2013) ................................ 15

SUMÁRIO

1 INTRODUÇÃO ........................................................................................................ 4 2 CONTEXTUALIZAÇÃO TEÓRICA ......................................................................... 5 2.1 AVA - AMBIENTE VIRTUAL DE APRENDIZAGEM .............................................. 6 3 OBJETO DE ESTUDO ........................................................................................... 9 3.1 INTERFACE ATUAL ........................................................................................... 10 3.1.1 MENU DE DADOS PESSOAIS ...................................................................... 11 3.1.2 MENU DE FUNCIONALIDADES GERAIS ..................................................... 11 3.1.3 MÓDULOS OU FERRAMENTAS ................................................................... 12 3.1.4 ANÁLISE DE DADOS .................................................................................... 14 4 REPENSANDO ..................................................................................................... 16 4.1 TECNOLOGIA .................................................................................................... 16 4.2 DESIGN PENSADO ............................................................................................ 17 4.3 DESIGN RESPONSIVO E DESIGN FLUÍDO ..................................................... 18 4.4 ERGONOMIA E USABILIDADE .......................................................................... 19 4.4.1 O TESTE DE USABILIDADE ......................................................................... 19 5 CONSIDERAÇÕES FINAIS .................................................................................. 20

1 INTRODUÇÃO

A internet atualmente vem atuando de maneira ativa na educação. As escolas e as universidades ultrapassam o espaço físico e cada vez mais estão presentes também no espaço virtual, as pessoas se intercomunicam, trocam informações, dados e pesquisas. A educação continuada é facilitada pela possibilidade de integração de várias mídias e também pela facilidade de colocar em contato direto, docentes e alunos. Assim surgem os Ambientes Virtuais de Aprendizagem. Entende-se por AVA1 como um espaço virtual, composto de interações sociais e cognitivas; um meio virtual onde pessoas, com objetivos em comum, trocam informações e constroem conhecimento (VAVASSORI E RAABE, 2006). Um ambiente virtual de aprendizagem é um sistema que reúne uma série de recursos e ferramentas, permitindo e potencializando sua utilização em atividades de aprendizagem através da Internet. Estes ambientes possuem uma interface gráfica que possibilita a criação de uma comunidade onde, mediada pela linguagem da hipermidia2, compartilha o espaço virtual em que se expõem trabalhos, podendo ler e rever tudo o que já foi publicado (VAVASSORI E RAABE, 2006 p.313). O Eureka3 é o Ambiente Virtual de Aprendizagem da PUCPR, foi um sistema desenvolvido de maneira interna onde a própria Universidade criou uma equipe responsável pelo projeto. Hoje o ambiente é utilizado por praticamente todos os alunos e docentes da PUCPR, e tornou-se parte do processo de ensinoaprendizagem da Universidade. Os usuários, seja alunos ou docentes, ao se depararem com o Eureka têm dificuldade em utilizar a sua interface e encontrar as informações que desejam. Consequentemente, este ambiente criado para ensino-aprendizagem, encontra-se com muitos problemas de infraestrutura e comunicação e acaba frustrando o usuário. Analisado como uma ferramenta em potencial, foi preciso realizar estudos e pesquisas com o objetivo de entender de forma aprofundada as necessidades do público que utiliza este sistema. _______________ AVA – Ambiente Virtual de Aprendizagem Hipermídia – Documento em hipertexto que também é capaz de mostrar imagens e som. 3 Eureka – Ambiente Virtual de Aprendizagem desenvolvido e utilizado pela PUCPR. 1 2

Nesta realidade pergunta-se: Como a interface pode melhorar a experiência do usuário com o Eureka?

Na busca à resposta, propõe-se como objetivo de pesquisa melhorar o aspecto visual do Eureka seguindo os princípios do Design Thinking4 e torná-lo acessível para qualquer tipo de dispositivo através do Design fluído5 e responsivo6. Assim como objetivos secundários, verificar as dificuldades encontradas pelos usuários e desenvolver um ambiente virtual com foco na experiência do usuário, priorizar a hierarquia e a distribuição das informações.

2 CONTEXTUALIZAÇÃO TEÓRICA

“Rede” é a palavra que descreve os espaços compartilhados formados por computadores interligados em todo o mundo por sinais de telefone e de satélite (FRANCO,1997). A “Rede das redes” (Internet) é um sistema global de redes de computadores interligadas que utilizam o conjunto de protocolos padrão de Internet, o TCP/IP7 para se comunicar (FRANCO,1997). A Internet teve início como uma rede pequena de um projeto militar, ao começar a ser utilizada pelos meios acadêmicos-científicos sofreu um grande processo de expansão até se tornar o meio de comunicação mais importante da atualidade (FRANCO,1997). Franco (1997, p.12) acrescenta: A evolução das formas eletrônicas de transmissão de sinais levou ao desenvolvimento da informática e das redes de computadores, cujo estado atual é a Internet. O acesso à informação cada vez mais se faz através dos meios informáticos, mesmo para o homem comum. O que isso representa para a inteligência e o conhecimento? As novas tecnologias de informação apresentam-se fragmentando modos de ser e pensar estabelecidos e fazem emergir novos espaços para a cultura.

_______________ Design Thinking – Conjunto de métodos e processos para abordar problemas, relacionados à aquisição de informações, análise de conhecimento e propostas de soluções. 5 Design Fluído – Design que se adapta a resolução da tela do dispositivo. 6 Design Responsivo – Design que “responde” de uma maneira diferente para cada dispositivo e assim “apresenta” o conteúdo de uma maneira, conforme a resolução da tela. 7 TCP/IP –TCP Transmission Control Protocol (Protocolo de Controle de Transmissão) e o IP, Internet Protocol (Protocolo de Internet). 4

Graças ao surgimento das redes, foi possível também o surgimento das redes de aprendizagem, estas utilizam computadores interligados em rede para atividades educacionais. Consistem em comunidades de alunos que trabalham juntos no ambiente virtual (HARSIM, TELES, TUROFF E HILTZ, 2005). Elas podem ser utilizadas de modo auxiliar, onde “elas funcionam como suplemento ou auxiliar da instrução regular” (HARSIM, TELES, TUROFF E HILTZ, 2005 p.109) ou mista ao estudo presencial “no qual uma parcela significativa das aulas de programas presenciais ou a distância é conduzida por e-mail ou conferências por computador (HARSIM, TELES, TUROFF E HILTZ, 2005 p.109).

2.1 AVA - AMBIENTE VIRTUAL DE APRENDIZAGEM

O ambiente virtual de aprendizagem é um ambiente presente no ciberespaço8 que através de ferramentas permite o processo de ensino-aprendizagem, utilizando da mediação de professores. Os recursos dos AVA’s são basicamente os mesmos existentes na internet (correio, fórum, chat9 etc.). Os ambientes virtuais permitem aos participantes fornecer informações, trocar experiências, discutir problemáticas e temas de interesses comuns, desenvolver atividades colaborativas para compreender seus problemas e buscar alternativas de solução. De acordo com Gomes (2001, p.25 in TORRES, 2004, p.93): Ambiente Virtual de Aprendizagem é o ambiente tecnológico no ciberespaço que permite o processo de ensino-aprendizagem através da mediação pedagógica entre alunos ou um grupo de alunos e o professor ou um grupo de professores, ou outros agentes geograficamente dispersos. Apresenta-se em forma de portais, banco de dados, bibliotecas virtuais, cursos a distância, museus ou outros.

Assim, o AVA tem um papel de mediador no processo de ensino, Pereira complementa (2007): _______________ Ciberespaço – Espaço existente no mundo de comunicação em que não é necessária a presença física do homem para constituir a comunicação como fonte de relacionamento. 9 Chat - Em português significa conversação, ou bate-papo (termo usado no Brasil), é um neologismo para designar aplicações de conversação em tempo real. 8

AVAs consistem em mídias que utilizam o ciberespaço para veicular conteúdos e permitir interação entre os atores do processo educativo. [...] Ambiente Virtual de Aprendizagem (AVA) consiste em uma opção de mídia que está sendo utilizada para mediar o processo ensino-aprendizagem à distância (PEREIRA, 2007, p. 4 e 5).

O AVA é um ambiente social, que possibilita o ensino através da interação entre as pessoas, segundo Valentini e Soares (2005): AVAs vai além da ideia de um conjunto de páginas educacionais na Web ou de sites com diferentes ferramentas de interação e de imersão (realidade virtual). Entendemos que um ambiente virtual de aprendizagem é um espaço social, constituindo-se de interações cognitivo-sociais sobre ou em torno de um objeto de conhecimento: um lugar na Web, “cenários onde as pessoas interagem”, mediadas pela linguagem da hipermídia, cujos fluxos de comunicação entre os interagentes são possibilitados pela interface gráfica (VALENTINI e SOARES, 2005, p.19).

Portanto, o Ambiente Virtual de Aprendizagem pode ser considerado um espaço virtual determinado na internet que, através da congregação de várias ferramentas, viabiliza a comunicação, a mediação de saberes e a formação midiatizada, permitindo interações individuais e coletivas entre todos os envolvidos no projeto de ensino-aprendizagem (PEREIRA, 2007). Alguns exemplos de AVA’s disponíveis no mercado com base na pesquisa de Bonassina (2014): AVA Asymetrix ToolBook AulaNet Authoware Case Docent Ecollego.com EduSystems Eureka Escuninha Eurek@Kids Generation 21 IntraLearn Knowledgesoft Learning Space LearnLinc Moodle Teleduc Top Class Web Course in a box WebCt

Endereço Eletrônico http://home.click2learn.com/ http://guiaaulanet.eduweb.com.br/ http://macromedia.com http://www.staffs.ac.uk/case http://www.docent.com/home.htm http://www.ecollege.com/ http://www.mtsystem.hu/edusystem http://pucpr.br/eureka http://serv2.ceamecim.furg.br/escuninha/index2.html http://www.lami.pucpr.br/eurekakids http://www.gen21.com/ http://www.intralearn.com/ http://www.knowledgesoft.com/ http://www.lotus.com/LearningSpace http://www.learnlinc.com/ http://www.moodle.org/ http://www.hera.nied.unicamp.br/teleduc http://www.wbtsystems.com/ http://www.blackboard.com/ http://webct.com/ Quadro 1: Exemplos de AVA Fonte: Ana Lucia Berno Bonassina

AVA Asymetrix ToolBook AulaNet Authoware Case Docent Ecollego.com EduSystems Eureka Escuninha Eurek@Kids Generation 21 IntraLearn Knowledgesoft Learning Space LearnLinc Moodle Teleduc Top Class Web Course in a box WebCt

Endereço Eletrônico

http://macromedia.com

http://www.ecollege.com/ http://pucpr.br/eureka

http://www.intralearn.com/

http://www.moodle.org/ http://www.wbtsystems.com/ Quadro 2: Exemplos de AVA (Atualizado – 08/2014) Desenvolvido pelo autor

Cada AVA é concebido através de muito estudo, distinguindo-se cada um por suas interfaces e tecnologias empregadas. Ao comparar os quadros 1 e 2 concluímos que muitos AVA’s foram descontinuados, dos que restaram destaca-se o Moodle, um software de Código Aberto (Open Source), o que significa que ele é livre para se usar, modificar e até mesmo distribuir (BONASSINA, 2008). O benefício por ser gratuito não garante que a ferramenta venha atender a todos os aspectos e necessidades de todas as instituições que utilizam. Por se tratar de código aberto, pressupõe que um programador possa alterar o código ou criar novos módulos para adaptar a necessidade de cada instituição, ou seja, parte da premissa da recriação ou da customização (VILLAS BOAS, 2006).

Muitas faculdades e universidades nacionais utilizam o Moodle, e tantas outras descontinuaram seus AVA’s próprios e adotaram também este sistema de código aberto. Tanto pela facilidade de personalização quanto por este atender as necessidades. Algumas das instituições que utilizam o Moodle são MACKENZIE, PUCRS, PUC-SP, UEM, UFBA, UFPA, UFPR, UFRGS, UFRN, UFSC, UFSCar, UFT, UFVJM, UNB, Unicamp, UNICENTRO, UNIFESP, Unioeste, Unipampa, UNIPAR, Unisinos, USP, UTFPR.

3 OBJETO DE ESTUDO

A PUCPR possui um Ambiente Virtual de Aprendizagem próprio, o Eureka, que é amplamente utilizado como facilitador da aprendizagem, onde é possível formar uma comunidade de pessoas, compartilhando interesses comuns, trocando informações, relacionando-se e, principalmente, construindo conhecimento (MATOS E GOMES, 2003). O Ambiente Eureka é resultado de um projeto de pesquisa desenvolvido no Laboratório de Mídias Interativas (LAMI) da PUCPR que tem como propósito:

A implementação de um ambiente baseado na web para aprendizagem cooperativa visando a promover educação e treinamento a distância, utilizando a Internet como meio de criação de comunidades virtuais que participam de cursos que tradicionalmente são presenciais (MATOS E GOMES, 2003 p. 14).

O início do processo de virtualização da PUCPR data de 1999 e pode ser dividido em 4 fases distintas:

1999 – Ano da Pesquisa – Nesse ano, é criado a CEAD; o EUREKA sai das mesas de projeto, é usado a nível BETA. A Universidade Virtual Siemens PUCPR surge e profissionais do Brasil inteiro passam a frequentar o EUREKA para curso de treinamento profissional; 1.000 pessoas se cadastram no sistema em novembro de 1999.

2000 – Ano da difusão – 200 salas são abertas em vários cursos de graduação, pós-graduação e para pesquisa; 10.000 pessoas cadastradas no sistema em novembro de 2000.

2001 – Ano da institucionalização do EUREKA – Adoção pela Pró-Reitoria Acadêmica, através da criação do NTE (Núcleo de Tecnologias Educacionais); EUREKA/PUCPR apresentado no “Virtua Educa” em Madri e no AACE-EdMedia na Finlândia; 600 salas abertas; 20.000 pessoas cadastradas no sistema em novembro de 2001.

2002 – Ano da consolidação do Eureka como Infra-Estrutura da PUCPR – O sistema é transferido do LAMI para o Centro de Computação da PUCPR, e os direitos autorais bem como sua equipe de desenvolvimento sendo encampados pela universidade. 26.000 pessoas cadastradas em abril de 2002 (MATOS E GOMES, 2003 p. 14).

3.1 INTERFACE ATUAL

O Eureka é um ambiente que está em constante desenvolvimento, possui uma equipe própria destinada a manutenção e aprimoramento do sistema. Em sua história teve três mudanças significativas, com alteração de quase toda a sua interface. A primeira quando o sistema foi criado, a segunda quando ele realmente foi ao ar para testes com os alunos em 2002 e a versão atual do início de 2008. Mas, afinal, o que é exatamente uma interface? Em seu sentido mais simples, a palavra se refere a softwares que dão forma à interação entre usuário e computador. A interface atua como uma espécie de tradutor, mediando entre as duas partes, tornando uma sensível para outra. Em outras palavras, a relação governada pela interface é uma relação semântica, caracterizada por significado e expressão, não por força física (JOHNSON, 2005, p.17).

Figura 1: Hierarquia dos menus e informações – Fonte: Eureka Disponível em <http://eureka.pucpr.br> Acesso em 15 de outubro de 2014

Segundo o próprio Manual do AVA, a interface do Eureka se organiza em três partes específicas. •

Menu de dados pessoais - serve para acessar informações

pessoais, como editar seu perfil dentro do sistema, obter ajuda ou entrar em contato.

•

Menu de funcionalidades gerais - serve para acessar as

principais funcionalidades do sistema como a agenda, as salas, o correio geral e a pasta pessoal. •

Área principal de trabalho - área de trabalho dentro do ambiente,

onde as ferramentas e módulos são exibidos.

3.1.1 MENU DE DADOS PESSOAIS

O menu de dados pessoais contém: •

Nome do usuário;

•

Perfil do usuário com o qual está navegando;

•

Acesso ao módulo Início do Eureka com a Agenda e o Edital do perfil selecionado;

•

Acesso à página de dados pessoais (visualização e edição);

•

Acesso à ajuda do Eureka;

•

Link para sair do Eureka.

3.1.2 MENU DE FUNCIONALIDADES GERAIS

O menu de funcionalidades gerais é formado por: •

Agenda – mostra todas as informações referentes às atividades de aprendizagem propostas nos Planos de Trabalho de todas as suas salas;

•

Salas – permite o acesso ao menu de salas;

•

Correio geral – por ele, é possível acessar todos os e-mails de todas as suas salas;

•

Pasta pessoal – um espaço para você rapidamente colocar seus arquivos sem precisar entrar em uma sala específica.

3.1.3 MÓDULOS OU FERRAMENTAS

Desde a última versão (2008) o Eureka sofreu algumas mudanças, como o nome das ferramentas e algumas funcionalidades, segue abaixo a estrutura da versão atual conforme acesso em 6 de outubro de 2014. •

AGENDA – Um cronograma criado automaticamente com todas as atividades distribuídas por dia. Possui também a opção de adicionar um compromisso pessoal.

•

SALAS – Divide-se em salas ativas, salas encerradas e grupos de discussão. Todas as salas possuem as mesmas ferramentas, o que as diferencia é que em salas ativas o usuário pode visualizar e interagir com todas as ferramentas (ativadas pelo tutor), em salas encerradas o usuário só pode visualizar as informações e em grupos de discussão o usuário pode escolher mais grupos que deseja participar (mediante a aprovação do tutor do grupo de discussão) o COMUNICAÇÃO  Edital – É o “Mural” da sala.  Correio – Corresponde ao Correio Eletrônico apenas aos participantes desta sala.  Fórum – Apresenta uma base de conhecimento de tópicos e respectivas contribuições sobre assuntos relativos aos cursos em andamento. Permite a inclusão de novas contribuições e novos tópicos.  Chat – Permite a comunicação on-line, entre os participantes.  Contatos – Mostra o perfil de todos os integrantes da sala.  Blog – Blog da Sala o ESTUDOS  Plano de Ensino – Onde o tutor coloca todas as atividades oficiais da matéria, referências de materiais para estudo, entrega de trabalhos e demais atividades.

 Provas Online – Mostra todas as provas online.  Material Online – Mostra o Material Didático para estudo online.  Links – Lista de Links de referência automático das atividades do Plano de Ensino, pode-se também inserir mais Links. o GRUPOS  Algumas atividades do Plano de Ensino, são disponibilizadas em grupo, é nessa área que o aluno escolhe seu grupo. o PASTA DA SALA  Apresenta o conteúdo de apoio do curso. Um espaço para compartilhamento de arquivos entre professores e alunos. o RELATÓRIOS  Relatórios de Acesso e Relatórios de Notas. •

CORREIO GERAL – Corresponde ao correio eletrônico geral de todos as salas em que o usuário está cadastrado. Permite-se criar, encaminhar, responder e excluir mensagens.

•

PASTA PESSOAL – Uma pasta em que o usuário pode inserir arquivos, apenas o usuário logado tem acesso a sua respectiva pasta.

Figura 2: Estrutura Eureka 2014 – Desenvolvida pelo autor

3.1.4 ANÁLISE DE DADOS

Através do código de rastreamento do Google Analytics, ferramenta que cria estatísticas de visitação em sites da internet, obtivemos os seguintes dados de acesso ao Eureka.

Figura 3: Número total de acessos por ferramentas 2014 (01/01/2014 até 31/08/2014) Fonte: Google Analytics

Figura 4: Número total de acessos por ferramentas 2013 (01/01/2013 até 31/12/2013) Fonte: Google Analytics

Analisando os dados de acessos por ferramentas dos anos de 2014 e 2013 (Figura 3 e Figura 4) respectivamente, fica evidente que algumas ferramentas do sistema não estão sendo devidamente utilizadas.

Figura 5: Ferramentas em porcentagem de uso (2010 à 2013) Fonte: Google Analytics

Neste outro gráfico podemos notar o que se repete nos 2 anteriores. A ferramenta Cronograma (agora chama de Plano de Trabalho ou Plano de Ensino) e a ferramenta Material Didático Online (SAAW3) são pouco utilizadas pelos alunos ou mal exploradas pelos docentes. Destaque para o Plano de Ensino que apresenta uma curva ascendente de acessos.

4 REPENSANDO

Uma interface usável sem um critério de design visual coerente com uma identidade e uma estética agradável ao usuário, jamais será uma boa interface gráfica. Assim como o design altamente estético, mas com falhas evidentes de uso, será um fracasso (ROYO, 2008). O design estará envolvido nos problemas de comunicação em todas as fases do planejamento de qualquer projeto para a internet. (...) Mais ainda quando se trata de um espaço que continua evoluindo paralelamente à tecnologia e às demandas de uso dos internautas, de forma vertiginosa (ROYO, 2008 p. 89).

Discussões sobre a importância da função (usabilidade) ou da forma (estética) acontecem em todos os setores em seu período de desenvolvimento. O espaço virtual e os equipamentos que o criam estão em transformação contínua. O design digital também está em plena evolução. Por isso existem discussões sobre o que está bem ou mal feito, do que funciona ou não funcionará (ROYO, 2008).

4.1 TECNOLOGIA

O código fonte do Eureka esta escrito em PHP10, que “é uma linguagem de script open source de uso geral, muito utilizada e especialmente guarnecida para o desenvolvimento de aplicações Web embútivel dentro do HTML” (Manual do Eureka. Disponível em: <http://php.net/manual/pt_BR/> Acesso em 15 de outubro de 2014).

_______________ 10

PHP - um acrônimo recursivo para PHP: Hypertext Preprocessor

Analisando o código fonte do Eureka, é possível notar o quanto seu código está defasado, nos anos 90, devido à falta de uma linguagem adequada para a criação de páginas web através do HTML1, os sites eram totalmente programados a partir de tabelas. Hoje, o uso de tabelas para formatação de páginas é desaconselhado pois mistura dados e torna a programação extremamente confusa (GOMES,

Daniel.

Disponível

em:

<http://visibilidade.net/tutorial/tabelas-HTML-

Formatacao.html> acesso em 16 de outubro de 2014). Com o surgimento do HTML 5: Esta nova versão traz consigo importantes mudanças quanto ao papel do HTML no mundo da Web, através de novas funcionalidades como semântica e acessibilidade. Com novos recursos, antes só possíveis por meio de outras tecnologias. Sua essência tem sido melhorar a linguagem com o suporte para as mais recentes multimídias, enquanto a mantém facilmente legível por seres humanos e consistentemente compreendida por computadores e outros dispositivos (Wikipédia. Disponível em <http://pt.wikipedia.org/wiki/HTML5> Acesso em 15 de outubro de 2014).

O HTML 5 adiciona várias funções sintáticas a programação, o que ainda torna o código fonte mais simples e legível, combinada com o CSS 3 -Cascading Style Sheets. Onde se define estilos para páginas web com efeitos de transição, imagem, e outros, que dão um estilo novo às páginas Web em todos os aspectos de design do layout (Wikiédia. Disponível em <http://pt.wikipedia.org/wiki/CSS3> Acesso em 15 de outubro de 2014).

4.2 DESIGN PENSADO

A inovação conduzida pelo design veio acrescentar a visão do mercado de que para inovar é preciso focar no desenvolvimento ou integração de novas tecnologias (VIANNA; VIANNA; ADLER; LUCENA RUSSO, 2012). O Design Thinking inova principalmente ao introduzir novos significados aos produtos e serviços. Uma vez que “as coisas devem ter forma para serem vistas, mas devem fazer sentido para serem entendidas e usadas” (KRIPPENDORF, 1989). Para que a comunicação seja eficiente, é necessário que seja atraente visualmente, que as informações tenham uma hierarquia correta, que as cores sejam adequadas e que transmita a mensagem com consistência.

Design Thinking é o conjunto de métodos e processos para abordar problemas, relacionados à aquisição de informações, análise de conhecimento e propostas de soluções. Como uma abordagem, é considerada a capacidade para combinar empatia em um contexto de um problema, de forma a colocar as pessoas no centro do desenvolvimento de um projeto; criatividade para geração de soluções e razão para analisar e adaptar as soluções para o contexto (VIANNA; VIANNA; ADLER; LUCENA RUSSO, 2012). Assim, um processo de design thinking pode ser dividido, mas não sequenciado em 4 etapas:  Imersão, é quando se aproxima de um problema, a partir das mais diversas perspectivas e pontos de vistas.  Análise e Síntese, os dados coletados na fase de imersão devem ser submetidos a uma fase de análise e síntese, de forma a serem organizadas e criar padrões identificáveis, dentro de uma lógica que permita a compreensão do problema.  Ideação, é a fase onde o perfil de um público alvo é definido, brainstorms são criados, nessa fase os usuários (público) e profissionais da área são envolvidos no projeto, de forma a obter várias perspectivas e um melhor resultado.  Prototipação: É o momento que ideias tornam-se conteúdo formal e material, de forma a representar a realidade capturada e propiciar a validação de todo o conteúdo estudado. Apesar de ser apresentado como fase final do processo de design thinking, ele pode permear todo projeto, de forma a acontecer simultaneamente com a imersão, análise e síntese, e ideação.

4.3 DESIGN RESPONSIVO E DESIGN FLUÍDO

O design responsivo parte da ideia que as telas com resolução menor não podem ser ignoradas, e desenvolver uma versão para desktop e outra para mobile não é uma atitude muito inteligente. A solução foi criar um design que “responda” de maneira diferente de acordo com o dispositivo e assim “apresente” o conteúdo de

uma

maneira

diferente

(GUERRATO,

Daniela.

Disponível

<http://blog.popupdesign.com.br/design-responsivo-i-o-que-e-e-por-que-usar/> Acesso em 16 de outubro de 2014). O design fluído parte da ideia de se fazer interfaces que se adaptam ao tamanho do monitor ou dispositivo. Se baseia em usar valores percentuais ao invés de absolutos para as tags HTML que delimitam as áreas do site, ou seja, ao invés de declarar a largura do site com valores absolutos em pixels (px), usamos valores proporcionais em percentual (%). Desta forma o site e suas subpartes ocuparão uma área relativa ao tamanho da janela do navegador do usuário (BARROS, Bruno. Disponível em <http://www.designadaptavel.com.br/artigos/layout-fluido-ou-liquido> Acesso em 16 de outubro de 2014).

4.4 ERGONOMIA E USABILIDADE

Segunda a ISSO/IEC 9126: Usabilidade refere-se à capacidade de um software ser compreendido, aprendido utilizado e ser atraente para o usuário, em condições específicas de uso. A parte 11 da norma ISSO 9241 descreve as orientações sobre usabilidade de software, em que incluem orientações sobre como a usabilidade pode ser especificada e avaliada como parte de um plano de qualidade. “Usabilidade é a efetividade, eficiência e satisfação com que um produto permite atender aos objetivos específicos de usuários específicos em um contexto de uso específico” Descreve as características de: a) Eficácia: grau de realização de objetivos perseguidos na interação; b) Eficiência: recursos alocados para alcançar estes objetivos; c) Satisfação: Grau de aceitação do produto pelo usuário;

4.4.1 O TESTE DE USABILIDADE

O teste de usabilidade ou utilizabilidade é realizado com a observação da interação de usuários no mundo real ou sob condições controladas. Os avaliadores

reúnem os dados dos problemas detectados no uso e verificam se a interface suporta o ambiente e as tarefas do usuário. Algumas vantagens do teste de usabilidade, segundo Jeffries (1991): a) Indica as reações dos usuários potenciais ao sistema; b) Mostra os problemas ou as falhas do sistema; c) Mostra onde o sistema funciona bem; d) Ajuda a avaliar as características do projeto e os conflitos; e) Fornece ideias para o projeto, por meio das sugestões dos usuários; f) Fornece meios para comparação de múltiplos usuários; g) Fornece suporte para um aperfeiçoamento adicional do projeto; h) Promove participação do uso

5 CONSIDERAÇÕES FINAIS

O Eureka é um sistema bem estruturado, e com milhares de usuários e consequentemente, milhares de acessos diários, porém apresenta problemas e dificuldades de uso da sua interface pelos usuários, conforme analisado através dos gráficos de acesso do sistema. O foco principal do projeto é fazer uma pesquisa com os usuários do AVA, e através desta apontar quais as falhas e dificuldades que eles encontram ao utilizarem o Eureka, através desta pesquisa desenvolver idéias para a melhoria das ferramentas e criar alternativas de interface. Após definida a interface é criado o protótipo que será submetido a teste de usabilidade com os usuários para assim identificar a ocorrência de melhorias ou novas dificuldades. Aplicando os conceitos aqui abordados e reestruturando as ferramentas que são pouco ou mal exploradas. Assim teremos um Ambiente Virtual de Aprendizagem melhor e que estimulará ainda mais o processo de ensino-aprendizagem entre alunos e docentes.

LISTA DE TERMOS

AVA - Ambiente Virtual de Aprendizagem BETA – Versão de um produto (geralmente software) que ainda se encontra em fase de desenvolvimento e testes. CSS – Abreviação para a expressão inglesa Cascading Style Sheets, que significa Folha de Estilos em Cascata. Design Fluído – Técnica de estruturação HTML e CSS, em que a aplicação se adapta a diversos dispositivos através do uso de porcentagem. Design Responsivo – Técnica de estruturação HTML e CSS, em que a aplicação se adapta a diversos dispositivos através da quebra do layout em colunas. Design Thinking – Conjunto de métodos e processos para abordar problemas. Ergonomia – Qualidade de adaptação de uma máquina ao seu operador, proporcionando um eficaz manuseio e evitando um esforço extremo do trabalhador na execução do trabalho. Eureka – Ambiente Virtual de Aprendizagem da PUCPR GNU – Licença Pública Geral HTML - Abreviação para a expressão inglesa HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto. LAMI – Laboratório de Mídias Interativas NTE – Novas Tecnologias Educacionais PHP - Hypertext Preprocessor TCP/IP – TCP significa Transmission Control Protocol (Protocolo de Controle de Transmissão) e o IP, Internet Protocol (Protocolo de Internet). TIC - Tecnologia de Informação e Comunicação Usabilidade – Conjunto de métodos destinados a melhorar o uso de determinado produto.

REFERÊNCIAS

BONASSINA, Ana Lucia Berno. Ambientes Virtuais de Aprendizagem: Uma proposta para inclusão de escolares hospitalizados. Curitiba: PUCPR, 2008. CYBIS, Walter; BERTIOL, Adriana Holtz; FAUST, Richard. Ergonomia e usabilidade: Conheicmentos, Métodos e Aplicações. São Paulo: Novatec, 2007. FRANCO, Marcelo Araújo. Ensaio sobre as tecnologias digitais da inteligência. Campinas: Papirus, 1997. GARRIDO, Susane Martins Lopes. Planejamento. Curitiba: IESDE, 2009. GOMES, Daniel. Porque é que as tabelas para formatação são desaconselhadas em web design?, 2011. Disponível em: < http://visibilidade.net/tutorial/tabelasHTMLFormatacao.html>. Acesso em 16 out 2014. HARASIM, Linda; TELES, Lucio; TUROFF, Murray; HILTZ, Starr Roxanne. Redes de aprendizagem: Um guia para ensino e aprendizagem online. Tradução de Ibraíma Dafonte Tavares. São Paulo: Senac, 2005. JEFFRIES, Robin et. al. User interface evaluation in the real world: a comparison of four techniques, in CHI-91 human factors in computing systems. 1991. JOHNSON, Steve. Cultura da interface: como o computador transforma nossa maneira de criar e comunicar. Tradução de Maria Luiza X. de A. Borges. Rio de Janeiro: Jorge Zahar, 2001. Manual do Eureka, Disponível em: < https://eureka.pucpr.br/manual/manual.pdf>. Acesso em: 09 out 2014. MATOS, Elizete Lúcia Moreira (Org.); GOMES, Péricles Varella (Org.). Uma experiência de virtualização universitária: O Eureka da PUCPR. Curitiba: Champagnat, 2003. MATOS, Elizete Lúcia Moreira. O Eureka da PUCPR: Uma grande ideia. Curitiba: PUCPR, 2004. PEREIRA, A. T. C. Ambientes virtuais de aprendizagem em diferentes contextos. Rio de Janeiro: Ciência Moderna, 2007.

PREECE, Jennifer; ROGERS, Yvonne; SHARP, Helen. Tradução de Viviane Possamai. Design de interação: Além da interação homem-computador. São Paulo: Bookman, 2005. ROYO, Javier. Design Digital: fundamentos do design. São Paulo:Rosari, 2008. SATIKO, Edna; TREBIEN, Eiri. Software educacional: Modelo de desenvolvimento. União da Vitória: FACE, 2003. TORRES, Patrícia Lupion. Laboratório on-line de aprendizagem: uma proposta crítica de aprendizagem colaborativa para educação. Tubarão: Unisul, 2004. VALENTINI, Carla Beatriz, SOARES, Eliana Maria Sacramento (orgs.). Aprendizagem em Ambientes Virtuais: compartilhando ideias e construindo cenários. Caxias do Sul: EDUCS, 2005. VIANNA, Maurício; VIANNA, Ysmar; ADLER, Isabel K.; LUCENA, Brenda; RUSSO, Beatriz. Design Thinking: Inovação em negócios. Rio de Janeiro: MJV Press, 2012. VILLAS BÔAS, Vitor. Moodle, 2006. Disponível em: <http://imasters.com.br/artigo/4600/e-learning/ambientes-virtuais-deaprendizagemmoodle-x-plataformas-pagas/>. Acesso em: 10 out 2014.