FACULDADE DE DESIGN

MATEUS SILVA DE OLIVEIRA

REDESENHO DE INTERFACE PARA SOFTWARE DE EDIÇÃO DE VÍDEO

PORTO ALEGRE 2011

0

MATEUS SILVA DE OLIVEIRA

Redesenho de Interface para Software de Edição de Vídeo

Trabalho de Conclusão de Curso apresentado à Faculdade de Design do Centro Universitário Ritter dos Reis, como requisito parcial para obtenção do título de Bacharel em Design.

Orientadores: Prof. Me. Heli Meurer, Prof.ª Me. Lizandra Kunzler, Prof. Dr. Marcelo Martel e Prof. Norberto José Pinheiro Bozzetti.

Porto Alegre 2011

1

2

______

OLIVEIRA, Mateus Silva de (1988) Redesenho de Interface para Software de Edição de Vídeo. Monografia - Centro Universitário Ritter dos Reis 2011 A compilação desta monografia tem todos os direitos de reprodução ©2011 reservados a Mateus Silva de Oliveira. Nenhuma parte do projeto realizado através desta monografia pode ser copiado, impresso ou gravado sem a prévia autorização, por escrito, do autor e detentor dos direitos de reprodução. Caso haja interesse em cópias entrar em contato com o autor pelo e-mail: [email protected] 3

Dedico este trabalho à minha família, que nunca deixou de me apoiar.

4

AGRADECIMENTOS Agradeço a toda minha família e amigos, que sempre me apoiaram e não mediram esforços para me ver feliz. Agradeço, também, a todos os grandes mestres que passaram por minha vida acadêmica, pelo conhecimento compartilhado. E, principalmente, agradeço aos mestres Jaire Passos e Heli Meurer, por nunca perderem a fé em mim.

5

"O impossível só existe se você acreditar nele”.

(Chapeleiro Maluco no filme “Alice”, 2010).

6

RESUMO

Projeto de redesenho de interface gráfica para software de edição de vídeo voltado para crianças e pré-adolescentes. Tendo em vista que a interação entre utilizador e ferramenta é de extrema importância para a otimização no uso de um programa de computador, a comunicação entre ambos deve ser o mais abrangente possível, dentro de um público específico. Partindo do princípio de que tais softwares não apresentam uma comunicação intuitiva, de modo a guiar o utilizador, o principal ponto deste trabalho se dará na interação entre crianças, que, em sua maioria, não apresentam muitas barreiras cognitivas, e softwares de edição de vídeo, os quais apresentam complexa comunicação para com o usuário.

Palavras-chave: Cognição, Comunicação, Interação, IGA, Edição de Vídeo,

7

ABSTRACT

Graphic interface redesign project for video editor software aiming children and pre-teens. Considering that the interaction between user and tool is extremely important for optimizing the use of a software, the communication between them has to be as comprehensive as possible within a specific group. Assuming that such software does not have an intuitive communication for guiding the user, the main point of this monograph will be centered in the interaction between children, that mostly do not have many cognitive barriers, and video editor softwares, which have complex dialog with their own users.

Key-Words: Cognition, Communication, Interaction, FGI, Video Edition

8

SUMÁRIO 1 INTRODUÇÃO ...... 13 2 JUSTIFICATIVA ...... 15 3 OBJETIVOS ...... 17 3.1 OBJETIVO GERAL ...... 17 3.2 OBJETIVOS ESPECÍFICOS ...... 17 3.3 OBJETIVOS ACADÊMICOS ...... 17 4 METODOLOGIA ...... 18 4.1 METODOLOGIA DE PROJETO...... 18 5 CRONOGRAMA ...... 19 6 FUNDAMENTAÇÃO TEÓRICA ...... 20 6.1 A ORIGEM DOS FILMES ...... 20 6.2 A EDIÇÃO DE VÍDEO ...... 21 6.2.1 EDIÇÃO LINEAR ...... 22 6.2.2 EDIÇÃO NÃO-LINAR ...... 22 6.3 INTERAÇÃO HUMANO-TECNOLOGIA ...... 22 6.4 INFORMÁTICA NA EDUCAÇÃO...... 23 6.5 DESIGN DE INTERAÇÃO ...... 25 6.5.1 INTERAÇÃO VOLTADA PARA O USUÁRIO...... 27 6.5.1.1 USUÁRIO CORPORATIVO ...... 27 6.5.1.2 ANALFABETOS FUNCIONAIS ...... 27 6.5.1.3 USUÁRIOS INTERNACIONAIS ...... 28 6.5.1.4 IDOSOS ...... 28 6.5.1.5 CRIANÇAS E JOVENS ...... 28 6.6 USABILIDADE ...... 29 6.6.1 METAS DE USABILIDADE ...... 29 6.6.1.1 EFICÁCIA ...... 30 6.6.1.2 EFICIÊNCIA ...... 30 6.6.1.3 SEGURANÇA ...... 30

9

6.6.1.4 UTILIDADE ...... 31 6.6.1.5 CAPACIDADE DE APRENDIZAGEM ...... 31 6.6.1.6 CAPACIDADE DE MEMORIZAÇÃO ...... 31 6.6.2 HEURÍSTICAS DE USABILIDADE ...... 32 6.6.2.1 HEURÍSTICA DA REALIMENTAÇÃO ...... 32 6.6.2.2 HEURÍSTICA DA ABRANGÊNCIA ...... 32 6.6.2.3 HEURÍSTICA DO CONTROLE ...... 33 6.6.2.4 HEURÍSTICA DA COERÊNCIA ...... 33 6.6.2.5 HEURÍSTICA DA PREVENÇÃO ...... 33 6.6.2.6 HEURÍSTICA DO RECONHECIMENTO ...... 34 6.6.2.7 HEURÍSTICA DA FLEXIBILIDADE ...... 34 6.6.2.8 HEURÍSTICA DO MINIMALISMO ...... 34 6.6.2.9 HEURÍSTICA DOS ERROS ...... 35 6.6.2.10 HEURÍSTICA DA AJUDA ...... 35 6.6.3 USABILIDADE PARA CRIANÇAS E JOVENS ...... 35 6.7 COGNIÇÃO ...... 36 6.7.1 COGNIÇÃO EM CRIANÇAS E JOVENS ...... 36 6.7.1.1 SENSÓRIO MOTOR ...... 37 6.7.1.2 PRÉ OPERATÓRIO ...... 37 6.7.1.3 OPERAÇÕES CONCRETAS ...... 38 6.7.1.4 OPERAÇÕES FORMAIS ...... 38 7 PROJETO ...... 39 7.1 ESTRATÉGIA ...... 39 7.1.1 DEFINIÇÕES E DELIMITAÇÃO DO TEMA...... 39 7.1.1.1 O QUE DESENVOLVER?...... 39 7.1.1.2 POR QUE PROJETAR?...... 39 7.1.1.3 COMO DESENHAR?...... 40 7.1.1.4 PARA QUEM?...... 40 7.1.1.5 COM QUE TECNOLOGIA?...... 40

10

7.1.1.6 PARA QUE MERCADO?...... 40 7.1.2 IDENTIFICAÇÃO DE CENÁRIOS...... 40 7.1.3 SIBD E SFBR...... 42 7.1.4 EQUALIZAÇÃO DE FATORES PROJETUAIS...... 43 7.1.5 TAXONOMIA...... 44 7.1.6 ANÁLISES...... 44 7.1.6.1 ANÁLISES LINGUÍSTICAS...... 45 7.1.6.1.1 ANÁLISES DENOTATIVAS...... 45 7.1.6.1.2 ANÁLISES CONOTATIVAS...... 46 7.1.6.1.3 ANÁLISE DIACRÔNICA...... 48 7.1.6.2 ANÁLISES CONTEXTUAIS...... 57 7.1.6.3 ANÁLISES DESENHÍSTICAS...... 77 7.1.6.3.1 ANÁLISE ESTRUTURAL...... 77 7.1.6.3.2 ANÁLISE FUNCIONAL...... 79 7.1.6.3.3 ANÁLISE COMPARATIVA DE FERRAMENTAS...... 80 7.1.6.3.4 ANÁLISE DE IDENTIADE GRÁFICO-VISUAL...... 80 7.1.6.3.4.1 LOGOGRAFIA...... 80 7.1.6.3.4.2 CROMOGOGRAFIA...... 83 7.1.6.3.4.3 ICONOGRAFIA...... 85 7.1.6.3.5 ESCALAS DE DIFERENCIAL SEMÂNTICO...... 87 7.1.6.4 ANÁLISES HEURÍSTICAS...... 90 7.1.7 LISTA DE VERIFICAÇÃO...... 94 7.2 ESCOPO...... 95 7.2.1 DEFINIÇÃO DE PERSONAS...... 96 7.2.2 DEFINIÇÃO DE FERRAMENTAS E FUNCIONALIDADES...... 96 7.2.3 CENÁRIO HIPOTÉTICO...... 97 7.2.4 DIFERENCIAL SEMÂNTICO...... 99 7.2.5 POSICIONAMENTO...... 100 7.3 ESTRUTURA...... 101

11

7.3.1 ORGANOGRAMA DE FUNCIONALIDADES...... 101 7.3.2 TAREFAS...... 102 7.3.2.1 TAREFA 1...... 102 7.3.2.2 TAREFA 2...... 103 7.4 ESQUELETO...... 104 7.4.1 WIREFRAMES ESTRUTURAIS...... 104 7.4.2 WIREFRAMES ARQUITETURAIS...... 107 7.5 ESTÉTICA ...... 111 7.5.1 MALHAS DE CONSTRUÇÃO ...... 111 7.5.1.1 MALHA DIAGRAMACIONAL ...... 111

7.5.1.2 MALHA FILOSOFAL ...... 112 7.5.2 PADRÃO TIPOGRÁFICO ...... 112 7.5.3 ASSINATURA GRÁFICO-VISUAL ...... 113 7.5.4 PADRÃO CROMÁTICO ...... 114 7.5.5 MODELO FUNCIONAL ...... 115 8 ANEXOS ...... 121 8.1 DEFINIÇÃO DE TERMOS ...... 121 8.2 LISTA DE IMAGENS ...... 123 9 REFERÊNCIAS BIBLIOGRÁFICAS ...... 127

12

1 INTRODUÇÃO

Esta monografia abordará o desenvolvimento de um redesenho de interface de software editor audiovisual voltado para crianças e jovens. A proposta é de compreender o modo como estes usuários se comunicam com interfaces virtuais, o nível de interação que se fará necessário e o quão intuitivo ele deve se apresentar. O projeto visa tanto a funcionalidade (estudantes que carecem de tais programas para trabalhos escolares, por exemplo) como para entretenimento.

O foco deste projeto se dará na parte de vídeos. Mesmo na atualidade, teatro continua sendo teatro e filme continua sendo filme. E apesar de uma ligação forte entre os dois, há uma diferença peculiar, que faz toda a diferença para o projeto em questão: uma peça teatral se “monta” no momento em que está sendo executada, partindo do princípio do improviso de que se sabe como começa, mas nunca como termina; e um filme se monta bem antes de poder ser executado, dependendo da correta gravação de cenas, cortes, tomadas (muitas vezes realizadas mais de uma vez) e montagem. Ou seja, para se fazer um filme é necessário todo um estudo por trás da sequência de cenas. Esse estudo é chamado de edição audiovisual, algo que não está presente nas peças de teatro justamente por estas apresentarem sua “montagem” e “execução” ao mesmo tempo.

Atualmente a edição audiovisual tem se tornado mais abrangente. Há diversos softwares no mercado com a finalidade de editar filmes e vídeos. Porém, em sua maioria, apresentam interfaces voltadas a públicos já acostumados com certos padrões de comunicação visual presente em tais softwares. O resultado disso é que usuários de primeiro contato geralmente precisam aprender a usar o programa com antecedência, pois a interação entre utilizador e ferramenta não é intuitiva o bastante para o exercício imediato.

13

Partindo do ponto em que esses softwares são de difícil assimilação por adultos, imaginemos como ficariam as crianças e pré-adolescentes. Claro, por não possuírem tantas barreiras cognitivas quanto os mais velhos, sentir-se-iam livres para mexer até descobrir como fazer, porém, para que isto aconteça, é necessária uma boa dose de sorte, pois a complexidade é tanta que as interfaces de tais programas podem ser comparadas a um painel de avião, para os leigos. É muito mais fácil o usuário se perder dentro do programa, estragar o vídeo ou se frustrar do que conseguir realizar a tarefa a qual tinha se proposto.

14

2 JUSTIFICATIVA

Minha motivação principal para a realização deste projeto é o meu gosto pessoal por filmes, teatro e artes cênicas. Sempre fiquei fascinado com o processo de criação de tais obras, desde as mais “faraônicas” (como as provindas de Hollywood), como as de menor expressão (como os teatros de escola). É um universo vasto, com diversos campos a serem explorados, especialmente nos dias de hoje em que a internet transformou a comunicação, fazendo com que esta não possua mais as barreiras impostas num passado não muito distante.

Nos dias de hoje, o mundo virtual se tornou parte constante na vida da população. O alcance, cada vez maior, que a internet proporciona está formando uma nova geração de pessoas, tornando-as seres quase oniscientes. A informação ao alcance de um clique transformou um mundo antes dominado por livros em ambientes virtuais, trocando as folhas de papel por softwares e web-sites.

