Kit de Alfabetização Web

Registro de acervo. casahacker.org/kit-de-atividades… — Squarespace, 2019. 14 atividades. Currículo de alfabetização web.

Visão Geral do Kit de Atividades de Exploração, Construção e Participação na Web

O objetivo do Kit de Atividades de Exploração, Construção e Participação na Web da Casa Hacker é fornecer aos participantes uma compreensão conceitual básica sobre como explorar, construir e participar da Web.

A Alfabetização Web, por exemplo, apoia nossa comunidade a:

• Entender como a Internet funciona;

• Conhecer as ferramentas e estratégias que podem ser usadas para procurar e localizar pessoas, recursos e informações;

• Fomentar novos conteúdos na rede para mantê-la viva;

• Conectar com as comunidades que compartilham, criam e mantêm conteúdo singnificante on-line;

• Avaliar informações e detectar a desinformação;

• Capacitar a si e às suas comunidades para participarem on-line como cidadãos, estudantes, trabalhadores e criadores.

Desenvolver, atualizar e manter esse kit de atividades vem de um esforço de contribuidores e parceiros estratégicos da Casa Hacker, além de todo material base e expertise do Mozilla’s Core Web Literacy Curriculum.

Práticas Abertas

Trabalhar abertamente é um dos requisitos fundamentais deste kit de atividades e também da Base Curricular de Alfabetização Web 2.0. Um dos primeiros passos na implementação deste kit de atividades é entender o que significa trabalhar abertamente. Assim, nós incentivamos você a aprender a trabalhar abertamente estudando nosso nosso guia orientativo “Práticas Abertas” (disponível em breve) para aprender os conceitos básicos de participação, colaboração e compartilhamento em projetos conduzidos pela comunidade.

Divulgue, Expanda e Melhore o Kit de Atividades

Esse kit é feito para ser inclusivo, adaptável e aberto, isso significa que as comunidades podem para usá-la, divulgá-la, expandi-la, adaptá-la e aprimorá-la.

Veja como você pode contribuir:

• Conte-nos como e onde você está usando esse kit de atividades;

• Gostaríamos também de saber o que você aprendeu e o que você mudaria;

• Traduza para diferentes idiomas;

• Remixe para diferentes públicos;

• Melhore continuamente as atividades.

Ganhando Medalhas Digitais

A Casa Hacker, através da Badgr, oferece medalhas digitais para as habilidades de alfabetização web se você estiver interessado em ganhar ou fazer com que sua comunidade ganhe medalhas.

Mantenedores

Este kit de atividades é atualmente mantido por Geraldo Barros (geraldo@casahacker.org).

Web e Você

Habilidades: Comunicação, Colaboração

Nesta atividade off-line de contação de histórias, os participantes refletem e compartilham observações, ideias e sentimentos sobre seu próprio uso da Web e o que a Web significa para suas comunidades. O que amam ou odeiam na Web? O que estão curiosos sobre a Web? Que tipo de coisas gostariam de fazer na Web? Os facilitadores usam as percepções dessa atividade para contextualizar e moldar o restante das atividades para o grupo de participantes. Esta atividade em grupo também deve ajudar os participantes a se conhecerem e se sentirem conectados.

Objetivos de Aprendizagem

• Descrever como a comunidade usa e interage na Web.

Tempo Necessário

45 minutos a 1 hora dependendo do tamanho do grupo.

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a Web.

Materiais

• Notas autoadesivas

• Lápis, marcadores

• Temporizador para manter o tempo durante a contação de histórias

Habilidades de Alfabetização Web

Esta é uma atividade introdutória para o desenvolvimento de habilidades de Alfabetização Web.

Habilidades do Século XXI

• Comunicação

• Colaboração

Introdução

[6-10 min]

• O(A) facilitador(a) pede a cada participante que se apresente e responda a uma pergunta de quebra-gelo (por exemplo, qual é a sua comida favorita, jogo favorito, qual personagem de desenho animado você mais se parece). A questão do quebra-gelo ajuda os participantes conhecerem-se e a sentirem-se mais à vontade durante a discussão; pode - mas não precisa ser - relacionado à alfabetização Web.

💡 Dica! O(A) facilitador(a) deve fazer uma demonstração para que os participantes aprendam a compartilhar e, especialmente, entender quanto tempo eles têm para sua apresentação.

• Estabeleça regras básicas/acordos compartilhados. Explique que os participantes aprenderão juntos – compartilhando perspectivas e ideias, trabalhando juntos em pequenos grupos ou duplas e como um grupo grande. Cada pessoa é incentivada a compartilhar ativamente.

• O(A) facilitador(a) pergunta: o que podemos fazer para trabalhar e aprender melhor juntos? Solicite ideias do grupo e faça uma lista de comportamentos positivos para o trabalho em grupo.

💡 Dica! O(A) facilitador(a) pode adicionar pontos importantes se o grupo não os apresentar. Estes podem incluir:

• Ouvir ativamente

• Não interromper

• Ser respeitoso(a) com os outros membros

• Estar aberto(a) a perspectivas diferentes das suas

• Se você costuma conversar muito em grupos, tente ouvir mais

• Se você costuma ouvir, tente falar e compartilhar seus pensamentos

Apresentando a Web

[3-5 min]

• O(A) facilitador(a) explica que os participantes pensarão e falarão sobre a Internet e a World Wide Web - as ferramentas e tecnologias que usamos quando estamos “on-line”. O(A) facilitador(a) pede ao grupo para compartilhar as coisas que eles fazem “on-line”.

💡 Dica! Para esta rodada de compartilhamento, o(a) facilitador(a) pode encorajar os participantes a levantarem as mãos e esperarem para serem chamados a falar, ou pedir aos participantes que compartilhem aleatoriamente. Escolha o estilo de compartilhamento que funciona melhor para o seu grupo.

💡 Dica! Se o grupo não apresentar muitos exemplos, ou se o grupo não tiver experiência prévia na Web, o(a) facilitador(a) pode comentar sobre ferramentas e tecnologias propensas a serem usadas pelo grupo. Exemplos de atividades on-line podem incluir:

• envio ou recebimento de e-mail

• usar a web para se conectar com membros distantes da família

• usar um aplicativo em smartphones - por exemplo, aplicativo de mapas para ajudá-lo a navegar

• usar sites de busca de emprego

• “googar” ou pesquisar na web por informações

• assistir/ouvir shows ou músicas em sites como Netflix ou Spotify

• fazer login no Facebook ou em outras redes sociais

• jogos

• compras

O facilitador(a) ressalta que há maneiras diferentes de estar on-line, muitas das razões pelas quais as pessoas usam a Web. O grupo irá explorá-las juntos em um exercício de contação de histórias.

Contando Histórias: A Web e você

[20-25 min]

• Neste exercício, o(a) facilitador(a) divide os alunos em grupos de 3 a 4 participantes para contar e ouvir histórias. Explique que cada participante terá de 3 a 4 minutos para contar histórias de suas experiências na Web.

💡 Dica! Aqui estão algumas dicas para dar aos participantes de como começar a contar suas histórias. Os contadores de histórias devem levar 3 ou 4 minutos completos. Se o contador de histórias terminar antes do tempo acabar, aproveite o tempo para conversar, debater e pensar na história. Os ouvintes devem praticar a escuta ativa - concentre-se no contador de histórias.

• O(A) facilitador(a) deve selecionar uma das seguintes perguntas para usar com o grupo. Todos os contadores de histórias devem responder à mesma pergunta.

• Qual é a experiência mais importante/significativa/memorável que você teve on-line?

• Como a web mudou sua vida?

• Como você usa a web? Que tipo de coisas você gosta de fazer on-line?

• OU, para aqueles que não têm experiência anterior com a web:

• Que tipo de coisas você gostaria de fazer on-line?

• Que tipo de informação você espera encontrar on-line? O que seria mais útil para descobrir ou aprender?

• Como estar conectado com muitas pessoas diferentes ao redor do mundo poderia mudar a sua vida?

• A questão selecionada deve ser postada em algum lugar da sala onde é visível; o grupo recebe um ou dois minutos de tempo para pensar sobre sua história antes do início do exercício.

• O(A) facilitador(a) deve modelar uma história para definir o tom e a profundidade da história. Se o facilitador contar uma história leve e menos pessoal, os participantes entenderão isso como uma sugestão. Se o facilitador(a) for mais fundo, ou contar uma história mais pessoal, ele/ela concede permissão ao participante e espaço para fazer o mesmo.

💡 Dica! Essa deve ser uma história pessoal, portanto, como facilitador(a), você deve se basear em sua própria experiência na modelagem de uma história. Mas um exemplo do tipo de história que o facilitador poderia modelar seria algo assim (com mais detalhes, para preencher 3 minutos):

A Internet mudou minha vida porque eu pude usá-la para me conectar com pessoas que amam música, que é uma das coisas mais importantes da minha vida. Eu uso comunidades on-line (quadros de avisos, listas de discussão no começo para sites do Facebook e plataformas de mídia social agora) para aprender sobre música, aprofundando meu apreço e compreensão dela de maneiras que nunca imaginei. E também fiz muitos amigos ao longo do caminho! Essas conexões me fizeram viajar - os dois primeiros países que eu viajei para fora do Brasil foram o Japão e o Alemanha, e fui visitar amigos que fiz na comunidade de música on-line. Nós finalmente conseguimos nos encontrar e participar de eventos e shows juntos na vida real. Depois de 20 anos, ainda tenho essas amizades que fiz on-line!

• Entre cada história, o(a) facilitador(a) deve lembrar os participantes de respirar, pausar e deixar essa história penetrar.

• Entre cada história, peça aos alunos que reflitam tranquilamente:

• O que há de diferente entre a sua própria história?

• O que é semelhante?

• Lembre os participantes de agradecer por sua história.

Reflexão e Revisão

[10-15 min]

• Agora que os participantes compartilharam suas histórias individuais, o(a) facilitador(a) pede ao grupo que reflita sobre o que ouviu (em sua própria história e nas histórias de outras pessoas) e documente e/ou discuta todas as maneiras diferentes de como o grupo usa a Web.

💡 Dica! Se o tempo estiver curto, o(a) facilitador(a) pode optar por fazer o exercício do mapa de palavras ou fazer algumas perguntas de exploração.

Mapa de Palavras: Usando notas autoadesivas os participantes fazem listas de palavras aprendidas nas histórias. Os alunos devem escrever uma palavra por nota autoadesiva.

VERBOS: o que fazemos ou gostaríamos de fazer na web - (exemplos podem ser conectar, aprender, comprar)

ADJETIVOS: como é a experiência para nós e para os outros? (exemplos: emocionante, divertida, arrasadora, confusa)

SUBSTANTIVOS: coisas que acontecem/são encontradas on-line, ou o que usamos para conectar (exemplos: comunidades, música, telefone celular, modem)

• Os participantes trazem as suas notas autoadesivas e as colocam em uma parede, em agrupamentos de palavras (verbos, adjetivos, substantivos). O(A) facilitador(a) convida os alunos a virem e darem uma olhada e refletirem sobre as seguintes perguntas:

• O que você está surpreso(a) em ver?

• O que está faltando?

• O que se destaca?

Perguntas de exploração: os participantes consideram algumas questões de exploração, escrevendo respostas, ideias e pensamentos em notas autoadesivas. O(A) facilitador(a) pode escolher entre as seguintes perguntas (ou fazer as suas próprias) com base no público e o que emergiu nas histórias:

• O que é misterioso sobre a web? O que você está curioso/pensando sobre a tecnologia web, algo que você quer aprender?

• Quais são algumas das maneiras pelas quais a web mudou seus relacionamentos? O que há de diferente da interação na web versus “na vida real”?

• VOCÊ está na web? Como e onde você está representado na web?

• Como você se expressa on-line? Quem são seus diferentes públicos? Quem está te olhando ou assistindo? O que você escolhe para compartilhar?

• Coloque as notas autoadesivas novamente na parede e convide os alunos a olhar e discutir novamente.

💡 Dica! O(A) facilitador(a) pode usar respostas, histórias e perguntas de exploração para moldar o resto do programa de oficinas e eventos - revisar às perguntas para contextualizar, dar exemplos, e abordar lacunas no conhecimento e compreensão, ou abordar experiência especial - por exemplo: “nós tivemos uma pergunta sobre como um navegador funciona”, então vamos explorar isso agora ”ou“ “alguns de vocês são usuários ativos do YouTube - o que você pode nos dizer sobre a plataforma?”

💡 Dica! Sempre respeite os pontos de vista, ideias e perspectivas variadas quando se referir ao conteúdo compartilhado pelos participantes. No final da oficina, agradeça aos participantes por sua participação, perguntas e histórias!

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou na atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?

Mapear a Web

Habilidades: Colaboração, Comunicação, Solução de problemas

Descrição

Nesta atividade de discussão/mapeamento/desempenho, os participantes compartilham o que já sabem sobre a Web e colaboram para preencher lacunas e responder à perguntas. Eles trabalham juntos para organizar essas informações em um “mapa” visual e espacial que mostra as relações entre muitos elementos da Web, de servidores a sites, a tweets e telefones celulares. Em uma seção final da atividade, os participantes “executam a rede” conectando todos os elementos.

Objetivos dE Aprendizagem

• Explicar as partes da Internet estão relacionadas

• Demonstrar como a informação viaja através da Web usando manipuladores, esboços ou através de movimentos físicos

• Localizar um endereço IP e explicar quais informações são transmitidas

Tempo Necessário

45 minutos a 1 hora dependendo do tamanho do grupo

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a web.

Materiais

• Notas autoadesivas

• Lápis, marcadores

• Placas pré-fabricadas com os seguintes rótulos:

• “Salto 1: roteador local”

• “Salto 2: provedor de serviços de Internet”

• “Salto 3: o servidor”

Habilidades de Alfabetização Web

• Esta é uma atividade introdutória às habilidades de alfabetização web

Habilidades do Século XXI

• Colaboração

• Comunicação

• Solução de problemas

Introdução

[5-10 min]

• Se os participantes não se conhecem, o(a) facilitador(a) pedirá a cada membro do grupo que se apresente e responda à uma pergunta para quebrar o gelo (como comida favorita, jogo favorito, qual passeio ou personagem de desenho animado você mais se parece).

💡 Dica! A questão do quebra-gelo ajuda os participante a se conhecerem e sentirem-se mais à vontade durante a discussão; pode – mas não precisa ser – relacionado à alfabetização web.

💡 Dica! O(A) facilitador(a) deve fazer uma breve demonstração.

• O(A) facilitador(a) aborda e conecta brevemente o tópico desta sessão a uma grande ideia. Explique isso:

• A internet é provavelmente uma das tecnologias mais importantes, se não a mais importante, da nossa era.

• É a principal maneira em que o nosso mundo armazena e compartilha todos os tipos de informações (informações pessoais, informações financeiras, informações médicas, informações científicas e muito mais).

• Por isso, é importante entendermos de maneira básica como a Internet funciona.

• Quando sabemos disso, podemos tomar melhores decisões sobre como a usamos e quais informações compartilhamos.

• O(A) facilitador(a) convida os participantes a discutirem o modo como “vemos” ou entendemos a Internet. Use as seguintes perguntas para iniciar a conversa:

• Como é a Internet? Podemos vê-la?

• Se você tivesse que tirar uma foto, como seria a aparência?

• Quais são algumas metáforas da Internet que você ouviu (ou seja, surfar, tubos, teia de aranha, aranhas e rastreadores)?

• Quais metáforas que funcionam melhor para você?

• Você pode propor novas?

Brainstorm: Elementos do Mapa

[5 min]

• O(A) facilitador(a) explica que os participantes podem pensar na Internet como um sistema, uma coleção de partes que criam um todo funcional. Os participantes podem trabalhar juntos para criar um mapa desse sistema!

• O(A) facilitador(a) distribui notas autoadesivas para o grupo, ou se o grupo for pequeno o suficiente, eles podem debater juntos.

• Os participantes escrevem diferentes componentes do sistema, cada um em uma nota autoadesiva.

💡 Dica! Se os participantes tem dificuldade para começar, eles podem se perguntar: quando eles estão “on-line”, que tipo de tecnologia usam? O que faz parte imediatamente de sua conexão em seu ambiente? (ou seja, seu computador, também conhecido como cliente, smartphone, modem, roteador).

• Quais são as outras partes dessa conexão – aquelas que talvez não vejam? (ou seja, Wi-Fi, cabos, servidores, torres de celular, “a nuvem”).

• Quando on-line, o que estão vendo? O que estão usando? (navegadores, sites, sites específicos, aplicativos ou páginas, imagens, mídia, todos os tipos de conteúdo, e-mail).

• Quais são as outras palavras ou termos que ouviram sobre a Web que não discutimos? (pacotes, largura de banda, https, HMTL, URL, JavaScript, etc).

• Quais outras coisas podem estar conectadas à Web que ainda não mencionaram? (pense no espaço IOT emergente – carros autônomos, geladeiras, rastreadores fitness, sistemas de segurança, semáforos, etc).

💡 Dica! O(A) facilitador(a) deve certificar-se de que os principais termos estejam presentes: computador cliente, servidor, site, página web, smartphone, e-mail, rede, etc.

Definição dos Termos da Web

[5 min]

• Se alguns dos termos que o grupo gerou não forem familiares, reserve algum tempo para defini-los juntos. O(A) facilitador(a) pode consultar abaixo o glossário de termos criado pelo CERT.br.

• https://cartilha.cert.br/glossario

Dica! A atividade de apresentação rápida sobre as Mecânicas da Web é uma ótima maneira de trabalhar com algumas dessas definições. Link original

Montando o Mapa

[5 min]

• Colocando notas autoadesivas em um quadro, o grupo trabalha em conjunto para criar um diagrama da Internet. Para ajudá-los a fazer isso, use os seguintes prompts.

💡 Dica! Você também pode usar materiais 3D táteis, como papel de parede, corda ou papelão para criar um modelo.

• Como os diferentes elementos estão relacionados? Por exemplo, muitos computadores clientes se conectam a um único servidor.

• Onde as informações são armazenadas ou mantidas e como elas são transportadas?

💡 Dica! Se os participantes forem muito novos nesses conceitos, o(a) facilitador(a) poderá montar o mapa, explicando cada etapa, os relacionamentos e como a informação se movimenta pelo sistema.

Execute a rede

[15-20 min]

• O(A) facilitador(a) deve revisar o seguinte:

• Vemos em nosso mapa que a “Internet” é um sistema de computadores em rede e a “Web” está na Internet.

• A Web é o sistema interconectado de sites e páginas, armazenado em vários computadores ao redor do mundo.

• Usamos um navegador web, como o Firefox, para acessar páginas na web.

• Sempre que você pedir à Internet para fazer algo – inserindo um endereço da Web em um navegador, assistir a um vídeo no YouTube ou verificar um e-mail no seu smartphone – seu pedido “salta” por vários dispositivos de rede, como roteadores, comutadores e servidores a caminho do seu dispositivo para o servidor do site.

• Mostre estes vídeos introdutórios para dar aos participantes um pouco mais de contexto.

• Como funciona a Internet? Parte 1: O protocolo IP

• Como funciona a Internet? Parte 2: Sistemas Autônomos, BGP, PTTs.

• Como funciona a Internet? Parte 3: DNS

• Como funciona a Internet? Parte 4: Governança da Internet

• Depois de assistir aos vídeos, reserve alguns minutos e peça aos participantes para compararem e contrastarem o que aprenderam ao assistir ao vídeo, em comparação com o que imaginaram juntos anteriormente. Quão perto estávamos? O que nós deixamos de fora? O que nos surpreendeu?

• O(A) facilitador(a) explica ao grupo que, para ajudar a entender esse caminho, eles vão exibir uma versão humana de informações que se movem pela Internet, em uma pista de obstáculos.

• As informações vão viajar de um:

• computador local (cliente) para

• uma rede de acesso local para

• a Internet para

• o site da sua escolha

• Comece mostrando aos participantes através de um modelo do sistema. Peça ao grupo que junte a placa “Meu computador” e peça três voluntários. Entregue aos três voluntários as placas rotuladas:

