Linguagem Visual / Parte 6

A linguagem visual Parte 6

Trabalho Realizado por Clarissa, Cristiane e Viviana. 

Parte 6 - Tutorial Sobre Cores

Parte 1 - Interfaces

Aula de 15 de outubro

Olá pessoal!

Temos algumas tarefas hoje!

ATIVIDADE 1 - A primeira delas é publicar no blogue da Gincana Solidária os vídeos e fotos da Feira Regional e do Show de Talentos que tivemos na escola. Distribuam os vídeos e publiquem, tem que postar direitinho identificando cada tarefa. Vocês podem olhar o ordenamento das tarefas clicando AQUI

ATIVIDADE 2 - Leitura e resumo das postagens de nome "Projetando o site do Liberato - um pouco de teoria". Notem que este tema está dividido em seis partes. Vocês deverão escolher um dos temas e realizar a leitura e o resumo. Não poderão escolher o mesmo tema. Cada postagem deverá ser feita por um aluno diferente, somente na parte 6 em que os textos não estão escritos na postagem e sim há links para dois tutoriais. O tutorial Cores deve ser feito por um aluno e o tutorial Linguagem Visual deve ser dividido entre três alunos. Qualquer dúvida, me procurem no Laboratório 1.

Projetando o site do Liberato: um pouco de teoria... PARTE 6

Tutorial sobre cores

Tutorial sobre linguagem visual

Projetando o site do Liberato: um pouco de teoria... PARTE 5

O que está sendo publicado aqui foi retirado do seguinte material: Etapa 1- FundamentosMódulo 4 - Design e Usabilidade - Formação Continuada Midías na Educação Mídia Informática, disponível em: http://penta3.ufrgs.br/midiasedu/modulo4/tutoriais/fundamentos/fundamentos.pdf

ADAPTABILIDADE

Este critério é relacionado ao fato de que podemos fazer as mesmas tarefas de diferentes formas. Pode-se, por exemplo, imprimir um arquivo teclando “Ctrl+P”, ou clicando no ícone de impressora disponível da interface, ou ainda, abrir um menu de opções onde existe o comando “Imprimir”. Quando um software permite isso, está possibilitando aos usuários de diferentes níveis de experiência a “customização” ou “personalização” da interface.

GESTÃO DE ERROS

A interface deve prever alertas aos usuários, quando estes entram com dados inadequados. Por exemplo, para um campo de data de aniversário que somente aceita números e ocorre de o mês ser digitado com palavras, o software deve avisar que somente é permitido caractere numérico. Este requisito é mais relacionado a interações com grande entrada de dados. No entanto, vários editores de texto utilizam este artifício, quando sublinham uma palavra incorreta e perguntam se você quer corrigí-la.

HOMOGENEIDADE/COERÊNCIA

A homogeneidade é uma característica relacionada à identidade visual, textual e de estilo de navegação, que são percebidos quando temos interfaces que apresentam determinado padrão estético. Uma maneira fácil de identificar este padrão é quando vamos “fechar uma janela” no Windows e sempre encontramos o ícone com um “X” no canto direito superior da janela. Assim, o posicionamento dos ícones, barras de ferramentas, utilização de cores no fundo de tela e demais áreas, devem obedecer a um padrão mínimo para que o usuário se oriente, execute mais rápido suas ações e não tenha a impressão de que, de uma hora para outra, tudo mudou e “parece” que está em outro software.

SIGNIFICADO DOS CÓDIGOS

Aqui entramos numa área importante de comunicação visual. Se você vai fazer uma interface para quem está acostumado a pintar, então as ilustrações de pincéis, palhetas de tintas ou degradês, usadas em ícones de um editor de imagem, vão ser bem significativas e representar claramente a ação a ser executada quando o ícone for clicado. Quanto mais universal for o significado das figuras utilizadas para formar a interface, mais abrangente será o público a ser atingido. É claro que, nestes casos, temos que observar bem a especificidade dos perfis dos usuários a serem atendidos, principalmente quanto à cultura e aspectos histórico-sociais que identificam seu universo de significados conhecidos.

COMPATIBILIDADE