Porém, como cita Hamann (2011), nem sempre foi assim. Há pouco mais de dez anos atrás era difícil de “achar” o que se queria. Fosse informação ou algum tipo de ferramenta. E com softwares de edição audiovisual não era diferente. A maior parte dos detentores de tais ferramentas eram profissionais do ramo, pois se tratavam de produtos caros e difíceis de ser encontrados. Com o passar dos anos, era cada vez mais fácil de se conseguir um software destes, fato este diretamente ligado à pirataria dos dias atuais. Hoje em dia, qualquer pessoa com um pouco de curiosidade, tempo e disposição pode adquirir um programa desses sem muito esforço. Saber usá-lo corretamente é outra história.

Geralmente, a sensação que se tem ao abrir um desses programas pela primeira vez é a de desnorteamento. A maioria destes programas é facilmente confundido com um simulador de vôo, tamanha a quantidade de botões, luzes, telas e funcionalidades piscando ao mesmo tempo. Em outras palavras, esses

15 softwares, pelo menos a grande maioria deles, não são o que podemos chamar de intuitivos. Tal como a heurística do diálogo simples, quanto mais informação o usuário precisar assimilar, mais “incomodado” ele se sente.

A ideia do tema surgiu depois da conclusão de que se houvesse um software desse tipo, quando era eu quem tinha de fazer vídeos para o colégio, existisse, minha vida teria sido bem menos complicada. Mesmo hoje em dia é difícil de achar jovens com o conhecimento para se editar corretamente um vídeo. Não que falte vontade por parte de quem utiliza, mas a comunicação complexa de tais softwares geralmente acaba por levar o utilizador a buscar outros meios de edição, como o exaustivo “corte-a-corte” de cenas.

A identificação com esse meio (filmes, teatro, música, edição audiovisual) me levou a pensar em como transportar esse tema para o mundo dos utilizadores pretendidos: crianças e pré-adolescentes. E é com base no modo como se comunicam e interpretam sinais visuais que este projeto será conduzido.

16

3 OBJETIVOS

3.1 GERAL

Projeto de redesenho de interface para software de captura e edição audiovisual. Destinado, principalmente para crianças e pré-adolescentes, envolvendo pesquisa de modo de comunicação entre usuário e interface, tornando o software mais intuitivo do que os principais concorrentes.

3.2 ESPECÍFICOS

Pesquisar como o público de destino se comunica com uma interface virtual. Pesquisar problemas de usabilidade e ergonomia de um público definido. Diminuir o número de usuários receosos para com esse tipo de software. Tornar a interface do programa mais intuitiva. Aliar a interface ao conceito de IGA, com hierarquia de ferramentas e funcionalidades. Desenhar o software de maneira que os usuários tenham acesso facilitado às funcionalidades do programa. Muitos desses usuários apresentam vontade de entender o sistema, porém encontram muitas barreiras cognitivas para a usabilidade do programa em questão.

3.3 ACADÊMICOS

Levar em consideração a área da produção audiovisual e conhecer o mercado de interfaces tecnologias e métodos utilizados para o bom desenvolvimento de um projeto dígito-virtual.

17

4 METODOLOGIA DE PROJETO

O desenvolvimento prático do projeto se dará através da metodologia Projeto E de Meurer & Szabluk (2009).

4.1 PROJETO E

A metodologia em questão se divide em seis etapas: Estratégia, escopo, estrutura, esqueleto, estética e execução. Cada etapa conta com sub-etapas, que poderão sofrer pequenas alterações, adições e/ou adaptações.

Estratégia: É aqui onde se dá a busca pelo tema do projeto, bem como informações importantes para a concepção do mesmo, tais como: Delimitação de tema, processo criativo, estado da arte, contextualização e questões projetuais básicas.

Escopo: Após uma boa delimitação de tema, o utilizador da metodologia deverá ter em mente o que fazer com a ideia, ou seja, por qual caminho o seu projeto irá seguir, nas linhas da metodologia. Esta etapa é importante porque é dela que serão concebidas as primeiras gerações de alternativas, bem como o fluxo de tarefas, seguindo como base a lista de verificação da fase anterior.

Estrutura: É aqui onde as gerações de alternativas começam a tomar a forma final. Todo o estudo realizado até aqui levará a criar a estrutura a ser seguida nas próximas fases do projeto.

Esqueleto: Nesta etapa, após as gerações de alternativas e estudos específicos, serão concebidas as malhas, grelhas e estrutura principal para ser utilizado no projeto. No design, tudo tem um porquê. No caso do design gráfico, os porquês são definidos através dessas malhas estruturais, dando ao desenho uma síntese formal, que explica o porquê de cada coisa estar presente no lugar onde estará.

18

Estética: Estudo final e aplicação do layout definitivo e todas as composições finais a serem executadas. Apesar de a explicação ser simples, é uma parte bastante complexa. Necessita de vários estudos até chegar à sua forma final dentro do projeto em desenvolvimento.

Execução: A parte final consiste em fazer os últimos testes de simulação e aplicação do protótipo/modelo. Se aprovado, parte-se para a produção do projeto.

5 CRONOGRAMA

As etapas deste trabalho foram divididas conforme a metodologia Projeto E, e adaptadas em conjunto com o plano de ensino disponibilizado pelos professores. Podem haver pequenas alterações até o final do semestre.

Imagem 1 - Cronograma de Atividades (Metodologia)

Fonte: Autor, 2011.

19

6 FUNDAMENTAÇÃO TEÓRICA

6.1 A ORIGEM DOS FILMES

A origem da edição de vídeos se dá a partir da evolução do cinema. Segundo Machado (1997), há diversas teorias acerca do surgimento do cinema. Isso acontece porque, para chegar à tela 3D Silverscreen dos dias atuais, houveram muitos antecessores. Desde a “Câmara Escura” de Da Vinci o homem apresenta registros de projeção de imagens. Tanto teoria como aspectos práticos se dividem em diversas ramificações, fazendo com que a história muitas vezes pareça confusa.

O cinema, como nós conhecemos hoje em dia, nasceu no final do século XIX, mais precisamente no ano de 1895, com os irmãos Louis e Auguste Lumière, na França. Foi em 28 de dezembro deste ano que, no Salão Grand Café, em Paris, os Lumière apresentaram ao mundo o Cinematógrafo.

Imagem 2 – Cinematógrafo Lumière

Fonte: Wikimedia, 2011.

O cinematógrafo é uma evolução do cinetoscópio de Thomas Edison. Foi inventado por Léon Bouly no ano de 1893, porém este não pôde pagar pelo registro da invenção e, em 1894, foi patenteado pelos irmãos Lumière. A invenção associa funções de captura, revelação e projeção de película, ao contrário de invenções que antecederam o cinematógrafo, que necessitavam 20 de câmeras específicas para cada procedimento. Desde sua apresentação, no Salão Grand Café, com o filme “L’Arrivée d’um Train à La Ciotat”, o cinematógrafo gerou grande enternecimento, tamanha era a grandiosidade da novidade apresentada.

6.2 A EDIÇÃO DE VÍDEO

De acordo com Canelas (2010, p.2): “A edição de vídeo foi introduzida dois anos após a invenção do registro magnético de vídeo, ou seja, em 1958, começando por ser uma edição física, tal como se praticava na montagem cinematográfica”. O processo, na época, era moroso e delicado, pois as imagens da película eram pequenas demais, sendo extremamente difícil conseguir um corte no ponto exato. Além disso, se houvesse um erro de colagem da película, poderiam haver perturbações visuais no andamento do vídeo.

A partir dos anos 60, a tecnologia começou a ser introduzida nas edições de vídeo profissionais, porém de forma muito mais “analógica” que a atual. Entretanto, já era utilizado o auxílio de uma máquina. Isso gerou um salto na evolução da edição, pois pela primeira vez o editor não entraria mais em contato com a película para realizar a edição, e sim por meio de sistemas humano-máquina. No começo da edição eletrônica era feito através de um aparelho leitor de película, um monitor de visualização e um operador, e, se pensarmos bem, essa sequência continua bem parecida até os dias de hoje.

De acordo com Ward apud Canelas (2010, p.3): “A edição de vídeo é um processo que consiste em selecionar e coordenar um plano com o seguinte, com vista à construção de uma sequência de planos que formem, por sua vez, uma narrativa lógica e coerente.”

O processamento de imagens, hoje em dia, divide os sistemas de edição em dois: linear e não linear. 21

6.2.1 EDIÇÃO LINEAR

Qualquer edição que utilize fita de película é linear, independente de dispositivos e ferramentas em uso, pois necessitam de processamento temporal linear (primeiro o quadro um, depois o quadro dois e assim por diante). Está, aos poucos, sendo substituída pela edição não-linear.

6.2.2 EDIÇÃO NÃO-LINEAR

Atualmente, a maioria das edições é feita em sistemas não-lineares. Esses sistemas são virtuais, e podem ser encontrados em softwares e dispositivos eletrônicos de armazenamento de imagem. Esta “tomando” o mundo da edição pois sua não-linearidade se refere ao processamento atemporal de imagens, já que são virtuais e não mais películas físicas.

A gravação e edição audiovisual permitiu que erros (freqüentes no passado) de emissões televisivas e cinematográficas fossem ocultos. Têm impacto direto no modo de produzir um programa audiovisual, podendo, inclusive, serem armazenados de modo virtual em, por exemplo, um banco de dados (algo bem menos complexo do que guardar milhares de películas).

6.3 INTERAÇÃO HUMANO-TECNOLOGIA

De acordo com Colom Cañellas (1994) “(...) utilizando a informática, o homem alcança novas possibilidades e estilos de pensamento inovador jamais postos em prática. (...) A tecnologia vai transformando, também, as nossas mentes porque de alguma maneira temos acesso aos dados, mudamos nosso modelo mental da realidade (...).

Durante os últimos anos surgiram grandes mudanças na tecnologia, principalmente em campos como o da comunicação, que proporcionou um

22 enorme desenvolvimento, por exemplo, na ergonomia. Essas evoluções científicas foram enormemente auxiliados pela informática, que permitiu o embasamento e aprimoramento de processos de produção e pesquisas.

Segundo Carvalho apud Carvalho (2003, p.79): “o avanço tecnológico transformou o computador em uma ferramenta cada vez mais indispensável às atividades humanas. É difícil encontrar um ambiente onde o computador não esteja presente, de maneira direta ou indireta.” Ou seja, da atualidade para o futuro, o uso, e conseqüentemente a interação, serão cada vez mais presentes no dia-a-dia. Há alguns casos em que pessoas precisam utilizá-lo para conseguir realizar uma tarefa.

O que pode vir a restringir o acesso não é nem mesmo apenas o financeiro, pois quanto maior o avanço tecnológico, menor a “natalização” da abrangência da tecnologia. Porém, o desafio principal é justamente para com a interação. A maioria de interfaces até pouco tempo atrás requeriam um certo nível de conhecimento para que houvesse a interação. Nos dias de hoje e cada vez mais no futuro, as interfaces e interações serão tão simples a ponto de não ser necessário nenhum conhecimento prévio, habilidade ou nível de instrução para poderem ser utilizadas.

O desenvolvimento adequado das interfaces entre o ser humano e o computador é uma tarefa complexa devido ao aspecto humano das relações. Pela sua complexidade o estudo das características envolvidas em tal interação exige uma abrangência multidisciplinar, englobando conhecimentos de várias áreas ligadas aos fatores humanos, além da computação. (Carvalho, 2003, p.80)

6.4 INFORMÁTICA NA EDUCAÇÃO

Segundo Tajra (2000) utilizar a informática na educação é muito mais complicado que qualquer outro meio didático conhecido,pois é um meio diferente de todos os recursos disponíveis. É possível fazer bem mais que uma tarefa e nenhum outro recurso didático possui tanta variedade de utilização. 23

Além disso, escolas são instituições naturalmente predispostas à demora quando o assunto é inovar. Isso faz com que a transição da ideia da informática como meio didático seja gradual, porém lenta.

As experiências de produção de mídias na escola envolvem uma dinâmica própria e um equilíbrio entre interesses sociais, subjetivos e educacionais, pois nesse espaço elas significam a possibilidade de explorar as próprias identidades e as emoções de diferentes maneiras, num processo que pode ser mais bem compreendido se o entendermos como uma forma de intertextualidade em que a criatividade pode se expressar como forma de diálogo social. (Fritzen & Moreira, 2008, p.61)

Em pesquisa realizada pelo Centro de Estudo sobre as Tecnologias da Informação e da Comunicação (CETIC) em 2010, tendo como base 4.988 alunos, mostra um elevado percentual de alunos que já utilizam a informática como ferramenta de estudos.

Imagem 3 – Pesquisa CETIC

Fonte: CETIC, 2011. Dentro deste grupo maior (que faz uso da informática) há subgrupos em que a grande maioria apresenta certa dificuldade ao lidar com programas multimídia, especialmente de áudio e vídeo. Claro, há uma grande margem de alunos que já possuem o conhecimento necessário para acostumar-se a usar certos programas, porém é visível que isso acontece pela experiência do usuário, tendo em vista de que quanto menor o usuário (em idade), mais dificuldades são apresentadas.

24

Imagem 4 – Pesquisa CETIC 2

Fonte: CETIC, 2011.

Mecklenburger (1990, p.106) afirma que “A escola é uma tecnologia da educação, no mesmo sentido em que os carros são uma tecnologia do transporte. Com a escolaridade maciça, as salas de aula são invenções tecnológicas criadas com a finalidade de realizarem uma tarefa educacional. São um meio de organizar uma grande quantidade de pessoas para que possam aprender determinadas coisas”.

O ganho do computador em relação aos demais recursos tecnológicos, no âmbito educacional, está relacionado à sua característica de interatividade, à sua grande possibilidade de ser um instrumento que pode ser utilizado para facilitar a aprendizagem individualizada, visto que ele só executa o que ordenamos; portanto, limita-se aos nossos potenciais e anseios. Além disso, vários dos recursos tecnológicos citados anteriormente podem ser incorporados ao computador. (Tajra, 2000, p.49)

