1
Class Progress
2
MEMORIAL DESCRITIVO CLASS PROGRESS Everton Asmé - 2º Semestre - 2015 Desenho Industrial - Habilitação Design Digital Pontifícia Universidade Católica do Paraná
Acesso ao projeto Digital.
Class Progress
3
SUMÁRIO O PROJETO ........................................................................ 4 1. 2. 3. 4. 5. 6. 7.
Objetivo ................................................................................4 Motivação .............................................................................5 Problematização ..................................................................6 Soluções e justificativa ........................................................7 Projeto inicial .......................................................................7 Mudança de foco .................................................................8 Público alvo ..........................................................................8 7.1. Painel semântico do público alvo .......................................... 9
8. Funcionalidades .................................................................10 9. Contexto de uso ..................................................................11 10.Mapa conceitual ................................................................. 12
LINGUAGEM VISUAL ......................................................... 13 1. Nome do projeto .................................................................13 1.1. Brainstorm e busca de similares.......................................... 13
2. Logotipo .............................................................................14 2.1. Painel semântico de referências.......................................... 14 2.2. Desenvolvimento de soluções ............................................. 15 2.3. Logotipo finalizado............................................................... 15
3. Utilização do material design ............................................16 3.1. Princípios.............................................................................. 16 3.2.Tipografia ................................................................................ 17 3.3. Cores ..................................................................................... 18 3.4. Ícones ................................................................................... 18
INTERFACE E USABILIDADE ............................................. 22 1. Interação ............................................................................23 1.1. Fluxograma ............................................................24 1.2. Wireframe ...............................................................24
PROTÓTIPO ...................................................................... 28 1. Propostas adicionais ao projeto .........................................28
BENCHMARKING .............................................................. 29 1. Análise de similares ............................................................29 2. Comparativo ........................................................................31
BIBLIOGRAFIA .................................................................. 32 ANEXOS............................................................................... 33
Class Progress
4
O PROJETO O Class Progress é um projeto de aplicativo que pretende complementar a sala de aula como uma ferramenta assistencial para o professor, potencializando a interação e colaboração entre aluno e professor. Além de ser uma ferramenta de resumos e histórico de aula para o aluno, o aplicativo oferece uma análise de desempenho simplificado. Com esses dados é possível avaliar a qualidade de absorção do conteúdo e a qualidade do aprendizado que sua aula promoveu. Os dados são retirados de um questionário rápido e objetivo em que pode conter uma resposta correta ou não, postado a cada aula, juntamente com resumo e referências como links, videos, imagens e upload de arquivos que foram abordados durante a aula.
1. Objetivo O objetivo do Class Progress é complementar a aula do professor. Propor maior interatividade entre professor e aluno. Possibilidade de avaliar a qualidade de absorção do conteúdo e aprendizado que sua aula promove, podendo mudar sua estratégia. A ideia é tornar as aulas mais eficientes e manter o conteúdo sempre disponível ao aluno a qualquer momento. Quanto a utilização do aplicativo, o objetivo é atingir professores de várias áreas do conhecimento, sejam eles de instituições de ensino ou professores independentes que gostem de se manter atualizados e busquem sempre inovar seu método didático. O projeto tem como base o sistema operacional iOS da Apple, feito inicialmente para iPad, pois seu uso para um professor é mais eficiente. Após a criação dos layouts é possível transportá-lo para outros dispositivos facilmente usando as mesmas características.
Class Progress
5
2. Motivação A motivação para criar um aplicativo educacional veio de vários lugares sendo alguns destes o interesse de trabalhar com educação, a participação dos professores em meu projeto e o evento que participei em 2013, o 5º Simpósio Hipertexto. A busca para encontrar um boa solução digital para um produto educacional me fez chegar a questão: Qual a função do design na sociedade? - Segundo descrições elaboradas pelo Internacional Design Center de Berlim em 1979, “Ele não deve se ater apenas ao produto em si, mas deve responder a questões do meio ambiente, da economia de energia, da reutilização, de duração e de ergonomia.” Na virada do século 20 para 21 Bürdek (1999) sugere descrições sobre os problemas que o design deve atender. Por exemplo: ✦
Visualizar progressos tecnológicos,
✦
Priorizar a utilização e o fácil manejo de produtos
✦
Tornar transparente o contexto da produção, do consumo e da
reutilização. ✦
Promover serviços a comunicação, mas também, quando necessário,
exercer com energia a tarefa de evitar produtos sem sentido. A intenção de trabalhar com interação e comunicação dentro do ambiente de aprendizado também alterou o escopo do projeto, segundo Jennifer Preece (2013) ”Projetar produtos interativos para apoiar o modo como as pessoas se comunicam e interagem em seus cotidianos, seja em casa ou no trabalho.” Neste aplicativo transportei essa ideia para solucionar a dificuldade de interação e comunicação como apoio ao ambiente de aprendizagem. O que me fez tomar essa abordagem educacional em um aplicativo foi o artigo científico que fiz durante o curso sobre o Uso de Aplicativos Mobile na Assistência a Interação em Ambientes Colaborativos de Aprendizado, onde há conceitos de colaboratividade e compartilhamento que contribuíram para o
Class Progress
6
projeto como o design instrucional contextualizado e conceitos sobre usabilidade que estão em Anexo.
3. Problematização Após ter a ideia do projeto, fui em busca informações relacionadas ao uso de artefatos tecnológicos digitais no contexto de aprendizado. Encontrei algumas iniciativas por parte de alguns pensadores do tema, Luciano Meira aborda conceitos de inclusão digital no meio educacional em suas palestras com um título polêmico, “O fim da escola”, mas ainda assim não são muitos que conseguem se aventurar e implementar ferramentas digitais em um contexto de aprendizagem. As ferramentas que existem, em sua maioria, são complexas, exigem tempo de dedicação, é preciso realizar cursos com tutoriais, aplicativos que são mais uma forma de burocratizar o ambiente de aprendizado, não há como acompanhar o progresso de suas aulas de forma rápida, simplificada, com feedback em tempo real. Os professores tem dificuldade de implementar soluções inovadoras, aumentar o engajamento do aluno, testar formas diferentes de diálogo e desafios e aumentar o interesse dos alunos em sala de aula. A dificuldade em se obter dispositivos devido ao preço, mobilidade, locação, entre outros, impede que o professor utilize essas ferramentas. Não há a utilização dos dispositivos disponíveis nas mãos de cada aluno, os aparelhos são utilizados somente para entretenimento e nada mais. Na maioria das vezes o smartphone é um problema em sala de aula, ele não tem, ainda, utilidade para o aprendizado, isso atrapalha a aula e irrita o professor. Com o Class Progress a utilização dos dispositivos dos alunos será direcionada ao aprendizado.
Class Progress
7
4. Soluções e justificativa A proposta colaborativa e de interação do aplicativo torna-o uma ferramenta que pode potencializar a qualidade das aulas em sala. Os alunos se tornam mais conscientes de que o professor está seguindo a matéria conforme o aprendizado deles, essa colaboração e compartilhamento de conhecimento cria motivação para os alunos aprenderem mais. Segundo Reinildes Dias(2010), “A noção de compartilhamento refere-se à ideia de que alunos aprendendo juntos aprendem mais do que indivíduos trabalhando separadamente." Com os gráficos que o aplicativo fornece, o professor pode analisar o progresso de suas aulas todos os dias, retomando conteúdo, mudando estratégias, criando maior interesse pelo aluno na próxima aula.
5. Projeto inicial O projeto inicial se chamava QuickLesson e foi desenvolvido no 3º período do curso de Design Digital com meu colega e amigo Gregory Pinheiro. Este projeto foi inscrito no 5º Simpósio Hipertexto, evento realizado em Fortaleza em 2013, o projeto ficou em nono lugar entre os 10 melhores aplicativos educacionais do Brasil. Durante o decorrer do curso este projeto foi objeto de vários estudos em semiótica, psicologia do design e teoria do design. Este produto era direcionado à instituições de ensino formal públicas e privadas.
Acesso ao projeto. https://goo.gl/i9k7oF
Class Progress
8
6. Mudança de foco Quando iniciadas as aulas para o desenvolvimento do TCC, retomei o projeto pois observei seu potencial como ferramenta de apoio a aprendizagem. Agora com algumas mudanças que tornam o aplicativo mais usual e abrangente, foi pensado na facilidade de implementar essa ferramenta e dispositivos que podem ser utilizados na rotina de um professor, o questionário agora tem uma variedade de três tipos de questões diversificando as possibilidades do professor. Também é possível enviar arquivos como imagens, videos, PDFs e links com referências. A mudança visual também ocorreu, primeiramente a usabilidade, seguindo as Guidelines da Apple nos dispositivos iOS e o Material design dos smartphones que rodam Android, para tornar o app mais leve e simples de utilizar pensando no sistema operacional do dispositivo. Abordo esse assunto nos capítulos seguintes. Independente de qual área do conhecimento, qualquer professor pode usar o aplicativo, sendo ele um profissional da educação formal ou o professor que é independente e de áreas variadas.
7. Público alvo O público alvo foi separado em dois, o primário mais importante e com foco principal do funcionamento do aplicativo e o secundário o aluno com funcionalidades básicas e simplificadas. Primário: Professor. Professores do ensino fundamental à superior, técnico, línguas, música, entre outros interessados por inovações e tecnologia. Professores que tem acesso a dispositivos móveis, smartphones ou tablets, sendo iOS ou Android, que tenham contato com a sala de aula e desejam acompanhar o progresso de aprendizado. Secundário: Aluno. Pré-Adolescentes, adolescentes e adultos a partir de 11 anos de idade que estão cursando o ensino fundamental
Class Progress
9
à superior, aqueles que estão cursando o EJA (Educação de Jovens e Adultos), alunos de escolas de inglês, música e uma variedade de pessoas que tem um professor. Estes usuários tem acesso a smartphones ou tablets, sendo iOS ou Android e que tenham interesse em novas tecnologia.
7.1. Painel semântico do público alvo Com base no público alvo mencionado acima, criei um painel semântico, exemplificando seu contexto de uso.
Painel semântico do público alvo.
Class Progress
10
8. Funcionalidades Pensando no contexto de uso e como o professor vai interagir com seus alunos tentei tornar o aplicativo o mais simples possível de se utilizar durante a aula em sala. O produto terá dois logins diferentes e cada usuário tem o seu limite de interações. Professor: ✦
Criar matérias, salas e aulas;
✦
Cada aula tem um resumo e referências;
✦
Fazer o upload de arquivos de texto, imagens e links com textos ou
apresentações relacionados a aula; ✦
A cada post insere uma questão sobre o assunto da aula, essa
questão pode ter uma resposta correta ou não, sendo três categorias de perguntas: a. Objetiva com uma única resposta correta; b. Enquetes para gerar debates (não se leva este tipo de questão em consideração para gerar gráficos desempenho); c. Questão verdadeiro e falso. ✦
Visualiza o desempenho da matéria e das aulas separadamente com
base nos questionários; ✦
Verifica comentários de alunos para esclarecer dúvidas na próxima
aula. Aluno: ✦
Visualiza o histórico de aulas, resumo e questionários;
✦
Responde questionários;
✦
Comenta as aulas com dúvidas.
Class Progress
11
9. Contexto de uso O aplicativo não deve substituir a aula do professor, nem diminuir o tempo de aula pois essa ferramenta depende dessa interação presencial entre aluno e professor. Esta ferramenta deve complementar e facilitar o acompanhamento do progresso de suas aulas. Para exemplificar o contexto de uso criei duas situações que podem ajudar a entender como o aplicativo funciona: Exemplo 1: 1. O professor prepara e da sua aula normalmente; 2. Ao final da aula ele abre o aplicativo Class Progress e segue as etapas
até a turma; 3. Cria um post com o resumo e uma questão sobre o conteúdo do dia,
ao criar esse post todos os alunos da turma recebem uma notificação; 4. O professor pede para que os alunos respondam essa questão ao
final da aula; 5. Quando o professor preparar a próxima aula, ele verifica o
desempenho da aula e lê os comentários sobre a aula. Com base nesses dados observa se o conteúdo foi ou não absorvido de forma aceitável pelos alunos; 6. O professor retoma o conteúdo ou muda sua estratégia didática e faz
um novo teste para a próxima aula. Exemplo 2: 1. O professor cria o post com o resumo da aula com a questão de
enquete sem resposta correta para um debate em sala. 2. O Professor vê os resultados e pode iniciar uma discussão sobre o
assunto abordado; 3. No final da aula o professor pode criar um novo resumo e uma nova
questão, que agora tem uma resposta correta. 4. Utiliza esses dados para acompanhar o progresso da turma.
Class Progress
12
10.Mapa conceitual Para facilitar o entendimento conceitual do aplicativo foi necessário a criação de um mapa, descrevo as funcionalidades básicas do aplicativo e a diferença de uso entre professor e aluno no seu contexto de uso.
Class Progress
13
LINGUAGEM VISUAL Com uma arquitetura complexa o usuário precisa se manter livre de dificuldades, ainda mais se tratando de um aplicativo que pretende complementar a sala de aula. Foi necessário pensar em cores específicas, formas, ícones de fácil reconhecimento e tipografia adequada para a leitura e legibilidade em dispositivos móveis valorizando o conteúdo e melhorar a praticidade em sua utilização. Segundo Niemeyer (2000), "O nível de atendimentos dos requisitos de usabilidade são determinados por três critérios ergonômicos: legibilidade, leiturabilidade e pregnância”.
1. Nome do projeto Depois de várias pesquisas, cheguei a um nome ligado às funcionalidades do aplicativo e a tradução de um conceito abstrato do aplicativo para um nome e uma forma o visual, abaixo seguem as etapas por onde passei.
1.1. Brainstorm e busca de similares Utilizando essa técnica de dinâmica em grupo para explorar a potencialidade criativa dos indivíduos do grupo, chegamos ao objetivo, mas antes passamos por estes nomes e pelas pesquisas referente a utilização, se alguma empresa já usava, domínio livre ou não e se já existe um serviço com nome parecido. Quick Lesson
Teach All
Learn Hand
School Helper
SchoolDevice
plusLesson
Class Progress
PluSchool
PocketSchool
ClassProgress ou Progresso em Sala de Aula em português, o nome selecionado passa o conceito do aplicativo que trata do
Class Progress
14
progresso em sala de aula, o desenvolvimento e desempenho, pensando também no design instrucional contextualizado abordado no artigo em anexo.
2. Logotipo O logotipo relacionado ao nome tem a intenção de passar o conceito do progresso de aulas no aplicativo, utilizando como base o fractal que representa a evolução contextualizada do design instrucional.
2.1. Painel semântico de referências Abaixo seguem alguns exemplos de imagens que busquei para criar o conceito da logo.
Referências para o desenvolvimento da logo. Imagens do Google.
Class Progress
15
2.2. Desenvolvimento de soluções Desenvolvi vários rafes da logo utilizando o software Adobe Illustrator, trabalhando com vetores para chegar a uma solução leve e fluída.
Class
class Progress
Progress
2.3. Logotipo finalizado Para chegar ao logotipo final realizei uma pesquisa com as opções em desenvolvimento demonstrando a um grupo de pessoas que conhecem o conceito e outro que não sabe do que se trata o projeto, o logotipo com maior receptividade foi este:
Class Progress
16
3. Utilização do material design Material Design é uma nova linguagem visual criada e ainda em desenvolvimento pelo Google, uma linguagem visual para usuários que sintetiza os princípios clássicos de um bom design utilizando as tecnologias disponíveis para melhorar a experiência do usuário com seus dispositivos móveis e Web em computadores. Utilizei essa linguagem devido a facilidade de representar uma determinada função, a melhor visualização e novas formas de interação. Um sistema que permite uma experiência unificada em todas as plataformas e tamanhos de dispositivos, conhecido como Design Responsivo.
3.1. Princípios O Google apresenta três princípios que atuam no conceito do Material Design. Formas de criar significado utilizando hierarquia, metáforas que tornam o aplicativo mais atraente e interativo, movimentos que funcionam como feedback para o usuário. Utilizei estes princípios principalmente no ícones.
Metáfora
Corajoso, intencional
Realidade tátil, inspirado no estudo de papel e tinta, mas tecnologicamente avançado.
Eles criam hierarquia, significado e foco.
Link para Material Design. https://goo.gl/R1oA4U
Class Progress
Movimento fornece significado O movimento é significativo e apropriado, serve para concentrar a atenção e manter a continuidade.
17
3.2.Tipografia Busquei em várias bibliotecas tipográficas, uma delas, o Google Fonts com algumas licenças livres para uso. Como o aplicativo também será para dispositivos Android então foi preferível utilizar a família Roboto que é uma fonte nativa. De acordo com Christian Robertson que é o criador da fonte Roboto: ela tem duas naturezas, um mecânica com formas geométricas grossas. Ao mesmo tempo, a fonte apresenta curvas amigáveis. Isto torna o ritmo de leitura mais natural, comumente encontrado em fontes com serifa.
Link para Google Fonts. https://goo.gl/4C3xpj
Class Progress
18
3.3. Cores A busca por cores criei alguns parâmetros pretendidos para melhorar a experiência do usuário, essas cores sugerem qualidades abstratas como leveza, sofisticação, confiança, segurança. Há duas paletas diferentes, uma com as cores mais presentes no aplicativo e outra para elementos de interação como ícones e alertas.
Hex # #4A8CAE
#407E9E
#F39943
#DF8938
#4A4A4A
#B6B6B6
#E6E6E8
#F4F4F4
#F8F8F8
Paleta de cores principais da interface do aplicativo.
Hex # #4A8CAE
#407E9E
#F39943
#DF8938
#8DA552
#718147
#DD574B
#CB4C40
Paleta de cores de interações e feedbacks.
Sensação de confiança, leveza, segurança.
Agressiva, cria uma chamada.
Energia, sensação de urgência e importância.
3.4. Ícones A utilização de ícones em aplicativos é essencial para torna-lo intuitivo. O ícone deve ter uma relação de proximidade com o objeto representado, muitas das representações do aplicativo funcionam indicando outra coisa a qual esta ligada, não por semelhança mas por proximidade, conhecemos esses signos por meio de experiência subjetiva ou herança cultural. Ainda há outros que não há relação com a coisa representada, a associação dele é produzida por uma convenção cultural.
Class Progress
19
O ícone do aplicativo utiliza a logo como principal elemento, este ícone esta presente em todo o aplicativo, inclusive com uma animação de feedback de carregamento do aplicativo. Este, segue os princípios do material design com utilização de volume e forma para criar uma percepção de movimento.
Na próxima página descrevo as interações e ações realizadas por cada ícone, todos os elementos do aplicativo tem uma função clara e dinâmica. Na tabela abaixo, os ícones principais de navegação, ícones de ação e ícones informativos. Ícone
Ativo
Ação
Observação
Tela principal do aplicativo.
Independente de qual página estiver este ícone leva ao início.
Configurações.
Configurações do aplicativo e assinatura.
Tela de perfil do usuário
Informações sobre perfil e assinatura.
Tela de favoritos
Lista de aulas favoritadas separadas por seção.
Tela de informações
Informações sobre o aplicativo, desenvolvedores, etc…
Favoritar/ Desfavoritar
Favorita uma aula que vai para a lista de favoritos.
Volta
Falta para etapa ou tela anterior.
Criar Novo Curso
Nova matéria
Nova aula
Cria uma nova aula.
Class Progress
20
Ícone
Ativo
Ação
Observação Histórico de aulas
Exibe a lista de aulas ja dadas durante o curso.
Arquivos
Lista de uploads de PDFs postados durante as aulas.
Duplicar
Duplica a matéria e/ou aulas.
Excluir
Exclui aulas e matérias
Alunos
Lista de alunos dentro da matéria.
Adicionar Aluno
Adiciona alunos às matérias. Utilizado para editar qualquer tipo de conteúdo.
Editar Seleção
Seleção de resposta e seleção de configurações.
Seleção
Seleção sem uma resposta correta.
VERDADEIRO
Seleção de questões verdadeiro ou falso.
FALSO
Seleção de questões verdadeiro ou falso.
Questão / Resposta correta
A resposta está correta.
Questão / Resposta incorreta
O aluno errou a questão.
Cancela / Exclui
Cancela convites e exclui alunos da turma.
Avisos / Alertas
Notificações variadas.
Comentários
Aba de comentário de alunos.
Imagem / Sem e com
Foto de perfil e imagem que represente o curso.
Class Progress
21
Ícone
Ativo
Ação
Observação Adicionar imagem
Adicionar nova imagem. Representa o usuário.
Username Senha Email Pesquisa
A chave representa segurança, digite sua senha. Representa o email o usuário, sua caixa postal. Ícone de pesquisa separado por seção, matérias, aulas, alunos.
Class Progress
22
INTERFACE E USABILIDADE Seguindo as Guidelines, tanto da Apple como as do Google para dispositivos móveis há uma variedade de limitações e probabilidades para o desenvolvimento de uma interface com boa usabilidade. O aplicativo pretende em todas suas interações e elementos de interface seguir esse princípios. De acordo com as Guidelines da Apple a interface deve Acesse a página da Guidelines da Apple. https://goo.gl/drrAZl
incorporar os seguintes temas: ✦
Deferência. A interface do usuário ajuda as pessoas a
compreender e interagir com o conteúdo, mas nunca compete com ele. ✦
Clareza. O texto é legível em todos os tamanhos, ícones são
precisos e lúcido, adornos são sutis e apropriado, e um foco aguçado na funcionalidade incentiva o design. ✦
Profundidade. Camadas visuais em movimento realista
transmitem vitalidade e aumentam o prazer e compreensão. Segundo Gomes (2003), “do ponto de vista ergonômico, a escolha e especificação de uma determinada família tipográfica, assim como das próprias imagens a serem utilizadas, é de fundamental importância, independentemente do partido estético adotado para a configuração visual, valendo sobretudo para os signos funcionais” Como o aplicativo pode armazenar muito conteúdo foi preciso incorporar espaços negativos, são espaços limpos, sem nenhum elemento visual, o espaço negativo torna o conteúdo e funcionalidade mais visível e mais fácil de entender conteúdos importantes. Espaços negativos também podem transmitir uma sensação de calma e tranquilidade, e pode tornam o aplicativo mais focado e eficiente.
Class Progress
23
1. Interação Construção de uma interação imediata e com feedback imediato ao usuário, com interações mais simples, sem exageros, mas o suficiente para cativar o usuário e lhe oferecer a melhor experiência. Preceitos móveis são fundamentais como a entrada da interação por toque, o swipe, touch, pull, drag and drop, slide, pin.
Exemplo de movimentos na tela touth. Fonte: Guidelines da Apple.
Exemplo de Feedback do aplicativo. Fonte: Guidelines da Apple.
Class Progress
24
1.1. Fluxograma A partir do mapa conceitual e pesquisas sobre as funcionalidades foi possível estabelecer um fluxograma demostrando as funcionalidades do aplicativo.
1.2. Wireframe Seguindo o conceito, funcionalidades e o fluxograma do aplicativo, criei as telas almejando a facilidade de uso e legibilidade do aplicativo. Os Wireframes foram criados no Sketch 3, software para desenvolvimento de aplicativos e layouts variados. O formato de tela utilizado foi a tela do iPad Air Retina, 2048x1536 pixels, com o intuito de atender primeiramente ao professor tornando o aplicativo mais direto com a disposição de vários elementos na tela. Aqui apresento as principais telas do aplicativo e suas especificações.
Class Progress
25
As telas em miniatura demonstram como o aplicativo abre, tela de login e tela de cadastro e tela de cadastro definem como o aplicativo vai funcionar, pois é a hora de optar por professor ou aluno, isso pode ser alterado no menu de configurações quando o usuário quiser. 4:21PM
iPad
100%
4:21PM
iPad
100%
username Nome exemplo@mail.com
Sobrenome
Senha exemplo@mail.com Senha
Entrar
Professor
Criar conta
Aluno
Criar
Fazer login
Página principal do aplicativo, o centro de toda a gestão do de aulas e turmas. No painel de controle o usuário tem feedbacks como as notificações e avisos de alunos e comentários. 4:21PM
iPad
Cursos
100%
Painel de controle
Buscar aula
História II
Geografia Manhã História II Turma 2…nta Maria Baseball Clube Santa Monica Violino Teatro Guaíra jan
Guitarra Turma 2 do Maria Pereira Inglês Seviço Comunitário 3 2014
Origami Praça do Japão
Turma 2 Colégio Santa Maria Ultima aula: 13/02/2015
83
Desempenho
% do curso
32
Total de aulas
Alunos com baixo rendimento
Nova Aula
Aproveitamento
Martha Gibson
5 questões sem responder
80%
Christina Lawson
3 questões sem responder
40%
Amy Owens
1 questões sem responder
56%
Diana Baker
56%
Walter Cook
56%
Class Progress
26
Dentro da sala de aula no aplicativo é possível saber detalhes de aproveitamento de cada aula, nessa tela o professor cria novas aulas com resumo, documentos em anexo e imagens, juntamente com o questionário abaixo. 4:21PM
iPad
100%
História Buscar aula
A criação dos princípios da Lógica, por Aristóteles
Pronunciation and diction 2 06/19/2015
83%
13/02/2015
30%
Respostas corretas
12
5
Faltam 5 respostas
A criação dos princípios… 06/19/2015
83% (Mackenzie) "... andava pelas ruas e praças de Atenas, pelo mercado e pela assembléia indagando a cada um: 'Você sabe o que é isso que está dizendo?', 'Você sabe o que é isso em que você acredita?', ..., 'Você diz que a coragem é importante, mas o que é a coragem?', 'Você acredita que a justiça é importante, mas o que é a justiça?',..., 'Você crê que seus amigos são a melhor coisa que você tem, mas o que é a amizade?'. Suas perguntas deixavam seus interlocutores embaraçados,... descobriam surpresos que não sabiam responder e que nunca tinham pensado em suas crenças e valores ... ... as pessoas esperavam que ele respondesse, mas para desconcerto geral, dizia: 'Não sei, por isso estou perguntando.' Daí a famosa frase: 'Sei que nada sei' ".
How to use the verb want 06/19/2015
83% Most used expressions 06/19/2015
54%
jan
Pronunciation and diction 06/19/2015
30% Pronunciation and diction 2 06/19/2015
100%
2014
How to use the verb want 06/19/2015
95%
Abaixo, as abas de questionários sendo uma questão objetiva de múltipla escolha, no meio a questão de verdadeiro ou falso e por último a questão tipo enquete sem uma resposta correta, para gerar debates e discussões. Porcentagem de acertos
Faltam 5 respostas
Porcentagem de respostas
80%
Cras quis nulla commodo, aliquam lectus sed, blandit augue. Cras ullamcorper bibendum bibendum. Duis tincidunt urna non pretium porta. Cras quis nulla commodo, aliquam lectus sed, blandit augue. Cras ullamcorper bibendum bibendum. Duis tincidunt urna non pretium porta.? A. Sed vel tristique quam. B. Donec facilisis tortor ut augue lacinia, at viverra est semper. C. Vestibulum rutrum quam vitae fringilla tincidunt.
Faltam 5 respostas
80%
1. A economia dos gregos baseava-se no cultivo de oliveiras, trigo e vinhedos. O artesanato grego, com destaque para a cerâmica, teve grande a aceitação no Mar Mediterrâneo. As ânforas gregas transportavam vinhos, azeites e perfumes para os quatro cantos da península? A. a civilização minóica B. Aspectos da história e cultura de Creta C. Vestibulum rutrum quam vitae fringilla tincidunt. D. Vestibulum rutrum quam vitae fringilla tincidunt.
Faltam responder Faltam 5 respostas Mauris dignissim semper mattis. Fusce porttitor a mi at suscipit. Praesent facilisis dolor sapien, vel sodales augue mollis ut. Mauris magna eu no tortor posuere 1. A economia dosvenenatis gregos baseava-se cultivo de oliveiras, trigo e vinhedos. O luctus. Aenean tincidunt turpis sedpara dui aliquam vehicula. artesanato grego, com destaque a cerâmica, teve grande a aceitação no Mar Mauris venenatis tortor posuere luctus. vinhos, azeites e perfumes para os Mediterrâneo. As magna ânforaseugregas transportavam quatro cantos da península?
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut pretium pretium tempor. Ut 60% eget imperdiet neque. In volutpat ante semper diam molestie, et aliquam erat laoreet. Sed sit B. Aspectos da história e cultura de Creta amet arcu aliquet, molestie justo at, auctor nunc. 20% id, Phasellus ligula ipsum, volutpat eget semper viverra eget nibh. C. Vestibulum rutrum quam vitae fringilla tincidunt. A. a civilização minóica
60%
D. Vestibulum rutrum quam vitae fringilla tincidunt. 10%
Class Progress
27
Pronunciation and diction 2
A criação dos princípios da Lógica, por Aristóteles
83%
13/02/2015 Nome da aula
12
Respostas corretas
tela dinâmica, uma caixa se abre sobre a
A criação dos princípios…
Anexos How to use the verb want
Links Most used expressions
Pronunciation and diction
A inserção de conteúdo funciona com uma
Faltam 5 respostas
tela e deixa a função em evidência com
Escreva um resumo de sua aula aqui. 83% (Mackenzie) "... andava pelas ruas e praças de Atenas, pelo mercado e pela assembléia indagando a cada um: 'Você sabe o que é isso que está dizendo?', 'Você sabe o que é isso em que você acredita?', ..., 'Você diz que a coragem é importante, mas o que é a coragem?', 'Você acredita que a justiça é importante, mas o que é a justiça?',..., 'Você crê que seus amigos são a melhor coisa que você tem, mas o que é a amizade?'. Suas perguntas deixavam seus interlocutores embaraçados,... descobriam 54% surpresos que não sabiam responder e que nunca tinham pensado em suas crenças e valores ... Verdadeiro ou Falso Enquete Multipla escolha ... as pessoas esperavam que ele respondesse, mas para desconcerto geral, dizia: 'Não sei, por isso estou perguntando.' Daí a famosa frase: 'Sei que nada 30% O que é o que é? sei' ".
facilidade para a inserção das questões. 4:21PM
iPad
Editar Curso
História Level 2 - Grupo 1 History Level 2 - Group 4
Pronunciation and diction 2
Inserir imagem Nome do Curso
Baseball Level 2 - Grupo 2
100% How to use the verb want
100%
Cursos Buscar matéria
Violino Level 1 - Grupo 5
Resposta 1
Aguardando confirmação
jan
Guitarra Level 9 - Grupo 3
95% Resposta 2
Inglês Level 8 - Grupo 4
Resposta 2
Origami Level 1 - Grupo 8
4:21PM
100%
Perfil
Eugene Davidson
BASIC
PLUS
bwells@jaxnation.mil
Cadastrados
4:21PM
100%
Configuração
Update photo
Info
Eugene Davidson
Programadores
English teacher
PREMIUM
jwebb@yakijo.net +55 41 9101 0010
Usado 3 mb / 50 mb por mês
Eugene Davidson
Professor
Anthony Gomez
Jonathan Black
Daniel Walters
Jack Kennedy
jwebb@yakijo.net
jwebb@yakijo.net
Usuário desde Outubro de 2008
Alterar seu login para:
4 Alunos de 5.
Update da conta
Aluno
Você não perdera nenhum dado pois tudo está salvo na nuvem. Você pode alterar seu login sempre que necessário.
Perfil
jroberts@yodo.mil
Tela de edição do curso, adicionar e excluir alunos, editar nome, turma e imagem do curso. iPad
Usuário desde Outubro de 2008
Update da conta
kaustin@demimbu.gov
Martha Gibson
Salvar Aula
Configuração
jwebb@yakijo.net
ljacobs@vitz.gov
2014
iPad
Level 3 Group B
exemplo@mail.com
BASIC
PLUS
jwebb@yakijo.net
PREMIUM
Usado 3 mb / 50 mb por mês
Info
4 Alunos de 5.
Logout
Perfil
jwebb@yakijo.net
Designer
Everton Asmé everton@pomba.design
Obrigado por usar o ClassProgress.
Info
Tela de configuração do aplicativo, perfil, login, assinatura, memória disponível para upload e informações. 4:21PM
iPad
100%
Class
Add
Buscar matéria
exemplo@mail.com
History Level 2 - Group A
Suporte e dúvidas: support@quicklesson.com
Tela de informações, desenvolvedores, suporte e dúvidas.
Awaiting confirmation jwebb@yakijo.net
English Level 5 - Group D Baseball Strategies Level 2 - Group E Violin Level 1 - Group A Guitar Level 9 - Group F Japonese Level 8 - Group A Origami Level 1 - Group B
kaustin@demimbu.gov bwells@jaxnation.mil
Confirmar convite? ljacobs@vitz.gov
Um email será enviado para o aluno adicionado. Registered Cancelar
OK
Martha Gibson
jroberts@yodo.mil
Christina Lawson
ehansen@twitterbeat.info
Amy Owens
vmoore@skimia.info
Diana Baker
thawkins@ntag.net
Walter Cook
cmorrison@topicblab.com
Kelly Robinson
clawrence@quatz.com
Tela de avisos, Feedbacks importantes sobre alterações no aplicativo como adição ou exclusão.
Class Progress
28
PROTÓTIPO O protótipo foi criado em baixa fidelidade ao que o aplicativo pode proporcionar ao professor já que grande parte do projeto foi dedicada a qualidade da interface e montagem de telas, estão presentes as telas principais do aplicativo com seus links de ligação com outras telas. O protótipo foi desenvolvido no simulador online Marvel, onde é possível criar interações, efeitos de troca de tela entre outros.
Acesso ao protótipo. https://goo.gl/MuZOkm
1. Propostas adicionais ao projeto Há muitas propostas adicionais para este projeto, mas como proposta adicional principal ficam o desenvolvimento da área do aluno, acredito que o prazo para a finalização de um projeto complexo como este deveria ser bem maior e com mais pessoas envolvidas, e a realização de testes mais efetivos e variados. Um protótipo fiel ao produto, com todas as telas possíveis e feedbacks necessários para a utilização do aplicativo e o desenvolvimento de uma Leading page ou site para apresentar o projeto e suas funcionalidades, agregando páginas em redes social como o Facebook, Twitter e Instagram para o melhor acompanhamento do público no desenvolvimento do projeto.
Class Progress
29
BENCHMARKING Processo em que avalio as outras empresas ligadas a educação que dispõe de aplicações web ou não, por meio do qual incorporei os melhores desempenhos e qualidades que podem aperfeiçoar o produto, além de verificar as similaridades com o projeto Class Progress.
1. Análise de similares Os similares que encontrei em sua maioria são destinados a web, a maioria sem aplicativo, utilizadas como ferramenta de histórico de aulas e outras mais complexas, com lista de presença, provas e toda sala de aula dentro das aplicações. Segue abaixo os principais aplicativos que analisei, disponibilizei os links das ferramentas para verificação das funcionalidades e demais dúvida. Todos os aplicativos tendem ao EAD.
Link para site Edmodo https://goo.gl/9nslu1
A empresa disponibiliza acesso em todos os dispositivos, seu layout é muito parecido com o Facebook, há um feed onde tudo fica. O design é simples e bem organizado, porém é bem complexo com muitas tarefas disponíveis, algo que involuntariamente tenta substituir a sala de aula para o ambiente virtual.
Class Progress
30
Link para site da Blackboard http://goo.gl/7dKmRG
Esta um empresa tem vários serviços. Entre eles o educacional, o aplicativo peca em interface, tomando como base as Heurísticas de Nielsen esse aplicativo deve solucionar alguns problemas presentes. A interface poderia ser mais simples e com interações claras ao usuário. Os principais critérios para a avaliação dos aplicativos foram: ✦
A disponibilidade em dispositivos móveis;
✦
Funcionalidades similares aos do Class Progress;
✦
Ramo educacional;
✦
Qualidade visual;
✦
A utilização de cores;
✦
Ícones e demais elementos da interface.
Class Progress
31
2. Comparativo Essa comparação tem os seguintes critérios, os dispositivos onde as ferramentas analisadas estão disponibilizadas, se tem aplicativo, se funciona no navegador e quais sistemas operacionais estas ferramentas estão disponíveis.
Ferramenta
Navegador
iOS
Android
Gratuito
Assinatura
Aparenta facilidade de uso
!
!
Legenda:
SIM
INDEFINIDO - Não atende as qualidades
Class Progress
NÃO
32
BIBLIOGRAFIA SANTAELLA, Lucia. - Semiótica Aplicada - São Paulo: Editora Thomson Learning, 2002. KRUG, Steve. Não me faça pensar: Uma abordagem de bom senso à Usabilidade na Web. 2 ed. Rio de Janeiro: Alta Books, 2008. BÜRDEK, Bernhard E. História, Teoria e Prática do Design de Produtos/ Bernhard E. Bürdek; tradução Freddy Van Camp. 1.Ed. São Paulo: Edgard Blücher, 2006. FILATRO, Andrea. Design instrucional contextualizado: Educação e Tecnologia. 3 ed. São Paulo: Senac, 2003. 215 p. PREECE, Jennifer. SHARP, Helen. ROGERS, Yvonne. Design de Interação: Além da Interação Homem-computador. 3 ed. Porto Alegre: Bookman, 2013. NIELSEN, Jakob. BUDIU, Raluca. Mobile Usability. New Riders Publishing 2012. DIAS, Reinildes. WebQuests no processo de aprendizagem de L2 no meio on-line. In: MENEZES, Vera Lúcia. Interação e aprendizagem em ambiente virtual. 2 ed. Belo Horizonte: Invenção, 2010. p. 359. NIEMEYER, Lucy. Design no Brasil. Rio de Janeiro: 2AB, 1998. GOMES Fo, João. Gestalt do Objeto: Sistema de leitura visual da forma. São Paulo: Escrituras editora, 2000. GOMES Fo, João. Ergonomia do objeto: Sistema técnico da leitura ergonômica. São Paulo: Escrituras Editora, 2003. Procedimentos - Information Architecture Tutorial - By Webmonkey Staff. Disponível em: <http://www.webmonkey.com/2010/02/ Information_Architecture_Tutorial> Acesso em 28 ago. 2015. Heurísticas de Jakob Nielsen. Disponível em: <http://www.nngroup.com/ search/?q=heuristic> Acesso em 28 ago. 2015.
Class Progress
33
ANEXOS ARTIGO .......................................................................35 MEMORIAL PROJETO INICIAL ....................................45 Briefing ...............................................................................45 Benchmarking ..................................................................49 Geração de alternativas ..................................................52 PRÊMIO HIPERTEXTO 2013 .......................................57
Class Progress
34
ANEXOS
Class Progress
35 USO DE APLICATIVOS MOBILE NA ASSISTÊNCIA A INTERAÇÃO EM AMBIENTES COLABORATIVOS DE APRENDIZADO USING APPLICATIONS MOBILE AT ASSISTANCE INTERACTION IN COLLABORATIVE LEARNING ENVIRONMENTS Autor: Everton Asmé1 Orientador: Juliana Pereira de Sousa2 Sabrina Talita de Oliveira3
RESUMO Este artigo discute noções sobre o uso de aplicativos mobile como ferramenta na assistência à interação entre aluno e professor em ambientes colaborativos de aprendizado. Aborda conceitos como design instrucional contextualizado, noções teóricas do design, bem como plataformas e artefatos tecnológicos disponíveis. Com um processo de aprendizado contínuo e colaborativo aliada ao uso de plataformas digitais, é possível prospectar novas abordagens quanto a aprendizado, e que pode auxiliar o professor a tornar seu conteúdo móvel e acessível. O uso dessas ferramentas de forma assistencial pode em determinadas áreas de estudo, favorecer a preparação de aulas, debates e interação entre os envolvidos. Palavra-chave: Design Instrucional, Assistência a Educação, Ambientes de aprendizagem.
ABSTRACT This article discusses notions about the use of mobile applications as a tool to assist the interaction between student and teacher in collaborative learning environments. Addresses concepts such as contextualized instructional design, theoretical notions of design as well as platforms and available technological artifacts. With a continuous and collaborative learning process combined with the use of digital platforms, you can prospect new approaches to learning, and can help the teacher to make your mobile content and affordable. The use of these assistive tools can form in certain areas of study, favoring the preparation of lessons, discussions and interaction among stakeholders. Keyword: Instructional Design, Educational Assistance, Learning Environments.
1
Aluno do curso de Desenho Industrial com habilitação em Design Digital da PUCPR Professora do curso de Desenho Industrial com habilitação em Design Digital da PUCPR 3 Professora do curso de Desenho Industrial com habilitação em Design Digital da PUCPR 2
36
1. INTRODUÇÃO Há uma percepção de que a educação presencial necessita de novas abordagens para acompanhar esse desenvolvimento tecnológico digital. O ensino presencial é o mesmo utilizado desde a criação da escola tradicional onde alunos sentam em carteiras e escutam o discente. O caso se torna ainda mais complexo quando pensamos na substituição desse método, pois existem estudos do Programa Internacional de Avaliação de Estudantes (PISA) que indicam estudantes que usam frequentemente computadores na sala de aula não absorvem conteúdo de forma satisfatória. Estudantes de países como Singapura e Coréia do Sul passam 10 min por dia utilizando o computador e tem as melhores notas de matemática, leitura e ciências4. Deve-se pensar em algo que complemente e potencialize o aprendizado, aproximando o aluno e o professor.
Como tornar a aprendizagem mais móvel, dinâmica e atrativa? Leva-se em consideração que as escolas, em sua maioria não está preparada para aderir a tecnologias digitais. “A falta de infraestrutura específica nas escolas também é um fator que dificulta a implantação de computadores e tablets.” 5. E as instituições educacionais que tem essas ferramentas não as utilizam como assistência continua, sendo assim, os professores não estão usufruindo do potencial que estes artefatos tecnológicos podem oferecer. Precisa-se criar essa interação com baixo investimento, pois instituições que disponibilizam acesso a dispositivos que possibilitam essa interação são inacessíveis a maioria da população brasileira. A forma de avaliar o aluno com a utilização dessas ferramentas, deve também, ser potencializada mas sem substituir os métodos ja existentes.
Pensando na atualidade onde a maioria das pessoas está conectada, é preciso utilizar isso ao favor do aprendizado. Complementar o aprendizado tornando-o mais acessível aos alunos e professores, algo que seja móvel, prático, que todos usem no seu dia a dia. E que seja não somente acessível no quesito portabilidade, mas também em como se adquire esse artefa-
4
Disponível em: <http://g1.globo.com/jornal-hoje/noticia/2015/09/estudo-levanta-duvidas-sobre-impacto-da-tecnologia-usada-nas-escolas.html> e <http://www.oecd.org/pisa/home/> 5 MAINARDES, Carolina. O tablet chega à sala de aula. Abril de 2013. Disponível em: <http:// www.gestaoeducacional.com.br/index.php/reportagens/ensino/143-o-tablet-chega-a-sala-de-aula > Acesso em: 27 abr 2015.
37 to, por exemplo, o preço acessível, sem a necessidade que este artefato seja disponibilizado pelo professor ou instituições.
Com o avanço da tecnologia e seus artefatos, novos dispositivos surgem e podem ser aplicados não somente no cotidiano, como vem sendo disseminado na sociedade, mas também à realidade de aprendizado. Colocar em debate o uso de artefatos tecnológicos que podem auxiliar professores como uma ferramenta educacional, pode abrir novas possibilidades na educação e no desenvolvimento de aplicativos focados nesse nicho. O que buscamos com essa pesquisa é encontrar soluções inovadoras, que aumente o engajamento do aluno, formas diferentes de diálogo e desafios, tornando as aula mais interessantes como propõe o Professor Luciano Meira, em suas palestras chamadas de "O fim da escola”6 .
O objetivo deste artigo é encontrar soluções que complementem o aprendizado e que a tecnologia digital não substitua a sala de aula, mas se torne parte dela e da convivência dos alunos, professores, e outros envolvidos, potencializando a aprendizagem. Com um processo contínuo de aprendizagem colaborativa aliada ao uso de artefatos tecnológicos digitais, é possível buscar novos horizontes para o aprendizado, seja em escolas de ensino formal, a professores autônomos de áreas variadas, música, idiomas, entre outros.
Primeiramente aborda-se o conceito de design instrucional contextualizado para compreender como o ensino-aprendizado pode se desenvolver junto a artefatos tecnológicos. Como o aprendizado colaborativo pode nos ajudar a aumentar a qualidade do aprendizado e a experiência de usuário. As noções de design de interação para uma solução viável e simples para o uso contínuo no contexto de aprendizagem. E quarto e ultimo, o estudo de plataformas, artefatos tecnológicos disponíveis que podem fortalecer os métodos tradicional do professor, tornando o conteúdo mais móvel e acessível.
6
Palestra de Luciano Meira no 5º Simpósio Hipertexto na UFPE/Recife: https://www.youtube.com/ watch?v=gmZdjesmbto
38
2. CONCEITOS DE DESIGN INSTRUCIONAL CONTEXTUALIZADO Neste capitulo, encontram-se conceitos básicos de design instrucional contextualizado e como este, pode ajudar a encontrar soluções para conjugar a tecnologia e a aprendizagem num contexto de uso. Pensando em um nível macro, design instrucional, é compreendido como o planejamento do ensino e do modo como se aprende. Tradicionalmente é utilizado especificamente para a produção de materiais didáticos analógicos.
Com a utilização da tecnologia de informação e comunicação, principalmente a internet no ensino-aprendizagem, é preciso um planejamento e nova estratégias e ensino-aprendizagem. A utilização de TICs depende da infra-estrutura tecnológica do local onde será aplicada e da capacidade dos alunos de lidar com as artefatos tecnológicos. Com o apoio dessas tecnologias, o design instrucional pode receber formas efetivas de contextualização, Filatro(2004, p. 1) sita 6 características: 1. Maior personalização aos estilos e ritmos individuais de aprendizagem; 2. Adaptação às características institucionais e regionais; 3. Atualização a partir de feedback constante; 4. Acesso a informações e experiências externas à organização de ensino; 5. Possibilidade de comunicação entre os agentes do processo (professores, alunos, equipe técnica e pedagógica, comunidade); e 6. Monitoramento automático da construção individual e coletiva de conhecimentos.
Podemos utilizar o termo design instrucional contextualizado para descrever intencionalmente o planejamento, desenvolvimento e aplicação de situações didáticas específicas, valendo-se das tecnologias que favoreça a contextualização e a flexibilidade.
Para representarmos melhor a diferença entre o convencional e o contextualizado. O design instrucional convencional é representado na figura 1, as etapas de design instrucional são individuais seguida uma da outra.
39 Figura 1 – Fases de desenvolvimento de design instrucional
Fonte: FILATRO, 2004 p. 117.
Para a representação do design instrucional contextualizado onde não a a separação das etapas, e estas progridem juntas, evoluindo. O fractal na figura 2 é escolhido pois representar muito bem essa evolução do que qualquer outra forma geométrica fechada. Figura 2 – Expressão gráfica do modelo de desenvolvimento de design instrucional contextualizado.
Fonte: FILATRO, 2004 p. 117.
Com essa representação torna-se simples o entendimento do que seria o contextualizado, o professor e aluno desenvolvem o aprendizado conjuntamente, sendo avaliado constantemente a cada aula, o professor prepara novas aulas de acordo com a adaptação do aluno a determinado conteúdo. Aderindo a essa abordagem pode-se dizer que o uso de artefato tecnológicos digitais pode ser uma ótima ferramenta assistencial de desenvolvimento de aulas, debates, e acompanhamento do desempenho.
3. APRENDIZAGEM COLABORATIVA
40 A ideia de aprender em grupo, parece recente, mas ja vem desde o século XVIII e foi bastante testada pelos teóricos, pesquisadores e professores da época. Hoje colaboração e compartilhamento de conteúdo são vividos diariamente, em redes públicas na internet 7, um dispositivo enviando um arquivo de texto ou um livro digital para outro dispositivo utilizando tecnologias wireless8 dentre outras. Essas tecnologias possibilitam a maior aprendizado, concordando com DIAS (2010, p.359) : [...]A noção de compartilhamento refere-se à idéia de que alunos aprendendo juntos aprendem mais do que indivíduos trabalhando separadamente. A outra, a de empréstimo, está relacionada à idéia de que alunos aprendendo com um par mais competente entendem melhor as tarefas de aprendizagem e, em consequência, aprendem de uma maneira mais eficientes.
Há vários artefatos digitais que possibilitam o compartilhamento e o trabalho colaborativo. Ferramentas hipertextuais9, com acesso a internet encontramos redes socais, Wikis10 colaborativas, fórum de discussão, dentre outros. O conhecimento é compartilhado livremente por um indivíduo, por um grupo ou todos que achem determinado assunto relevante.
Na internet, as redes sociais destacam-se como ferramenta de compartilhamento, entre elas, o Facebook11, sendo a maior ferramenta de compartilhamento de conteúdo, dentre elas estão fotos, vídeos, textos, informações de perfil, estas disponíveis para um grupo ou público específico.
O conteúdo pesquisado ou criado pelo professor, pode ser disponibilizado, focando em seu público, em uma plataforma, dispositivos que possibilitem esse compartilhamento de conteúdo, possibilitando a colaboração dos alunos no aprendizado. O professor e alunos devem ter a sua disposição a partir de um artefato tecnológico todo o conteúdo e feedbacks para novos debates e formatação de aulas dinâmicas e divertidas.
7
Conjunto de meios físicos e programas usados para o transporte de informações. Permite a transmissão de dados e informações sem a necessidade do uso de cabos. 9 Remete a um texto, ao qual se agregam outros conjuntos de informação na forma de blocos. 10 São utilizados para identificar um tipo específico de coleção de documentos em hipertexto. 11 Site e serviço de rede social. 8
41
4. DESIGN DE INTERAÇÃO E EXPERIÊNCIA DE USUÁRIO Incluir neste artigo conceitos de design é essencial para entender como a interface de um aplicativo e a experiência do usuário pode ser utilizada no contexto de aprendizagem. As formas gráficas, o tipo de linguagem, a adaptação necessária para determinado tipo de aprendizado e como um artefato digital pode dar assistência ao professor e aluno. "Projetar produtos interativos para apoiar o modo como as pessoas se comunicam e interagem em seus cotidianos, seja em casa ou no trabalho."(PREECE, 2013, p.8). Para alguns autores essa definição é mais geral, não se aplicando somente a comunicação, mas a todas as formas de interações possíveis.
Design de interação deve entender como será o comportamento do usuário em relação ao artefato digital, o dispositivo tecnológico que possibilitará a interação e como será utilizado pelas pessoas no mundo real, sendo em nosso contexto, os alunos, que devem absorver esse conteúdo de forma simples e dinâmica.
Devemos ressaltar que não é possível projetar a experiência de usuário, devemos projetar algo que se adeque a experiência de usuário. Um exemplo disso, pode ser o telefone, podemos projetar sua textura, seu teclado, a forma com será segurado. Quando alguém segurar este telefone e utilizá-lo ele sentirá algo agradável e satisfatório, que trará uma boa experiência de usuário.
5. ARTEFATOS TECNOLÓGICOS O uso de dispositivos móveis está disseminado, pessoas estão conectadas o tempo todo por smartphones, tablets, entre outros. A empresa Apple foi uma pioneira no quesito educação, onde nos EUA, fez contratos com o governo e disponibilizou milhares de computadores em salas de aula. Hoje são tablets ou iPads, que facilitam o aprendizado e são os mais utilizados para a educação infantil e formal com aplicativos, quebra cabeças, mapas corporais, eBooks, etc. No site da Apple há o seguinte argumento para o uso do iPad:
42
Cada um tem uma maneira de aprender. Com apenas alguns toques, você pode personalizar o iPad dos seus alunos com materiais adequados aos seus níveis e estilos de aprendizado[…]A ampla variedade de conteúdo sobre todos os assuntos e para todas as séries facilita a adaptação do iPad a todos os alunos, com níveis de aprendizagem diferentes.
Há outros exemplos como imagens e vídeos disponíveis na web como o projeto One Transformed Classroom12 que fez uma experiência com 15 iPads em uma sala de aula, os alunos estudaram matérias como desenho, matemática, inglês, e outras atividades.
Com tantos exemplos de pesquisas e experiências, o que busca-se com esse artigo é encontrar algo disponível a todos, no caso, os smartphones e tablets. É possível utilizar o dispositivo do próprio aluno para acessar o aplicativo que possibilite a aula mais dinâmica e divertida.
6. IMPLICAÇÕES E CONSIDERAÇÕES FINAIS Este artigo resulta de um estudo preliminar sobre a utilização de artefatos digitais, como complemento possível para a aprendizagem atual, o uso de aplicativo disponível em vários dispositivos possibilita a facilidade de chegar ao aluno sem a necessidade de muito investimentos, já que o próprio aluno tem o seu dispositivo, não sendo necessária a disponibilização pelo professor.
As aplicações encontradas hoje são, em sua maioria, ensino a distancia (EAD), os alunos estão abandonando as salas, deixando de lado a interagindo com o professor a distancia. Ferramentas On-line complexas, o acesso é restrito somente em navegadores de computador, não há um acompanhamento continuo e pessoal nem tarefas extras que visam um aprendizado colaborativo. Algumas ferramentas até esbarram na idéia colaborativa, mas são as mais complexas e sem muita acessibilidade, mobilidade e facilidade de uso.
12
One Transformed Classroom: <https://www.youtube.com/watch?v=oYLirypK_Yo>
43 Tomando como base os tópicos anteriores, pode-se dizer que as possibilidades para o aprendizado tem potencial para ser mais móvel, acessível, divertido e interativo tornando o aprendizado humanizado e flexível. Os métodos de aprendizagem não precisam de mudanças drásticas, mas devem ser revistos, não substituindo a sala de aula, mas fazendo parte dela proporcionando um aprendizado colaborativo real e virtual melhorando o contato com o professor. Unindo o design instrucional contextualizado, o design de interação e as plataformas disponíveis, pode-se encontrar grandes possibilidades, potencializando a educação moderna, torna o aprendizado mais cativante, um futuro onde o aluno não será enclausurados a frente de um computador por horas ou a frente de um professor, irá a um local obter conhecimento através de relações sociais colaborativas, divertidas, com facilidade de acesso e de uso.
REFERÊNCIA BIBLIOGRÁFICA FILATRO, Andrea. Design instrucional contextualizado: Educação e Tecnologia. 3 ed. São Paulo: Senac, 2003. 215 p. FILATRO, Andrea; PICONEZ, Stela Bertholo. Design instrucional contextualizado. 2014. 9 f. Faculdade de Educação da USP. 2014. Disponível em: <http://www.abed.org.br/congresso2004/por/pdf/049-TC-B2.pdf >Acesso em: 17 abr. 2015. IRALA, Esrom Adriano Freitas; TORRES, Patrícia Lupino. O uso do AMANDA como ferramenta de apoio a uma proposta de aprendizagem colaborativa para a língua inglesa. Abril de 2004. Disponível em: <http://www.abed.org.br/congresso2004/por/htm/172-TCD4.htm> Acesso em: 17 abr 2015. KRUG, Steve. Não me faça pensar: Uma abordagem de bom senso à Usabilidade na Web. 2 ed. Rio de Janeiro: Alta Books, 2008. 201 p. MOTA, M. O.; GOMES, D. M. O. A. Uma análise do comportamento do consumidor na adoção de inovação tecnológica: uma perspectiva brasileira dos livros eletrônicos. Revista de Negócios, v. 18, n. 4, p. 3-16. 2013. Disponível em: <http://www.spell.org.br/documentos/ver/17691/uma-analise-do-comportamento-do-consumidor-na-adocao-de-inovacaotecnologica--uma-perspectiva-brasileira-dos-livros-eletronicos/i/pt-br> Acesso em: 17 abr. 2015. SANTOS, Carvilho Alves; MORAES, Denise Rosana da Silva. Tecnologia educacional no contexto Escolar: Contradições, Desafios e Possibilidades. 2009. 36 f. Disponível em: <http://www.diaadiaeducacao.pr.gov.br/portals/pde/arquivos/2085-8.pdf> Acesso em 17 abr. 2015.
44 PREECE, Jennifer. Design de Interação. 3 ed. Porto Alegre: Bookman, 2013. 585 p. DIAS, Reinildes. WebQuests no processo de aprendizagem de L2 no meio on-line. In: MENEZES, Vera Lúcia. Interação e aprendizagem em ambiente virtual. 2 ed. Belo Horizonte: Invenção, 2010. p. 359. BERGMANN, Juliana Cristina Faggion; SANTOS, Margarete Terezinha Fabbris. Avaliação de material didático para EAD: Feedback do aluno como fonte de constante de informação. 2009. 8 f. Grupo Educacional Uninter / PUC-PR Disponível em: <http://www.abed.org.br/ congresso2009/CD/trabalhos/1552009180600.pdf > Acesso em 28 abr. 2015.
45
Documento Inicial de Design para aplicativo Aplicativo de Assistência a Interação e Avaliação Simplificada na Educação Design Digital Everton Asmé Orientadoras: Prof. Juliana Pereira de Sousa Prof. Sabrina Talita de Oliveira
Briefing Título do projeto
QuickLesson / TeachAll / LearnHand / PocketSchool / SchoolReview / SchoolHelper / SchoolDevice / plusLesson / PluSchool
O que é o projeto?
App Educacional a fim de propor uma interação maior entre aluno e professor de uma forma simples e rápida.
Segmento de atuação de seu projeto
Ensino fundamental, Ensino Médio, EJA, Ensino médio / técnico.
Mapa Conceitual do Produto
" Público Alvo - Primário: Pré-Adolescentes e Adolescentes de 11 a 17 anos e também adultos que estão cursando o ensino fundamental de 5ª a 9ª série, cursando ensino Descrição médio ou EJA (Educação de Jovens e Adultos) com acesso a computadores, Smartphones ou Tablets na escola e em bibliotecas públicas ou se possível em casa. Secundário: Professores do ensino fundamental com acesso a computadores, Smartphones ou Tablets que estejam interessados em novas tecnologias, métodos de ensino e integração com os alunos. Terciário: Pais dos alunos que gostariam de acompanhar o desempenho da escola, professores e filhos. E ainda ter uma melhor interação com os professores.
46 Público Alvo Painel Semântico
" Fonte: Google Imagens
Palavras chave
Aplicativo, assistência, educação, interação, avaliação, acessibilidade.
Funcionalidades
O produto terá três login diferentes, cada um terá o seu limite de interações. ■ Login do Aluno: ■ Visualização do desempenho de sua classe; ■ Visualização do desempenho das outras classes de sua série; ■ Visualização do ranking geral; ■ Comentar a postagem do professor; ■ Responder o QUIZ do dia, que será proposto pelo professor antes da aula. ■ Professor: ■ Visualização do desempenho de todas as salas que dá aula; ■ Criação de comentários explicativos caso haja alguma dificuldade em comum na turma; ■ Criação de novos QUIZ. ■ Login do Diretor; ■ Visualização do desempenho de todas as salas e matérias. ■ Visualização de gráfico mais completo de todas as sala, e um gráfico geral ■ Terá acesso ao ranking geral do App
47 Contexto de Uso
O aplicativo é voltado para facilitar as aulas do professor, ao ver como esta o desenvolvimento de suas turmas. Fornece um gráfico para o professor a partir de perguntas que o mesmo postará para que os alunos respondam depois aula, dessa forma o professor saberá se os alunos estão com dificuldades naquele assunto e poderá fazer uma revisão do conteúdo antes de seguir em frente com a próxima matéria. A direção da instituição poderá acompanhar o desenvolvimento de todas as salas e classes a partir de um gráfico mais completo, facilitando a forma de encontrar o ponto fraco e propor uma avaliação da situação. Virá com um “ranking” onde analisará todas as respostas e fará um novo gráfico separado por séries e turmas, assim mostrando quais as salas estão com maior pontuação.
Justificativa
Cria um pensamento mais coletivo entre os alunos da mesma turma, tornando-os mais companheiros se ajudando com as matérias. Maior utilização dos aparelhos oferecidos pelo governo ou instituições de ensino, já que o aplicativo é utilizado diariamente. Com o acompanhamento durante a preparação da próxima aula o professor vê o desempenho da turma podendo melhora esta aula, postará a aula do dia no fim de cada aula. Também trará competitividade entre as turmas, onde a turma que tiver a melhor pontuação ganhará um prêmio imposto pela própria instituição, se for de seu interesse.
Protótipo
Desenvolver um protótipo funcional básico que inclua essas relações entre os usuários.
Objetivo geral
Propor maior interatividade entre professor e alunos, e envolvidos com a educação do aluno.
Objetivos específicos
Facilitar o trabalho do profissional da educação.
Objetivos a curto prazo
Identidade visual, mecânicas gerais, busca de investidores e realização final.
Objetivos a longo prazo
Expansão do aplicativo, sendo utilizado em escolas públicas e particulares do Brasil gerando atenção e interesse por ser um produto nacional.
Objetivos para o TCC
Entrega de todo o conceito do aplicativo juntamente com um protótipo e resultado de testes de usabilidade com mockups juntamente com uma pesquisa de usuário no seu contexto.
Adicionais ao projeto
Website, Material publicitário, Marketing Digital, Blog de desenvolvimento.
48 Preço, modelo de negócio
Como a iniciativa é beneficiar a educação, com os patrocínios, investimentos e iniciativas privadas, pretendo que o aplicativo tenha uma licença gratuita para escolas públicas e licenças específicas para colégios particulares.
Orçamento
Busca de investimento para liberação de todas as licenças necessárias para o desenvolvimento do projeto.
Linguagem:
A linguagem deve ser intuitiva, o usuário deve se encontrar facilmente e utilizar rapidamente sem precisar pensar muito, focando no conteúdo como principal objeto do aplicativo.
Interação:
Construção de uma interação imediata e com feedback imediato ao usuário, com interações mais simples, sem exageros mas o suficiente para cativar o usuário e lhe oferecer a melhor experiência.
Estratégias de divulgação:
Marketing digital, Blog e website, Youtube, para divulgação de vídeos, tanto publicitarias quanto de desenvolvimento, eventos e concursos da comunidade educacional no Brasil.
Experiência que se deseja transmitir
Experiência de conhecimento sobre o conteúdo abordado pelo professor, Interesse do aluno, diversão, simplicidade, reinvenção da maneira como se avalia o aluno sem substituição do ensino tradicional.
Experiência que NÃO se deseja transmitir
A idéia de substituição do ensino tradicional e o uso indevido do aplicativo como forma de avaliação única ou tarefas somente pelo aplicativo.
Recursos humanos
Designers e programadores web e servidores, desenvolvedores iOS e Android, usuários para testes de usabilidade e pesquisadores de campo com grupo do público alvo.
Lista de Materiais para desenvolvimento
Photoshop, Sketch 3, Xcode, Notepad+, Sublime, Office, Google Drive, Trello, Facebook, Windows, MacOS, Google Chrome, iPhone para testes, Dispositivo Android para testes, Servidor de hospedagem, banco de dados.
49
Benchmarking Inicial Similares
Perguntas e comentários "
Login
" "
Enquetes Tela inicial
" "
Cotação
"
Painel posts
"
50
"
"
"
Diferencial
"
O grande diferencial do aplicativo é que ele será utilizado como assistência e não como uma ferramenta obrigatória para todas as atividades ou substituição do ensino tradicional. É um auxilio ao acompanhamento do desempenho da escola e uma ferramenta rápida para ser utilizada uma ou mais vez ao dia sem o intuito de entregas de trabalho ou avaliações finais de uma matéria.
51
Navegador
Mobile
Aplicativo
"
" "
"
" " " legenda: presente Não atende bem o público Não existe
Interação rápida com o público e facilidade de uso.
52
Geração de Alternativas
"
" http://fortawesome.github.io/Font-Awesome/ Utilização de ícones mais simples e que representam as funcionalidades do aplicativo, podendo ser utilizado em dispositivos móveis e em navegadores.
Referencias visuais para ícones e cores
" Soluções de Linguagem:
A linguagem deve ser intuitiva, o usuário deve se encontrar facilmente e utilizar rapidamente sem precisar pensar muito, focando no conteúdo como principal objeto do aplicativo.
53 Análise Semiótica Qualitativo Icônico
- cores
- linhas
- luminosidade
- forma
- composição
Sugerem qualidades abstratas:
- leveza
- sofisticação
- confiança
- segurança
SANTAELLA, Lucia. - Semiótica Aplicada Análise de Cores
" Objetos
Ícone (Primeiridade, semelhança):
Este desenho é um ícone, pois tem uma relação de proximidade com o objeto representado,
Representação de uma corrente;
Índice (Secundidade, relação espontânea):
Funciona indicando outra coisa a qual esta ligada, não por semelhança mas por proximidade, conhecemos esses signos por meio de experiência subjetiva ou herança cultural.
Ao lado a corrente representa um hyperlink que
pode ser compartilhado;
Símbolo ( Terceiridade, relação convencionada) :
Sendo um hyperlink a corrente é uma forma de remeter a ligação entre páginas ou informações, não há relação com a coisa representada, a associação dele é produzida por uma convenção cultural.
Ícone:
Representação de uma taça ou troféu;
Índice:
O troféu com suas cores ouro, prata e bronze remetem a um ranking.
Símbolo:
O troféu com a cor ouro tem o significado de vitória, 1º lugar. Prata, 2º lugar e o bronze como 3º lugar. Há relação convencionada com o objeto.
54 Navegação.
Símbolos
"
Informacionais.
"
Todos os signos acima, além de serem índices por representarem outra coisa, são símbolos pois foram adquiridos com a cultura de onde vivem.
" Construção de uma interação imediata e com feedback imediato ao usuário, com interações mais simples, sem exageros mas o suficiente para cativar o usuário e lhe oferecer a melhor experiência.
Interação:
wireflow
"
55 Exemplo de telas
"
"
"
56 SANTAELLA, Lucia. - Semiótica Aplicada - Editora Thomson
http://books.google.com.br/books? id=iW9QpHNWTcUC&printsec=frontcover&source=gbs_ge_summary_r&cad=0#v=onepage&q&f=false
TURIN, Ruti Nielba. - Aulas Introdução ao Estudo das Linguas - 1. Edição. Cap.Classificação dos Signos São Paulo: Editora Annablume, 2007.
http://books.google.com.br/books? id=c5LHbBt8kKoC&printsec=frontcover&redir_esc=y#v=onepage&q&f=false
57
35
Class Progress Everton AsmĂŠ - Design Digital - PUCPR 2015