Quando estamos digitando um texto e podemos visualizar como ele ficará na impressão, estamos utilizando um tipo de compatibilidade que é a de formato. Significa que o que vemos na tela está compatível ou correspondente com o que sairá na impressora. Outra forma de compatibilidade importante é que seja respeitada a maneira com que o usuário está acostumado a realizar uma tarefa. Significa que, se você está acostumado a criar suas aulas com textos, imagens, colagens e esboços quando o faz sem computador, então o seu software ideal será aquele que permita o uso de texto e imagem simultaneamente. Logo, estamos compatibilizando a sua forma de fazer aulas no papel com a forma de fazê-las no computador. A partir destes conhecimentos sobre ergonomia e usabilidade, vamos começar a ver como podemos dar solução aos problemas de projeto. Passaremos, no próximo módulo, a estudar como as partes que compõem uma interface se organizam e quais as qualidades a serem observadas em cada uma destas partes. Enfatizaremos a “Linguagem Visual”, porque ela é predominante na interface humano-computador. Obviamente, as outras formas de linguagem, como a verbal, são de fundamental importância, mas já estamos mais acostumados a produzí-las. No entanto, você vai ver que é possível traçar um paralelo entre as diferentes linguagens e utilizá-las de forma clara e eficiente numa interface de alta qualidade.

Projetando o site do Liberato: um pouco de teoria... PARTE 4

O que está sendo publicado aqui foi retirado do seguinte material: Etapa 1- FundamentosMódulo 4 - Design e Usabilidade - Formação Continuada Midías na Educação Mídia Informática, disponível em: http://penta3.ufrgs.br/midiasedu/modulo4/tutoriais/fundamentos/fundamentos.pdf

 Qualidades ergonômicas de uma interface

As qualidades ergonômicas são tanto da interface quanto do software em si. Esta definição é importante porque o “programa” e a “interface” são componentes de um mesmo produto. Imagine que, para todos os comandos ou cliques que você aciona na interface, há uma programação equivalente que permite uma resposta à sua ação. Então a pergunta é:

por onde começar um projeto que seja realmente ergonômico? Pela interface, pois é através dela que um programador vai entender as suas necessidades com relação a um produto.

Oito critérios gerais para o sucesso de uma interface com base em estudos de Scapain e Bastien do INRIA:

A CONDUÇÃO

Um software ergonômico é como um tutor que ajuda o usuário na interação com o computador. Ele apresenta uma série de mensagens úteis para que o usuário sinta-se seguro em interagir. Estas mensagens aparecem em forma de alertas, rótulos, pequenos textos que ocorrem no momento e local exatos, isto é, aparecem quando necessários. Eles possibilitam que:

·O usuário se localize no software; isto significa que na interação com um jogo com etapas a vencer, por exemplo, a interface lhe demonstre em que etapa você se encontra.

·O usuário conheça as ações e suas conseqüências. No exemplo do jogo, se a ação do usuário for de retornar para a etapa anterior, então ele pode perder a pontuação já alcançada. Um outro bom exemplo é quando você vai salvar um arquivo no seu computador com um nome e localização iguais a de outro arquivo já existente, e o computador lhe avisa que você perderá os dados salvos anteriormente.

·Quando necessário que o usuário consiga obter informações complementares para orientar sua interação. É o caso da “ajuda”, que serve como um pequeno manual de como realizar as tarefas do software. É muito importante para objetos de aprendizagem que servem a diferentes públicos, pois cada um possui habilidades e tempo de experiência diferentes com computadores. Para usuários novatos, os recursos de ajuda devem ser bem disponíveis. Estes recursos devem ser extremamente simples, didáticos e visuais (uma boa forma de ajuda são as animações de “como fazer”), pois devem sanar dúvidas e exigir baixo esforço cognitivo, já que o usuário o acessa justamente em momento de dúvida e provável impaciência.

CARGA DE TRABALHO

Imagine se todas as vezes que você precisasse acessar seu e-mail, tivesse que preencher novamente seu cadastro. Seria muito desagradável, mas com os dados armazenados no provedor, basta inserir o nome de usuário e senha.

Formalmente, podemos dizer que um software ergonômico permite fácil aprendizado porque sua interface e estrutura permitem que o usuário aprenda rapidamente como utilizá-lo, diminuindo a quantidade de falhas na interação e sobrecarga cognitiva. Quanto maior a carga de trabalho cognitivo do usuário, maior a possibilidade de cometer erros. Neste sentido, a divisão de tarefas entre o usuário e o software é de importância fundamental. Então, quando estiver projetando um produto, é importante evitar que o usuário tenha de fazer o que o software pode fazer. Assim a carga cognitiva durante a navegação é diminuída, priorizando, para o usuário, o foco nas tarefas de aprendizado do conteúdo. Quando entramos no critério de carga de trabalho, passamos a definir o que é um software econômico, porque é conciso, apresentando apenas o essencial, diminuindo a carga informacional e a quantidade de ações para obter o resultado.

CONTROLE EXPLÍCITO

Este critério diz que o software deve ser “obediente” e que o usuário deve ter total controle sobre ele. Imagine o contrário, um usuário tentando mudar para outra página na internet e a página em que ele se encontra não permite isso. É necessário que o usuário consiga decidir e concretizar as ações no decorrer da interação. O usuário deve sentir-se sempre no controle da interação.