Apesar da importância, não existe um modelo universal para aplicação da informática na educação, variando sempre com a disponibilidade de recursos humanos, financeiros, técnicos, metodologia de instituições de ensino, bem como a credibilidade em si para com meios tecnológicos na educação.

25

O uso de informática no ensino de crianças e jovens não deixa de ser um auxílio à educação, pois desenvolve habilidades cognitivas, lógicas, comunicacionais e estimula a criatividade, o que se encaixa como um estimulante ao aprendizado. Não que o professor perca a sua importância, pois estaria deixando de ser o meio pelo qual se “adquire o saber”, mas sim assumiria um papel de organizador de ideias, facilitando no desenvolvimento individual de cada aluno.

6.5 DESIGN DE INTERAÇÃO

Segundo Preece, Rogers e Sharp (2005) o design de interação é a criação de experiências para a correta interpretação de como pessoas trabalham, se comunicam e interagem. Winograd (1997) apud Preece, Rogers e Sharp (2010, p.28) definiu o design de interação como “o projeto de espaços para comunicação e interação humana”. Ou seja, vendo por este ponto, o sentido dessa experiência é a de oferecer suporte às pessoas.

A importância de se entender como os usuários agem e reagem a situações e como se comunicam e interagem acarretou o envolvimento de pessoas de disciplinas diferentes, como psicólogos e sociólogos, em questões referentes ao design de interação. Da mesma forma, a crescente importância de se entender como projetar diferentes tipos de mídias interativas de maneira eficaz e prazerosa envolveu também uma diversidade de outros profissionais, incluindo designers gráficos, artistas, animadores, fotógrafos, especialistas em cinema e designers de produto. (Preece, Rogers e Sharp, 2010, p.28)

A principal meta, no que se refere à projetação de uma interface que atenda às pessoas, é ser claro e objetivo. Deve-se ter sempre em mente qual a finalidade do projeto, para que se possa focar em pontos relevantes. Desde quando os sistemas de interação começaram a visar os próprios utilizadores, começaram a tratar das questões de interação. O que está na cabeça de quem projetou pode não ser o mesmo de quem vai usar o sistema, e isso pode trazer complicações no uso adequado da ferramenta. Antigamente, a interação homem-software era complexa para a maioria da população, contribuindo para

26 formar o que Cybis (2007) chamou de “barreira da informática”, presente nos anos 80. Essa barreira costumava quebrar a pretendida disseminação de computadores, serviços e softwares.

Para Cybis (2007, p.14): “A dificuldade no desenvolvimento de interfaces ergonômicas se deve ao fato de elas constituírem, fundamentalmente, sistemas abertos dos quais os usuários são agentes ativos, atores de comportamento não-determinístico, cujas mudanças na maneira de pensar e de se comportar são tanto conseqüência como causa de um ambiente tecnológico sempre em evolução.

A dificuldade de interação reside justamente nessa questão antagonista: quanto mais abrangente a interação, menor será o foco para com o objetivo do sistema. Seguindo o princípio da acessibilidade, Lidwell, Holden e Butler (2003, p.14) explicam que: “Objetos e ambientes devem ser projetados para serem usados sem modificações necessárias, para a maior variedade de pessoas possível”. Porém, essa flexibilidade tem de estar em equilíbrio com o objetivo do sistema, senão acabaria por se tornar uma arma contra o próprio projetista: Se muito focado, teria um público reduzido, e se muito flexível, perderia o brilho da projetação, já que o objetivo ficaria disperso entre a interação homem- software.

6.5.1 INTERAÇÃO VOLTADA PARA O USUÁRIO

Segundo Mandel apud Agner (2006, p.153) os sistemas de interação devem possuir vasta abrangência. Para isso, os projetistas de tais sistemas devem saber de onde veio a conceituação do produto, e qual o rumo a ser tomado, ou seja, o(s) objetivo(s) proposto(s).

Precisamos atentar que no desenvolvimento de um projeto dígito-virtual devemos ter, além das técnicas de trabalho, o foco principal no usuário. Há basicamente três níveis de interação para usuários: Iniciantes (sendo os que 27 mais possuem dificuldades na interação com o sistema), intermediários (compreendem melhor o sistema, porém ainda possuem alguns obstáculo, como por exemplo algumas funcionalidades “escondidas” dentro do ambiente virtual) e avançados (não dependem mais de uma comunicação facilitada para a correta execução de tarefas).

Para Gribbons apud Agner (2006, p.154) há cinco grupos de usuários que independem do nível de interação homem-máquina.

6.5.1.1 USUÁRIO CORPORATIVO

Este usuário é o típico agente de uma empresa. Antigamente fazia uso de alguns poucos softwares disponíveis, porém esse número tem crescido com o passar dos anos. É um usuário com capacidade limitada de adaptação e cognição comprometida pelo número de modificações apresentadas de versão para versão dos programas atuais.

6.5.1.2 ANALFABETOS FUNCIONAIS

Este é talvez o grupo com mais dificuldades na interação, pois apresenta a barreira da língua. Como não pode compreender o sistema de modo visual através da leitura, este usuário se faz valer de outros tipos de reconhecimento. Porém, muitas vezes apresentam dificuldades quanto à cognição e retenção de informações.

6.5.1.3 USUÁRIOS INTERNACIONAIS

Com o avanço da tecnologia as barreiras físicas já foram, de certo modo, rompidas. A informação vaga livremente pelo mundo e, sendo assim, a venda de softwares é cada vez mais abrangente. A barreira para esse usuário é intercultural. Porém, geralmente, quem busca um sistema fora do país de

28 origem geralmente sabe os prováveis problemas que irá encontrar (e sabe como contorná-los). Esse grupo não apresenta grandes dificuldades no que se refere ao manuseio do sistema como ferramenta.

6.5.1.4 IDOSOS

Este grupo em particular apresenta dificuldades físicas: memória em declínio, perda da acuidade visual e da detecção de cores. Podem apresentar também dificuldades motoras. As capacidades cognitivas não são tão afloradas como os outros grupos, então a interação ocorre de modo lento.

6.5.1.5 CRIANÇAS E JOVENS

Este é o grupo-chave para esta monografia. Crianças e jovens têm suas capacidades cognitivas ligadas diretamente à interação homem-máquina. Não se baseiam em somente um sentido para que a interatividade com o sistema seja feita de forma satisfatória, sendo que se comunicam de forma multissensorial.

De modo que estes grupos são abrangentes quanto aos usuários, o que se tira de informação quanto a isso é que a tecnologia esta em constante evolução. E se muda, a comunicação entre ambiente virtual e usuário mudará também. Ou seja, é necessária saber, desde o princípio do projeto, para quem você projeta.

6.6 USABILIDADE

Cybis (2007) retrata a usabilidade como a qualidade característica ao uso de programas e aplicações. Sendo assim, não é uma qualidade própria de apenas um sistema, mas sim de um conjunto de características da interface e do usuário visando um objetivo.

29

Pode-se dizer que a ergonomia está na origem da usabilidade, pois ela visa proporcionar eficácia e eficiência, além do bem-estar e saúde do usuário, por meio da adaptação do trabalho ao homem. Isto significa que seu objetivo é garantir que sistemas e dispositivos estejam adaptados à maneira como o usuário pensa, comporta-se e trabalha e, assim, proporcionem usabilidade.

(Cybis, 2007, p.28)

Disso pode-se entender que as interfaces são ferramentas baseadas na cognição, agindo diretamente na percepção, raciocínio, memorização e tomada de decisões, seja ela usada como ferramenta funcional ou como entretenimento, simplesmente. Ao construir um sistema com usabilidade devemos atentar para análises dos diversos componentes do seu contexto de uso e da participação ativa do utilizador nas decisões de projeto da interface.

6.6.1 METAS DA USABILIDADE

Para Preece, Rogers e Sharp (2005, p.35): “Parte do processo de entender as necessidades do usuário, no que diz respeito a projetar um sistema interativo que as atenda, consiste em ser claro quanto ao objetivo principal”. Ou seja, para a usabilidade ter efeito em uma interface, é essencial cumprir algumas metas. Querer que o projeto seja fácil de usar, eficiente e agradável é completamente diferente de fazer com que isso ocorra. Como nos propõe Preece, Rogers e Sharp as principais metas de usabilidade, são: eficácia, eficiência, segurança, utilidade, facilidade de comunicação e facilidade de lembrar o uso do sistema.

6.6.1.1 EFICÁCIA

É uma meta bastante geral e se refere a quanto um sistema é bom em fazer o que se espera dele. Deverá ser averiguado se o sistema é capaz de se comunicar facilmente com os usuários, e se eles conseguem realizar tarefas de forma eficiente, acessando informações que buscam sem a necessidade de auxílio. 30

6.6.1.2 EFICIÊNCIA

É o modo como o próprio sistema ajuda o utilizador a realizar as tarefas às quais se propõe. Um bom exemplo são os sistemas de cadastramento de alguns web-sites, que armazenam informações para, na próxima vez que for usado, acesse os dados diretamente do cadastro pré-estabelecido. O que se deve levar em conta é se o usuário manterá o próprio nível de interação após se acostumar com o uso do sistema.

6.6.1.3 SEGURANÇA

Tem relação direta com a proteção ao usuário, como evitar situações indesejadas. No sentido da interação, é parecido com a Heurística da Prevenção de Erros. Diz respeito a auxiliar qualquer tipo de usuário, em qualquer tipo de situação a evitar realizar ações indesejadas acidentalmente. Também tem relação com o receio para com as conseqüências de seus erros e de como isso afeta o seu comportamento. É necessário averiguar se o sistema previne os utilizadores de cometer erros graves. E, no caso de permitir, que esses erros possam ser recuperados sem muita dificuldade.

6.6.1.4 UTILIDADE

Refere-se a quanto o sistema possibilita os usuários a realizar as tarefas que desejam, ou seja, o nível de funcionalidade. O sistema deve fornecer as ferramentas necessárias ao utilizador, para que estes possam realizar suas tarefas da maneira que desejam.

6.6.1.5 CAPACIDADE DE APRENDIZAGEM

A capacidade de aprendizagem trata do nível de facilidade com que se aprende a usar o sistema. As pessoas não gostam de despender muito tempo

31 aprendendo a fazer. Preferem usar uma vez e já estarem aptos a realizar uma tarefa com freqüência. Varia de pessoa para pessoa o nível de tédio perante a necessidade de aprender a correta utilização de um sistema, e muitas vezes, por uma grande parcela de pessoas, o “aprender” pode ser taxado de complexo. O que vale para esta meta de usabilidade é a determinação de quanto tempo o usuário estará disposto a gastar para conhecer o sistema. Não haveria sentido em desenvolver diversas funcionalidades se o usuário não se sentir à vontade para procurar entendê-las e executá-las.

6.6.1.6 CAPACIDADE DE MEMORIZAÇÃO

No que se diz respeito à usabilidade de um sistema, a capacidade de memorização nada mais é que a facilidade de lembrar como se utiliza esse sistema, depois de já haver aprendido como fazê-lo. É especialmente importante para ferramentas que não são utilizadas com muita freqüência. Deve-se ter em mente que se uma operação não for usada por alguns dias, precisa ser fácil de lembrar rapidamente o uso. O projetista deve se perguntar quais os suportes de interface são fornecidos de modo a auxiliar o usuário a lembrar o modo de uso, especialmente com ferramentas e tarefas que não são utilizadas regularmente.

6.6.2 HEURÍSTICAS DE USABILIDADE

As Heurísticas de Nielsen (1994) são um conjunto de medidas a serem tomadas visando uma solução. Elas avaliam o resultado para assumir uma solução (a mais próxima do ideal) possível. No segmento de criação, tudo é subjetivo, de modo que não há o que se pode chamar de perfeição, melhor ou pior. Porém as Heurísticas ajudam as soluções a se tornarem adequadas ao meio ao qual se propõem.

No caso deste projeto, as Heurísticas, utilizadas no desenvolvimento de ambiente virtual, possuem regras ligadas diretamente à usabilidade e 32 funcionalidade para com o tratamento ao usuário. Esse conjunto de regras são conhecidas como “Os Dez Mandamentos de Nielsen”, em alusão aos mandamentos bíblicos.

6.6.2.1 HEURÍSTICA DA REALIMENTAÇÃO

Também conhecida como “Feedback”. Essa Heurística prevê que o usuário deve estar sempre informado sobre o que está acontecendo na interface. Isso significa que a interface deve estar sempre “realimentando” o usuário com informação sobre o que está acontecendo, ou seja, todas as ações tomadas necessitam de “realimentação” instantânea para que o usuário não fique desorientado. O tempo limite para a perda de foco do visualizador é de dez segundos.

6.6.2.2 HEURÍSTICA DA ABRANGÊNCIA

Também conhecida como “Falar a Linguagem do Usuário”. O sistema deve falar a língua do público ao qual se destina, de forma simples e direta. Se linguagem complexa for utilizada, além dos limites pessoais de um usuário, o mesmo perde interesse automaticamente. A terminologia deve ser baseada na linguagem de quem vai usar, e nunca orientada ao sistema.

6.6.2.3 HEURÍSTICA DO CONTROLE

Também conhecida como “Saídas Claramente Demarcadas”. O usuário deve ter total controle sobre o sistema em utilização, podendo “ir e vir” à sua vontade. Importante salientar, também, que o sistema em uso só deve executar tarefas que o próprio usuário vier a solicitar. O usuário deve ser capaz de, a qualquer momento, abortar uma tarefa, desfazer uma operação e retornar ao estado anterior.