• “Salto 1: roteador local”

• “Salto 2: provedor de serviços de Internet”

• “Salto 3: o servidor”

• Peça aos voluntários para se espalharem por toda a sala.

• Explique que:

• as placas representam diferentes “saltos” pelos quais uma solicitação da Web deve passar antes de chegar ao servidor que hospeda o site que o usuário está procurando.

• O restante dos participantes são pacotes de código contendo solicitações da Web em linguagem de computador especial, tentando chegar ao servidor na outra extremidade da sala.

• Escolha um desses participantes “pacote” para atuar como modelo para o restante do grupo antes que todos iniciem a atividade. Dê aos participantes o seguinte cenário:

• Estou no meu computador e decido assistir a um vídeo no YouTube. Depois de digitar o endereço da Web, meu computador converte “youtube.com.br” em um tipo especial de solicitação codificada (chamada HyperText Transfer Protocol ou HTTP) que todos os computadores podem ler.

• Meu computador divide esse código em vários “pacotes” para enviar pela rede… nosso participante voluntário representa um desses pacotes.

• Peça ao participante voluntário para caminhar até o primeiro salto e explique:

• Primeiro, o pacote passará por dispositivos de rede local, como roteadores e modems em seu prédio.

• Os dispositivos da rede local enviam o pacote para a Internet.

• Peça ao participante que ande e explique o próximo salto: depois que um pacote chega ao provedor de serviços de Internet (ISP), ele é enviado até um dos roteadores do YouTube.

• Peça ao participante que ande e explique o próximo salto. Depois que o pacote passar pelo roteador do YouTube, ele será enviado para um servidor na sede da empresa que transmitirá meu vídeo. Explique:

• No servidor, para que o vídeo seja transmitido em meu computador, o computador do YouTube também converte meus vídeos em pacotes, que viajam todo o caminho de volta para o meu computador no mesmo caminho dos dispositivos de rede necessários para acessar o YouTube.

• Peça ao participante de exemplo que caminhe de volta para você, certificando-se de fazer uma pausa em cada salto no caminho de volta.

• Agora, vamos aumentar a complexidade da rede – afinal, temos milhões e milhões de servidores e clientes por aí, não apenas alguns! Vamos atribuir 2 ou 3 (ou mais participantes) para atuar como “salto 3” – o servidor. E recebemos mais alguns usuários fazendo solicitações de computadores clientes e mais participantes atribuídos a pacotes.

• Atribua a cada servidor uma função – por exemplo, um servidor pode ser um BancoDoBrasil.com.br ou Americanas.com.br ou o ingressorapido.com.br ou o catálogo on-line da biblioteca local.

💡 Dica! Você pode debater isso perguntando aos participantes quais sites eles usam e os tipos de coisas que solicitam desses sites.

• Escreva os nomes dos servidores nos cartões e peça aos “servidores” para segurá-los.

• Peça aos participantes que escrevam pedidos, como “lista de brinquedos para cães à venda na Americanas” ou “ingressos para o show da Anitta em IngressoRapido.com.br” em cartões – eles os entregarão aos “pacotes”.

💡 Dica! Pergunte aos participantes se eles querem criar um identificador na solicitação deles para garantir que a solicitação seja devolvida ao computador certo.

• Agora é hora de todos tentarem a pista de obstáculos! Explique:

• Os usuários/computadores clientes entregam seus pedidos aos “pacotes”.

• Os “pacotes” devem parar em cada “salto” antes de passar para o próximo.

• espere, há uma “pegadinha”! Antes que os pacotes possam ir de um pulo para outro, eles precisam mostrar seu pedido para o “pare”, que é um tipo de gatekeeper (barreira/porteiro).

• No salto do Provedor de Internet, o participante que atua como um Provedor de Internet precisará direcionar os pacotes para os servidores corretos; no caminho de volta, ele precisará direcionar o pacote para o cliente correto.

• Os servidores têm pouco tempo para marcar ou alterar o cartão do pacote com as informações solicitadas antes de enviar o pacote de volta ao cliente.

• Peça aos “pacotes” para formar uma linha de arquivo único e percorrer a pista de obstáculos o mais rápido que puderem! Você pode ter alguém marcando quanto tempo leva para todo mundo atravessar o percurso e ver quem é o mais rápido.

💡 Dica! Para tornar a pista de obstáculos mais interessante, você pode colocar “espiões do governo” entre os saltos. Este recurso da EFF explica como terceiros podem interceptar dados entre os saltos. Converse com seus participantes sobre quais dados estão protegidos, o que e quando está vulnerável.

💡 Dica! Se o seu grupo for grande o suficiente, encha o Provedor de Internet com pedidos para um determinado servidor.

💡 Dica! Durante a atividade, você pode fazer aos participantes as seguintes perguntas:

O que acontece em cada “salto”? Você acha que um pacote na vida real se move mais rápido pela Internet do que você?

• Observação: se você não tiver espaço físico para essa atividade, os participantes poderão entender como as partes da Web interagem usando objetos como jogo de cartas, canudos, cordas ou outros objetos.

Opcional: endereços IP

[5 min]

• Pergunte ao grupo quantos computadores ou dispositivos estão conectados à Internet.

• Como você acha que cada computador está identificado ou localizado na rede?

• Discuta a ideia de um endereço – o que torna um endereço (como um endereço de rua ou um endereço de e-mail) útil?

• Explique que é importante que o endereço seja único: ele indica uma casa, um apartamento ou uma pessoa específica, uma mensagem enviada para esse local ou apenas uma pessoa.

• Introduza o conceito de endereços IP: cada dispositivo ou computador em uma rede ou on-line possui um endereço IP (ou “Internet Protocol”, em português “Protocolo da Internet”).

• É uma maneira amigável de descrever um endereço de um site – computadores gostam de números!

• Endereços IP possuem 4 conjuntos de números em uma string.

• Se digitarmos isso em um navegador, ele será resolvido em um endereço da web amigável.

Dica! Se um computador estiver disponível, demonstre como a digitação de um endereço IP leva você a um nome de domínio amigável para humanos.

Reflexão e Revisão

[5 min]

• Para encerrar, o(a) facilitador(a) pode fazer perguntas de reflexão como:

• O que acontece na Internet quando você digita um endereço da Web e pressiona enter?

• Quais são as “partes” da Internet?

• Como grandes quantidades de informação chegam por partes na rede mesmo com uma largura de banda baixa?

• Qual a diferença entre a Internet e a World Wide Web?

• Não deixe de agradecer aos participantes por sua participação, ideias e percepções.

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou sobre esta atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?

Faça amigos com o seu Navegador

Habilidades: Navegação, Sintetização, Colaboração, Comunicação

Descrição

Um navegador de Internet, também conhecido como navegador web ou simplesmente navegador, é um programa de software que você usa para acessar a Internet e visualizar páginas web em seu computador. Você pode pensar em seu navegador como sua porta de entrada para a Internet. Os participantes refletirão sobre as ferramentas que eles usam para navegar em um site e aproveitar seus conhecimentos existente.

Objetivos da Aprendizagem

• Descrever a diferença entre um navegador web e um mecanismo de pesquisa

• Localizar as principais ferramentas de um navegador web

• Rotular partes de uma página web

• Navegar em um site

Tempo Necessário

30 a 45 minutos dependendo do tamanho do grupo.

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a web.

Materiais

• Notas autoadesivas

• Papel e lápis

• Notebook com conexão à Internet

Habilidades de Alfabetização Web

• Navegação

• Sintetização

Habilidades do Século XXI

• Colaboração

• Comunicação

Enter the World Wide Web

Parte I

[10 min]

• Conecte-se ao conhecimento prévio perguntando aos participantes:

• Qual é a diferença entre um navegador web e um mecanismo de pesquisa?

• Quais são os nomes dos navegaodres web mais populares?

• Qual é o mecanismo de pesquisa mais popular?

• Esclareça quaisquer equívocos

• Um navegador é um programa de software gratuito que exibe sites e permite que os usuários acessem vários sites e páginas web na Internet. Você pode baixar qualquer navegador que desejar. Quando você compra um computador, ele normalmente já tem um navegador baixado para que você possa acessar imediatamente a Internet. Pense no navegador da web como a porta de entrada para a Internet.

• Um mecanismo de pequisa, como o Google, Yahoo e Bing também são programas de software que procuram por um determinado documento quando palavras específicas são inseridas. Quando um usuário digita palavras-chave em uma caixa de pesquisa, o mecanismo de pesquisa usa algoritmos para exibir resultados que correspondem a essa pesquisa.

• Pesquise e explore

• Peça aos participantes que abram um dos navegadores web em seus computadores. Será muito mais fácil para todos os participantes abrirem o mesmo navegador web pois os nomes e opções diferem ligeiramente entre os navegadores. Esta lição é baseada no navegador Firefox.

• Explique que quando eles abrem um navegador, eles acessam a página inicial do navegador, que é uma página web. Os usuários podem selecionar a página inicial de seus navegadores web.

• Peça aos participantes para passar o mouse sobre os ícones na parte superior da tela (a barra de ferramentas) e anote as palavras que aparecem em notas autoadesivas. Eles também podem clicar e ver qual é a função. Eles devem encontrar:

• Abra uma nova aba

• Fechar aba

• Voltar uma página

• Avançar uma página

• Recarregar

• Página inicial

• Mostrar histórico

• Abrir menu

• Pesquise ou digite o endereço

• Pesquisa

• Barra de rolagem

• Peça aos participantes para categorizar as ferramentas. Quais ferramentas permitem ao usuário navegar na página? Quais ferramentas estão relacionadas à pesquisa por um site?

• Peça aos participantes para abrir e fechar novas abas. Explique as razões para manter várias abas abertas. O objetivo é eliminar a confusão entre fechar o navegador e fechar uma página web. Você pode querer revisitar este ponto depois que os participantes tiverem várias páginas diferentes abertas.

• Os participantes podem querer escrever as palavras de suas notas autoadesivas e desenhar o ícone ao lado de cada palavra ou esboçar a página inicial do navegador e preencher as ferramentas.

Atividade On-line: entre na World Wide Web

Parte II

[15min]

• Os participantes praticarão a navegação em um site em preparação para a atividade de pesquisa: Detetive na Web.

• Pergunte aos participantes quando se usa um mecanismo de pesquisa e quando não. (Se soubermos o endereço da web exato, não precisaremos fazer uma pesquisa).

• Escolha um site relevante para seus participantes e peça-lhes para digitar a URL na barra de endereços.

• Discuta as diferentes extensões e explique o que elas nos dizem sobre o tipo de empresa ou organização: .com, .org, .edu, .gov, .net. * Você também pode falar sobre http, https e www como parte da URL (Uniform Resource Locator, ou em português, Localizador Uniforme de Recursos) ou endereço da web. O site normalmente contém uma coleção de páginas web.

• Peça aos participantes para nomear o que eles vêem na página web: ou seja, mídia, texto, títulos, ferramentas de navegação ou links para outras páginas. Explique como eles identificam um link para outra página ou recurso. Mostre a eles uma imagem de um cursor em formato de mão.

• Pergunte aos participantes se eles já estiveram em uma página web, clicaram em links para outras páginas e não conseguiram voltar para onde gostariam de estar?

• Peça-lhes que pensem nas ferramentas de navegação no topo da página e discutam como usá-las. (voltar para a última página, visitado, encaminhar para reverter a ação, recarregar para obter informações atualizadas e página inicial).

• Em seguida, peça aos participantes que usem a barra de rolagem horizontal na parte inferior da página e a barra de rolagem lateral para mover a página para cima, para baixo, para a esquerda e para a direita. (Nem todas as páginas web terão uma barra de rolagem horizontal).

• Peça aos participantes para fecharem o navegador web. Em seguida, forneça uma URL e uma lista de “tesouros” para encontrar nesse site específico. Algumas ideias são:

• Veja a extensão da URL. O que podemos deduzir sobre o tipo de organização desta URL?

• Identifique a mídia na página inicial: qual é o nome e o conteúdo?

• Vá para a página X e liste 3 pedaços de informação nesta página

• Qual navegador você está usando?

Reflexão e Revisão

[5 min]

• O(A) facilitador(a) pergunta aos participantes: como o que você aprendeu hoje altera a maneira como você pensa sobre pesquisas na Web e nos resultados da pesquisa?

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou sobre esta atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?

Festa da Pesquisa

Habilidades: Pesquisa, Sintetização, Avaliação, Solução de problemas, Colaboração, Comunicação

Descrição

Nessa discussão/atividade off-line, os participantes consideram a pesquisa na web e porque ela é tão importante e tão desafiadora. Eles aprendem sobre programas de software chamados “rastreadores web” e “mecanismos de pesquisa” que ajudam a encontrar e fornecer resultados de pesquisa entre bilhões e bilhões de recursos da web. Os participantes também recebem uma introdução aos algoritmos e praticam a escrita e a revisão de algoritmos.

Objetivos da Aprendizagem

• Nomear os programas de software que ajudam a coletar e classificar os resultados da pesquisa.

• Criar um exemplo de um algoritmo que ilustra como os algoritmos funcionam para suportar pesquisas na web.

• Criar um índice para um algoritmo simples.

Tempo Necessário

1 a 1.5 horas dependendo do tamanho do grupo

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a web

Materiais

• Coleções de 20 a 60 objetos pequenos e variados do mesmo tipo – por exemplo, grupos de botões ou miçangas de diferentes formas, tamanhos, cores, texturas, materiais. Você precisará de uma coleção para cada grupo de 2 a 4 participantes.

• Um computador/projetor configurado, ou alguma outra forma de mostrar streaming de vídeo (do YouTube) e conexão com a Internet.

• Um quadro branco, quadro negro ou bloco de flipchart para escrever notas que todo o grupo pode ver.

• Notas autoadesivas

Habilidades de Alfabetização Web

• Pesquisa

• Sintetização

• Avaliação

Habilidades do Século XXI

• Solução de problemas

• Colaboração

• Comunicação

Introdução

[3-5 min]

• O(A) facilitador(a) pede a cada membro do grupo que se apresente e responda a uma pergunta sobre para quebrar o gelo (como comida favorita, jogo favorito, que muppet ou personagem de desenho animado você mais se parece).

Dica! A questão do quebra-gelo ajuda os aprendizes a conhecer os outros no grupo e a sentirem-se mais à vontade durante a discussão; pode – mas não precisa ser – relacionado à Alfabetização Web.

Enquadramento: Pesquisando na Web

[5 min]

• Qual é a última coisa que você pesquisou na web? Quais ferramentas você usa quando pesquisa? Quando você pesquisa, com que frequência você encontra o que está procurando? Algumas pesquisas são mais fáceis que outras?

• O (A) facilitador(a) conecta respostas de discussão a uma grande ideia.

• Atualmente, a web tem bilhões e bilhões de páginas! Isso é um monte de informações e recursos, por isso, encontrar a informação certa que você precisa na enorme coleção de páginas interconectadas é o trabalho de uma coleção de programas de software.

• Alguns desses programas fazem o trabalho de explorar a web para descobrir o que está lá, para criar um índice da web.

Dica! Se for apropriado, você pode perguntar aos participantes: o que é um índice? Onde você costuma encontrar em um índice e para que serve? (Nos livros, um índice é uma lista ordenada do conteúdo que ajuda a encontrar tópicos específicos em um livro inteiro).

• Explique que os participantes farão experiências com a criação de um índice (ou listagem ordenada) de uma coleção de objetos, o que nos ajudará a encontrar itens ou itens específicos nessa coleção.

Atividade off-line: seja o rastreador!

[30 min]

• Pesquise uma coleção.

• Usando um método preferido, o(a) facilitador(a) divide os participantes em grupos de 2 à 4.

• Cada grupo de aprendizes obtém uma coleção de 20 a 60 objetos pequenos e variados – por exemplo, um grupo de botões ou miçangas ou peças Lego de diferentes formas, tamanhos, cores, texturas, materiais.

• O(A) facilitador(a) pede que cada grupo de participantes encontre todos os botões ou miçangas azuis em na coleção. Quando eles terminarem, eles devem levantar as mãos. Inicie um temporizador e tome nota da hora em que todos os grupos terminaram a tarefa. Peça a cada grupo para relatar o número de botões ou miçangas azuis que encontraram.

Dica! Se houver tempo, tente outra pesquisa, adicionando outro atributo junto com uma especificação de cor, como textura ou tamanho.

• Discuta a tarefa

• O(A) facilitador(a) diz aos participantes: você acabou de fazer uma pesquisa – parabéns, todos são mecanismos de pesquisa! Vamos falar sobre como você fez isso – o que você fez para encontrar todos os itens azuis? O que ajudou? Foi fácil ou difícil?

Dica! Se o grupo está com dificuldades para refletir sobre a tarefa, pergunte: eles tiveram que sacudir ou despejar a coleção para ver o que estava lá? Eles tiveram que discutir o que conta como azul? As coleções maiores são mais difíceis de pesquisar?

• Documente o processo de pesquisa.

• Pergunte aos participantes: Se fôssemos escrever uma lista de etapas envolvidas nessa pesquisa simples, como seria essa aparência? Vamos fazer isso juntos – que passos você deu? Os passos foram repetidos?

Dica! O conjunto de etapas pode ser algo parecido com isto:

Espalhe a coleção para que você possa ver. Decida o que conta como “azul” (ou médio, ou qualquer que seja o termo de pesquisa). Selecione um botão que corresponda à descrição da pesquisa. Coloque ao lado. Repeta até não restarem botões azuis. Calcule sua contagem final de botões. Levante sua mão para sinalizar que você terminou a tarefa. Relate o número.

• Uma vez que o(a) facilitador(a) tenha documentado esta lista, pergunte aos participantes – alguém mais poderia fazer essa tarefa, apenas olhando para a nossa lista?

• Explique que esta lista sequencial de tarefas é conhecida como um algoritmo. Quando os desenvolvedores de software escrevem código de computador, eles escrevem algoritmos, ou listas de tarefas, que os computadores executam.

• Pergunte: o que poderia facilitar essa tarefa? Existe alguma coisa que poderíamos fazer no ADVANCE para tornar as coisas mais rápidas?

• Crie um índice

• Peça aos participantes que encontrem uma maneira de solicitar os itens da coleção para acelerar a pesquisa – isto é um índice! Ofereça folhas de papel, canetas e notas autoadesivas e deixe os participantes resolverem problemas na criação do sistema.

Dica! Se os participantes parecerem travados, faça sugestões – como os itens podem ser agrupados? Existem semelhanças entre os itens? Quais são os recursos que alguém pode pesquisar?

• Quando os participantes parecem ter terminado, dê-lhes uma segunda tarefa de pesquisa, diferente da primeira. Marque quanto tempo leva para todos os grupos concluírem e relatarem. Marque a hora – deve ser mais rápido para todos os grupos, especialmente para grupos com coleções maiores.

• Discuta!

• Como os participantes resolveram o problema? Que abordagens tomaram? As abordagens eram iguais ou diferentes?

• Ressalte que o processo de explorar a coleção e criar esse índice é exatamente o que os programas de software denominados “web crawlers” ou “spiders” fazem – um por um examinando bilhões de páginas web e criando um índice para agilizar os processos de pesquisa.

Dica! Se houver tempo, discuta a ideia de metadados, informação que ajuda a descrever cada objeto na coleção - “azul”, “quadrado”, “miçangas” e “botão”.

• Revise o Algoritmo

• Retorne ao algoritmo; Como ter a coleção indexada muda os passos?

Dica! Aqui, você pode ter uma discussão em grupo sobre o algoritmo e falar sobre as diferentes adições às etapas que cada grupo pode adicionar (dependendo de como eles criaram o índice). OU (se o tempo permitir) você pode pedir aos participantes que tomem o algoritmo básico e escrevam um novo conjunto de etapas que funcionem com sua coleção indexada. Então os grupos podem andar ao redor da sala.

• Certifique-se de destacar a ideia de que novos algoritmos são diferentes para cada grupo e método de indexação. Conecte isso à ideia de que, quando usamos diferentes mecanismos de pesquisa, obtemos resultados diferentes, dependendo do algoritmo e de como os sites são indexados.

Reformulação

[5-10 min]

• O(A) facilitador(a) explica que, claro, as páginas web não são botões/miçangas. O que há de diferente entre páginas web e botões/miçangas? Peça aos participantes para discutir ou você pode explicar os seguintes pontos:

• As páginas web são muito mais complexas e repletas de informações e imagens ricas.

• Elas estão todas interconectadas - conectados entre si, para que alguém possa se referir ou se conectar a outro - de uma maneira que nossos botões não conseguem.

• Além disso, há bilhões de páginas web - isso está acontecendo em uma escala totalmente diferente das nossas pequenas coleções aqui.

• O(a) facilitador(a) explica que os mesmos princípios que usamos em nosso exercício de botão se aplicam à empresas de mecanismos de pesquisa como o Google e o Yahoo que criam índices e usam algoritmos de pesquisa para encontrar seus resultados de pesquisa.

• Mostre este pequeno vídeo sobre como a Google Pesquisa funciona https://www.youtube.com/watch?v=BNHR6IQJGZs

• Aponte que:

• Nem todas as páginas estão incluídas no índice! Apenas parte da web está disponível e as páginas mais populares estão frequentemente no topo da sua pesquisa.

• O algoritmo é projetado para dar um bom resultado ao pesquisador, mas nem sempre é o melhor resultado, e seu resultado pode ser diferente do dia a dia.

• Os algoritmos são projetados por pessoas, em empresas como Google, Microsoft, Yahoo, etc, e eles são constantemente ajustados e alterados.

• Existe algo chamado Search Engine Optimization (SEO) - coisas que os web designers, desenvolvedores e desenvolvedores de conteúdo fazem para conseguir que suas páginas cheguem bem alto nos resultados da pesquisa, aproveitando-se de como o algoritmo funciona.

Atividade On-line

[5-10 min]

• Peça aos participantes para compartilhar pesquisas ou pesquisar perguntas que tenham - por exemplo, quanto tempo leva para ir andando à São Paulo, o que há em um molho especial ou quanto dinheiro um veterinário ganha por ano.

• Faça um brainstorm e liste diferentes mecanismos de pesquisa, ou seja, Bing, Yahoo, Google etc.

• Atribua a cada participante ou grupo de participantes uma pergunta e um mecanismo e peça que procurem pelo menos 3 fontes diferentes de informação.

• Discuta em grupo o que os participantes descobriram em sua pesquisa.

• Peça aos participantes que pesquisem novamente com a mesma pergunta, mas com um mecanismo de pesquisa diferente, e compare os resultados com a primeira pesquisa.

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou sobre esta atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?

Detetive Web

Habilidades: Avaliação, Pesquisa, Navegação, Solução de problemas, Colaboração, Comunicação

Descrição

Aprenda a contar a verdade através da ficção enquanto usa a web para investigar a existência do Kraken, uma enorme criatura marinha tentacular e perigosa, e como detectar informações erradas e desinformação. Os participantes colaborarão para criar um conjunto de regras para orientá-los na avaliação de fontes da web para resolver uma questão de pesquisa e compará-las a outras listas de verificação.

Objetivos da Aprendizagem

• Pesquisar e avaliar informações na web.

• Criar critérios para avaliar informações na web.

• Listar outros recursos disponíveis para avaliar informações na web.

Tempo Necessário

1 hora à 1.5 horas dependendo do tamanho do grupo

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a web.

Materiais

• Notas autoadesivas

• Flipchart, quadro branco ou papel

• Lápis, marcadores

• Notebook com conexão à Internet

Habilidades de Alfabetização Web

• Avaliação

• Pesquisa

• Navegação

Habilidades do Século XXI

• Solução de problemas

• Colaboração

• Comunicação

Introdução

[15-20 min]

• Brevemente enquadre e conecte este tópico à uma grande ideia.

• Pergunte aos participantes:

• Você pesquisa informações na web? Qual foi a última coisa que você pesquisou?

• Como esse recurso ajuda/muda as coisas para você?

• Conecte esta discussão com a ideia de que a web é uma fonte rica e complexa para todos os tipos de informação, de muitas fontes diferentes.

• Facilite uma breve discussão entre seus participantes sobre fontes da web.

• Tudo que você lê ou assiste on-line é verdade?

• Como você sabe quando a informação na Internet é confiável?

• Como você pode dizer quando não é confiável?

Dica! Discuta com os participantes a história das notícias falsas (fake news) e peça-lhes que dêem exemplos de notícias falsas do passado e do presente, e porque isso pode parecer mais proeminente hoje em dia (por exemplo, notícias falsas não são novidade, porém por causa das mídias sociais, notícias falsas podem alcançar mais pessoas mais rápido do que e-mails virais puderam fazer no passado.) Dica! Discuta a diferença entre informação errada (informação que é falsa) e desinformação (a informação que é falsa e deliberadamente destinada a enganar). Saliente que podemos prestar atenção ao que estamos percebendo e sentindo on-line e usar essas respostas, além de um conjunto de critérios para nos ajudar a ser melhores detetives da web. Dica! Um remix disso é falar sobre estratégias de publicidade, tendências, etc, de que a mídia na web é frequentemente projetada para provocar sentimentos específicos.

Co-crie uma lista de critérios

[10 min]

• Crie critérios para guiá-lo na determinação da confiabilidade das informações na web.

• Peça aos usuários que pensem e escrevam em notas autoadesivas individualmente e depois compartilhem com o grupo.

• O(A) facilitador(a) deve permitir que o grupo os gere, mas pode gentilmente guiar ou preencher com algumas sugestões e prompts, como: fontes, autores - fundos, capacidades, frescor / data, familiaridade do site / fonte, design do site, estilo de escrita / ortografia, publicidade, outras histórias no site, etc.

• Facilitator should let the group generate these, but can gently guide or fill-in with a few suggestions and prompts, such as: sources, authors– backgrounds, capabilities, freshness/date, familiarity of site/source, design of site, writing style/spelling, advertising, other stories on site, etc.

• Tente chegar a um acordo sobre cada regra. A lista não precisa ser exaustiva – tenha como objetivo seis ou mais itens.

• Se houver controvérsia, não elimine as regras, mas mantenha-as ao lado.

• Permitir a discussão de regras e reconheça que os critérios que funcionam para alguns podem não funcionar para os outros.

• Documente as regras compartilhadas em uma grande folha de papel, quadro negro ou flipchart e poste onde todos possam vê-las.

• Haverá uma chance de adicionar ou revisar a lista após a atividade.

Pesquisando e avaliando evidências

[20 minutos]

• Divida os participantes em grupos de 2 ou 3. Explique que o desafio de cada grupo é examinar as seguintes sete fontes de evidências de que o Kraken, uma criatura marinha tentacular de 100 a 120 pés que ataca e afunda navios, é real.

• NOTA: Estes representam dois conjuntos diferentes de histórias: 1-4 sobre uma forma encontrada em uma imagem do Google Earth e 5-8 sobre novas imagens de vídeo subaquáticas. O(A) facilitador(a) pode limitar a 1-4 ou 5-8, conforme necessário, ou dar a cada grupo um conjunto diferente.

• http://www.mirror.co.uk/news/world-news/legendary-120m-kraken-sea-monster-8215560

• http://www.ufosightingsdaily.com/2016/06/60-meter-giant-squid-found-on-google.html

• http://www.orlandosentinel.com/features/gone-viral/os-thats-not-the-kraken-on-google-earth-its-a-rock-20160621-story.html

• http://www.southernfriedscience.com/did-monster-hunters-find-a-120-meter-long-giant-squid-on-google-maps/

• http://www.npr.org/2013/01/13/169274472/the-kraken-is-real-scientist-films-first-footage-of-a-giant-squid

• http://www.foxnews.com/science/2013/01/24/video-kraken-in-natural-habitat-released.html

• https://www.scientificamerican.com/article/live-giant-squid-filmed-in-deep-ocean/

• https://www.greenprophet.com/2013/01/kraken-sea-monster-video/

• https://en.wikipedia.org/wiki/Kraken

• Os grupos devem passar 20 minutos pesquisando juntos. O(A) facilitador(a) enquadra essa atividade:

• Lembre aos participantes que eles têm uma pergunta bastante específica, “O Kraken, uma criatura marinha de tentáculos de 100 a 120 pés que ataca e afunda navios, é real?”

• Escreva a pergunta e poste-a na sala, certifique-se de que não há dúvidas ou dúvidas sobre essa questão e que isso está claro para todos.

• Sugira que os participantes usem a pergunta de pesquisa para orientar seu trabalho.

• Distribua folhas de pontuação em branco para acompanhar a avaliação de cada site.

• Explique que os participantes devem resumir o conteúdo de cada site em alguns pontos na parte superior da folha – a ideia ou mensagem básica.

• Peça aos participantes para listar:

• as regras acordadas (e qualquer outra que deseje usar) na coluna 1

• pontuações (mais/menos) na coluna 2

• notas e comentários na coluna 3 - o que você percebe? Como o site se parece? Como o conteúdo faz você se sentir?

Dicas! Encoraje os participantes a falarem através dos seus pensamentos e observações em conjunto enquanto exploram e pontuam. Dicas! Incentive os participantes a clicar nos sites onde essas histórias foram postadas para mais informações sobre a fonte, o autor, os patrocinadores, etc. Dicas! Incentive os participantes a pensar sobre a linha do tempo das histórias - quando elas apareceram? Quais são os mais recentes? Como as fontes e histórias estão conectadas?

• Peça aos participantes que reflitam sobre o que notaram/sentiram enquanto olhavam para os sites. [10-20 minutos]

• Alguma coisa te surpreendeu?

• Houve alguma diferença entre a manchete e a ideia principal?

• Quais diferenças você notou na história de site para site?

• O que você sentiu quando leu ou olhou os sites? Alguns foram mais divertidos/excitantes do que outros?

• Quais sites parecem mais confiáveis? O quais não? Você validou as fontes on-line?

• Há novas regras que você propõe para a lista?

• Quem é o dono do site? Como podemos descobrir o objetivo do site? Quando a página foi criada?

• Revise a lista de regras e discuta conforme necessário.

• Compartilhe os resultados da pergunta de pesquisa – quais são as respostas deles? Como a lista de regras ajudou?

• Conclusão: Dadas estas histórias, podemos dizer que o Kraken, uma criatura marinha de tentáculos de 100 a 120 pés que ataca e afunda navios, provavelmente NÃO é real. Na primeira história, uma ilha de rochas é confundida com um Kraken. Na segunda história, o vídeo foi filmado de uma lula gigante, mas é muito menor e mais tenso do que o Kraken que estamos procurando, embora possa ter inspirado as lendas.

Detectando habilidades na natureza

[15-20 min]

• Explique aos participantes que eles testaram a lista em um conjunto de recursos selecionados – notícias selecionadas previamente. Agora, eles podem testar suas listas em fontes de notícias e informações que encontram “em estado selvagem”.

• Brainstorm com os participantes, ou atribuir uma questão que é controversa – seja a partir de notícias ou cultura pop.

Dica! Assegure-se de que os participantes formem a pergunta com clareza, concentrando-se em provar ou refutar um fato específico.

• Peça aos participantes para fazer uma pesquisa na web para encontrar 3 ou 4 fontes diferentes sobre essa controvérsia.

• Peça-lhes para usar o mesmo processo na seção anterior para avaliar a reivindicação.

• Reúna o grupo para compartilhar os resultados. Pergunte aos participantes:

• Alguns dos resultados foram diferentes ou houve consenso?

• Quais fontes eram confiáveis? Quais fontes você decidiu que não eram confiáveis?

• Há algo que você adicionaria ou alteraria na sua lista?

Verifique sua Lista de Verificação

[6 min]

• Vamos ver como sua lista acima se compara a outras listas e processos de verificação de fatos.

• Divida os participantes em grupos de 3 a 4 e peça aos participantes que examinem:

• How to Spot Fake News from FactCheck.org

• 7 Steps to Better Fact Checking from Politifact

• How to Fact-Check the Atlantic from the Atlantic

• Pergunte aos participantes:

• Como essas listas se comparam à sua própria lista?

• O que você aprendeu que não sabia antes?

• E se algo estiver faltando nessas listas?

• Como você incentivaria os outros a praticar boas técnicas de pesquisa/checagem de fatos?

Dica! Explique aos participantes que algumas dessas listas são feitas para e por jornalistas, que escrevem e publicam notícias – antes da Internet, esses eram os “guardiões” (gatekeepers) da informação factual. O que significa ser um porteiro? Os usuários atuais de mídia social – você, se você usa e publica em mídias sociais – também são “guardiões” potenciais de informações factuais? Dica! Se o tempo permitir, você pode considerar a adição da seguinte atividade, que explora como falsificar suas próprias notícias: https://nucleus-network.github.io/missioninfo/activities/fakenews.html#overview

• Explique aos participantes que há vários sites dedicados a verificação de fatos em notícias, além de informações sobre cultura pop e lendas urbanas. O Politifact.com, FactCheck.org e o Fact Checker Blog do Washington Post cobrem as notícias. Snopes.com abrange notícias, bem como cultura pop.

• Pergunte aos participantes:

• Eles já usaram sites como este?

• Eles estão propensos a usá-los?

• Como pode avaliar a confiabilidade desses sites?

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou sobre esta atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?

Design na Web

Habilidades: Design, Pesquisa, Navegação, Comunicação, Colaboração, Solução de problemas

Descrição

Nessa discussão e atividade on-line, os participantes exploram e experimentam como o design visual funciona na Web e como os web designers usam suas habilidades para estimular determinados comportamentos. Os participantes comparam e contrastam os elementos visuais e interativos de diferentes páginas e plataformas. Em pares, eles narram e documentam as “jornadas do usuário” por meio de um site – um processo que os web designers da vida real usam para testar e melhorar sites.

Objetivos da Aprendizagem

• Explicar como o design visual funciona na web

• Identificar como os elementos de web design são usados para incentivar determinado comportamento

• Criticar e documentar reações a um site

Tempo Necessário

45 minutos a 1 hora, dependendo do tamanho do grupo

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a web.

Materiais

• Notas autoadesivas

• Lápis, marcadores

• Notebook com conexão à Internet

Habilidades de Alfabetização Web

• Design

• Pesquisa

• Navegação

Habilidades do Século XXI

• Comunicação

• Colaboração

• Solução de problemas

Introdução

[10 min]

O(A) facilitador(a) introduz a ideia de que a web é um espaço projetado. Tudo o que você experimenta na web é resultado de uma decisão humana e uma intenção humana: * Um botão ou barra de pesquisa em um determinado local * Texto em um determinado tamanho * Escolhas de cores * Imagens, texto, etc.

• O(A) facilitador(a) pergunta aos participantes, o que significa projetar algo?

• Vamos pensar em design no mundo físico. Vamos pegar os edifícios, por exemplo (o(a) facilitador(a) escolhe dois exemplos contrastantes):

• casa assombrada/prédio do governo/boate

• vs. chácara aconchegante/creche/biblioteca?

• Você já esteve em espaços como estes? Como esses ambientes podem ser ou parecer diferentes?

• Quais são os sentimentos diferentes que você deseja que os usuários do seu prédio tenham?

• Quais são as diferentes ações que você deseja que os usuários de seu edifício tomem?

• Designers fazem escolhas para criar um resultado – em ação ou sentimento para o usuário. Todos os designers têm planos e intenções.

• Como usuário, você responde ao design com sentimentos e ações (ou não).

• O(A) facilitador(a) conecta a discussão sobre os espaços físicos com a Web: como um espaço físico, a maioria dos sites é projetada com uma intenção – há algo que o designer deseja que os usuários façam.

• Discuta com os participantes ou faça uma atividade de pensar/dupla/compartilhar sobre as seguintes perguntas:

• Quais sites você usa com mais frequência? Cada participante pensa em um site (YouTube, Facebook, Google, Amazon, site da biblioteca, etc.)

• Qual é o objetivo do site? O que o criador do site pretende que você faça? (Pode ser: comprar coisas, ver anúncios, etc)

• O que você está fazendo aí? O que você quer fazer?

• O seu objetivo é diferente do que o designer do site quer? Se sim, como?

• Você já teve uma experiência de visitar um site com a intenção de fazer uma coisa e acabar fazendo algo diferente? Como ou por que isso aconteceu?

• Você já teve a experiência de visitar um site e não ser capaz de fazer ou encontrar algo lá?

• O(A) facilitador(a) explica que quanto melhor o design do site, maior a probabilidade de você fazer o que o designer pretende.

Elementos de Design Visual

[5 min]

• Para muitos usuários da Web (com exceção de usuários com deficiência visual, aqueles que usam leitores de tela), os sites têm um forte componente visual. Pergunte aos usuários: quais são alguns elementos do design visual?

Dica! Aqui, você pode usar um exemplo para começar os aprendizes ou criar uma lista juntos primeiro. Alguns elementos podem incluir:

• Cor

• Tamanho

• Forma

• Espaço

• Posição (alinhamento, proximidade)

• Repetição

• Variedade

• Harmonia

• Veja exemplos – qual é a intenção do site? como o design é usado?

• Para cada exemplo, o que você vê? O que você vê primeiro? Quais elementos de design visual estão lá? O que se destaca?

• Dois exemplos para comparar e contrastar:

• casa assombrada/prédio do governo/boate

• vs. chácara aconchegante/creche/biblioteca?

• Deixe os participantes olhar e discutir. Aqui estão algumas das coisas que eles ou o(a) facilitador(a) podem mencionar:

• No exemplo do Google:

• O foco é a barra de pesquisa – é quase a única coisa na página.

• O logotipo colorido do Google aparece contra o fundo branco.

• Muito espaço em branco na página nos ajuda a focar.

• No exemplo da Amazon:

• Tantas coisas para ver e clicar –

• Algumas coisas são maiores: o anúncio do Echo Dot recebe muito espaço, por isso é importante.

• O botão pop-up “LOG IN” está flutuando em cima do resto do design, chamando a atenção para si.

• O botão “Explore” também aparece visualmente.

• A barra de pesquisa é proeminente e fácil de encontrar – veja a lupa amarela.

• Os círculos repetidos dão aos usuários a sensação de que podem escolher entre muitos agrupamentos de produtos para comprar.

• As pequenas imagens dos produtos no topo são lúdicas e divertidas, elas são uniformemente dimensionadas, você tem a sensação de que há muitas delas.

Elementos Interativos de Design

[5 min]

• Pergunte aos usuários: quais elementos tornam um site interativo?

• Os exemplos podem incluir: Links, formulários, barras de pesquisa, botões “curtir”, botões “Comprar agora”, caixas de comentários, caixas de atualização de status, listas de itens a serem percorridos, mouse-overs para pop-ups

• Veja alguns exemplos com os participantes e discuta o que eles vêem. Pergunte aos participantes: como os elementos de design visual (como tamanho, cor, forma, posicionamento) funcionam com elementos de interação?

• Os participantes podem perceber que os designers usam cor, tamanho e posicionamento para chamar a atenção para os botões que desejam que os usuários pressionem, ou uma barra de pesquisa, etc.

Dica! Se estiver navegando on-line, você pode tentar alternar para o modo de design responsivo (Ferramentas> Desenvolvedor da Web> Modo de design responsivo), que permite ver como o site aparecerá em diferentes dispositivos.

Quais elementos do site desaparecem quando o espaço da tela é menor e quais ainda estão presentes? Ver um site nesse modo pode ajudar os participantes a entender quais aspectos do site o designer considera mais importantes.

Objetivos do Usuário, Metas do Site

[5 minutos]

• Vamos considerar as metas que um site (ou a empresa/organização que o site representa) tem para interações em seus sites, em comparação com as metas do usuário. Selecione um site real como um exemplo.

Dica! Escolha alguns sites comuns, como o Amazon.com, o YouTube.com ou quaisquer sites usados com frequência na comunidade do seu público. Você pode atribuir os sites ou permitir que os participantes selecionem.