33

6.6.2.4 HEURÍSTICA DA COERÊNCIA

Também conhecida como “Consistência”. O sistema tem de possuir um padrão de fácil compreensão para o usuário. Em tempo, esse padrão deve formar uma unidade em todo o sistema, e não somente em partes específicas. Além disso, comandos devem ter sempre o mesmo efeito, e ferramentas devem ser sempre apresentadas no mesmo local, da mesma maneira anterior, para auxiliar no reconhecimento.

6.6.2.5 HEURÍSTICA DA PREVENÇÃO

Também conhecida como “Prevenir Erros”. Os possíveis erros que o usuário possa encontrar devem ser previstos, quaisquer que sejam. Se uma parte do sistema em projetação é mais propensa a erros, é interessante que seja modificada até que os erros cessem e não mais ocorram/sejam encontrados. É interessante, também, que o projetista conheça os principais erros e distrações em interfaces com o mesmo propósito, para assim, minimizar ainda mais os erros.

6.6.2.6 HEURÍSTICA DO RECONHECIMENTO

Também conhecida como “Minimizar a Sobrecarga de Memória do Usuário”. Esta Heurística prevê que, quanto mais intuitivo for o sistema em desenvolvimento, menos o usuário precisará se esforçar a fim de lembrar de uma informação. Ou seja, sistema deve sempre mostrar elementos de diálogos e permitir que o usuário faça suas escolhas. O usuário que visualize e reconheça uma funcionalidade no mesmo momento está ganhando em tempo, paciência e minimizando o esforço mental, propriamente dito.

34

6.6.2.7 HEURÍSTICA DA FLEXIBILIDADE

Também conhecida como “Atalhos”. O sistema deve levar em consideração que nem todos os usuários são iniciantes. Partindo deste princípio, o sistema em questão deve ser intuitivo aos iniciantes e flexível aos mais experientes, proporcionando-lhes abreviações, atalhos de teclado, sequências de cliques de mouse, atalhos de navegação pela interface, entre outros. Tudo para deixar o sistema mais dinâmico para os usuários que sabem “onde pisam”.

6.6.2.8 HEURÍSTICA DO MINIMALISMO

Também conhecida como “Diálogos Simples e Naturais”. Ludwig Mies Van Der Rohe tem uma célebre frase: “Menos é mais”. Essa Heurística tem forte ligação com esse pensamento. Quanto mais limpo for o sistema, melhor. Ou seja, quanto menor o número de informação desnecessária houver menos o usuário perderá o foco. Deve-se apresentar a informação que o usuário precisa. Ponto. Nada a mais.

6.6.2.9 HEURÍSTICA DOS ERROS

Também conhecida como “Boas Mensagens de Erro”. Esta Heurística tem relação com a Heurística Minimalista. Quanto mais informação adicional houver em uma mensagem de erro, mais o usuário precisará raciocinar para saber o que está acontecendo, e isso pode acarretar em uma dispersão. O sistema deve possuir mensagens de erro, porque por mais que se previna elas irão acontecer, porém todas elas devem ser claras e objetivas. A função delas é a de ajudar o usuário a compreender e solucionar os possíveis erros quando estes surgirem. A linguagem utilizada não deve possuir códigos, nem muito menos culpar ou intimidar o usuário. Quando isso acontece, geralmente o usuário se sente incomodado e aflito por ter causado o erro, podendo não se sentir mais à vontade quando transitar pela interface. 35

6.6.2.10 HEURÍSTICA DA AJUDA

Também conhecida como “Ajuda e Documentação”. Para que o sistema seja dinâmico, o ideal é que não seja necessária nenhum tipo de ajuda. Quanto mais intuitivo (de modo a guiar o usuário pela interface), melhor. Porém, nem sempre é possível desenvolver um ambiente 100% à prova de necessidade de ajuda, portanto, neste caso, ela deve ser simples, de fácil acesso por outros meio, como por exemplo a internet.

6.6.3 USABILIDADE PARA CRIANÇAS E JOVENS

Ao projetar uma interface, tendo um público como crianças e jovens, deve ser levado em conta que há diversas peculiaridades entre o “pequeno” e o “grande” usuário. Crianças necessitam de um elemento motivador para fixar atenção de forma satisfatória, e para elas, nada melhor que a diversão. A questão se dá justamente em como irá ocorrer a comunicação entre a criança e o software. A grande pergunta de um desenvolvedor é: como criar uma conexão com o indivíduo e como manter essa conexão. De acordo com MacFarlane, Sim e Horton (2005) a usabilidade é o divisor de águas. Dentro de um ambiente virtual, que tenha como objetivo apresentar uma ferramenta ou até mesmo puramente educacional, é a usabilidade e o nível da complexidade de acessar informações e funcionalidades que despertará a vontade de explorar no usuário. Se com o uso do programa o usuário adquirir proficiência, tornar-se-á usual e intuitiva. Porém, ao passo que a experiência de usuário progredir de modo lento, a comunicação para com o software pode sofrer impacto na retenção de informação.

Sendo assim, para fixar a atenção de uma criança e/ou jovem se faz necessário buscar o desafio para a recompensa da descoberta, da busca pelo resultado. Porém, essa diversão deve ser polida o bastante para que algo 36 inicialmente educacional ou funcional não se transforme em puro entretenimento ou estética. Principalmente quando tratamos das novas mídias digitais que surgem de mês em mês. É necessário orientar o projeto no desenvolvimento cognitivo infantil, juntamente com a faixa etária visada, criando soluções a partir da comunicação e do comportamento do utilizador.

6.7 COGNIÇÃO

De acordo com o dicionário, cognição seria a função da inteligência humana dedicada a adquirir conhecimento. Essa função depende de vários fatores em uma pessoa, e envolve percepção, raciocínio, pensamento lógico, linguagem, expressão, entre outros.

6.7.1 COGNIÇÃO EM CRIANÇAS E JOVENS

Para Satler (2001) apud Hutz (2010, p.31) os aspectos da avaliação cognitiva de crianças e jovens “é um processo que deve considerar não só as características e o potencial do indivíduo, como também o contexto familiar e sociocultural no qual está inserido”. Crianças, por não possuírem as barreiras cognitivas criadas por adultos, possuem um modo particular de ver o mundo à sua volta. Elas não tem medo de aprender ou adquirir conhecimento, o que é incrivelmente comum na sociedade (adulta) atual. Elas têm um comportamento de aquisição de informação particular, que evolui conforme a criança vai crescendo. Piaget (1980) define o processo do desenvolvimento da cognição infantil em alguns grupos de acordo com a idade do indivíduo.

6.7.1.1 SENSÓRIO MOTOR

Por volta do nascimento até os dois anos de idade, a capacidade cognitiva da criança baseia-se na experiência através dos sentidos. Ou seja, ela adquire informação através da estimulação sensorial. Um exemplo: Não é 37 muito difícil ver bebês mordendo e agarrando coisas. É dessa forma que eles percebem o mundo, fazendo uso do tato, paladar, visão, audição e olfato. Serão as experiências baseadas com esses sentidos que a criança irá determinar a sua passagem ao próximo estágio.

6.7.1.2 PRÉ OPERATÓRIO

Esta fase acontece entre os dois anos de idade aos sete anos, ou quando o indivíduo dá o “salto” da fase sensório motor. O que acontece nesta fase é uma evolução na interação da criança com o mundo. Se antes ela só “adquiria” informação, limitada pelos receptores sensoriais, agora ela pode interagir com esses “disparadores de estímulos”. A retenção de informação da criança tem a capacidade aumentada consideravelmente, fazendo com que consiga armazenar imagens, sons e vocabulário em ritmo tão acelerado que se competisse com um indivíduo mais velho a ver “quem aprende mais rápido” (proporcional ao nível de cognição por idade), a criança certamente deixaria o adulto para trás. E ela ainda possui uma vantagem: como nesta fase o aprendizado é feito de forma intuitiva, mesmo que não realize a tarefa com precisão, ela estará gostando de aprender. Outro ponto a ser ressaltado é que a partir dessa idade a criança já pode evocar objetos, pessoas e situações sem que estejam presentes/simultâneos.

6.7.1.3 OPERAÇÕES CONCRETAS

Dos sete aos onze anos há uma reestruturação na forma de entender para a criança. Ela começa a passar, aos poucos, da fantasia para a realidade, conseguindo resolver operações concretas. A interação com o mundo exterior passa de intuitivo-sensorial para lógica.

6.7.1.4 OPERAÇÕES FORMAIS

Esta etapa, que acontece dos 11 aos 16 anos, tem como ponto chave a 38 consolidação da cognição. A criança passa a raciocinar meta-cognitivamente, ou seja, pensar sobre o próprio pensamento. Esta fase proporciona à cognição um outro nível, já que agora o indivíduo pode formular hipóteses e testá-las mentalmente. Esta também é uma etapa que abre as portas para o caminho do pensamento sobre perspectivas diferentes, também conhecido como pensamento perspectivista.

Piaget (1980, p.103) ainda diz: “... a afetividade constitui a energética das condutas, cujo aspecto cognitivo se refere apenas às estruturas. Não existe, portanto, nenhuma conduta, por mais intelectual que seja, que não comporte, na qualidade de móveis, fatores afetivos, mas reciprocamente, não poderia haver estados afetivos sem a intervenção de percepções ou compreensão, que constituem a estrutura cognitiva. A conduta é, portanto, uma, mesmo que, reciprocamente, esta não tome aquelas em consideração: os dois aspectos afetivo e cognitivo são, ao mesmo tempo, inseparáveis e irredutíveis.”

Disso pode-se entender que Piaget, embora considerasse que o desenvolvimento intelectual envolvesse ambos aspectos cognitivos e afetivos, o principal agente motivador era a afetividade, pois sempre trabalhamos mentalmente através de relações para com o objetivo visado.

39

7 PROJETO

7.1 ESTRATÉGIA

A interface de um software de computador é o que norteia o usuário do programa. Muito mais do que o conteúdo, a correta distribuição, hierarquia e localização de funcionalidades em um ambiente virtual é que vai definir uma interface como amigável ou não. A estratégia trata de todo o processo de reconhecimento sobre o tema proposto, onde o projetista realiza pesquisas, análises e comparações sobre o projeto.

7.1.1 DEFINIÇÕES E DELIMITAÇÃO DO TEMA

7.1.1.1 O QUE DESENVOLVER?

Redesenho de interface para software de edição audiovisual, visando uma interface visual mais intuitiva e aceitável para o público alvo, seguindo o conceito de Interface Gráfica Amigável.

7.1.1.2 POR QUE PROJETAR?

Para facilitar a utilização e interação do público alvo, minimizando possíveis desconfortos gerados em uma interação que visa, na maioria dos casos, usuários mais experientes, facilitando o acesso às funcionalidades do sistema.

7.1.1.3 COMO DESENHAR?

Por se tratar de um projeto dígito-virtual, será utilizada a metodologia projetual “Projeto E”, de Meurer & Szabluk (2009), juntamente com estudos a serem realizados com softwares semelhantes já existentes. 40

7.1.1.4 PARA QUEM?

Este projeto é focado em crianças e pré-adolescentes, com idade variante de cinco a treze anos de idade. Esse público geralmente possui pouco ou nenhum contato anterior com o tipo de software proposto, porém possui grande facilidade em absorver conhecimento, não tendo problemas em assimilar o uso correto de um software de baixa ou média complexidade. Será necessário que o projeto utilize uma forma de se comunicar voltada para estes usuários primários.

7.1.1.5 COM QUE TECNOLOGIA?

A ser desenvolvido utilizando linguagem C++.

7.1.1.6 PARA QUE MERCADO?

Voltado para o mercado brasileiro, porém, se bem sucedido, há a possibilidade de expansão a outros países.

7.1.2 IDENTIFICAÇÃO DE CENÁRIOS

O cenário atual é povoado de softwares extremamente direcionados, sendo que sua maioria apresenta funcionalidades e recursos voltadas para um objetivo somente. Um bom exemplo é o de editores como o YouTube Movie Maker, que apresenta edição de vídeo voltada para a execução de vídeos no sítio virtual de compartilhamento de vídeos YouTube. Um antagonismo observado é que, quanto maior o número de funcionalidades presentes em um software de edição de vídeos, mais complexo ele se apresenta, ao passo que quanto mais simples (e, consequentemente, sem muitas variações de ferramentas) mais intuitivo ele é.

41

Imagem 5 – Cenário Atual e Cenário Pretendido

Fonte: Autor, 2011.

7.1.3 SIBD E SFBR

Para a correta adequação do projeto ao tema proposto, é necessário saber, desde sua concepção, de onde veio (Situação Inicial Bem Definida), ou seja, a origem do projeto, e para onde vai (Situação Final Bem Resolvida), o norteador principal do trabalho.

Imagem 6 – Cenário Atual e Cenário Pretendido

Fonte: Autor, 2011.

42

7.1.4 EQUALIZAÇÃO DE FATORES PROJETUAIS

Reequacionamento de fatores projetuais, do ponto de vista do projetista:

Imagem 7 – Equacionamento de Fatores Projetuais

Fonte: Autor, 2011.

Os principais fatores relacionados a este projeto são: Antropológico, ergonômico e psicológico.

Antropológico: Este fator está ligado diretamente à questão de comportamento dos usuários e como se relacionam com o sistema virtual. Ergonômico: A ergonomia neste caso está relacionada à exploração visual feita pelo utilizador do software. Os elementos que compõem a interface devem estar em rigorosa hierarquia para atingir o conceito de Interface Gráfica Amigável, não propiciando qualquer desconforto ou perturbação ao usuário. Psicológico: O fator psicológico age, principalmente, na comunicação entre o usuário e a interface (interação). Tem relação direta ao entendimento e na forma em que a cognição entra em ação.