• Pergunte aos participantes:

• Quais são os objetivos que os usuários podem ter relacionados ao site?

• Quais são as metas que o site/empresa/organização pode ter?

• Tente listar três ou mais metas potenciais para cada um. Por exemplo:

• O YouTube.com pode ter o objetivo de incentivar os usuários a assistir muito conteúdo. Um objetivo secundário pode ser para os usuários verem cliques em anúncios. Um terceiro objetivo pode ser incentivar os usuários a comentarem sobre vídeos.

• Um usuário do YouTube.com pode assistir a apenas um único vídeo específico. Ou um usuário também pode querer encontrar muitos vídeos sobre um assunto. E um usuário pode querer enviar seu próprio conteúdo para o YouTube.

• Os objetivos dos usuários e do site estão em conflito? Como?

• O que acontece quando as metas do usuário e do site estão em conflito?

• Explique aos participantes que, ao documentar sua experiência com sites, eles podem ver como o design do site funciona para atingir as metas dos sites e as metas dos usuários… ou não!

Investigações e Jornadas

[15 minutos]

• Nesta atividade, os participantes se emparelharão e trabalharão juntos para documentar suas próprias jornadas de usuário com um site específico. O objetivo é perceber como eles estão interagindo com o design do site. Idealmente, cada dupla de participantes deve ter um computador para trabalhar.

• O(A) facilitador(a) divide o grupo em duplas. O(A) facilitador(a) pode selecionar sites para os participantes trabalharem, ou os participantes podem selecionar seus próprios sites.

• Peça aos participantes para irem ao site com uma intenção ou objetivo em mente.

• Por exemplo: estou indo para a Amazon para pesquisar livros sobre gatinhos; Vou procurar uma aula de introdução ao HTML no YouTube.

• Uma pessoa da dupla é o usuário que está navegando pelo site e falando em voz alta/contando a história do que está fazendo “ou seja. Vou digitar “gatinhos” na barra de pesquisa ou “vou descer e ler esses comentários”

• O outro membro do dupla está ouvindo/documentando a jornada do usuário. O ouvinte deve notar e/ou tomar notas sobre a experiência do usuário.

• Por exemplo, o ouvinte deve documentar:

• Qual é o plano ou objetivo do usuário ao usar o site?

• Qual é a primeira coisa que eles veem no site? O que aparece?

• Aonde eles clicam?

• Eles olham/assistem/ouvem conteúdo que não estavam procurando (anúncios, vídeos ou itens sugeridos, etc.)?

• Por que isso aconteceu?

• Como o site se sente? frio, simpático, chique, elegante, etc

• O que os incomodou? O que foi divertido?

• Eles mantiveram seu objetivo original para a sessão, ou foram desviados?

• No que eles gastaram mais tempo fazendo no site?

• Cada participante deve levar de 5 a 7 minutos navegando em um site como usuário e de 5 a 7 minutos documentando a experiência do parceiro(a) como ouvinte/anotador(a).

Dica! A versão off-line da atividade acima: Os(As) facilitadores podem imprimir uma página web para os participantes marcarem. É possível fornecer uma página interna e a página inicial do site (para investigar se a página interna ajuda efetivamente o usuário a navegar pelo restante do site). Como consequência, os participantes podem usar uma folha de papel em branco para criar um protótipo de uma página web que efetivamente resolve quaisquer problemas que eles vêem nos folhetos fornecidos.

Reflexão e Revisão

[5 min]

• O(A) facilitador(a) conduz uma breve sessão de discussão/reflexão sobre jornadas do usuário.

• O(A) facilitador(a) explica que as jornadas do usuário são uma ferramenta que os designers usam quando testam sites e aplicativos – eles podem fazer com que os usuários tentem usar o site e documentem o que fazem em cada etapa do processo para ajudar a refinar o design.

• O que os participantes descobriram no exercício da jornada do usuário?

• O que você notou durante a atividade? O que era novo, inesperado?

• Você percebeu que o design visual ou elementos de design de interação desempenham um papel no seu comportamento?

• Você notou alguma tensão entre as coisas que queria fazer ou obter da sua experiência no site e o que o design do site estava sugerindo que você fizesse?

• Como isso faz você se sentir?

• Você acha que perceberá ou fará algo diferente quando estiver navegando no futuro?

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou sobre esta atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?

Marcação Básica

Habilidades: Comunicação, Colaboração, Criatividade, Código, Design

Descrição

Nesta atividade, os participantes exploram como as informações, como texto e imagens, podem ser apresentadas para serem facilmente legíveis/compreensíveis, e como isso funciona na web usando tags HTML. Essa atividade explora como os navegadores funcionam, como as páginas web são estruturadas, a relação entre as tags HTML e o conteúdo.

Objetivos da Aprendizagem

• Descrever como o código HTML é usado para criar páginas web.

• Identificar tags HTML comuns.

• Criar um arquivo de texto que possa ser exibido como uma página web usando tags HTML

Tempo Necessário

45 minutos a 1 hora, dependendo do tamanho do grupo

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a web.

Materiais

• Notas autoadesivas

• Lápis, marcadores

• Notebook com conexão à Internet

• Imprima cartões com tags para TagTag Revolution ou faça o seu próprio em pedaços separados de papel, escreva as seguintes “tags” (não se esqueça de incluir a seta!):

• Abra as tags: “<aplaudir> →” (também cantar, pisar, girar, agitar).

• Feche as tags: “</aplaudir> ←” (também cantar, pisar, girar, agitar).

Habilidades de Alfabetização Web

• Código

• Design

Habilidades do Século XXI

• Comunicação

• Colaboração

• Criatividade

Introdução

[3 min]

• Revise os principais conceitos, enquadre e conecte este tópico a uma grande ideia. Explique:

• A Internet é um sistema de computadores interconectados, e a world wide web é um sistema de páginas interconectadas que vivem na Internet.

• Sites são espaços para acessar, compartilhar e interagir com conteúdo multimídia.

• As pessoas que criam a web - desenvolvedores e designers web - usam uma linguagem de codificação de computador chamada HyperText Markup Language ou HTML para criar páginas web.

• Quando você acessa a web, está usando um software chamado navegador para exibir páginas.

Dica! Pergunte quem sabe alguns exemplos de navegadores web.

• Vamos explorar hoje o HTML, especificamente como usamos o HTML para tornar nosso conteúdo - texto, imagens, etc. - legível pelos navegadores e fácil para os humanos lerem e entenderem.

Conteúdo e Tags

(5-7 mins)

• Para esta atividade, você precisa de dois recursos visuais:

• 1. a primeira página de um jornal mostrando imagens, títulos, linhas de texto, texto, parágrafos, colunas.
• 2. o texto e as imagens da primeira página despojados de toda formatação, na mesma fonte de tamanho, sem parágrafos, colunas, etc, impressos em uma única página. Você pode fazer isso acessando uma cópia digital de um jornal da edição impressa, como o New York Times, selecionando todo o conteúdo e copiando e colando-o em um Editor de Texto e removendo toda a formatação (através do comando “make plain text”). Você pode ter que fazer um pouco de edição extra para remover toda a formatação. O objetivo é mostrar aos participantes uma página inicial típica de um artigo, além do conteúdo como um bloco de texto uniforme e contínuo.

• Mostre aos participantes as duas páginas; diga-lhes que o conteúdo é o mesmo em ambas as páginas.

• Discuta juntos - qual é a diferença aqui? O que está faltando? Qual página é mais atraente? Qual página é mais interessante? Qual é mais fácil de ler? Por quê?

• Discuta em conjunto como elementos como títulos, colunas, linhas de texto, tamanhos de fonte diferentes e blocos de texto ajudam a organizar o conteúdo e direcionam nossos olhos para o que é importante na página.

Dica! Mantenha uma lista dos elementos de design que surgirem na discussão - mapeie-os para as tags HTML mais adiante na lição.

• Conceito-chave! Explique que é assim que os web designers usam o HyperText Markup Language (Linguagem de Marcação Hipertexo): para adicionar formatação ao conteúdo na Web, para que o navegador possa exibi-lo de maneira fácil de ler e interessante.

• Os web designers usam “tags” de HTML para informar ao navegador o que fazer com o conteúdo.

• Pergunte aos participantes, o que é uma tag? Onde você tem tags? O que eles fazem?

Dica! Se os participantes estiverem com dificuldades, explique: você tem marcações em suas roupas ou na sua bagagem, pessoas marcam você nas mídias sociais, você pode marcar uma postagem no blog… Uma tag é um pouco de informação que você anexa a alguma coisa, para identificá-la de alguma forma ou adicionar instruções especiais.

• Explique: Quando os web designers escrevem HTML, eles pegam partes do conteúdo e “marcam-os” com tags para dizer ao navegador como mostrar esse conteúdo. Eles colocam uma tag no início do conteúdo (a tag de abertura) e uma tag no final (a tag de fechamento), para que o navegador saiba quando iniciar e parar.

Dica! A visualização são realmente úteis aqui - escreva ou projete um exemplo (como abaixo) onde todos possam vê-lo.

• Explique as regras para marcação são:

• Quando queremos marcar algum conteúdo, nós o cercamos com um par combinado de palavras, cada palavra é cercada por um conjunto de colchetes “< >”.

• Veja uma tag de exemplo: <title> Marque o mundo </title>

Dica! pergunte aos participantes, neste exemplo, qual é o título?

• Quando as tags são usadas on-line, os colchetes alertam o software do navegador de que é uma tag. A palavra ou caractere dentro de cada colchete informa ao navegador informações importantes sobre o que está dentro dele.

• Você pode ver que há algo diferente no segundo conjunto de colchetes: </title> a barra invertida significa que é uma tag de FECHAMENTO - informando ao navegador que a marcação foi concluída.

• Nós SEMPRE usamos tags de abertura e fechamento para cercar o conteúdo.

• Com pouquíssimas exceções, as tags são SEMPRE compatíveis com o conteúdo, assim como os exemplos de marcação que discutimos.

• Informe aos participantes que agora vamos experimentar o CONCEITO de marcação e marcação em atividades off-line antes de nos aprofundarmos e vermos como elas funcionam on-line.

Off-line: Marque o Mundo

[10 min]

Dica! Se os seus participantes parecem confortáveis com o conceito de abertura e fechamento de tags (ou você está pressionado por tempo), você pode pular esta e passar para a próxima seção. Se eles precisarem de mais tempo com esse conceito, faça a atividade Marque o Mundo.

• Introdução: Explique aos participantes que eles experimentarão fazer marcações e atribuir marcações a coisas do mundo real na sala. Distribua folhas de papel, marcadores e fita adesiva. Explique que este é um exercício para mostrar o CONCEITO de marcação e abertura e fechamento de tags.

• Aqui no mundo real, você tem total liberdade para criar seus próprios nomes de tags. Mais tarde, veremos que no HTML de codificação, usamos um conjunto restrito de nomes de tags com os quais todos concordam. Mas, por enquanto, crie a tag que quiser.

Dica! Escreva o seguinte exemplo em letras grandes no quadro ou crie um slide para mostrá-lo. Use o tempo que for necessário para este conteúdo e certifique-se de que todos entenderam - é importante!

• Revise as regras de marcação:

• Quando queremos marcar algum conteúdo, nós o cercamos com um par combinado de palavras, cada palavra é cercada por um conjunto de colchetes “< >”. Aqui está uma tag de exemplo:

• <title> Marque o Mundo </title>

• Nós SEMPRE usamos tags de abertura e fechamento para cercar o conteúdo.

• Você pode marcar qualquer coisa na sala - faça suas próprias tags e feche-as!

Dica! Para ajudar os participantes a começarem, crie uma tag de exemplo e coloque-a na sala - <cadeira> </cadeira>. Incentive as pessoas a se divertirem e serem criativas!

Off-line: Revolução das Marcações

[10 min]

• Introdução: Explique aos participantes que eles estão prestes a ter uma divertida dança das cadeiras para mostrar como as tags HTML atribuem instruções ao conteúdo.

Dica! Este jogo é melhor com grupos acima de 10. Se você tem um grupo maior, você pode querer adicionar algumas tags extras. Se você tiver um grupo pequeno, talvez queira usar menos. Sinta-se livre para fazer o seu próprio.

• Passos:

Organize os jogadores em um círculo, certificando-se de que haja espaço suficiente para andar pelo lado de fora do círculo.

Selecione dois jogadores do grupo para serem os “Programadores”. Entregue a um deles a primeira tag aberta e ao outro a tag correspondente fechada. Comece com uma tag fácil como <palmas> e </palmas>.

Inicie a música e faça com que os dois “Programadores” andem pelo lado de fora do círculo enquanto os outros jogadores ficam parados. Certifique-se de que os “Programadores” mantenham uma pequena distância entre eles. Você poderia fazer com que eles começassem a andar a cinco passos um do outro.

Quando você parar a música, os “Programadores” anexarão as tags aos membros do círculo que estão mais próximos. Lembre-se de que as tags devem envolver o conteúdo.