43

7.1.5 TAXONOMIA

Taxonomia do projeto baseada na sistematização biológica. Essa classificação tem como fim delimitar as características maiores do redesenho de sistema proposto, como finalidade de gerar um foco preciso e sinalizar seus limites como projeto dígito-virtual.

Imagem 8 – Taxonomia

Fonte: Autor, 2011.

7.1.6 ANÁLISES

As análises formam uma importante etapa de pesquisa e avaliações referentes ao projeto em desenvolvimento e, principalmente, a projetos similares. Essas análises são divididas em análises lingüísticas, análises contextuais, análises desenhísticas e análises heurísticas.

44

7.1.6.1 ANÁLISES LINGUÍSTICAS

7.1.6.1.1 ANÁLISES DENOTATIVAS

As análises denotativas implicam no significado literal de termos relacionados ao projeto. Todas as definições apresentadas a seguir foram retiradas do dicionário virtual Priberam Online. São elas:

Audiovisual: 1. Que diz respeito simultaneamente ao ouvido e à vista; 2. Diz-se do que pertence ao método ativo de ensino fundamentado na sensibilidade visual da criança e que utiliza a apresentação de imagens, filmes e de gravações.

Cinema: 1. Arte de compor e realizar filmes destinados a serem projeções cinematográficas; 2. Estabelecimento ou sala de projeções cinematográficas; 3. Fingimento, simulação.

Ecrã: 1. Superfície, geralmente branca, na qual se projetam vistas fixas ou animadas; 2. Tela de visualização ou apresentação; 3. Superfície fluorescente sobre a qual se forma a imagem nos tubos catódicos; 4. Filtro destinado a alterar a luz.

Edição: 1. Ato de editar; 2. Conjunto dos exemplares que de uma vez se fazem da mesma obra; 3. Publicação literária; 4. Atividade do editor; 5. Cada uma das realizações de um evento ou programa.

Filme: 1. Película revestida com uma emulsão sensível à luz, e na qual se registram as imagens em fotografia e em cinematografia; 2. Documento, obra cinematográfica; 3. Desenrolamento contínuo de ações.

45

Interação: 1. Influência recíproca de dois ou mais elementos; 2. Fenômeno que permite a certo número de indivíduos constituir-se em grupo, e que consiste no fato de que o comportamento de cada indivíduo se torna estímulo para o outro; 3. Ação recíproca que ocorre entre duas partículas.

Projeção: 1. Ato de imprimir movimento a um corpo; 2. Raios projetados por um foco; 3. Imagem que se reflete numa superfície; 4. Figura que se obtém pela incidência de perpendiculares tiradas de todas as extremidades das linhas de uma figura; 5. Ação de ir lançando a pouco e pouco num cadinho a substância que se pretende calcinar; 6. Representação de uma parte da Terra ou do céu sobre um plano.

7.1.6.1.2 ANÁLISES CONOTATIVAS

As análises conotativas buscam o significado não-literal de um termo. Na maioria das veze apresenta o significado real perante uma situação em que o significado literal (denotativo) não é suficiente como explicação.

Decupagem: É o planejamento da filmagem que divide uma cena em planos e a previsão de como estes planos vão se ligar uns aos outros através de cortes.

Direção: No caso do tema do projeto a direção (de filmagem) nada mais é que a supervisão e execução de captura de um vídeo. Serve para organizar as seções do filme e também direcionar aspectos técnicos como sonoplastia, enquadramento e iluminação.

(Edição) Linear: Sistema de edição que só permite cortes lineares (cena-a-cena). Isto requer organização e planejamento. Toda a edição deve passar por uma análise técnica para poder ser executada, de modo que cada parte fique no lugar estabelecido.

46

(Edição) Não-Linear: Sistema virtual de edição que emula arquivos audiovisuais e permite cortes e edições a qualquer momento, sem precisar seguir etapas pré-definidas.

Linha de Tempo: Mais conhecida pela tradução para o inglês (timeline) a linha do tempo é a divisão do vídeo por frames e do áudio por tempos.

Storyboard: É um organizador gráfico tal como um roteiro, ou seja, é uma série de ilustrações ou imagens arranjadas em sequência com o propósito de pré-visualizar um filme, animação ou gráfico animado, incluindo elementos interativos em websites.

Montagem: É o processo que consiste em selecionar, ordenar e adaptar todas as partes de um filme ou outro produto audiovisual. É a sincronização de sonoplastia, roteiro, vídeo e todos os outros processos de composição do filme/vídeo.

Roteiro: Trata-se da narrativa de um filme, sendo ela gráfico-visual puramente escrita ou uma mescla de ambos.

Sonoplastia: Também conhecido como efeitos sonoros. Trata de toda a qualidade de áudio durante sons artificialmente produzidos para gerar maior realismo durante a execução do vídeo.

Sonorização: É o reforço e edição de som para que o áudio de um vídeo possa ser claro e de fácil percepção perante o público.

Take: Um take é uma versão filmada para uma cena. São filmados sucessivamente até a filmagem de a cena estar completa. A partir do término da captura, é trabalho do diretor de filmagem decidir qual o take mais apropriado para a sequência do filme em questão.

47

7.1.6.1.3 ANÁLISE DIACRÔNICA

A análise diacrônica trata da evolução de aspectos ligados ao projeto em desenvolvimento. Neste caso, como o foco do trabalho é cognição, interação e processos relacionados aos filmes, o objeto de análise de diacronia é o da relação ser humano X projeção de imagens.

Pinturas rupestres (40.000 a.C.): São as mais antigas representações artísticas conhecidas. Iniciadas no período Paleolítico Superior, as pinturas eram gravadas em abrigos ou cavernas, em suas paredes e tetos rochosos.

Imagem 9 – Pinturas Rupestres

Fonte: http://retracosdahistoria.blogspot.com/2011/03/pinturas-rupestres.html, 2011.

Mo-Tzu (Séc. V a.C.): O primeiro registro do fenômeno da ‘‘projeção de imagens’’ foi do filósofo chinês Mo-Tzu em 500 a.C. Ele descreve a criação de uma imagem invertida formada por raios de luz que atravessam um orifício em um quarto escuro. Ele chama este quarto como “quarto do tesouro preso”.

Imagem 10 – Mo Tzu

Fonte: http://www.fisica-interessante.com/aula-historia-e-epistemologia-da-ciencia-5-historia-da- epistemologia-1.html, 2011. 48

Aristóteles (Séc. III a.C.): O princípio da câmara escura já era entendida na Grécia antiga pelo filósofo Aristóteles (384-322 a.C) que constatou o fenômeno observando as formas de um eclipse solar parcial projetadas no chão por causa de buracos nas folhas de uma árvore.

Imagem 11 – Aristóteles

Fonte: http://www.consciencia.org/aristoteles.shtml, 2011. Teatro de Sombras (Séc. II a.C. – Séc. II d.C.): O Teatro de Sombras como é conhecido, começou na China, por volta da Dinastia Han, apesar de a projeção de sombras ter seu início em um período anterior. O teatro nada mais é que a projeção, sobre paredes ou telas de linho, de figuras humanas, animais ou objetos recortados e manipulados. O operador narra a ação, quase sempre envolvendo príncipes, guerreiros e dragões.

Imagem 12 – Teatro de Sombras

Fonte: http://www.articularte.com.br/Filho_da_Burra/Valente_index.htm, 2011.

Leonardo Da Vinci (Séc. XV d.C.): Em 1521, Cesare Cesariano, discípulo de Leonardo da Vinci, descreve a Câmara Escura em uma anotação e 49 em 1545, surge a primeira ilustração da Câmara Escura, na obra de Reiner Gemma Frisius, físico e matemático holandês.

Imagem 13 – Câmara Escura de Da Vinci

Fonte: http://www.cotianet.com.br/photo/hist/camesc.htm, 2011.

Lanterna Mágica (Séc. XVII d.C.): No século seguinte à descrição de Da Vinci, o físico napolitano Giambattista Della Porta desenvolveu o projeto, que projeta uma caixa fechada, com um pequeno orifício coberto por uma lente. Através dele penetram e se cruzam os raios refletidos pelos objetos exteriores. A imagem, invertida, inscreve-se na face do fundo, no interior da caixa. Após isso, no século seguinte, o alemão Athanasius Kirchner, baseia-se no processo inverso da câmara escura. É composta por uma caixa cilíndrica iluminada a vela, que projeta as imagens desenhadas em uma lâmina de vidro. Nasce o que seria a mãe de todas as câmeras fotográficas e projetores atuais: A lanterna mágica.

Imagem 14 – Lanterna Mágica

Fonte: http://kinodinamico.com/tag/lanterna-magica/, 2011.

50

Adição de Movimento (Séc. XIX d.C.): Para captar e reproduzir a imagem do movimento são construídos vários aparelhos baseados no fenômeno da persistência retiniana (fração de segundo em que a imagem permanece na retina), descoberto pelo inglês Peter Mark Roger, em 1826. A fotografia, desenvolvida simultaneamente por Louis-Jacques Daguerre e Joseph Nicéphore Niepce, e as pesquisas de captação e análise do movimento representam um avanço decisivo na direção do cinematógrafo.

Fenacistoscópio (Séc. XIX d.C.): Em 1832, o físico belga Joseph- Antoine Plateau inventa um aparelho formado por um disco com várias figuras desenhadas em posições diferentes. Ao girar o disco, elas adquirem movimento. A idéia era apresentar uma rápida sucessão de desenhos de diferentes estágios de uma ação, criando a ilusão de que um único desenho se movimentava.

Imagem 15 – Fenacistoscópio

Fonte: http://interagindocomasartes.blogspot.com/2008/06/cinema-2-bimestre-1-anos- do-ensino-mdio.html, 2011.

Praxinoscópio (Séc. XIX d.C.): Aparelho que projeta na tela imagens desenhadas sobre fitas transparentes, inventado pelo francês Émile Reynaud. A princípio uma máquina primitiva, composta por uma caixa de biscoitos e um único espelho, o praxinoscópio é aperfeiçoado com um sistema complexo de espelhos que permite efeitos de relevo. A multiplicação das figuras desenhadas e a adaptação de uma lanterna de projeção possibilitam a realização de truques que dão a ilusão de movimento.

51

Imagem 16 – Praxinoscópio

Fonte: http://intro-design.blogspot.com/2007/11/sexta-feira-maio-04-2007-vamos-fazer- um.html, 2011.

Fuzil Fotográfico (Séc. XIX d.C.): Étienne-Jules Marey desenvolve, em 1878, o fuzil fotográfico: um tambor forrado por dentro com uma chapa fotográfica circular.

Imagem 17 – Fuzil Fotográfico

Fonte: http://www.mnemocine.com.br/cinema/historiatextos/marey/Marey.htm, 2011.

Cronofotografia (Séc. XIX d.C.): Pesquisas posteriores sobre o andar do homem ou o vôo dos pássaros levam Étienne-Jules Marey, em 1887, ao desenvolvimento da cronofotografia: fixação fotográfica de várias fases de um corpo em movimento, que é a própria base do cinema.

52

Imagem 18 – Cronofotografia

Fonte: http://proferutecontabilidade2009.pbworks.com/w/page/18778276/primeiros%20aparelhos, 2011.

Cinetoscópio (Séc. XIX d.C.): O norte-americano Thomas Alva Edison inventa o filme perfurado. E, em 1890, roda uma série de pequenos filmes em seu estúdio, o Black Maria, primeiro da história do cinema. Esses filmes não são projetados em uma tela, mas no interior de uma máquina, o cinetoscópio – também inventado por Edison um ano depois. Mas as imagens só podem ser vistas por um espectador de cada vez.

Imagem 19 – Cinetoscópio

Fonte: http://thomaslumiere.blogspot.com/2011/06/bem-vindos.html, 2011.

Cinematógrafo (Séc. XIX d.C.): A partir do aperfeiçoamento do cinetoscópio, os irmãos Auguste e Louis Lumière idealizam o cinematógrafo em 1895. O aparelho é movido a manivela e utiliza negativos perfurados,

53 substituindo a ação de várias máquinas fotográficas para registrar o movimento. O cinematógrafo torna possível, também, a projeção das imagens para o público.

Imagem 20 – Cinematógrafo

Fonte: http://atilareal.wordpress.com/2008/11/03/seteartes/, 2011.

Hollywood (Séc. XX d.C.): A década de 20 consolida a indústria cinematográfica americana e os grandes gêneros – western, policial, musical e, principalmente, a comédia –, todos ligados diretamente ao estrelismo. Áudio (Séc. XX d.C.): Em 1926 a Warner Brothers produz o primeiro filme com música e efeitos sonoros sincronizados: Don Juan, de Alan Crosland.

Imagem 21 – Don Juan de Alan Crosland, 1926

Fonte: http://www.cine-clasico.com/foros/viewtopic.php?t=1862, 2011.

54

Cores (Séc. XX d.C.): Em 1932 houve o lançamento do primeiro filme comercial produzido com o processo de “tri-colorização” da história: Flowers and Trees, desenho animado de Walt Disney.

Imagem 22 – Flowers and Trees de Walt Disney, 1932

Fonte: http://todayindisneyhistory.blogspot.com/2010/07/july-30-silly-symphonies-go- color.html, 2011.

Computação Gráfica (Séc. XX d.C.): Em meados da década de 70 houve um expressivo aumento no uso da computação gráfica em filmes. Um dos mais conhecidos dentre os que começaram a usar esse artifício foi Star Wars de George Lucas, produzido em 1977.

Imagem 23 – Star Wars

Fonte: http://nosgeeks.com.br/atencao-fas-de-star-wars-mega-colecao-em-blu-ray- apresenta-material-inedito-starwarsday/, 2011.

55

CGI (Séc. XX d.C.): Na década de 80 houve também uma explosão do uso de CGI nas produções hollywoodianas. O final da década de 80 trouxe o início da mixagem de imagens digitais com diversos meios audiovisuais.

Imagem 24 – Videoclip da música “Money for Nothing” de Dire Straits

Fonte: http://imagesofheaven.blogspot.com/2010/07/happy-25th-anniversary-money- for.html, 2011.

Cinema 3D (Séc. XX d.C.): Na atualidade as projeções estão cada vez mais realistas e, no caso do cinema 3D, literalmente pulando para fora da tela. Dois projetores enviam imagens polarizadas que, com a ajuda de óculos especiais, criam a ilusão de ótica de tridimensionalidade.

Imagem 25 – Filme 3D sem o efeito dos óculos 3D

Fonte: http://technocean.com.br/2011/10/03/oculos-3d-da-oakley-do-filme-transformers- a-venda-no-brasil/, 2011.

56

7.1.6.2 ANÁLISES CONTEXTUAIS

As análises contextuais buscam referências no cenário atual do foco do projeto. Neste caso, softwares editores de vídeo. A seguir, algumas análises seguidas de pontos fortes e fracos dos softwares analisados.

Windows Movie Maker 1

Imagem 26 –

Fonte: http://windows-movie-maker.softonic.com.br/, 2011.

Pontos fortes: Boa variedade de ferramentas, gratuito, pouca perda de qualidade em transferências de arquivos.

Pontos fracos: Muitas funcionalidades não acessíveis, trava bastante, não salva em algumas situações.

57

Kdenlive

Imagem 27 –

Fonte: http://www.marcocimmino.net/tag/kdenlive/, 2011.

Pontos fortes: Boa variedade de ferramentas, gratuito, trabalha com vários formatos.

Pontos fracos: Não muito intuitivo, não inclui gravação de sons.

58

Sony Vegas 9

Imagem 28 – Sony Vegas

Fonte: http://www.sequelanet.com.br/2010/07/download-sony-vegas-pro-9-keygen.html, 2011.

Pontos fortes: Boa variedade de ferramentas, trabalha em HD e Audio Dolby Digital, edita em rede.

Pontos fracos: Complexo para iniciantes, não disponível em português.

59

Adobe Premiere

Imagem 29 –

Fonte: http://filmmakingcentral.com/fmc2/2008/12/fmc-review-%E2%80%93-adobe-premiere- pro-cs4-is-ready-for-primetime/, 2011.

Pontos fortes: Boa variedade de ferramentas, compatibilidade com vários formatos, compatibilidade com outros softwares.

Pontos fracos: Requer hardware potente, pouco intuitivo, para Windows só funciona bem em sistemas 64 bits.

60

Corel VideoStudio Pro

Imagem 30 – Corel VideoStudio Pro

Fonte: http://tom2network.com/review-corel-videostudio-pro-x4-well-designed-versatile- interface/, 2011. Pontos fortes: Interface gráfica amigável, funcionalidades bem organizadas, leve (se levado em conta o quê oferece).

Pontos fracos: Trava bastante, não disponível em português.

61

YouTube Movie Maker

Imagem 31 – YouTube Movie Maker

Fonte: http http://soprogramaslegal.blogspot.com/2010/10/youtube-movie-maker-220- programa.html, 2011.

Pontos fortes: Gratuito, boa variedade de efeitos, leve, envia arquivos automaticamente para o YouTube, suporta vários formatos, alguns recursos não estão presentes.

Pontos fracos: Só edita vídeo de no máximo 5 minutos, só comporta resoluções menores que 480p.

62

VideoPad Video Editor

Imagem 32 – VideoPad Video Editor

Fonte: http://birungueta.blogspot.com/2011/06/portable-videopad-video-editor.html, 2011.

Pontos fortes: Intuitivo, simples, suporta diversos formatos, gratuito.

Pontos fracos: Poucas funcionalidades, não disponível em português.

63

Ulead Video Studio

Imagem 33 – Ulead Video Studio

.

Fonte: http://fileforum.betanews.com/detail/Ulead-VideoStudio-Plus/1145516734/1, 2011.

Pontos fortes: Interface intuitiva, suporta gráficos 3D, grande variedade de efeitos.

Pontos fracos: Utiliza muita memória RAM, apresenta perda de qualidade, utiliza “frame rates” muito altos (gerando vídeos muito pesados).

64

Video Spin

Imagem 34 – Video Spin

Fonte: http://videospin.dlma.com/, 2011.

Pontos fortes: Gratuito, interface limpa, disponível em português.

Pontos fracos: Codecs só funcionam por 15 dias, gera vídeos muito pesados, utiliza muita memória RAM, não suporta alguns formatos.

65

VideoLAN Movie Creator

Imagem 35 – VideoLAN Movie Creator

Fonte: http://www.baixaki.com.br/download/videolan-movie-creator.htm, 2011.

Pontos fortes: Interface organizada, compatível com diversos formatos.

Pontos fracos: Instável, trava bastante, por vezes não renderiza corretamente, utiliza muita memória RAM, não suporta resoluções muito altas.

66

Muvee AutoProducer

Imagem 36 – Muvee AutoProducer

Fonte: http://ru.brothersoft.com/screenshot-126064.html, 2011.

Pontos fortes: Interface intuitiva, simples de usar, disponível em português, disponibiliza tutorial para iniciantes.

Pontos fracos: Versão gratuita somente por 15 dias, não oferece total liberdade de edição, não suporta alguns formatos.

67

JayCut

Imagem 37 – JayCut

Fonte: http://gearburn.com/2011/07/blackberry-goes-shopping-for-video-skillz/, 2011.

Pontos fortes: Interface intuitiva, simples de usar.

Pontos fracos: Software para iniciantes, sem variedade de ferramentas.

68

Adobe Final Cut

Imagem 38 – Adobe Final Cut

Fonte: http://rafacosta.wordpress.com/2011/04/13/novo-final-cut-x/, 2011.

Pontos fortes: Grande variedade de ferramentas, liberdade quase total de edição, efeitos profissionais, vasta biblioteca de objetos disponível.

Pontos fracos: Não abre arquivos de versões antigas, pouco intuitivo para iniciantes, mídia de fita só pode ser capturada através de Fire Wire.

69

Free Fast Mpeg Cut

Imagem 39 – Free Fast Mpeg Cut

Fonte: http://www.brothersoft.com/free-fast-mpeg-cut-59025.html, 2011.

Pontos fortes: Simples de usar, interface intuitiva, realiza tarefas rapidamente.

Pontos fracos: Não suporta alguns formatos, não dá total liberdade de edição, poucas ferramentas.

70

Xilisoft Movie Maker

Imagem 40 – Xilisoft Movie Maker

Fonte: http://koskomputer.blogspot.com/2011/07/xilisoft-movie-maker-6-portable-crack.html, 2011.

Pontos fortes: Simples de usar, interface intuitiva, compatível com vários formatos, exporta para vários dispositivos.

Pontos fracos: Poucos efeitos, pré-visualização limitada.

71

Movavi Video Editor

Imagem 41 – Movavi Video Editor

Fonte: http://www.fileguru.com/Movavi-Video-Editor/screenshot, 2011.

Pontos fortes: Simples de usar, interface intuitiva, diversas ferramentas.

Pontos fracos: Exige hardware potente, versão teste de 30 dias, necessidade de cadastro.

72

Artoonix

Imagem 42 – Artoonix

Fonte: http://www.brothersoft.com/artoonix-45356.html, 2011.

Pontos fortes: Interface simples, edita animações básicas.

Pontos fracos: Não possui muitas ferramentas, exige certo conhecimento de animação em vídeo, funciona somente com animações menos complexas.

73

Jumpcut

Imagem 43 – Jumpcut

Fonte: http://www.fredcavazza.net/tag/nouvelle-tendance/, 2011.

Pontos fortes: Interface simples, intuitivo, leve.

Pontos fracos: Edição online, vídeos só podem ser salvos no site, sem possibilidade de exportar arquivos.

74

Masher

Imagem 44 – Masher

Fonte: http://www.stelladauer.com/blog/plug-play/edite-seus-videos-sem-gastar-nada/, 2011.

Pontos fortes: Simples, leve, gratuito, grande conteúdo próprio.

Pontos fracos: Necessário cadastro, edição online, não permite algumas edições básicas.

75

WeVideo

Imagem 45 – WeVideo

Fonte: http://info.abril.com.br/noticias/blogs/download-da-hora/webware/wevideo-edita-videos- online/, 2011.

Pontos fortes: Interface bem hierarquizada, variedade de recursos.

Pontos fracos: Editor online, lentidão para realizar algumas ações, banda larga recomendada, pouco intuitivo.

76

7.1.6.3 ANÁLISES DESENHÍSTICAS

7.1.6.3.1 ANÁLISE ESTRUTURAL

Windows Movie Maker

Imagem 46 – Análise Estrutural Windows Movie Maker

Fonte: Autor, 2011.

77

Adobe Premiere

Imagem 47 – Análise Estrutural Adobe Premiere

Fonte: Autor, 2011.

78

7.1.6.3.2 ANÁLISE FUNCIONAL

Kdenlive

Imagem 48 – Análise Funcional Kdenlive

Fonte: Autor, 2011.

Xilisoft Movie Maker

Imagem 49 – Análise Funcional Xilisoft Movie Maker

Fonte: Autor, 2011.

79

7.1.6.3.3 ANÁLISE COMPARATIVA DE FERRAMENTAS

Imagem 50 – Análise Comparativa de Ferramentas

Fonte: Autor, 2011.

7.1.6.3.4 ANÁLISE DE IDENTIADE GRÁFICO-VISUAL

7.1.6.3.4.1 LOGOGRAFIA

Windows Movie Maker

Imagem 51 – Análise Logográfica Windows Movie Maker

Fonte: http://tobysoftwares.blogspot.com/2010/02/windows-live-movie-maker-14.html, 2011.

Conceito: Rolo de filme tipo fita. Apesar de bem construído é bastante óbvio.

80

Legibilidade: A versão Live do software não apresenta nenhum logotipo, porém a tipografia utilizada em versões anteriores era forte, não serifada e com corpo bastante ‘‘pesado’’.

Leiturabilidade: Na tipografia utilizada anteriormente havia pouco espaço entre letras, o que podia gerar uma deficiência na leitura do logotipo.

Compreensibilidade: Em se tratando de uma particularidade do rolo de filme tipo fita, que seriam os buracos quadrados nas laterais, o logo possui certa compreensibilidade, porém pessoas não acostumadas com esse tipo de mídia podem não compreender em um primeiro contato.

Pregnância: A identidade visual não é difícil de ser memorizada, porém também não é fácil. A forma solta da fita em conjunto com a variação de cores e quantidade de informação visual pode dificultar a memorização.

YouTube Movie Maker

Imagem 52 – Análise Logográfica YouTube Movie Maker

Fonte: Brands Of The World, 2011.

Conceito: O conceito de ecrã é um dos pontos altos do logotipo do YouTube (que se extende ao software de edição de vídeo). Desde sempre a visualização de uma projeção tem de passar por uma tela. Com o YouTube não é diferente, e traz esse aspecto de ‘‘ecrã’’ no logotipo iconizado.

Legibilidade: A tipografia não serifada confere o ar despojado de que a empresa tenta passar. Tem resistência a redutibilidade e desfoque, e apresenta

81 contraste adequado.

Leiturabilidade: Bom espaço entre letras, facilita a leitura mesmo à distância.

Compreensibilidade: Alta compreensibilidade

Pregnância: A identidade visual é fácil de ser percebida. Poucas formas ajudam a reter mentalmente o logotipo rapidamente. A tipografia utilizada é forte e, em conjunto com o padrão cromático, fazem o logotipo ser lembrado rapidamente quando mencionado.

VideoSpin

Imagem 53 – Análise Logográfica VideoSpin

Fonte: http://www.boadica.com.br/dica/692/edicao-com-o-pinnacle-videospin, 2011.

Conceito: O ‘‘swoosh’’, já bem comum nos dias de hoje, faz alusão ao próprio nome Spin (rodopio). O conceito de ‘‘movimento’’ por meio dos ‘‘swoosh’s’’ já é bem batido, apesar de servir como elemento de apoio.

Legibilidade: A tipografia não serifada tem ótimo peso. O logotipo resiste bem a testes de redutibilidade e desfoque, embora o decodificador possa sumir em algumas reduções.

Leiturabilidade: Bom espaço entre letras, principalmente no decodificador. É possível ler com grande distância.

Compreensibilidade: Vídeos são imagens e movimento. O rodopio

82

(swoosh) no logo ajuda a conceituação, porém como se trata de um logotipo solto talvez não seja compreensível em um primeiro contato.

Pregnância: A identidade visual é fácil de ser memorizada. Sua estrutura, formas e cores são agradáveis, não fazendo o olhar se perder ou ficar sobrecarregado.

7.1.6.3.4.2 CROMOGOGRAFIA

Kdenlive

Imagem 54 – Análise Cromográfica Kdenlive

Fonte: Autor, 2011.

83

JayCut

Imagem 55 – Análise Cromográfica JayCut

Fonte: Autor, 2011.

Ulead

Imagem 56 – Análise Cromográfica Ulead