Todos que estão entre as setas da tag aberta <palmas> e da tag fechada ```, agora terão que começar a bater palmas (as pessoas que usam as tags, não precisam). Os jogadores que aplaudem devem continuar a bater palmas pelo resto do jogo.

Agora selecione duas novas tags e entregue-as aos “Programadores” (por exemplo, <cantar> e </cantar>).

Repita os passos 3 e 4. Desta vez, quando os “Programadores” passarem as tags, qualquer um que esteja entre as tags <cantar> terá que cantar. Se algum jogador estiver entre as tags <palmas> e as tags <cantar>, eles terão que bater palmas e cantar.

Continue estas etapas novamente com o resto das tags (e quaisquer outras tags que você deseja adicionar ao jogo) para fazer uma divertida e complicada festa dançante de tags! Quando os “Programadores” tiverem com as tags finais, peça-lhes que se juntem ao círculo onde quer que estejam, quando a música parar (em vez de entregar as tags às pessoas no círculo). Todos entre as tags que os “Programadores” estão segurando executam as ações em suas tags.

Depois que todas as tags forem usadas, você poderá fazer com que os jogadores com tags movam-se um de cada vez para alterar quem está fazendo o quê. Isso ajudará os participantes a entender como as tags são aplicadas ao conteúdo, como elas são abertas e fechadas no HTML.

• Aqui no mundo real, você tem total liberdade para criar seus próprios nomes de tags - mais tarde veremos que na linguagem de codificação HTML, usamos um conjunto restrito de nomes de tags com os quais todos concordam, que fazem sentido para o conteúdo web. Mas, por enquanto, crie a tag que quiser.

Marcação em Ação

[15 min]

• Introdução: explique que vimos como são as tags e como elas funcionam com o conteúdo (o que há dentro das tags). Agora, vamos praticar usando algumas tags reais que fazem parte do HyperText Markup Language (HTML).

• Primeiro, vamos verificar um documento HTML simples - adivinhem - a partir de um web designer e desenvolvedor, quando eles estão construindo páginas web, o que eles estão trabalhando é o código HTML em um arquivo de texto simples.

Dica! Abra um documento HTML simples em um editor de texto - o NotePad para PC ou o TextEdit para Mac, e também mostre-o em um navegador. Aponte as tags no documento e mostre o que elas fazem. Tags básicas sugeridas: h1, h2, h3, p, a, body. Você também pode mostrar um documento mais complexo (use o código-fonte do navegador) para mostrar que todas as páginas web são textos e códigos interpretados pelo computador.

• Essas tags têm significados acordados, de modo que tanto os desenvolvedores web quanto as pessoas que escrevem o software do navegador entendem o que elas significam. A única razão pela qual essas tags funcionam é por causa desses acordos - se você tentar usar algumas de suas tags divertidas do “Marque o Mundo” ou “Revolução das Marcações” em uma página web, você não verá nada, infelizmente.

Dica! Se os participantes estiverem confusos sobre quais tipos de tags seriam relevantes em HTML, lembre-os de que HTML significa “HyperText Markup Language (Linguagem de Marcação Hipertexto)” e que atribuímos tags ao conteúdo de texto. Pergunte: por que “parágrafo” seria uma tag HTML e não “palmas” ou “cantar”?

• Quando você usa essas tags, você está escrevendo HTML! E quando o navegador as vê, ele transformará sua página web de um chato bloco de texto para algo interessante e fácil de ler.

• Vamos marcar! Faça com que os participantes adicionem tags a algum conteúdo existente.

• OFF-LINE, para esta parte, você vai precisar de algum conteúdo - talvez uma notícia divertida ou uma biografia de alguém, ou algum outro conteúdo interessante, impresso em folhas 11x7 e cortadas em pedaços - parágrafos, títulos, links, etc. Você também precisará de alguma nota autoadesiva ou papel para tags. Escreva as tags ou deixe os participantes criá-las (somente da lista). Divida os usuários em pequenos grupos e dê a cada grupo uma coleção de texto e tags.

• ON-LINE, Para esta parte, você precisará de um arquivo de texto com algum conteúdo básico não formatado, mesmo tipo acima. Primeiro, peça aos usuários para salvar o arquivo como .html. Explique o objetivo das tags <head> e <title>. Em seguida, deixe-os digitar as suas tags!

Dica! Para o ON-LINE, crie um arquivo de texto com o conteúdo e peça aos usuários que o editem com o editor de texto MAIS BÁSICO - Bloco de notas em um PC ou TextEdit em um Mac - no modo de texto simples. O(A) facilitador(a) pode precisar explicar o cabeçalho e as tags do título.

• Explique aos participantes que eles precisam primeiro cercar todo o conteúdo com as tags body - para informar ao navegador que todo o conteúdo aqui é para exibição na web!

• Peça aos participantes para organizar o conteúdo usando as tags. Encontre os cabeçalhos mais importantes, divida os parágrafos, adicione pequenos títulos e procure por itens que possam ser hiperlinks. Ande pela sala e ajude aqui e ali.

• No final do exercício, se possível, os participantes on-line e off-line deverão ver a página carregada em um navegador. Os participantes on-line podem salvar e abrir o arquivo .html em um navegador. Para participantes off-line, o(a) facilitador(a) deve, se possível, mostrar a página finalizada em um computador e monitor.

• Explique aos usuários que esses arquivos ainda estão em seus computadores locais e só podem ser visualizados lá. Você ainda não os colocou “on-line” em um servidor, onde outras pessoas podem encontrá-los, portanto, elas não estão na web.

Dica! Lembre aos usuários da atividade Mapear a Web para ajudá-los a visualizar como o computador cliente está conectado. Eles podem acessar o conteúdo em servidores web, mas outros computadores na Web não podem acessar os arquivos dos clientes.

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou sobre esta atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?

Construindo Páginas Básicas

Habilidades: Composição, Código, Design, Revisão, Compartilhamento, Comunicação, Colaboração

Descrição

Nesta atividade, os usuários criarão sua primeira página Web usando um editor de texto básico e um navegador para exibir os resultados. Eles se entrevistarão para obter conteúdo pessoal (ou fictício) para uma página “Sobre”, organizarão e escreverão o conteúdo e marcá-lo usando HTML. Os usuários podem fazer o upload desses arquivos para um servidor (se disponível) e ver seus conteúdos na web!

Objetivos da Aprendizagem

• Criar uma página web simples

• Transfer web page online

Tempo Necessário

45 minutos a 1 hora dependendo do tamanho do grupo

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a web

Materiais

• Notebook com conexão à Internet

Habilidades de Alfabetização Web

• Composição

• Código

• Design

• Revisão

• Compartilhamento (se eles carregarem conteúdo para a Web)

Habilidades do Século XXI

• Comunicação

• Colaboração

Introdução

[10 min]

Dica! Lembre os participantes de sua experiência com Tags na lição anterior (Recomendo concluir a marcação 101 com os participantes antes desta atividade).

• Explique aos participantes que qualquer página web que você visita é na verdade um arquivo HTML, que é apenas um arquivo de texto – um monte de palavras – com HiperTexto ou Linguagem de Marcação adicionados ao conteúdo. HTML é a linguagem que usamos para escrever tags.

Dica! Se necessário, forneça uma pequena visita guiada ao navegador, como barra de endereços, botões iniciais, favoritos e histórico.

• Esses arquivos, às vezes, contêm outros tipos de código, como javascript ou php, o que torna as páginas – quando exibidas no navegador – interativas, chamativas e dinâmicas, puxando o código do navegador.

• Os arquivos HTML são apenas texto e não são muito bonitos de se ver.

• O navegador os leva e os torna legíveis e visualmente mais interessantes, mergulhando no design e puxando imagens e vídeos.

• Arquivo HTML + navegador, como o Firefox = PÁGINA WEB INCRÍVEL PARA VOCÊ (espero).

Dica! Para mostrar essa ideia, abra uma página simples e estática e olhe. Explique: Vamos ver! Podemos ver como uma página web se parece nos bastidores, antes que o navegador chegue a ela, explorando a “fonte de exibição”.

• Como os arquivos HTML são apenas texto, eles podem ser escritos em um editor de texto básico e visualizados em um navegador. Se você tem um navegador e um editor de texto em seu computador – e quase TODOS tem – você pode construir uma página web!

• Suas páginas não estarão na web. Para isso, você precisa pegar o arquivo que você criou e enviá-lo para um servidor para que as pessoas possam acessá-lo por meio da URL ou endereço da web.

Dica! Lembre às pessoas, talvez por meio de um diagrama, que os computadores clientes (usuários da web como você) se conectam à Internet e acessam páginas que residem em servidores na Internet. Servidores são projetados para “servir” páginas para usuários. As páginas web são arquivos HTML exibidos em um navegador, então eles ficam ótimos.

• MAS, por enquanto, você pode praticar a criação de páginas web aqui mesmo, no seu computador. Elas não estarão em um servidor na Internet, mas você ainda poderá criar os arquivos e visualizá-los no navegador em sua própria máquina.

Dica! Aqui você pode apontar para o diagrama e mostrar que você está criando uma página em um computador cliente, que não está compartilhando arquivos como um servidor!

• Para começar, precisamos de CONTEÚDO – porque a web é toda sobre comunicação e compartilhamento de informações e ideias. Vamos gerar algum conteúdo juntos!

Conteúdo e Contação de histórias

[20 min]

Dica! A próxima parte é divertida e interativa, e ótima para criar uma comunidade de sala de aula amigável e positiva. Mas se você tiver pouco tempo e dar aos participantes a sensação de que eles podem ter sua própria representação na Web NÃO é uma prioridade, você pode fornecer conteúdo pré-digitado como um arquivo .txt e pular para a próxima seção. – “Obter Marcação.”

• Escreva sua biografia ou a página “Sobre”. Peça aos participantes que se dividam em duplas e se entrevistem sobre suas vidas. Como facilitador(a), mantenha o controle do tempo para garantir que cada participante tenha tempo igual para a cada história.

• Entrevista: peça aos participantes que demorem 5 minutos para contar sua história ou, se não quiserem compartilhar coisas pessoais, eles podem inventar um personagem fictício e contar a história do personagem. Peça ao ouvinte para fazer anotações ou possivelmente gravar em um dispositivo. Solicite que os usuários falem sobre o que é mais importante para eles (ou seu personagem fictício). Ofereça esta lista de perguntas para começar:

• Qual é o seu nome, idade, outros detalhes?

• Onde você nasceu? Onde você cresceu? Como foi isso?

• O que você está fazendo agora? Como você gasta seu tempo? Quais são suas coisas favoritas para fazer, lugares favoritos, comida, música, etc?

• Existe um momento favorito, momento de maior orgulho que se destaca?

• Quais são seus planos e sonhos para o futuro?

Dica! O entrevistador pode fazer perguntas de acompanhamento para obter mais detalhes ou uma história mais completa. Ele ou ela pode fazer perguntas abertas como “por que” sobre as motivações, preferências, planos futuros, para ajudar a extrair mais percepções, ou ele pode fazer perguntas para esclarecer ideias na história.

• Revisão/Edição: Peça a cada participante que tire as anotações de sua história e as analise – considere adicionar detalhes, pense no que você deixou de fora.

• Organize e digite: peça aos participantes que digitem suas histórias em um editor de texto básico, certificando-se de usar o “modo de texto simples” (não o modo Rich Text). Ao digitar a história, eles podem considerar a organização e a estruturação da história em um começo, meio e fim. Talvez eles possam pensar em títulos para as seções: “Primeiros Dias” “Dias Atuais” “O que vem a seguir” ou eles podem encontrar outras formas de organizar o conteúdo, se eles falaram mais sobre seções de interesse – “Minhas músicas favoritas”, “lugares favoritos”, etc. A criação dessas seções ajudará a estruturar a biografia para facilitar a leitura como uma página web.

• Dê um título a sua história! Invente um título rápido para sua história ou conteúdo ou escolha algo básico.

• Crie uma nova pasta no seu computador e chame-a de “xx-paginaweb” usando suas iniciais.

• Salve sua história na pasta com a extensão .txt. – Dê um título sem espaços ou pontuação que não seja traços ou sublinhados, como “sobre-zm.txt”. Esta é a versão de texto da sua história, o conteúdo bruto.

• Além disso, salve sua história na pasta com .html como extensão, em vez de .txt – essa será sua versão web. O .html diz ao navegador para procurar por código html no arquivo. Dê um título sem espaços ou pontuação diferente de traços ou sublinhados, como “sobre-zm.html”.

Get Tagging!

[10 mins]

• Explique aos usuários que eles vão marcar sua história – a versão .html – com HTML, para torná-la pronta para exibição no navegador. Explique que codificar HTML e pensar e escrever conteúdo são duas maneiras diferentes de pensar, eles devem sempre ter conteúdo escrito antes de marcá-lo, em vez de escrever e marcar ao mesmo tempo.

Dica! Uma ótima maneira de ajudar os participantes a fazer isso, se você tiver acesso ao computador e ao projetor de um(a) instrutor(a), faça a atividade com o seu próprio conteúdo junto com os participantes e projete os resultados para que todos possam ver o que você está fazendo.

• Inicie o arquivo com uma tag doctype – essa é uma das únicas tags que não tem conteúdo dentro, e nenhuma tag de fechamento – é uma tag solitária única, lembrando o navegador, mais uma vez que estamos escrevendo html

• Adicione as tags <html> e </html> que envolvem toda a página – para que tudo dentro dela possa ser marcado com a linguagem de marcação.

• Depois disso, faça uma seção com um conjunto de tags chamada <head>``</head> no topo da página, antes de todo o seu conteúdo escrito. Colocaremos um pouco de conteúdo aqui para o navegador, mas não o veremos na própria página principal. Este é o título da página, que:

• define um título na aba do navegador.

• fornece um título para a página quando ela é adicionada aos favoritos.

• exibe um título para a página nos resultados do mecanismo de pesquisa.

• Em seguida, adicione as tags – elas devem estar ao redor do texto inteiro da página.

• Use h1 para o título principal de sua página, o título da sua história na tela (diferente da tag de título)

• Use tags h2 ou h3 para títulos de seção

• Use tags p para parágrafos.

• Não esqueça de fechar suas tags!

• Para crédito extra, adicione links para outros sites (como uma página sobre sua cidade natal, seu time favorito, artista ou músico, ou uma receita favorita). Você também pode baixar e adicionar imagens, apenas certifique-se de que elas estejam na pasta “xx-paginaweb”.

• Por fim, quando você adicionar todas as suas tags, salve a página!

• Agora, abra seu navegador favorito e vá para Arquivos > abrir arquivo. Navegue até a sua pasta e clique no arquivo html que você acabou de criar. Como se parece? Você está vendo seu conteúdo formatado para a web? Você vê seu título aparecendo na aba no topo da barra do navegador? Se as coisas não parecem corretas, o que pode ter acontecido?

Dica! O(A) facilitador(a) pode solucionar problemas aqui ––– são problemas comuns faltar tags, especialmente tags de fechamento, erros de digitação em tags, um documento não salvo como html, problemas com nomes de arquivos de imagem, etc. O(A) facilitador(a) pode andar por aí e verificar páginas e discutir ou mesmo demonstrar no exemplo projetado o que acontece quando as tags são deixadas de lado (por exemplo, nunca fechar uma tag h1 é uma ótima maneira de mostrar a importância de fechar as tags).

• Parabenize à todos nas páginas que eles fizeram! Eles agora são web designers! Lembre às pessoas que as páginas ainda estão em seus computadores locais e não na web! Mas elas estão prontas para ir para lá.

• Tenha uma breve discussão sobre o upload para servidores, sobre hospedagem web, o que significa, como funciona, quanto custa, o que as empresas de hospedagem fazem.

Fique On-line!

[15 min]

• Se a sua instituição tiver espaço e recursos de servidor disponíveis, mostre aos participantes como usar um aplicativo de transferência de arquivos para transferir suas páginas para uma pasta no servidor. Fale sobre o UPLOADING vs DOWNLOADING.

• Discuta como a URL será construída, peça aos usuários para descobrirem suas próprias URLs – nome do domínio, nome da pasta da classe, nome da pasta pessoal, nome da página.

• Quando todas as páginas estiverem no servidor, peça aos usuários que apontem seus navegadores para a URL na web para ver suas páginas. Você está na web de verdade! Woo-hoo!

Dica! Se tiver tempo, tenha uma breve discussão sobre hospedagem web, o que significa, como funciona, quanto custa, o que as empresas de hospedagem fazem.

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou sobre esta atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?

Aplicativos Web e Construindo com o Thimble

Descrição

Nesta atividade on-line, os participantes consideram como gostariam de se representar na web. Eles obtêm um curso intensivo na ferramenta de desenvolvimento web Thimble e usam o que aprenderam nas duas atividades anteriores sobre HTML e marcação para remixar um modelo em sua própria página pessoal na web. Esta lição revisita os conceitos de hospedagem web, nomes de domínio e URLs.

Objetivos da Aprendizagem

• Explique a diferença entre diferentes aplicativos da web.

• Crie uma página web usando o aplicativo web Thimble.

Tempo Necessário

45 minutos a 1 hora dependendo do tamanho do grupo

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a web.

Materiais

• Notebook com conexão à Internet e capacidade de projetar em uma tela

Habilidades de Alfabetização Web

• Código

• Composição

• Remixagem

• Revisão

• Design

• Compartilhamento

• Prática Aberta

Habilidades do Século XXI

• Comunicação

• Colaboração

• Criatividade

Introdução

[5-7 min]

• Enquadre a atividade explicando que alguns sites são bem diferentes dos outros. Alguns são simples; outros são mais complexos. Podemos dividir os sites que usamos em duas grandes categorias:

Dica! Recomenda-se que primeiro os usuários concluam a atividade “Construindo Páginas Básicas”.

• 1ª categoria: sites onde você pode acessar informações estáticas.

• Esses sites podem não mudar muito ao longo do tempo.

• Como usuário, você não pode fazer muito para alterar o site de conteúdo ou como ele funciona para você.

• Muitas das primeiras páginas web eram assim.

• Pergunte aos participantes: wuais são os exemplos de páginas estáticas? Pense em sites que não têm conteúdo novo com frequência ou nunca. Ou sites com poucas páginas.

Dica! Os exemplos podem ser o site de um pequeno restaurante, etc. Esses sites são projetados principalmente para transmitir informações.

• 2ª categoria: sites onde, como usuário, você pode fazer algo como criar um resultado ou alterar usando a página.

• Estes são sites que você usa para fazer algo acontecer.

• Você pode criar ou compartilhar algo ou fazer algo para alterar o conteúdo exibido ou fornecer informações para concluir uma tarefa.

• Pergunte aos participantes: quais são os exemplos de sites como esses? Qual foi a última coisa que você fez na web?

Dica! Os exemplos podem ser um site de uma biblioteca pública onde você pode pesquisar e reservar livros e outros recursos. Ou qualquer cliente de e-mail web, como Gmail, Yahoo, Hotmail ou serviços de mensagens instantâneas. Sites de compras, jogos baseados na web, sites de mídia social, etc. A Pesquisa do Google é um aplicativo web, assim como o Facebook.

• Sites (ou partes de sites) que permitem aos usuários fazer algo na web são chamados de aplicativos web.

• Esses aplicativos web são alimentadas por programas (código) que permitem que o computador cliente (aquele que você usa para navegar) trabalhe com o servidor (o computador onde o site reside) para que algo aconteça.

• Muitos dos elementos pequenos e simples que os participantes já viram antes podem ser considerados aplicativos web.

• Formulários web que permitem que os usuários enviem informações, por exemplo, seu nome e endereço de e-mail.

• Barras de pesquisa que permitem que os usuários acessem resultados definidos com base em uma pergunta ou termo que você digita em uma barra de pesquisa.

• Pergunte aos participantes se eles usaram barras de pesquisa ou formulários web - se assim for, eles usaram aplicativos web!

• Explique que os aplicativos web também podem ser muito mais complexos. O Thimble é um aplicativo web para criar páginas web. O Thimble é uma ferramenta de codificação para escrever HTML e outras linguagens web; Ele também publica as páginas dos participantes para que elas estejam on-line, na web.

Dica! Se os participantes já tiverem feito a atividade “Construindo Páginas Básicas” (que é recomendada), você pode lembrá-los de que eles não precisam estar on-line OU de usar um aplicativo web como o Thimble para criar páginas web. Eles podem usar um editor de texto simples para escrever HTML e salvar suas páginas e usar qualquer navegador para visualizar páginas. Essas páginas estão off-line até serem carregadas em um servidor web.

Conheça o Thimble, Faça um Tour

[5-7 min]

• Para esta seção, o(a) facilitador(a) deve projetar sua tela para que todos os participantes possam ver a turnê do Thimble. O ideal é que os participantes acompanhem em seus próprios computadores. Os participantes podem achar útil trabalhar em pares.

Dica! É melhor que os usuários façam login/criem uma conta para poder publicar páginas. No entanto, se os usuários não se sentirem à vontade para criar uma conta, eles poderão brincar com a criação ou edição de HTML no editor e ver como os resultados mudam na janela de visualização. Eles não poderão publicar páginas.

• Vá para a página inicial do Thimble e clique em “Comece um projeto do zero”. Explique aos usuários que agora saímos da página inicial do Thimble e estamos usando o Thimble como um aplicativo web para fazer algo: criar páginas HTML. Estamos fazendo isso no navegador, o que é muito legal!

• Pergunte aos participantes: o que você vê? como esta página é diferente da página inicial do Thimble? Como a página é dividida? Para que serve cada seção ou janela? Qual é a relação entre as seções? Deixe que os participantes falem e apresentem respostas, mas certifique-se de que eles entendam o seguinte:

• No canto superior esquerdo, há uma área onde você pode digitar e alterar o nome do arquivo de “projeto sem título” para um nome de arquivo que faça sentido para a página que você deseja criar.

• À esquerda, há um espaço chamado ARQUIVOS, no qual vemos dois nomes de arquivos. Estes são os dois arquivos que podemos trabalhar e editar para este projeto. Os participantes podem alternar entre eles clicando nos nomes. Se os participantes criarem novos arquivos, eles aparecerão aqui.

• No meio há espaço chamado EDITOR, onde podemos ver o código HTML, e podemos editá-lo também.

• À direita, há um espaço chamado “VISUALIZAR” - quando editamos o código, vemos como ele será exibido em um navegador - e as alterações ocorrerão à medida que digitarmos!

Dica! Este é um recurso interessante, portanto, dê aos usuários algumas pequenas tarefas para fazer - por exemplo, alterar o tamanho do título ou editar a palavra “amazing”.

• Observe que as alterações ou adições que não seguem as regras de HTML não aparecerão na visualização. Os participantes verificam problemas no editor, onde o erro ou “bug” será destacado em vermelho na janela do editor.

• Observe também o endereço na barra do navegador, na parte superior da tela. Se você não estiver conectado, deverá haver uma faixa preta após o endereço “https://thimble.mozilla.org/pt-BR/” e depois, “anonymous” e uma barra invertida + sequência de letras e números - esse é um local de espaço reservado no servidor da Mozilla onde sua sessão do Thimble será armazenada temporariamente.

• Se os participantes estiverem conectados, o endereço da web será https://thimble.mozilla.org/pt-BR/ + / username + /algum conjunto curto e aleatório de números.

• Este é um local (uma URL) que o aplicativo web criou para armazenar o trabalho desse participante no projeto, é a visualização do projeto.

• Os participantes também podem encontrar seus projetos clicando no nome de usuário no canto superior direito e selecionando “Meus projetos”.

• No canto superior direito, há um botão PUBLICAR. Se um participante estiver conectado ao Thimble e pressionar esse botão, sua página será salva nos servidores da Mozilla e estará acessível na web. O Thimble fornecerá um endereço da web diferente daquele para a visualização do Thimble. Isto publica o endereço da sua página, AO VIVO na Web! Qualquer pessoa, em qualquer lugar na web, pode ver a sua página neste endereço.

Dica! Talvez seja necessário esclarecer para os usuários que as pessoas que visitam esse endereço verão apenas a própria página, NÃO a visualização de trabalho do Thimble com a janela do editor e todas as opções. Teste e compare o endereço publicado com o endereço de visualização do Thimble.

Faça suas Páginas

[15-20 min]

• Para esta parte da atividade, os facilitadores têm várias opções de conteúdo para essas páginas.

• Os participantes podem selecionar um projeto existente para remixar - Tags Comuns é ótimo para começar. Essa é uma boa opção se o tempo para gerar um novo conteúdo for pequeno.

Dica! Se você decidir trabalhar com Tags Comuns como um projeto remixável, certifique-se de apontar a aba TUTORIAL, que aparece na janela de visualização. Os participantes procuram ajuda para concluir a atividade.

• Alunos que já fizeram a atividade “Construindo Páginas Básicas” já devem ter uma história sobre si mesmos escrita - eles podem adicionar a essa história e depois trazê-la para o Thimble.

Dica! Se o tempo estiver apertado, eles podem pular a adição de novo conteúdo e trazer a cópia da história existente.

• Peça aos participantes para adicionar à sua história de vida - peça-lhes que façam um brainstorming e escrevam uma nova seção sobre sua cidade natal, um parente favorito, uma memória positiva, etc. A escolha do(a) facilitador(a).

Dica! Certifique-se de que eles compõem em seu arquivo .txt salvo, e não diretamente no Thimble, e que eles não marquem e componham simultaneamente! Codificar e criar são duas formas diferentes de pensar - os participantes que fazem as duas coisas ao mesmo tempo podem diminuir o fluxo criativo ao adicionar tags à medida que escrevem ou podem se perder na história e esquecer as tags.

• Peça aos participantes para copiar e colar o conteúdo da matéria bruta no editor do Thimble (dentro das tags do corpo, é claro). Em seguida, eles podem praticar marcando essa página novamente (e marcando as novas partes) para se familiarizarem com as tags e escreverem HTML.

• Se os participantes não tiverem feito a atividade “Construindo Páginas Básicas”, eles podem gerar o conteúdo da história da seguinte forma: peça aos participantes que se dividam em pares e se entrevistem sobre suas vidas. Como facilitador, mantenha o controle do tempo para garantir que cada participante tenha tempo igual para a sua história.

• Entrevista: peça a cada um que reserve 5 minutos para contar sua história ou, se não quiserem compartilhar coisas pessoais, eles podem inventar o personagem fictício e contar a história desse personagem. Peça ao ouvinte para fazer anotações ou possivelmente gravar em um dispositivo. Solicite aos usuários que falem sobre o que é mais importante para eles (ou seu personagem fictício). Ofereça esta lista de perguntas para começar:

• Nome, idade, outros detalhes

• Onde você nasceu? Onde você cresceu? Como foi isso?

• O que você está fazendo agora? Como você gasta seu tempo? Quais são suas coisas favoritas para fazer, lugares favoritos, alimentos, música, etc

• Existe um momento favorito, momento de maior orgulho que se destaca?

• Seus planos e sonhos para o futuro

Dica! O(A) entrevistador(a) pode fazer perguntas de acompanhamento para obter mais detalhes ou uma matéria mais completa. Ele pode fazer perguntas abertas sobre motivações, sobre preferências, sobre planos futuros, para ajudar a extrair mais percepções, ou pode fazer perguntas para esclarecer ideias na história.

• Revisar/Editar: peça a cada participante que tire as anotações de sua história e as analise - considere adicionar detalhes, pense no que deixou de fora.

• Organize e digite: peça aos participantes que digitem suas histórias em um editor de texto básico, certificando-se de usar o “modo de texto simples” (não o modo Rich Text). Ao digitar a história, eles podem considerar a organização e a estruturação da história em um começo, meio e fim. Talvez eles possam pensar em títulos para as seções: “Primeiros dias” “Dias Atuais” “O que vem a seguir” Ou eles podem encontrar outras formas de organizar o conteúdo, se eles falaram mais sobre seções de interesse - “Minhas músicas favoritas”, “lugares favoritos”, etc. Criar essas seções ajudará a estruturar a biografia para facilitar a leitura como uma página web.

• Dê um título a sua história. Invente um título rápido para sua história ou conteúdo. Ou vá com algo básico.

• Crie uma nova pasta no seu computador e chame-a de “xx-paginaweb” usando suas iniciais. Você deve salvar este arquivo em duas versões.

• Salve sua história na pasta com .txt como extensão. Dê um título sem espaços ou pontuação que não seja traços ou sublinhados, como “sobre-zm.txt” Esta é a versão de texto da sua história, o conteúdo bruto.

• Copie e cole este conteúdo bruto na janela do editor do Thimble e comece a marcar.

• Alunos que criam suas próprias páginas pessoais no Thimble podem retornar a eles e adicionar conteúdo, especialmente para as atividades da “Lista de Reprodução do Projeto” ou “Todos os Adesivos” na seção “Participar”.

Conclusão e Discussão

[10 min]

• Escolha um dos tópicos abaixo para encerrar a atividade:

Código de Compartilhamento e Remixagem com Thimble

• Se os participantes trabalharem com suas próprias histórias, apresente-os a projetos remixáveis e à aba Tutorial, e deixe-os explorar e jogar por 5 ou 10 minutos. Se eles tiverem remixado um projeto existente, faça uma discussão sobre essa experiência. Pergunte aos participantes:

• Como é ver o código de outras pessoas? O que você achou novo, surpreendente? Você vê coisas que gostaria de experimentar?

• O que você pode aprender usando o Thimble para explorar e remixar projetos?

• Como você se sentiria se alguém remixasse seu projeto?

• Mesmo que uma página não esteja no Thimble, em muitos navegadores você pode espiar o código-fonte… No FireFox, vá em Ferramentas > Web Developer > Código-fonte da página para ver o código por trás de qualquer página. Se uma página for um aplicativo web, o código provavelmente será complexo. Se for uma página estática, será mais fácil de ler.

Prós e Contras do Thimble vs Compor Off-line

Revisite/explore a diferença entre compor e publicar com o Thimble OU criar páginas com um editor de texto/navegador e salvar em um computador pessoal. O(A) facilitador(a) pergunta aos participantes as diferenças. Algumas podem ser:

• Com o Thimble você está na web imediatamente! A página é salva no servidor da Mozilla. E você pode ver suas alterações enquanto digita.

• Com um editor de texto/navegador, você está trabalhando em sua máquina local, não na web. Você precisa salvar seu arquivo e atualizar o navegador para ver as alterações.

• Com o editor/navegador, você precisa fazer o upload para um servidor para colocar sua página on-line onde outras pessoas possam acessá-lo.

• Você precisa de uma conexão web para acessar ao Thimble.

• Você não precisa estar on-line para criar sites com o navegador e um editor de texto básico.

• Thimble é projetado para aprender código, não para publicar sites a longo prazo.

• Existem limitações de espaço para quantos arquivos você pode ter no Thimble. E o endereço da web…

• Como é o endereço da web (URL) da sua página Thimble diferente do endereço web do seu blog ou site favorito? Se você tivesse um negócio, isso funcionaria para um endereço da web?

Dica! Os participantes devem entender que os endereços do projeto Thimble são genéricos; eles não expressam o conteúdo do seu projeto. Eles são difíceis de lembrar. Para obter o incrível endereço da Web que desejam para a página, os participantes teriam que comprar um nome de domínio (como superpagina.com ou páginaincrivel.biz) e pagar por uma hospedagem Web - espaço do servidor onde suas páginas podem ser acessadas on-line.

• Thimble é realmente uma ferramenta de aprendizado - para testar e experimentar páginas.

• O editor de texto/combinação de navegador é uma maneira fácil de começar e pode levar você muito longe na criação de páginas e sites.

• Para sites mais complexos, você pode usar um aplicativo projetado especificamente para criar e hospedar páginas rapidamente - confira a atividade “Construtores de Sites”.

A Evolução da Web

• Explique: nos primeiros dias da web, muitas páginas eram estáticas. Houve muito compartilhamento de informação, mas não muita interação.

• Mostre um exemplo da web antiga usando a máquina de retrocesso do Internet Archive’s e pesquise pelo link do site da Apple.

• Compare, por exemplo, apple.com em 1996 com apple.com hoje (ou encontre seus próprios exemplos).

• Como é a experiência em cada site? Quais são as maiores mudanças?

• Como você acha que a web será em 20 anos? O que você gostaria de poder fazer na web do futuro?

Dica! O(A) facilitador(a) pode enfatizar que os dispositivos móveis “inteligentes” não existiam há cerca de 20 anos - o que podemos fazer na Web pode mudar, mas onde e como fazemos isso pode mudar também.

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou sobre esta atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?

Construtores Web

Habilidades: Código, Composição, Design, Comunicação, Colaboração, Criatividade

Descrição

Nesta atividade, apresentamos os participantes aos sistemas – chamados construtores de sites ou sistemas de gerenciamento de conteúdo - que muitas pessoas (designers, desenvolvedores e novatos na Web que não são especialistas) usam para criar sites com muitas páginas diferentes e conteúdo atualizado frequentemente, como blogs ou sites de compras. Os participantes fazem alguma coleta de dados e usarem exemplos analógicos (caneta e papel) para explorar como os construtores web funcionam.

Objetivos da Aprendizagem

• Definir um construtor de sites/sistemas de gerenciamento de conteúdo.

• Identifique quatro elementos básicos das ferramentas de criação de sites.

• Descreva como os elementos dos construtores de sites funcionam para criar páginas web.

Tempo Necessário

45 minutos a 1 hora dependendo do tamanho do grupo

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a web.

Materiais

• Papel e lápis

• Imprima a planilha com as seguintes informações:

• Planilha 1: Listagem de Animal de Estimação

• Nome do animal de estimação:

• Localização:

• Tipo (gato, cachorro, etc):

• Idade:

• Imagem:

• Caracteristícas:

• Disponível para adotação (sim/não):

Habilidades de Alfabetização Web

• Código

• Composição

• Design

Habilidades do Século XXI

• Comunicação

• Colaboração

• Criatividade

Introdução

[2 min]

• Explique:

• Hoje vamos falar sobre algumas ferramentas de software - chamadas de construtores de sites ou sistemas de gerenciamento de conteúdo - que muitas pessoas (designers, desenvolvedores e novatos na web que não são especialistas) usam para criar sites.

• Essas ferramentas reúnem HTML e CSS (Cascading Style Sheets ou Folhas de Estilo em Cascata, usadas para adicionar estilos visuais a sites da Web) junto com outras linguagens de programação para agilizar o processo de criação de sites.

• Mas primeiro, vamos fazer uma atividade de coleta de dados rápida e divertida. Usaremos esses dados para modelar como os criadores web funcionam.

Atividade: Coleta de Dados

[5 min]

• O(A) facilitador(a) distribui mini planilhas (impressas 2 por página/corte para economizar papel). Peça aos participantes para preenchê-las. Explique:

• Não há problema em criar as informações.

• Na planilha do animal de estimação, você pode desenhar uma foto super simples - os bonequinhos em formato de palito são totalmente aceitos!

• O texto da planilha está abaixo. O(A) facilitador(a) pode remixar conforme necessário.

• Colete as planilhas e informe aos participantes que voltaremos a elas.

Planilha 1: Listagem de Animal de Estimação Nome do animal de estimação: Localização: Tipo (gato, cachorro, etc): Idade: Imagem: Caracteristícas: Disponível para adotação (sim/não):

Discussion: Website Creation

[30 min]

• Explique: vimos como criar uma página web básica: pegamos conteúdo e marcamos em HTML. Isso funciona muito bem, especialmente para sites que não mudam muito ou para sites pequenos com apenas 5 ou 6 páginas. Pergunte aos participantes:

• Você consegue pensar em alguns sites estáticos: sites que não têm conteúdo novo com frequência ou nunca? Ou sites com poucas páginas? Exemplos podem ser um pequeno restaurante, etc.

• Mas e se tivermos informações que mudam o tempo todo? Ou se tivermos muitas e muitas informações? O que são sites que mudam muito?

• Os exemplos podem ser: sites meteorológicos e de notícias, blogs, sites de mídia social como o Facebook, Instagram, sites de compras.

• Que tipos de sites ou páginas visitamos com mais frequência? O que isso diz sobre a Internet? (ou seja, muita mudança, muita informação nova).

• Vamos supor que estamos fazendo um site com muitas páginas - um site que lista diferentes animais de estimação, onde as pessoas podem navegar pelas listas e ver se querem adotar um animal de estimação.

• Pergunte aos participantes: quais páginas são necessárias em nosso site? (página inicial, talvez uma página sobre, e talvez uma página que fala sobre cada animal de estimação).

• Então, vamos descobrir os passos para fazer o processo de criação do nosso site, e escrever os passos ou, em outras palavras, um algoritmo para isso. Digamos que já tenhamos nossas páginas “início” e “sobre”. E usaremos os dados de animais de estimação que acabamos de coletar. Qual é o algoritmo que escreveríamos para esse processo?

Dica! Algoritmo de amostra para criar páginas de estimação está aqui:

Abra o editor de texto, salve o novo documento como .HTML Digite ou cole o conteúdo da primeira página do animal de estimação Nome do animal de estimação: Localização: Imagem: Idade: Caracteristícas: Disponível para adoção (sim/não): Comentário: Marque com HTML Adicione estilos para cada tipo de dados usando CSS Salve e verifique se funciona no navegador Abra o editor de texto, salve o novo documento como .HTML Cole o conteúdo da próxima página do animal de estimação Nome do animal de estimação: Localização: Imagem: *Idade: Caracteristícas: Disponível para adoção (sim/não): Comentário: Marque com HTML Adicione estilos usando CSS Salve e verifique se funciona no navegador (Repetir x vezes)

• Pergunte aos participantes:

• Como este algoritmo se parece? O que você percebe sobre isso?

• Como você vai se sentir sobre a adição de todos os animais de estimação? Possíveis respostas: é repetitivo, estamos fazendo a mesma coisa repetidamente, entediante para passar por todos os animais de estimação, isso vai durar uma eternidade.

• O que poderíamos fazer para melhorar este processo?

• Explique que este é o desafio para qualquer site - como um blog ou um site de compras, um novo site - levará uma eternidade para fazer todas essas mudanças e novas páginas!

• Explique que os desenvolvedores e designers criaram ferramentas - algumas das quais são gratuitas e focadas em usuários iniciantes, como você - que ajudam a agilizar esses processos, para que ninguém precise marcar dezenas, centenas ou até milhares de páginas semelhantes.

• Em um construtor web, o computador faz a parte difícil! Sempre que temos um processo repetitivo, é um ótimo trabalho para um programa de software - os computadores realizam tarefas como esta muito melhor do que os humanos, sem reclamar.

• Essas ferramentas do construtor web, em sua forma mais básica, combinam quatro elementos. Vamos falar sobre como eles funcionam juntos.

• Conteúdo armazenado em um banco de dados

• Modelos HTML

• Regras de design CSS

• Algumas linguagens de código são executadas para juntar tudo isso rapidamente (PHP, Python, Ruby, JavaScript).

• Uma interface simples de usuário para inserir conteúdo.

• Esta interface esconde o HTML, CSS e qualquer código do usuário. Eles às vezes são arrastadas e soltas ou você digita seu conteúdo e faz algumas seleções simples. Mas vamos explorar como os construtuores web trabalham nos bastidores, depois que todas as suas coisas são inseridas no banco de dados.

• Vamos ver como isso é feito, para o nosso site favorito, no papel. Primeiro precisamos dos nossos 4 ingredientes!

• Conteúdo no banco de dados

• Cortaremos nossas planilhas, porque vamos querer acessar os dados separadamente.

• Crie um modelo HTML para a página do animal de estimação. Vamos deixar alguns espaços em branco onde o conteúdo irá.

• Consulte o exemplo:

• Crie algumas regras de estilo (diferentes para gatos, cães, lagartos).

• Cor de fundo da página

• Tamanho e cor da fonte

• Solte algumas instruções de código no modelo HTML para informar ao computador como juntar tudo. Vamos escrevê-los onde estão as notas azuis, para onde queremos que nossos dados sejam enviados. É como preencher as lacunas vazias ou loucas!

• Se fôssemos desenvolvedores trabalhando neste site em um computador, escreveríamos isso em linguagem de programação, mas aqui vamos apenas escrever instruções básicas, chamadas de “pseudo-código”. Não é o texto que precisamos para uma linguagem de programação real, mas expressa a intenção das instruções.

• Quais são as instruções? Vamos escrever outro algoritmo. Isso pode ser o que quisermos em termos de qual conteúdo adicionar, mas aqui está um exemplo:

• Acesse o registro desejado para animais de estimação

• Coloque o nome do animal ou o número do animal de estimação no título

• Atribua a folha de estilos correta

• Coloque o nome do animal de estimação no título

• Coloque o nome da imagem na tag img

• Coloque as características no parágrafo final

• Escreva as instruções que você sugeriu nas notas autoadesivas

• Agora, seja o código!

• Peça a um participante que tente montar a página seguindo as instruções da nota autoadesiva - isso é o que o código faz!

• Quando o navegador de um cliente solicita essa página para um determinado animal de estimação (por exemplo, Pet #2), o código do servidor reunirá as informações do banco de dados, atribuirá a folha de estilo correta e as enviará ao seu navegador. Isto faz a página ser exibida automaticamente! Portanto, uma página para cada animal de estimação não existe de maneira estática, mas é feita sob demanda.

• Isso é o que acontece nos bastidores de qualquer uma das plataformas de sistemas de gerenciamento de conteúdo/construtor web, como o WordPress, o SquareSpace ou o Wix.

• Como usuário, você estaria digitando conteúdo em uma interface, selecionando um modelo e pressionando um botão “publicar”. O código no lado do servidor e no navegador faz o resto! E agora você sabe como isso funciona!

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou sobre esta atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?

Segurança em Primeiro Lugar

Descrição

Nesta mistura de atividades on-line e off-line, Segurança em Primeiro Lugar, a parte 1 mostra as maneiras pelas quais nossas atividades on-line diárias podem ser rastreadas. Os participantes trabalharão primeiro em uma auditoria de privacidade, durante a qual descobrirão as maneiras pelas quais suas atividades pessoais podem ser vistas por terceiros. Os participantes aprenderão sobre metadados e o que podem revelar sobre nós. Por fim, os participantes desenvolverão uma conscientização dos mecanismos em funcionamento para rastrear nossas atividades on-line.

Na parte 2, os participantes seguirão as etapas recomendadas para proteger a privacidade on-line. Eles aprenderão como definir boas senhas, proteger seus navegadores, baixar extensões que aumentam a privacidade, praticar boas práticas de Wi-Fi e proteger seus dados pessoais.

Objetivos da Aprendizagem

• Identificar as escolhas de privacidade que você faz todos os dias.

• Explicar como os cookies e terceiros podem rastreá-lo on-line.

• Identificar três maneiras de limitar o rastreamento on-line em seu navegador e criar senhas melhores.

Tempo Necessário

1 a 2 horas dependendo do tamanho do grupo.

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a web.

Materiais

• Um computador/projetor configurado e conexão com a Internet.

• Um quadro branco, quadro negro ou bloco de flipchart para escrever notas que todo o grupo pode ver.

• Marcadores, caneta ou lápis.

• Criação de planilhas (conteúdo abaixo) conforme necessário.

• Notas autoadesivas

Habilidades de Alfabetização Web

• Proteger

• Pesquisar

• Navegação

• Avaliar

• Prática Aberta

Habilidades do Século XXI

• Comunicação

• Solução de problemas

Introdução

[10 min]

• Inicie uma discussão com os participantes sobre suas experiências com privacidade on-line.

Dica! Dependendo do tamanho do grupo, essas perguntas podem ser usadas para discussões em grupos pequenos ou com o grupo como um todo.

• Quando você ouve a palavra “privacidade”, o que você pensa? Como o conceito de privacidade se aplica ao seu dia a dia?

• Como as noções de privacidade que acabamos de discutir funcionam no contexto do que fazemos na web?

• A privacidade se aplica igualmente à sua vida off-line e ao seu tempo na web? Por que / Por que não?

• Lembre aos participantes que, como em qualquer problema de grande escala, podemos agir com muitas pequenas etapas que se acumulam em um efeito protetor.

• Pergunte aos participantes: o que você está fazendo para proteger sua privacidade?

Dica! Certifique-se de tocar na base dos seguintes tópicos, pois eles aparecerão mais adiante nesta lição:

Alterando suas configurações de privacidade Limpando o histórico de navegação Criando senhas fortes Habilitando a identificação de dois fatores Usando gerenciadores de senhas Praticando higiene de Wi-Fi Habilitando WPA ou WPA2 em nossos roteadores Wi-Fi Evitando o Wi-Fi público Protegendo informações pessoais Ser capaz de identificar esquemas de phishing Mantendo atualizações de segurança em nossos dispositivos

Parte I: Definindo Privacidade

[45 min - 1 hora]

Atividade off-line: linha do tempo de trilhas de dados

[20 minutos]

• Compartilhe com seus participantes que, em nossa próxima atividade, faremos uma rápida recapitulação do dia deles até hoje.

• Peça aos participantes que pensem em todas as coisas que fizeram, desde acordar até chegar aqui a esta sessão.

Dica! Se esta atividade ocorrer de manhã, pode ser mais proveitoso pedir aos participantes que reflitam sobre o dia anterior.

• Uma planilha de exemplo para esta atividade:

• Meu dia (até agora)

• Use esta planilha para fazer uma lista de suas atividades até hoje. Para cada item, responda as seguintes perguntas:

• Após cinco minutos de reflexão silenciosa, peça a seus participantes que compartilhem um pouco do que fizeram hoje. Lembre os seus participantes de que não há problema em manter os dados pessoais privados - esta planilha é apenas para eles!

• Peça aos seus participantes para darem uma olhada em suas planilhas, mantendo as seguintes questões em mente:

Dica! Se disponível, distribua um marcador ou um lápis de cor para cada um dos seus participantes. Peça-lhes para destacar ou circular as tarefas nas quais a tecnologia foi usada.

• Quantas das minhas ações hoje incluem tecnologia?

• Quantas das minhas ações hoje exigiram o uso de um site?

• Quem pode perceber com que frequência estou usando minha tecnologia para realizar tarefas do dia-a-dia?

• O que eles poderiam descobrir sobre meus hábitos on-line?

• O que eles poderiam descobrir sobre onde eu estou no mundo real?

Dica! À medida que seus participantes compartilham suas histórias de uso diário na web, discuta as maneiras pelas quais esses sites estão rastreando suas atividades.

De https://www.internetsociety.org/: Sites e compras on-line. Os varejistas e os sites de análise de produtos geralmente deixam cookies em seu sistema, que podem rastrear sua movimentação de um site para outro, permitindo anúncios segmentados que podem mostrar produtos sobre os quais você recentemente leu ou observou on-line. Mídias Sociais. Todos os +1, Retweets e comentários do Facebook (mesmo os privados) deixam um registro. Verifique se você sabe quais são as configurações de privacidade padrão para suas contas de mídia social e fique de olho nelas. Os sites geralmente apresentam novas políticas e configurações que aumentam a visibilidade de seus dados. Eles podem confiar em você apenas clicando em “OK” para quaisquer termos que eles estejam introduzindo, sem lê-los. Celulares, tablets ou notebooks. Alguns sites criarão uma lista de diferentes dispositivos que você usou para visitar esses sites. Embora muitas vezes isso possa ser usado como uma forma de ajudar a proteger sua conta, é importante entender as informações coletadas sobre seus hábitos.

• Discussão – pergunte aos participantes:

• O número de tarefas para as quais você se baseou na tecnologia surpreendeu você?

• Quem você acha que pode estar percebendo seus hábitos on-line?

• O que você acha que essas entidades podem aprender sobre você?

• Qual destas informações você gostaria de proteger?

• Informe aos seus participantes: as informações que deixamos para trás quando navegamos pela web são o que chamamos de “pegada digital” ou “sombra digital”. Sua pegada digital inclui os sites visitados, os e-mails que você envia e as informações que você fornece aos serviços on-line.

• Vamos dar uma olhada no tipo de informação que você pode deixar para trás na sua pegada digital.

Discussão e Atividade On-line: Quais informações podem ser coletadas?

[10 minutos]

• Compartilhe com seus participantes que, embora não seja provável que sua pegada digital contenha o conteúdo de suas atividades on-line, seus metadados estão sendo deixados para trás e rastreados por todos os tipos de entidades.

• Explique que metadados são, simplesmente, dados sobre dados. Aqui está um exemplo: uma imagem pode incluir metadados que descrevem o tamanho da imagem, a profundidade de cor, a resolução da imagem, quando a imagem foi criada e outros dados. Outro exemplo pode ser encontrado em arquivos de texto. Sem visualizar o conteúdo, podemos ver o tamanho do arquivo, o tipo de arquivo, quem é o autor e quando o documento foi escrito.

• Pergunte aos seus participantes: agora que sabemos mais sobre os metadados, vamos pensar nos metadados que um e-mail pode incluir. Digamos que você esteja enviando um e-mail para seu amigo. Terceiros podem não conseguir ver o conteúdo do seu e-mail. O que você acha que eles podem ver?

• Remetentes

• Destinatários

• Data e hora em que o e-mail foi enviado

• Se houve ou não anexos

• Pergunte aos participantes: o que você acha que poderia ser aprendido ao coletar e analisar esses pontos de dados sobre suas comunicações?

• Quem são seus amigos e familiares.

• Com quais dos seus amigos você mais mantém contato.

• Como seus amigos e familiares estão conectados juntos.

• Podemos ver esses metadados em ação com uma ferramenta desenvolvida pelo MIT chamada Immersion. Vejamos esta demonstração dos contatos de Tony Stark: https://immersion.media.mit.edu/demo

• Observe que podemos ver quem são os “principais colaboradores” de Tony.

• Podemos ver quais indivíduos receberam e-mails de grupo juntos. Eles formam um cluster representando nossos grupos de contatos.

• Também podemos usar o controle deslizante na parte inferior da página para ver como nossos contatos mudaram ao longo do tempo.

• Pergunte aos seus participantes: O que mais você percebe sobre o perfil de Tony Stark?

• Sinta-se livre para tentar isso em casa. O MIT fornece um login seguro para a maioria dos aplicativos de e-mail: https://immersion.media.mit.edu/

Atividade On-line: usando o Lightbeam

[15 min]

• Compartilhe com seus participantes que vamos dar uma olhada em quem pode estar nos rastreando on-line.

• Explique aos participantes que usaremos o Lightbeam da Mozilla para ver como as empresas usam os “cookies”, ou arquivos especiais salvos pelo navegador web, para acompanhá-lo on-line.

• Forneça uma visão geral dos cookies.

• Um cookie é um pequeno pedaço de dados enviado de um site e armazenado no computador do usuário pelo navegador do usuário enquanto o usuário está navegando.

• Eles foram criados para ajudar um site a lembrar informações como o que está em seu carrinho de compras, se um usuário está logado ou não, e lembrar das respostas que os usuários inseriram nos formulários.

• Existem muitos tipos de cookies, que veremos em nossa atividade de Apresentação Rápida de Privacidade.

• Certifique-se de que você e seus participantes estejam usando o Firefox.

• Demonstre como navegar até as extensões do Firefox, procure pelo Lightbeam e clique em Adicionar ao Firefox. (https://addons.mozilla.org/pt-BR/firefox/addon/lightbeam/)

• Circule pela sala para responder a qualquer pergunta individual sobre esse processo.

Dica! Se você está trabalhando com um(a) co-facilitador(a), essa é uma ótima maneira de ajudar.

• Explique que os participantes precisarão clicar no ícone do Lightbeam ao lado da barra de navegação para ver os dados.

• Demonstre o Lightbeam para seus participantes visitando dois ou três sites apropriados da comunidade que você gosta em uma nova aba (por exemplo, americanas.com.br, youtube.com.br, wikipedia.com). Em seguida, volte para a aba Lightbeam e mostre aos participantes quantos rastreadores seguiram você.

• Compartilhe com seus participantes: à medida que você visita mais e mais sites, o Lightbeam exibe outras empresas e organizações que estão seguindo você e rastreando seus cookies. Os sites podem acompanhá-lo pela web observando seus cookies e vendo onde você os encontrou.

• Peça aos participantes que explorem a Internet um pouco para deixar o Lightbeam coletar informações de rastreamento de terceiros.

• Então compartilhe com seus participantes: Agora tente você! Abra uma nova aba ao lado da sua aba Lightbeam. Visite quatro ou cinco sites apropriados da comunidade e volte para sua aba Lightbeam cada vez que você for para uma nova página. Veja como o Lightbeam acompanha quantos sites estão rastreando você.

• Dê tempo aos seus participantes para explorarem.

• Pergunte aos participantes:

• O que você viu no Lightbeam que surpreendeu você sobre o rastreamento on-line?

• Algum dos sites visitados usou um software de rastreamento comum?

• Existem importantes “boas” razões para rastrear pessoas on-line que valem a pena perder certa privacidade?

Offline Activity: Privacy Speed Dating

[20 min]

• Divida seus participantes em grupos de 6 ou mais.

• Forneça aos seus participantes “biografias” (veja abaixo) de vários dispositivos de rastreamento de terceiros.

Rastreamento do Google Analytics: Eu trabalho para o proprietário do site para ver quantas pessoas estão visitando o site (visitas e visitantes únicos, novos e antigos) ou de onde vêm. Ajudo o proprietário de um site a entender a experiência de um cliente do site. Eu sou um cookie persistente, geralmente de primeira parte, que é definido na primeira vez que você visita o site, e permaneço lá pelo tempo que o site determina, geralmente 18 meses.

Rastreamento de Gerenciamento de Sessão: Sou um cookie que é necessário para que o site funcione tecnicamente. Estou pronto quando você visita o site e eu desapareço quando você sai. Sou um cookie transitório, armazenado no lado do cliente na memória temporária e não no disco rígido. Estou feliz em namorar, mas não estou procurando um relacionamento de longo prazo e não vou invadir sua privacidade.

Rastreamento de comércio eletrônico: eu sou usado para gerenciamento de carrinho de compras e opções de “checkout rápido” quando você compra algo em seu site favorito. Meus cookies armazenam valores de ID que ajudam o site a rastrear você à medida que você adiciona coisas diferentes ao seu carrinho. Tudo o que você adiciona ao seu carrinho é armazenado com seu valor de ID, para que, quando você fizer o checkout, o site saiba o que está em seu carrinho. Eu posso ser um cookie de sessão que desaparece quando você sai, ou um cookie persistente que mantém seus itens de carrinho de compras quando você volta mais tarde. Sem mim, as compras on-line seriam muito menos convenientes.

Rastreamento de Localização: Eu sou o espião no seu bolso. Estou em seus computadores, telefones celulares e tablets. Como vou com você sempre, posso gravar sua localização o tempo todo, mesmo quando você não está conectado à Internet. Eu posso revelar não apenas onde você mora e trabalha, mas também onde você visita. Eu posso fazer com que sua rotina diária e quaisquer desvios sejam claros. Eu também posso ser usado para deduzir seus relacionamentos com outras pessoas.

Rastreamento de Terceiros: Eu fico armazenado no seu dispositivo quando você visita um site. Você muitas vezes não sabe que eu estou lá. O site decide quantos dos meus amigos estão convidados. Muitas vezes tenho muitos amigos. Pode haver 60 de nós ou mais em uma página. Mas às vezes sou visto sozinho ou não visto. Eu gosto de rastrear seus hábitos de navegação e contar aos outros. Eu acho que você poderia dizer que eu gosto um pouco de fofoca. Um dos meus trabalhos é trabalhar para empresas que querem construir um perfil de quem você é: quantos anos você tem, onde mora, o que lê e o que lhe interessa. As empresas para as quais trabalho podem empacotar e vender essas informações para: anunciantes, outras empresas ou governos. Muitas vezes estou escondido, mas quando trabalho para empresas bem conhecidas, você pode me ver como um botão colorido.

*Impressão Digital do Navegador: Comecei no setor bancário para ajudar a evitar fraudes, mas agora trabalho em muitas áreas. Meus amigos me contam coisas sobre você, como seu endereço IP, histórico do navegador, tamanho da tela, fuso horário, plug-ins e sistema operacional. Coloco informações que, por si só, não parecem ser identificadoras, mas, como reuno todas essas coisas, posso identificá-lo pela Internet e usá-las como uma alternativa aos cookies. Quanto mais exclusivamente o seu sistema é configurado, mais fácil para mim identificar você. Não acredita em mim? Experimente o Panopticlick. A EFF me mede desde 2010. *

• Peça a seus participantes que dediquem um pouco de tempo para ler a biografia que receberam. Compartilhe com seus participantes que eles devem adotar a “personalidade” do rastreador listada em seu cartão. Quando a atividade começar, eles terão dois minutos para conhecer e conhecer os outros na sala.

• Defina um temporizador para intervalos de 2 minutos. Inicie o cronômetro e peça a todos que encontrem um(a) parceiro(a).

Dica! Se houver um número ímpar de participantes, avise os participantes que um grupo de três de cada vez é perfeitamente aceitável.

• Diga aos seus participantes que eles têm dois minutos para se apresentarem um ao outro e fazer um ao outro qualquer uma das pequenas perguntas abaixo. Depois que os dois minutos terminam, peça a eles que encontrem outra pessoa e façam a mesma coisa. Continue até que todos tenham a chance de conhecer uns aos outros.

• O que você faz?

• Como são seus amigos?

• Como nos conectamos?

• Quantos anos você tem?

• De onde você é?

• Após dez minutos, chame seus participantes de volta para o grande grupo.

• Tenha uma discussão com seus participantes:

• O que mais te surpreendeu quando se trata desses rastreadores on-line?

• Ao aprender sobre um novo tipo de rastreador, você pode ver quem pode estar se beneficiando das informações que estão sendo coletadas sobre seus hábitos de navegação? Você está preocupado com o tipo de informação que está sendo compartilhada sobre você? Por que ou por que não?

• Agora que identificamos os problemas, vamos falar de soluções!

Parte II: Sua Lista de Verificação de Privacidade

[45 min - 1 hora]

Atividade On-line: Alterando Suas Configurações de Privacidade

[20 minutos]

• Informe os participantes: o seu navegador é o seu portal para a Internet. É onde seus passos para abordar sua privacidade pessoal começam. Vamos dar alguns passos hoje para esclarecer as configurações do nosso navegador.

• Diga aos participantes: Levantando as mãos, por favor, compartilhe o navegador que você usa. Estaremos entrando em grupos de acordo com os navegadores que costumamos usar para ver o que podemos fazer hoje para torná-los mais seguros.

Dica! Esta lista pressupõe que os participantes podem trazer seu próprio dispositivo. Essa atividade pode ser remixada para configurações nas quais todos os participantes estão usando um navegador comum.

Google Chrome Mozilla Firefox Microsoft Internet Explorer Apple Safari

• Agora vamos entrar em grupos para trabalhar nas configurações do nosso navegador.

Dica! Aponte para as áreas da sala onde seus grupos devem se sentar.

• Aprenda diretamente os recursos on-line com base em seus grupos:

• Google Chrome: https://myshadow.org/how-to-increase-your-privacy-on-chrome

• Mozilla Firefox: https://myshadow.org/how-to-increase-your-privacy-on-firefox

• Microsoft Internet Explorer: https://support.microsoft.com/en-us/help/17479/windows-internet-explorer-11-change-security-privacy-settings

• Apple Safari: https://support.apple.com/guide/safari/privacy-preferences-sfri35610/mac

• Forneça a cada grupo a Lista de Verificação de Privacidade do navegador abaixo. Lembre aos usuários que, embora possam ver dicas de segurança adicionais nas páginas web para as quais foram atribuídos, eles devem planejar trabalhar na planilha somente neste momento, pois passaremos por outras etapas como um grupo.

Dica! Revise e remixe esta planilha, pois as configurações estão sujeitas a alterações.

Dica! Remixe esta planilha para refletir as configurações nas quais todos estão usando o mesmo navegador, removendo a segunda coluna e ajustando as tarefas de forma que elas correspondam ao navegador em questão.

• Lista de Verificação de Privacidade do navegador

• Use esta lista de verificação para guiá-lo através do processo de atualização das configurações de privacidade no seu navegador!

• Discussão: Após 15 minutos, junte os participantes para discutir.

• Como você encontrou o processo de ajustar as configurações do seu navegador?

• As instruções que você viu on-line foram fáceis de seguir?

• As configurações foram fáceis de encontrar no seu navegador?

Atividade On-line: Limpando seu Histórico de Navegação

[5 minutos]

• Demonstração de como limpar seu histórico de navegação no Google Chrome

• histórico →

• mostrar histórico completo →

• limpar dados de navegação →

• selecione o início do tempo e verifique: todos os itens que você deseja apagar →

• Limpar dados de navegação

Dica! Escolha qualquer navegador que você desejar. O Google Chrome foi selecionado para esta atividade porque é o mais comumente usado.

Dica! Peça aos participantes para assistirem à sua demonstração cuidadosamente antes de tentarem sozinhos.

• Saliente que podemos marcar a caixa para limpar cookies no curso de limpar nossos navegadores.

• Informe seus participantes: os rastreadores podem ler seu histórico de navegação. Para praticar uma boa higiene de privacidade, é importante limpar regularmente seu histórico de navegação. Tente tornar um hábito limpar o seu histórico antes de sair todos os dias.

• Compartilhe com os participantes: no caso do Google, mesmo quando você está no modo de navegação anônima, seu histórico e seus cookies não serão excluídos até você fechar o navegador completamente.

• Peça aos participantes para dar uma chance!

Dica! Demonstre o processo algumas vezes enquanto os participantes estão praticando.

Atividade On-line: Extensões do navegador

[10 minutos]

• Explique aos participantes que existe um mundo crescente de extensões de navegador que combatem rastreadores. Hoje vamos explorar uma delas: o Privacy Badger.

• Compartilhe com os participantes que o Privacy Badger está disponível apenas para o Google Chrome e o Mozilla Firefox. Peça aos participantes para abrirem um desses dois navegadores.

• Vá para a página web do Privacy Badger: https://www.eff.org/privacybadger

• Informe seus participantes: O Privacy Badger é uma extensão do navegador que impede que os anunciantes e outros rastreadores de terceiros rastreiem onde você está e quais páginas você visualiza na web. Se um anunciante parece estar rastreando você em vários sites sem a sua permissão, o Privacy Badger bloqueia automaticamente o anunciante de carregar mais conteúdo no seu navegador. Para o anunciante, parece que você desapareceu de repente.

• Demonstre para seus usuários como clicar no “botão de instalação” para instalar o Privacy Badger.

Dica! Certifique-se de que seu computador ainda não tenha o Privacy Badger instalado, removendo-o do Google Chrome antes dessa atividade.

• Peça aos participantes que revisem os slides de introdução do Privacy Badger com você. Revise o que significam os diferentes controles deslizantes coloridos. Navegue até alguns sites apropriados da comunidade para obter o Privacy Badger, depois verifique novamente quais rastreadores foram bloqueados.

• Demonstre como o ícone do Privacy Badger muda de cor ao trabalhar para bloquear os rastreadores.

• Peça aos usuários para adicionarem a extensão Privacy Badger, navegarem em algumas páginas e experimentarem sozinhos!

Atividade Off-line: Criando Senhas Seguras

[15 minutos]

• Compartilhe a tira em quadrinhos xkcd acima com seus participantes. Compartilhe que o que torna uma senha ser facilmente adivinhada pelas máquinas (e difícil de lembrar para os humanos!) É a seleção de palavras comuns, mesmo se você estiver substituindo números por letras.

• Incentive seus participantes a experimentar este gerador de senha. Permita que os participantes saibam que eles também podem fazer isso off-line, selecionando quatro palavras comuns aleatórias do dicionário e reunindo-as.

• Discuta o que você pode fazer para garantir que as palavras sejam realmente aleatórias. Por exemplo, pode-se tentar substantivo, verbo, adjetivo.

Dica! Se você tiver um par de dados, experimente o Diceware. Sua lista de palavras inclui 8.000 palavras em inglês, precedidas por números de 5 dígitos. Como funciona: role o par de dados 5 vezes e adicione a palavra correspondente à sua frase secreta. Repita várias vezes para adicionar mais palavras e tornar sua senha mais segura.

• Tenha uma discussão com seus participantes.

• Que senhas são mais fáceis de lembrar? Por quê?

• O que pode ser mais fácil de adivinhar? Por quê?

• Que outras dicas você pode ter sobre como proteger suas contas on-line?

• Habilitando a identificação de dois fatores

• Usando gerenciadores de senhas

• Certifique-se de usar senhas diferentes para cada conta.

Dica! Existem muitas dicas de privacidade para compartilhar. Crie um folheto com recursos úteis ou dicas e truques. Aqui estão algumas fontes que você pode procurar:

Projeto de Privacidade de Dados: https://dataprivacyproject.org/curriculum/ Glassroom: https://theglassroom.org/ Eu e Minha Sombra Desintoxicação de 8 Dias: https://myshadow.org/ Segurança em uma Caixa: https://tacticaltech.org/projects/security-in-a-box-key-project/ Acompanhante de Educação de Segurança: https://www.eff.org/deeplinks/2017/11/announcing-security-education-companion Vigilância no nível da rua: https://www.eff.org/issues/street-level-surveillance Biblioteca Pública de Providence, Oficina de Treinamento em Privacidade para Patronos da Biblioteca: https://docs.google.com/presentation/d/1mkGJCHTYKyg2r2yQclRBvp23IfewRHZTMu8j2P0xDdg/edit?usp=sharing Sociedade da Internet Sua Pegada Digital Importa: https://www.internetsociety.org/tutorials/your-digital-footprint-matters/ Nossos Corpos de Dados: https://www.odbproject.org/ Projeto Biblioteca Livre: https://libraryfreedomproject.org/ Laboratório Virtual de Privacidade da Biblioteca Pública de San Jose: https://www.sjpl.org/privacy Biblioteca Pública do Líbano: https://www.leblibrary.com/online-self-defense

Cartões Hacker

[10 minutos]

• Agora vamos colocar nosso conhecimento em teste!

• Dê este jogo de cartão de privacidade: https://thimbleprojects.org/mozillalearning/308795/

• Diga aos seus participantes que eles podem encontrar um conceito que não abordamos na aula. Se eles encontrarem um cartão que gostariam de discutir, peça-lhes que levantem a mão.

Dica! Se você preferir acumular perguntas para discussões em grupo ao final desta atividade, peça a seus usuários que anotem as perguntas.

Encerramento e Reflexão

[5 min]

• Pergunte aos participantes: O que você aprendeu que você não sabia antes? O que te surpreendeu?

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou sobre esta atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?

Todas as Notas Autoadesivas

Descrição

Nesta combinação de atividades off-line/on-line, os participantes exploram como algumas imagens digitais são feitas de pixels e como essas imagens são estruturadas e exibidas. Eles discutem o que mais gostariam de comunicar on-line e criam sua própria ferramenta de comunicação visual para fazer isso: uma arte de imagem em pixel ou um adesivo web. Eles criam adesivos web primeiro em formato analógico e os recriam com ferramentas digitais. Os participantes adicionam seus adesivos aos seus próprios sites (se eles criaram sites nas atividades do WRITE) ou tentam enviá-los por e-mail ou postá-los nas mídias sociais.

Objetivos da Aprendizagem

• Definir o termo ‘pixel’.

• Explicar como os bitmaps determinam a resolução da tela.

• Criar imagens em pixels on-line e off-line.

Tempo Necessário

45 minutos a 1 hora dependendo do tamanho do grupo

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a web

Materiais

• Notebook com conexão à Internet

• Print out pictures within this activity or pull up on computer/project setup

• Quadro branco, flipchart ou papel

• Notas autoadesivas multicoloridas

• Lápis ou caneta

• Fita adesiva

Habilidades de Alfabetização Web

• Design

• Remixagem

• Compartilhamento

• Conexão

• Avaliação

Habilidades do Século XXI

• Comunicação

• Colaboração

• Criatividade

Introdução

[1 min]

• Explique: falaremos sobre como os computadores criam e armazenam imagens usando muitos pedacinhos de cor e como usamos essas imagens para comunicarmos on-line. E nós vamos criar algumas imagens muito simples, tanto em formato analógico quanto digital.

Pixels

[5-10 min]

• Pergunte aos participantes: Quem já ouviu o termo “pixel” antes? O que é um pixel? O que você sabe sobre eles? Dica! Pode ser necessário explicar a diferença entre o termo de computação e o produto de smartphone Pixel do Google.

• Explique: O termo “pixel” vem da palavra em inglês Picture Element. É o menor elemento possível, a menor unidade de informação em uma imagem digital.

• Eles aparecem na tela do computador como pontos de luz brancos ou coloridos ou como pontos que não estão acesos e aparecem em preto.

• Criar imagens com muitos elementos minúsculos não é uma ideia nova! Vamos ver e falar sobre alguns exemplos.

• Pergunte aos participantes: quais são as semelhanças e diferenças nas seguintes imagens? Qual é o menor elemento que compõe cada imagem? (pode mencionar a mistura de cores e camadas de pinceladas do artista George Seurat, Chuck Close usa pinceladas, mas dentro de uma grade, o videogame Space Invaders não tem mistura e camadas, e você pode ver uma grade forte)

Telas, Bitmaps, Resolução

[5-10 min]

• Pergunte aos participantes: quando artistas como Chuck Close e George Seurat criam uma imagem, no que eles estão trabalhando? Qual é a superfície em que trabalham? (As respostas podem ser: papel, tela, madeira, paredes para muralistas, etc.)

• Saliente que, no mundo real, esses itens sempre têm dimensões mensuráveis - sejam minúsculos, pequenos ou grandes como o lado de um prédio.

• Quando olhamos para imagens digitais: qual é a superfície? Qual é o equivalente digital de uma tela ou folha de papel? (Respostas: as telas de nossos monitores de computador ou telefones ou notebooks ou TVs.)

• Aponte que, como papel ou quadro, as telas também têm dimensões físicas (por exemplo, a altura e a largura do smartphone ou da tela do computador).

• Além disso, as telas têm restrições digitais. Cada tela tem um número máximo de pixels disponíveis para exibir imagens. Isso é chamado de resolução de tela. É expresso em duas dimensões, largura e altura em pixels. Exemplos:

• 1280 x 800

• 1024 x 640

• Observe que não há medida oficial fixa para um pixel. Depende das dimensões físicas da tela e da resolução da tela.

• Um outdoor gigante na Times Square pode ter um tamanho de pixel de 12 polegadas por 12 polegadas e seu smartwatch terá um tamanho de pixel microscópico.

• Explique aos participantes que quando usamos computadores para criar ou exibir uma imagem feita a partir de muitos pixels, o computador usa uma grade – uma matriz de pixels, chamada bitmap, para organizar as informações visuais.

• Cada “bit” de informação na imagem, cada pixel, tem sua própria localização única na grade ou “mapa”.

• Isto é válido para fotografias digitais, bem como obras de arte digitais ou imagens – como logotipos ou ilustrações – criadas a partir do zero.

• Veja um exemplo, uma imagem de um ouriço e um close dos pixels que compõem o olho:

• Como uma tela de exibição, uma imagem também tem resolução – o número total de pixels na imagem inteira.

• Calculamos a resolução de uma imagem multiplicando a largura e a altura do bitmap.

• Pergunte aos participantes: quem ouviu o termo “baixa resolução”? Ou “alta resolução?” O que isso significa? (respostas: baixa resolução significa uma imagem com menos pixels, alta resolução significa uma imagem com mais pixels. Quanto mais pixels houver na imagem, mais informações e detalhes obteremos.)

Off-line: Arte Pixel Analógica

[15-20 min]

• Explique aos participantes que eles criarão alguma arte usando pixels, mas de maneira analógica. Eles criarão uma imagem que eles poderão transformar posteriormente em formato digital para uso na web.

• Discuta brevemente a comunicação visual on-line: existem maneiras de usar imagens para se comunicar com outras pessoas on-line? (as respostas aqui podem ser: botão curtir do Facebook, emojis, avatares, etc.) Quais são os exemplos? Como e o que essas imagens dizem? Há algo que você quer comunicar mas que ainda não existe uma imagem? O que isso poderia ser? Que tipo de comunicação você gostaria de ver mais ou menos on-line?

• Explique as restrições de atividade: como não temos o dia todo, provavelmente usaremos um bitmap menor para criar uma imagem de baixa resolução, algo sem muitos pixels. Veja um exemplo familiar:

• Para preparar, você pode atribuir diferentes tamanhos de bitmap a diferentes grupos ou convidar grupos para selecionar o tamanho – eles querem trabalhar com grade de 5x5? Uma grade de 10x10? Uma grade de 25x25?

Dica! Peça aos usuários que considerem quantos pixels precisam para criar uma imagem legível. Você também pode pedir que eles façam um pouco de matemática – quantos pixels eles precisarão para cada opção?

• Mova os participantes para grupos menores (ou seja, 3 ou 4).

• Incentive os participantes, em grupo, a pensar sobre o que gostariam de comunicar com a sua imagem (e, se for uma opção, em que tamanho de grade estão trabalhando).

• Incentive o “sim” e o brainstorming – receba muitas ideias, não seja rápido demais para dispensar.*

• Convide-os a planejar a ideia em um quadro branco, flipchart ou papel de rascunho.

Dica! O papel do caderno em grade pode funcionar bem aqui.

• Peça aos participantes que usem fitas adesivas para dispor a grade de pixels.

• Distribua uma grande pilha de notas autoadesivas multicoloridas ou quadrados de papel multicolorido cortados para cada grupo. Se quiser, você pode oferecer a eles a opção de reduzi-los a tamanhos de pixels menores.

• Dê aos grupos cerca de 10 minutos para construir a arte a partir de suas notas autoadesivas ou papel.

• Tire fotos do produto acabado de cada grupo, caso haja uma catástrofe na mesa mais tarde.

• Obtenha toda a atenção do grupo e faça com que todos vejam cada criação, enquanto o grupo fala sobre o que eles fizeram, o que eles querem comunicar, seu processo e quaisquer outras ideias.

• Para finalizar, pergunte aos participantes sobre o processo:

• Como foi a sensação de construir arte com blocos de cor em vez de desenhar ou pintar em uma página em branco ou tela do zero?

• Quais foram os desafios?

• Você ficou surpreso com o quanto você pode se comunicar com pixels?

• Como a resolução entrou em jogo? Como o fator de cor entrou?

On-line: Arte Pixel Digital

[15-20 min]

• Explique aos participantes que eles usarão uma ferramenta baseada na web para criar suas próprias versões digitais da arte de pixel analógica que acabaram de criar. Você pode usar a tecnologia para desenhar e pintar, e não apenas usar sua câmera para gravar.

• Direcione-os para https://make8bitart.com/

• Opcional: discuta o conceito de “8 bits”.

• Demonstre como usar o seletor de cores, como desenhar na tela e como apagar os pixels que eles não querem.

• Mostre como a seleção do tamanho do pincel pode ajudá-lo a preencher rapidamente áreas maiores.

• Demonstrar como salvar como um png. Se os participantes são novos no uso do computador, saiba que eles podem precisar de instruções passo a passo.

• Opcional: explique que o formato png permite pixels transparentes, sendo algo que um .jpg, um formato antigo, não faz. Os pixels transparentes são úteis para um adesivo, pois não há um plano de fundo na imagem, parecendo que ela foi recortada e colocada aonde você quiser, como um adesivo da vida real (IRL - In Real Life).

• Dê aos usuários 5 minutos para replicar seus adesivos analógicos – isso não deve demorar muito, pois os adesivos já foram projetados!

• Convide-os a postar os adesivos nas mídias sociais, enviar por e-mail ou adicionar os adesivos aos seus próprios sites.

• Se houver interesse, permita que os usuários brinquem com o software e criem novos adesivos.

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou sobre esta atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?

Crowdsourcing na Web

Habilidades: Contribuir, Compartilhar, Avaliar, Conectar, Prática Aberta, Colaboração, Comunicação, Solução de problemas

Descrição

Nesta atividade, os participantes irão explorar como muitos indivíduos podem trabalhar juntos no mesmo projeto de aprendizado ou descoberta, usando a web como uma ferramenta de colaboração. Os participantes discutirão brevemente como a web e outras ferramentas digitais aumentaram a quantidade de informações on-line, bem como recursos humanos em potencial. Eles também explorarão a noção de crowdsourcing e ajudarão com um estudo de pesquisa usando a plataforma Zooniverse para ciência cidadã (ou outra plataforma – escolha do(a) facilitador(a)).

Objetivos da Aprendizagem

• Explicar o termo “crowdsourcing” e como ele contribui para a informação on-line.

• Colaborar on-line para contribuir com informações.

Tempo Necessário

45 minutos a 1 hora dependendo do tamanho do grupo

Público-alvo

Pode ser adaptado para públicos de 13 anos ou mais; com níveis variados de experiência com a web.

Materiais

• Notebook com conexão à Internet.

• Um computador/projetor configurado para demonstração.

• Dois conjuntos de talvez 50 a 60 imagens semelhantes, cada uma impressa em um cartão individual (você pode imprimir uma grade de imagens e cortá-las). Estas podem ser paisagens, fotos de pessoas, fotos de animais ou insetos.

Habilidades de Alfabetização Web

• Contribuir

• Compartilhar

• Avaliar

• Conectar

• Prática Aberta

Habilidades do Século XXI

• Colaboração

• Comunicação

• Solução de problemas

Introdução

[10 min]

• Pergunte aos participantes: Como estamos coletando e armazenando informações na era digital usando a web? Como isso é diferente do que foi feito no passado? Por exemplo, pergunte:

• Quem usou uma câmera de filme? Qual é a diferença entre uma câmera de filme e uma câmera digital? (As câmeras digitais permitem que você tire e armazene muitas fotos, provavelmente muito mais do que você faria com uma câmera de filme.)

• Outros exemplos podem ser: e-mails vs cartas, tweets ou posts no Facebook vs conversas por telefones ou pessoalmente.

• Juntamente com o crescimento rápido e expansivo da web e da computação, também temos novas ferramentas e sistemas digitais (como câmeras digitais e telescópios, como sensores que rastreiam o clima) para coletar mais e mais dados sobre nosso ambiente, sobre nós.

• Explique que muitas dessas informações são adicionadas ou carregadas na web – às vezes automaticamente (e-mail baseado na web, tweets), às vezes pelo autor ou proprietário, onde são armazenadas nos servidores e podem ser acessadas/acessíveis por qualquer pessoa com permissões.

• Resuma: muito mais informação é fácil de fazer e capturar digitalmente. Temos mais dispositivos em rede para coletar e criar informações, e podemos automatizar a coleta e o armazenamento de todos esses arquivos digitais.

• Pergunte aos participantes: que outros tipos de recursos estão na web, além de informações? Você já pensou em si mesmo como um recurso em rede? O que você pode oferecer para outras pessoas na web?

Dica! Se os participantes estão tendo dificuldade em encontrar o que eles oferecem, aqui estão algumas maneiras gerais pelas quais as pessoas podem contribuir conosco:

Ensine algo (site instructables, tutoriais do YouTube). Ajude a avaliar algo; dê sua opinião, comentário ou parecer sobre algo (projetos de ciência cidadã, comentários mais amplos como parecer). Compartilhe uma ideia, experiência ou percepção (blog, fórum comunitário para hobbies, questões médicas, etc). Crie seu próprio novo conteúdo (YouTube, SoundCloud). Empreste o poder de processamento de seu computador para ajudar a fazer algo quando você não o estiver usando (computação distribuída voluntária).

• Há uma enorme comunidade de usuários da web, pessoas de diferentes origens e idades, vivendo em lugares diferentes em todo o mundo, que possuem habilidades ou percepções ou tempo que podem estar dispostos a compartilhar. Existem bilhões de usuários da web e muito potencial.

• Até a web, não havia uma maneira fácil de acessar esse recurso humano coletivo, reunir pessoas para compartilhar habilidades ou trabalhar ou aprender em conjunto.

• Hoje vamos analisar algumas maneiras de colaborar e trabalhar com muitas outras pessoas na Web e ajudar nos desafios e possibilidades de toda essa informação digital. Mas vamos começar com uma experiência off-line para nos aquecer!

Off-line: Crowdsourcing Analógico

[15-20 min]

• Para esta atividade, você precisará de dois conjuntos de talvez 50 a 60 imagens semelhantes, cada uma impressa em um cartão individual (você pode imprimir uma grade de imagens e cortá-las). Estas podem ser paisagens, fotos de pessoas, fotos de animais ou insetos. As imagens devem ser todas semelhantes, mas com algumas diferenças. Aqui está um exemplo:

• Selecione um voluntário ou uma dupla de voluntários para serem parceiros ou trabalhador individual (não mais que 2 aqui). Forneça à esse participante ou participantes com um conjunto de cartões.

• O resto dos participantes – estes devem ser a maioria daqueles em sua sessão – são sua turma. Divida o segundo conjunto das imagens igualmente entre todos esses participantes – cada um deve receber 3 ou 4.

• Faça uma pergunta sobre o conjunto de imagens – no exemplo da joaninha, pergunte quantas manchas há em cada uma delas? Peça aos trabalhadores individuais e aos trabalhadores do grupo que façam a tarefa e montem seus dados. Dê a cada grupo uma folha para registrar os resultados. Peça aos participantes para colocarem quaisquer imagens que não possam interpretar de lado.

Dica! As respostas podem não ser simples para todas as imagens – pode não haver manchas, pode ver algumas mas não todos as manchas em um inseto em particular, pode não ser possível identificar.

• O grupo maior provavelmente terminará a tarefa primeiro! Seja qual for o grupo que terminar primeiro, peça que avaliem a pilha “não é possível“ juntos – podemos juntos tomar uma decisão – esse deve ser um processo rápido de revisão.

• Quando um dos grupos estiver concluído e tiver feito a avaliação de todas as imagens, pare a atividade para todos os grupos.

• Pergunte aos participantes:

• Como é fazer essa tarefa?

• Por que foi mais rápido para um grupo em relação aos outros?

• Que habilidades especiais eles precisavam para essa tarefa?

• Quais foram os desafios de cada grupo?

• Quais percepções o grupo maior tinha sobre as fotos “não é possível identificar” – os outros viram algo ou souberam algo que a primeira pessoa que olhou para a imagem não sabia?

• Explique que o grupo maior acabou de realizar uma atividade de “crowdsourcing” – cada um fez uma pequena tarefa – avaliando um pouco de dados – que contribuiu para uma tarefa maior – entendendo toda a nossa coleção de fotos. Este projeto foi feito mais rapidamente pelo grupo maior do que pela pessoa individual ou dupla.

• Existem tarefas maiores, especialmente na área de pesquisa científica, que podem utilizar o poder de crowdsourcing on-line em grande escala para avaliar muitos e muitos dados, o tipo que é coletado em grandes escalas, exatamente como discutimos no início da sessão.

• Informe aos participantes que, em seguida, eles usarão a web para ver como podem participar de pesquisa científica real on-line – eles se tornarão cidadãos cientistas ou pesquisadores, como parte de um esforço para incentivar mais pessoas a participar e fazer parte da descoberta científica.

On-line: Zooniverse

[25-30 min]

• Para esta atividade, os participantes participarão de alguma pesquisa científica de crowdsourcing usando o Zooniverse (ou outra plataforma, conforme selecionada pelo(a) facilitador(a)). Dependendo do tempo, há duas opções aqui:

• O(A) facilitador(a) seleciona um projeto com antecedência e orienta passo a passo os usuários em como participar (veja o exemplo abaixo) OU

• Os usuários exploram a coleção de projetos no Zooniverse e selecionam um (ou mais) que eles acham mais interessante.

• Observe que os usuários não precisam fazer login para usar o Zooniverse, embora possam fazê-lo, se quiserem criar uma conta.

• Explique que o Zooniverse é uma plataforma on-line onde pesquisadores de todos os tipos podem hospedar seus dados, para que os participantes possam ajudá-los.

• Você não precisa de habilidades especiais para ajudar, apenas interesse. Os tipos de coisas que você pode fazer para cada projeto são diferentes. Por exemplo:

• Você pode olhar para uma imagem e marcar um recurso/item ou contar o número de itens presentes. Você pode responder a perguntas sobre a imagem e avaliar uma imagem para determinadas qualidades.

• Você pode estar transcrevendo informações da imagem em formato analógico.

• Note in this section about checking and verifiying– that more than one person screens each image or piece of data.

• Demonstração do Projeto

Dica! O(A) facilitador(a) deve fazer isso e, se possível, ter sua tela projetada para que todos os participantes possam ver.

• Acesse o Zooniverse – https://www.zooniverse.org

• Vá para a página do projeto:

• Explique aos participantes que o Zooniverse é uma plataforma que hospeda muitos dados de pesquisa que os participantes como você podem ajudar a classificar ou avaliar, contribuindo para a pesquisa do mundo real!

• Selecione um projeto dentre as opções na página e clique para ser levado à página do projeto. Por exemplo, esta é a página inicial de um projeto chamado Expedição Elefante.

• Como todos os projetos estão na plataforma Zooniverse, a interface é semelhante para cada projeto.

• Existe um tutorial pop-up com vários passos. Use a tecla de seta para explorar as etapas.

• E há um espaço para fazer o trabalho de classificação.

• Mostre aos participantes como você pode concluir uma única tarefa de avaliação.

• Saliente que eles podem explorar as conversas da comunidade em “TALK” e aprender mais sobre o projeto em “SOBRE”.

• Faça a atividade! Dê aos participantes de 15 a 20 minutos para contribuir para um ou mais projetos no Zooniverse.

Reflexão e Encerramento

[5-10 min]

• Peça aos participantes algumas perguntas sobre a experiência deles e incentive uma discussão. Exemplos de perguntas abaixo:

• Como foi fazer essa tarefa? O que foi surpreendente? O que foi um desafio?

• Você teve alguma dúvida sobre a tarefa?

• Por que os pesquisadores precisam de ajuda como essa?

• Por que algumas tarefas são mais adequadas para humanos? Você acha que um computador poderia fazer esse trabalho?

• Quantas imagens/arquivos/vídeos seu projeto teve?

• Quantas outras pessoas contribuíram?

• Como você se sente sobre sua contribuição?

Reflexão da Experiência de Aprendizagem

[5 min]

• O que você gostou sobre esta atividade?

• Se você puder ensinar essa atividade a um público específico, o que você mudaria no processo, estrutura ou conteúdo para melhor atender às necessidades desse público?