Fonte: Autor, 2011.

84

7.1.6.3.4.3 ICONOGRAFIA

Sony Vegas

Imagem 57 – Análise Iconográfica Sony Vegas

Fonte: Autor, 2011.

Masher

Imagem 58 – Análise Iconográfica Masher

Fonte: Autor, 2011.

85

Xilisoft Movie Maker

Imagem 59 – Análise Iconográfica Xilisoft Movie Maker

Fonte: Autor, 2011.

86

7.1.6.3.5 ESCALAS DE DIFERENCIAL SEMÂNTICO

Windows Movie Maker

Imagem 60 – Escala de Diferencial Semântico Windows Movie Maker

Fonte: Autor, 2011.

Adobe Premiere

Imagem 61 – Escala de Diferencial Semântico Adobe Premiere

Fonte: Autor, 2011. 87

Final Cut

Imagem 62 – Escala de Diferencial Semântico Final Cut

Fonte: Autor, 2011.

Muvee AutoProducer

Imagem 63 – Escala de Diferencial Semântico Muvee AutoProducer

Fonte: Autor, 2011.

88

Artoonix

Imagem 64 – Escala de Diferencial Semântico Artoonix

Fonte: Autor, 2011.

JumpCut

Imagem 65 – Escala de Diferencial Semântico JumpCut

Fonte: Autor, 2011.

89

7.1.6.4 ANÁLISES HEURÍSTICAS

Windows Movie Maker

Feedback: O programa não informa o que se passa diretamente, porém, em oscilações, mostra os ‘‘loads’’ próprios do sistema Windows.

Abrangência: Boa abrangência, se comunicando bem tanto com crianças como com pessoas de mais idade.

Controle: Possui bons controles, fazendo com que o usuário tenha bastante liberdade, porém, certos comandos permanecem escondidos.

Coerência: Possui coerência visual sobre o padrão do sistema Windows.

Prevenção: Quase não apresenta chances de erro, porém, se ocorrem, não possui mensagem específica.

Reconhecimento: Possui auxílio de texto e ícones, juntamente com hierarquia bem delimitada.

Flexibilidade: Apresenta alguns atalhos para os mais experientes, e ao mesmo passo, é intuitivo o bastante para usuários de primeiro contato.

Minimalismo: Apesar de hierarquizada a quantidade de informações tende a distrair o usuário.

Erros: Não apresenta boas mensagens de erro, geralmente apresentando um código ao invés da solução.

90

Ajuda: Apesar do software não apresentar um sistema de apoio, as informações são facilmente acessadas através da internet.

Free Fast Mpeg Cut

Feedback: O programa não apresenta nem mesmo os ‘‘loads’’ (somente ao carregar um vídeo).

Abrangência: A comunicação com o usuário é mais subjetiva, sendo que um usuário sem experiência anterior pode perder o foco.

Controle: A proposta do software é bem simples, e por isso não depende de muitos comandos, porém os controles aos quais se propõem estão presentes e visíveis o tempo inteiro.

Coerência: Possui certa coerência visual, porém parece mais com a linguagem padrão do sistema em que o software foi produzido.

Prevenção: Possui caminhos bem delimitados, forçando o usuário a seguir um padrão de utilização.

Reconhecimento: Possui somente auxílio de ícones, o que pode dificultar no reconhecimento simultâneo.

Flexibilidade: Não apresenta atalhos ou outros modos de funcionalidades para usuários experientes.

Minimalismo: Interface muito simples, com praticamente três blocos de informação.

91

Erros: As mensagens de erro ocorrem, porém não apresentam possíveis soluções.

Ajuda: Não possui sistema de apoio no próprio software, porém pode-se entrar em contato com o desenvolvedor

Movavi Video Editor

Feedback: O programa informa o que ocorre em uma barra de informações

Abrangência: A comunicação é objetiva com quem está acostumado a usar tais softwares.

Controle: O controle sobre o vídeo é quase total. Há várias opções de ferramentas deixando o usuário livre para ir e vir na interface.

Coerência: Possui boa coerência visual, mantém um padrão por todo o software.

Prevenção: Por possuir várias funcionalidades, o usuário pode se sentir perdido na hora de acessar uma ferramenta.

Reconhecimento: Apesar de bastante icônico, há muita informação visual, o que pode confundir usuários de primeiro contato.

Flexibilidade: Apresenta certa quantidade de atalhos, porém é um tanto complexo para usuários menos experientes.

Minimalismo: Interface complexa, com muita informação, apesar de grade hierárquica bem definida. 92

Erros: Apresenta mensagens de erro compreensíveis, apesar de não mostrar uma possível solução.

Ajuda: Possui um sistema de ajuda, com possibilidade de acessar outras informações pelo website do desenvolvedor, porém necessita de cadastro.

93

7.1.7 LISTA DE VERIFICAÇÃO

A partir das análises realizadas é possível determinar certos atributos a serem cumpridos no decorrer do projeto. Estes atributos estão divididos em três: restrições (necessário), requisitos (provável) e possibilidades (possível).

Imagem 66 – Lista de Verificação

Fonte: Autor, 2011. 94

7.2 ESCOPO

Nesta etapa se inicia o processo de organização de conteúdos. É no escopo onde o projetista começa a moldar o conteúdo do projeto, catalogando funcionalidades, ferramentas, tarefas e cenários.

7.2.1 DEFINIÇÃO DE PERSONAS

Personas são pessoas fictícias que têm ligação direta com o produto em questão. Neste caso, estas personas estão dentro do público-alvo. Para definir uma persona é necessário considerar algumas características pessoais que farão essa conexão de público de destino para o projeto.

Henrique Moreira Dias

Henrique tem 9 anos, mora com os pais e seu irmão mais velho na Zona Sul de Porto Alegre. Família de classe média para alta. Estuda na terceira série do Ensino Fundamental. Adora assistir filmes, jogar vídeo-games e desenhar. Tem contato com computador/internet diariamente. Introspectivo, sua única obrigação é para com a escola. Muito tímido, tem vergonha de expor suas ideias e pontos de vista para sua turma.

Júlia Martins da Silva

Júlia tem 11 anos, mora com os pais na Zona Leste de São Paulo. Família de classe média. Estuda na sexta série do Ensino Fundamental. Gosta muito de ler e praticar esportes. Possui boas relações interpessoais e é dedicada na escola, sobressaindo-se em pesquisas e apresentações à turma. Tem contato quase que diário com computador/internet, porém usando-os 75% das vezes para fins escolares. Em seus momentos de lazer prefere sair com amigos ou jogar vôlei com seus vizinhos.

95

Alessandro Lopes de Figueiredo

Alessandro tem 13 anos, mora no centro de Florianópolis com os pais e é o mais novo de três irmãos. Sua família é de classe alta, e estuda na sétima série do Ensino Fundamental. Mantém-se ocupado boa parte do tempo organizando suas redes sociais e produzindo vídeos com sua turma de amigos para lançá-los em um “vlog” na Internet. Extrovertido, prefere trabalhar/estudar sozinho, mas reconhece o valor da ajuda de uma equipe.

Rafaela dos Santos da Silva

Rafaela tem 8 anos, mora com a mãe e sua irmã na Zona Norte do Rio de Janeiro. Família classe média. Estuda na segunda série do Ensino Fundamental. Ajuda a mãe com os afazeres domésticos e a cuidar da irmã. Em seu tempo livre gosta de assistir TV. Não possui computador, sendo o uso restrito ao colégio. É uma aluna esforçada e prefere realizar pesquisas a provas.

7.2.2 DEFINIÇÃO DE FERRAMENTAS E FUNCIONALIDADES

A definição de funcionalidades do sistema foi organizada através da técnica de embaralhamento de cartões de classificação. A imagem a seguir mostra as operações básicas a serem fornecidas pelo software (contendo ou não sub-funcionalidades):

96

Imagem 67 – Card Sorting

Fonte: Autor, 2011.

7.2.3 CENÁRIO HIPOTÉTICO

Cenário 1 – Trabalho escolar

Júlia (Persona 2) necessita criar uma apresentação em vídeo para um trabalho escolar. Ela se reúne com seus colegas e começam a filmar todas as cenas do vídeo. Após, leva o arquivo de captura para dentro do software e começa a edição. No vídeo (imagem) ajusta os tempos de cada cena, efetua os 97 devidos cortes de erros, ajusta a claridade de cenas, adiciona efeitos de transição e efeitos de vídeo. Adiciona texto (legendas e informação). Faz o download de uma trilha sonora e captura para dentro do software. Sincroniza áudio e imagem, adiciona efeitos sonoros. Salva o arquivo e exporta para formato compatível para exibição.

Cenário 2 – Vlog

Alessandro (Persona 3) gostaria de adicionar um vídeo de sua webcam diretamente em seu vlog no sítio virtual de compartilhamento de vídeos YouTube. Alessandro efetua a captura diretamente da webcam, corrige sincronias entre áudio e vídeo e parte para a edição. No vídeo, corrige a iluminação e espectro de cores e adiciona efeitos de vídeo e de transição. Adiciona texto de informação e salva o arquivo, exportando diretamente para a conta do YouTube.

Cenário 3 – Filme de Aniversário

Henrique (Persona 1) quer editar um vídeo para o aniversário de 80 anos de sua avó. Seleciona, então, 20 fotos e arquivos de imagens. Após digitalizar as fotografias de papel, captura todos os arquivos de imagem para o software. Organiza a sequência de fotos, juntamente com o tempo em que cada um aparecerá no ecrã. Adiciona legendas, sincronizando-as com o vídeo. Após isso, faz alguns downloads de áudio e captura-os para dentro do software. Sincroniza as trilhas de áudio com as imagens, salvando o arquivo logo após. Exporta, então, para um formato compatível de exibição.

98

7.2.4 DIFERENCIAL SEMÂNTICO

A seguir é apresentada a escala semântica ideal para o projeto em desenvolvimento. Esta escala foi concebida através da observação das escalas analisadas na etapa da Estratégia.

Imagem 68 – Escala de Diferencial Semântico Ideal

Fonte: Autor, 2011.

99

7.2.5 POSICIONAMENTO

A seguir, o posicionamento frente aos principais concorrentes do projeto em desenvolvimento. Este estudo teve como base um plano cartesiano dividindo entre maior/menor qualidade gráfica e quantidade de elementos presentes na interface.

Imagem 69 – Posicionamento

Fonte: Autor, 2011.

100

7.3 ESTRUTURA

7.3.1 ORGANOGRAMA DE FUNCIONALIDADES

Nesta etapa são apresentadas as funcionalidades determinadas do sistema em coexistência (podendo abrigar sub-funcionalidades).

Imagem 70 – Organograma de funcionalidades

Fonte: Autor, 2011.

101

7.3.2 TAREFAS

7.3.2.1 TAREFA 1

O usuário gostaria de editar um vídeo e enviá-lo diretamente para o seu canal no sítio virtual de compartilhamento de vídeos YouTube.

Imagem 71 – Tarefa 1

Fonte: Autor, 2011.

102

7.3.2.2 TAREFA 2

O usuário deseja enfileirar uma sequência de fotografias para fazer um vídeo com trilha sonora de um passeio referente às fotos.

Imagem 72 – Tarefa 2

Fonte: Autor, 2011.

103

7.4 ESQUELETO

7.4.1 WIREFRAMES ESTRUTURAIS

Imagem 73 – Wireframes estruturais 1

Fonte: Autor, 2011.

104

Imagem 74 – Wireframe estrutural 4

Fonte: Autor, 2011.

105

Imagem 75 – Wireframe estrutural 6

Fonte: Autor, 2011.

7.4.2 WIREFRAMES ARQUITETURAIS

É nesta etapa que o projeto começa a tomar a forma final. Após a escolha da alternativa, inicia-se a parte de refino das escolhas, para que, delas, saia o modelo final do projeto.

106

Imagem 76 – Wireframe arquitetural 1

Fonte: Autor, 2011.

Imagem 77 – Wireframe arquitetural 2

Fonte: Autor, 2011. 107

Imagem 78 – Wireframe arquitetural 3

Fonte: Autor, 2011.

Imagem 79 – Wireframe arquitetural 4

Fonte: Autor, 2011.

108

Imagem 80 – Wireframe arquitetural de tarefa 1

Fonte: Autor, 2011.

Imagem 81 – Wireframe arquitetural de tarefa 2

Fonte: Autor, 2011. 109

Imagem 82 – Wireframe arquitetural de tarefa 3

Fonte: Autor, 2011.

Imagem 83 – Wireframe arquitetural de tarefa 4

Fonte: Autor, 2011. 110

7.5 ESTÉTICA

A estética é o refino do projeto. É nesta etapa em que são realizados os mínimos ajustes para que a “precisão” do projeto seja satisfatória. A interface, como visto no Esqueleto, possui toda uma estruturação por trás do que se vê, e é na estética que o segredo por trás desta estrutura é revelado.

7.5.1 MALHAS DE CONSTRUÇÃO

7.5.1.1 MALHA DIAGRAMACIONAL

Imagem 84 – Malha diagramacional

Fonte: Autor, 2011.

111

7.5.1.2 MALHA FILOSOFAL

Imagem 85 – Malha filosofal

Fonte: Autor, 2011.

7.5.2 PADRÃO TIPOGRÁFICO

O padrão tipográfico a ser utilizado no redesenho de interface será constituído pela família tipográfica Myriad Pro.

Myriad Pro Myriad Pro Bold

ABCDEFGHIJKLMNOPQRSTUVWXYZ ABCDEFGHIJKLMNOPQRSTUVWXYZ

abcdefghijklmnopqrstuvwxyz abcdefghijklmnopqrstuvwxyz 0123456789 0123456789

Myriad Pro Condensed ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz

0123456789

112

7.5.3 ASSINATURA GRÁFICO-VISUAL

A proposta para a assinatura gráfico-visual da interface é de revolução (mudança completa). A assinatura do produto atual não existe, sendo utilizado, em seu lugar, o logotipo da empresa que desenvolveu o software. O logotipo criado tem base na família tipográfica Franklin Gothic.

Imagem 86 – Assinatura Gráfico-Visual

Fonte: Autor, 2011.

113

7.5.4 PADRÃO CROMÁTICO

O padrão cromático será dividido em quatro partes: Áudio, imagens, vídeos e ferramentas. Dados os termos, a composição de cores será feita a partir de imagens do painel semântico a seguir.

Imagem 87 – Padrão Cromático

Fonte: Autor, 2011.

7.5.5 MODELO FUNCIONAL 114

Imagem 88 – Modelo funcional 1

Fonte: Autor, 2011.

Imagem 89 – Modelo funcional 2

Fonte: Autor, 2011. Imagem 90 – Modelo funcional 3 115

Fonte: Autor, 2011.

Imagem 91 – Modelo funcional 4

Fonte: Autor, 2011.

Imagem 92 – Modelo funcional 5 116

Fonte: Autor, 2011.

Imagem 93 – Modelo funcional 6

Fonte: Autor, 2011.

Imagem 94 – Modelo funcional 7 117

Fonte: Autor, 2011.

Imagem 95 – Modelo funcional 8

Fonte: Autor, 2011.

Imagem 96 – Modelo funcional 9 118

Fonte: Autor, 2011.

Imagem 97 – Modelo funcional 10

Fonte: Autor, 2011.

Imagem 98 – Modelo funcional 11 119

Fonte: Autor, 2011.

8 ANEXOS 120

8.1 DEFINIÇÃO DE TERMOS

Alguns termos apresentados nesta monografia podem ser de complexa interpretação. Sendo assim, nesta seção, estes termos serão explicados na sua forma literal, simplificando o bom entendimento do trabalho. Todos os termos são referidos a partir de dicionários e enciclopédias virtuais.

Audiovisual. Diz respeito à sensibilidade quanto aos sentidos da visão e da audição. Pode se referir a formas de comunicação que combinam som e imagem, bem como a tecnologia utilizada para gerar o registro dessa comunicação.

Cognição. A cognição nada mais é que a capacidade humana de adquirir conhecimento. Esta característica, por motivos óbvios, é encontrada em indivíduos capazes de reflexão, e tem profundo envolvimento no que se refere à atenção, imaginação, linguagem, lógica, memória, pensamento, percepção, raciocínio e retenção de informação.

Comunicação Visual. A comunicação pode ser definida como o estabelecimento e manutenção de uma transmissão de informação entre um transmissor e um receptor. Já a comunicação visual é toda a forma de comunicação que se vale de componentes visuais para que ocorra essa transmissão de informação. Neste processo podem ser usados signos, símbolos, imagens, desenhos, gráficos e tudo que possa ser visto e interpretado.

Design Gráfico. É o estudo para o desenvolvimento metódico de uma comunicação visual através de técnicas formais. O ponto-chave do design gráfico se dá na concepção de uma peça gráfico-visual que una aspectos técnicos com uma conceituação sólida, baseada na cultura visual/social.

121

Interação. Influência recíproca de dois ou mais elementos. A interação se dá quando um indivíduo ou objeto desencadeia uma reação em outro indivíduo ou objeto. Há vários tipos de interação (humano-humano, humano-objeto, objeto- objeto, etc...) e vários níveis de interação, que vão desde ações bidirecionais, antagônicas até a interatividade.

Interatividade. A interatividade nada mais é que a interação entre um utilizador e uma máquina, por meio de uma tela de visualização. É um conceito quase sempre associado às novas mídias de comunicação. Pode ser entendida como a interação para com um ambiente virtual.

Intuição. A intuição é uma percepção instintiva de reconhecimento imediato. É um processo pelo qual seres humanos passam para chegar a uma conclusão sobre algo. A intuição é totalmente instintiva, de modo que não podemos usá-la conscientemente.

Software. Também conhecido como “programa de coputador”, define-se software por um conjunto de programas, processos, regras e documentação relativos ao funcionamento de um conjunto de tratamento da informação. Um software é composto por uma sequência de instruções que é interpretada e executada por um computador. Se não houver erros em suas diretrizes, essa sequência resultará em um comportamento (por parte do software) desejado. Qualquer dispositivo ou indivíduo capaz de interpretar e executar instruções pode interagir com um software.

8.2 LISTA DE IMAGENS

122

Imagem 1 - Cronograma de Atividades (Metodologia) Imagem 2 – Cinematógrafo Lumière Imagem 3 – Pesquisa CETIC Imagem 4 – Pesquisa CETIC 2 Imagem 5 – Cenário Atual e Cenário Pretendido Imagem 6 – Cenário Atual e Cenário Pretendido Imagem 7 – Equacionamento de Fatores Projetuais Imagem 8 – Taxonomia Imagem 9 – Pinturas Rupestres Imagem 10 – Mo Tzu Imagem 11 – Aristóteles Imagem 12 – Teatro de Sombras Imagem 13 – Câmara Escura de Da Vinci Imagem 14 – Lanterna Mágica Imagem 15 – Fenacistoscópio Imagem 16 – Praxinoscópio Imagem 17 – Fuzil Fotográfico Imagem 18 – Cronofotografia Imagem 19 – Cinetoscópio Imagem 20 – Cinematógrafo Imagem 21 – Don Juan de Alan Crosland, 1926 Imagem 22 – Flowers and Trees de Walt Disney, 1932 Imagem 23 – Star Wars Imagem 24 – Videoclip da música “Money for Nothing” de Dire Straits Imagem 25 – Filme 3D sem o efeito dos óculos 3D Imagem 26 – Windows Movie Maker Imagem 27 – Kdenlive Imagem 28 – Sony Vegas Imagem 29 – Adobe Premiere

123

Imagem 30 – Corel VideoStudio Pro Imagem 31 – YouTube Movie Maker Imagem 32 – VideoPad Video Editor Imagem 33 – Ulead Video Studio Imagem 34 – Video Spin Imagem 35 – VideoLAN Movie Creator Imagem 36 – Muvee AutoProducer Imagem 37 – JayCut Imagem 38 – Adobe Final Cut Imagem 39 – Free Fast Mpeg Cut Imagem 40 – Xilisoft Movie Maker Imagem 41 – Movavi Video Editor Imagem 42 – Artoonix Imagem 43 – Jumpcut Imagem 44 – Masher Imagem 45 – WeVideo Imagem 46 – Análise Estrutural Windows Movie Maker Imagem 47 – Análise Estrutural Adobe Premiere Imagem 48 – Análise Funcional Kdenlive Imagem 49 – Análise Funcional Xilisoft Movie Maker Imagem 50 – Análise Comparativa de Ferramentas Imagem 51 – Análise Logográfica Windows Movie Maker Imagem 52 – Análise Logográfica YouTube Movie Maker Imagem 53 – Análise Logográfica VideoSpin Imagem 54 – Análise Cromográfica Kdenlive Imagem 55 – Análise Cromográfica JayCut Imagem 56 – Análise Cromográfica Ulead Imagem 57 – Análise Iconográfica Sony Vegas Imagem 58 – Análise Iconográfica Masher

124

Imagem 59 – Análise Iconográfica Xilisoft Movie Maker Imagem 60 – Escala de Diferencial Semântico Windows Movie Maker Imagem 61 – Escala de Diferencial Semântico Adobe Premiere Imagem 62 – Escala de Diferencial Semântico Final Cut Imagem 63 – Escala de Diferencial Semântico Muvee AutoProducer Imagem 64 – Escala de Diferencial Semântico Artoonix Imagem 65 – Escala de Diferencial Semântico JumpCut Imagem 66 – Lista de Verificação Imagem 67 – Card Sorting Imagem 68 – Escala de Diferencial Semântico Ideal Imagem 69 – Posicionamento Imagem 70 – Organograma de funcionalidades Imagem 71 – Tarefa 1 Imagem 72 – Tarefa 2 Imagem 73 – Wireframe estrutural 1 Imagem 74 – Wireframe estrutural 2 Imagem 75 – Wireframe estrutural 3 Imagem 76 – Wireframe estrutural 4 Imagem 77 – Wireframe estrutural 5 Imagem 78 – Wireframe estrutural 5 Imagem 79 – Wireframe estrutural 6 Imagem 80 – Wireframe arquitetural 1 Imagem 81 – Wireframe arquitetural 2 Imagem 82 – Wireframe arquitetural 3 Imagem 83 – Wireframe arquitetural 4 Imagem 84 – Malha diagramacional Imagem 85 – Malha filosofal Imagem 86 – Assinatura Gráfico-Visual Imagem 87 – Padrão Cromático

125

Imagem 88 – Modelo funcional 1 Imagem 89 – Modelo funcional 2 Imagem 90 – Modelo funcional 3 Imagem 91 – Modelo funcional 4 Imagem 92 – Modelo funcional 5 Imagem 93 – Modelo funcional 6 Imagem 94 – Modelo funcional 7 Imagem 95 – Modelo funcional 8 Imagem 96 – Modelo funcional 9 Imagem 97 – Modelo funcional 10 Imagem 98 – Modelo funcional 11

9. REFERÊNCIAS BIBLIOGRÁFICAS

126

AGNER, Luiz. Ergodesign e Arquitetura da Informação – Trabalhando com o Usuário. Rio de Janeiro: Quartet, 2006.

ARMES, Roy. On Video: O Significado do Vídeo nos Meios de Comunicação. São Paulo: Summus, 1999.

Centro de Estudo sobre as Tecnologias da Informação e Comunicação Disponível em : Acesso em 17 de agosto de 2011.

CANELAS, Carlos.Os Sistemas de Edição de Vídeo: Linear versus Não Linear. 2010. 11f. Artigo da Biblioteca de Ciências da Comunicação. Disponível em http://www.bocc.ubi.pt/. Acesso em: 26 de Agosto de 2011.

CARLSSON, Ulla; FEILITZEN, Cecilia Von. A Criança e a Mídia: Imagem, Educação, Participação. São Paulo: Cortez, 2002.

CARVALHO, José Oscar Fontanini de. O Papel da Interação Humano- Computador na Inclusão Digital. Campinas: Transinformação, 2003.

COLL, César, TEBEROSKY, Ana. Aprendendo Arte. São Paulo: Ática, 2000.

COLOM CAÑELLAS, A. J. La educación como comunicación. In: CASTILLEJO, J. L. et al. Teoría de la Educación. Madrid: Taurus Universitária,1994.

COSTA, Flavia Cesarino. O primeiro cinema. São Paulo: Scritta, 1995.

CYBIS, Walter; BETIOL, Adriana Holtz; FAUST, Richard. Ergonomia e Usabilidade: Conhecimentos, Métodos e Aplicações. São Paulo: Novatec, 2007.

FRASCARA, Jorge et al. Designing Effective Communications. New York: Allworth Press, 2006

FRITZEN, Celdon; MOREIRA, Janine. Educação e Arte: As Linguagens Artísticas na Formação Humana. Campinas: Papirus, 2008.

HUTZ, Claudio Simon. Avanços em Avaliação Psicológica e Neuropsicológica de Crianças e Adolescentes. São Paulo: Casa do Psicólogo, 2010.

LIDWELL, William; HOLDEN, Kritina; BUTLER, Jill. Universal Principles of Design. Massachusetts: Rockport Publishers, 2003.

MACHADO, Arlindo. Pré-cinemas & pós-cinemas. Campinas: Papirus, 1997.

MACFARLANE, Stuart; SIM, Gavin; HORTON, Matthew. Assessing Usability 127 and Fun in Educational Software. New York: ACM Press, 2005.

MECKLENBURGER, James A. Educational Technology is Not Enough. Indiana: Phi Delta Kappan, 1990.

MEURER, Heli; SZABLUK, Daniela. Projeto E: Metodologia Projetual para Ambientes Dígito-Virtuais. Anais do 3º InfoDesign Brasil | Congresso Brasileiro de Design da Informação. Rio de Janeiro: PUC RIO, 2009.

MORAES, Anamaria de et al. Design de Avaliação de Interface: Ergodesign e Interação Humano-Computador. Rio de Janeiro: iUsEr, 2002.

NIELSEN, Jakob. Heuristic Evaluation. In NIELSEN, J.; MACK, R. L. Usability Inspection Methods. New York: John Wiley & Sons, 1994.

PAPALIA, D.; OLDS, S.; FELDMAN, R. O Mundo da Criança. Lisboa: Mc Graw Hill, 1999.

PIAGET, J. A Psicologia da Criança. São Paulo: Diefel, 1980.

PREECE, Jennifer; ROGERS, Yvonne; SHARP, Helen. Design de Interação: Além da Interação Homem-Computador. Porto Alegre: Bookman, 2005.

SABADIN, Celso. Vocês ainda não ouviram nada: A barulhenta história do cinema mudo.São Paulo: Lemos Editorial, 1997.

TAJRA, Sanmya Feitosa. Infomática na Educação. 9ª Edição São Paulo: Érica, 2000.

Tecmundo – A Evolução dos Computadores, por Renan Hamann Disponível em : < http://www.tecmundo.com.br/> Acesso em 16 de agosto de 2011.

XAVIER, Ismail. O Discurso Cinematográfico: A Opacidade e a Transparência. Rio de Janeiro: Paz e Terra, 1977.

128