componentes de interfaces recomendações ergonômicas para cor aula baseada na aula de walter de...

Componentes de Interfaces Recomendações Ergonômicas para

Cor

Aula baseada na aula de Walter de Abreu Cybis de Abril, 2003

Significado

TABELA DE SENSAÇÕES ACROMÁTICAS

Cor

Associação Material

Associação Afetiva

Símbolo

Batismo, areia clara primeira comunhão, nuvens em tempo claro, neve, lírio, casamento, cisne,

Ordem, simplicidade, limpeza, bem, pensamento, juventude, otimismo, paz piedade, inocência, dignidade, infância, harmonia, afirmação, pureza, despertar, modéstia, estabilidade, alma, divindade

Do germânico blank (brilhante). Simboliza a luz. Para os ocidentais simboliza a vida e o bem, para os orientais é a morte, o fim, o nada.

Significado

Cor



Símbolo

Sujeira, sombra, fim, enterro, carvão, noite, fumaça, condolência, morto, coisas escondidas

Mal, miséria, pessimismo, sordidez, tristeza, frigidez, desgraça, temor, negação, melancolia, opressão, angústia, dor, renúncia, intriga

É expressivo e angustiante ao mesmo tempo. É alegre quando combinado com certas cores. Às vezes tem conotação de nobreza, seriedade

TABELA DE SENSAÇÕES ACROMÁTICAS

Pó, chuva, neblina, máquinas, mar sob tempestade, ratos.

Tédio, tristeza, decadência, velhice, desânimo, seriedade, sabedoria, passado, finura, pena, aborrecimento, carência vital

Simboliza a posição intermediária entre a luz e a sombra. Não interfere junto às cores em geral – é neutro

Significado

Cor



Símbolo

Rubi, cereja, guerra, rocha, conquista, combate, sinal de parada, vida, fogo, lábios mulher, perigo, sol, sangue, chama, masculinidade

Dinamismo, força, energia, revolta, movimento, coragem, intensidade, paixão, ira, ação, agressividade, alegria.

Simboliza aproximação, encontro. Estimula os instintos naturais

TABELA DE SENSAÇÕES CROMÁTICAS

Outono, laranja, pôr do sol, luz, chama, calor, festa, perigo, fogo, aurora, raios solares

Força, luminosidade, dureza, prazer, euforia, energia, alegria, tentação, advertência, senso de humor

Simboliza o flamejar do fogo. Estimula oapetite

Significado

Cor



Símbolo

Flor grande, terra argilosa, palha, luz, topázio, verão, limão, Chinês.

Iluminação, conforto, alerta, ciúme, orgulho, esperança, idealismo, egoísmo, inveja, ódio, euforia, expectativa

Simboliza a cor da luz irradiante em todas as direções. Em excesso torna-se monótono e cansativo


Umidade, folhagem frescor, águas claras, bosque, natureza.

Bem-estar, paz, saúde, desejo, tranqüilidade, equilíbrio, esperança, liberalidade.

Simboliza a faixa harmoniosa que se interpões entre o céu e o sol. Cor repousante. Inibe o apetite..

Cor



Símbolo

Águas tranqüilas, Céu,gelo, frio, mar, montanha longínqua

Espaço, viagem, verdade, sentido, afeto, serenidade, intelectualidade, meditação, confiança, infinito, amizade

Cor do céu sem nuvens. Sensação do movimento para o infinito.


Noite, janela, sonho igreja, aurora, mar profundo

Fantasia, mistério, dignidade profundidade, justiça, misticismo, espiritualidade.

Significado

Cor



Símbolo

Terra, sensualidade, outono, doença, águas lamacentas, desconforto.

Pesar, melancolia, resistência, vigor


Vidência, agressão,furto, miséria.

Engano, calma, autocontrole

Simboliza a dignidade real

Significado

Fonte: Farina (1986) p. 111

Linha e o seu uso em interfaces homem-computador


As linhas retas possuem três tipos básicos: a horizontal, a vertical e a diagonal.

LINHA

Já as linhas curvas podem ser classificadas em curva simples e curva complexa. A linha curva simples tende a fechar-se sobre si mesma e de voltar para si mesma, e assim, o círculo surge como o plano ora instável estável. Enquanto que a linha curva complexa pode composta por fragmentos circulares geométricos, fragmentos livres ou por ambos.

Horizontal Diagonal Círculo

SIGNIFICADOS DAS LINHAS E FORMAS Fonte: Martins (2000), p. 29

Vertical Curva Quadrado Triângulo

masculino

homem ereto

dignidade

aspirações

estabilidade

firmeza

predomínio

tranqüilidade

continuação

estabilidade

paz

calma

vagar

movimento

desarmonia

crescimento

direção

feminino

abraço

Ñ agride

continuidade

estabilidade

sensualidade

graciosidade

proteção

perfeição

simetria

paz

infinito

formalidade

movimento

tranquilidade

esmero

estabilidade

escuro

honestidade

confiança

preto

ação

conflito

Tensão

Equilíbrio

Força

Vida

Estabilidade

Grande parte dos objetos de interação são delimitados por bordas, ou seja, por linhas, que são bastante significantes na garantia da leveza dos mesmos.

Isto ocorre através da natureza simples dos traços e do distanciamento proposto entre as bordas e os textos contidos na tela, tais como: denominações, títulos, cabeçalhos, rótulos entre outros (Cybis, 1997).

LINHA

Tipografia e sua aplicação em interfaces Homem - Computador


A tipografia é um estudo de letras com o objetivo de resultar em um produto gráfico legível e agradável ao usuário, pois com a evolução das artes gráficas, surgiram as preocupações em relação à disposição de caracteres.

TIPOGRAFIA

Ugaya (1993) diz que, para se ter boa legibilidade, a letra deve possuir tamanho adequado e que possa ser visualizada até determinada distância, ou seja, uma letra com 5 cm de altura por 1 cm de espessura se faz visível até uma distância de 20m.

TIPOGRAFIA

A proporção ideal entre altura e espessura é de 4/3, e o espaço entre os caracteres deve ser ajustado conforme o tipo de fonte utilizada, visando maior conforto visual ao usuário.

Letras rebuscadas contribuem para confundir a leitura, quando observadas de uma distância maior, como o E que pode parecer um B e o C que pode se passar pelo O.

TIPOGRAFIA

Para Cybis (1997) as principais características pertinentes à percepção de fontes utilizadas em textos e rótulos das telas de computadores são a serifa e o espaçamento entre os caracteres.

TIPOGRAFIA

Fontes com serifa são caracterizadas por uma terminação saliente dos caracteres, pode-se citar como exemplo a “Times New Roman”.

Fontes sem serifa são percebidas com leveza, entretanto dificultam a leitura, pode-se exemplificar este tipo de fonte com a “Arial”.

TIPOGRAFIA

Recomenda-se a utilização de fontes sem serifa em títulos e rótulos curtos. (Cybis -1997)

TIPOGRAFIA

Fontes com serifa são recomendadas para textos, a fim de se obter o reconhecimento rápido dos caracteres.

Quanto ao espaçamento entre os caracteres, devem ser dispostos de forma continuamente proporcional.

Ícones em interfaces Homem - Computador


ÍCONES

Ícones, índices e símbolos são freqüentemente utilizados em interfaces com o usuário. Esses elementos proporcionam um guia funcional e estético para interfaces gráficas.

Ícones são usados por toda a Web para representar objetos ou tarefas.

ÍCONES

Recomendações

1. Recomenda-se projetar os ícones criando esboços rápidos. (Marcus, 1992)

Uma vez que o conteúdo semântico tenha sido organizado, crie vários esboços que variem da abstração lógica à imagem concreta.

Indique todos os elementos visuais, seu tamanho e sua localização aproximada. É importante não ser muito preciso ou detalhista no início do projeto; o mais importante é explorar todas as variações possíveis. Avalie se os ícones vão de encontro às necessidades do emissor, do receptor e do meio em que ele será usado.

ÍCONES

Recomendações

2. Comece identificando a proposta do ícone e o seu uso. (Windows, 1995)

Faça uma "tempestade cerebral" sobre possíveis idéias. É freqüentemente difícil projetar ícones que definam operações ou processos.

ÍCONES

Recomendações

3. Recomenda-se o uso de metáforas do mundo real. (Windows, 1995)

Isso facilita o reconhecimento, identificação e associação do ícone por parte do usuário que pode usar a experiência e aprendizado prévio para interpretar o ícone.

ÍCONES

Recomendações

3. Classifique os ícones por estilos. (Marcus, 1992)

Um tratamento estilístico consistente tem grande importância.

ÍCONES

Recomendações

4. Use objetos grandes, linhas grossas e áreas simples para distinguir os ícones

ÍCONES

Recomendações

5. Recomenda-se que o ícone tenha uma aparência simplificada. (Marcus, 1992)

Um ícone composto de muitas partes pode confundir o usuário.

ÍCONES

Recomendações

6. Recomenda-se ter precaução com o uso do anti-aliasing. (Windows, 1995)

A técnica chamada anti-aliasing envolve a adição de pontos coloridos para suavizar as extremidades pontiagudas de um figura gráfica. Entretanto, não use anti-aliasing sobre o lado de fora da extremidade de um ícone, pois os pontos contrastantes podem parecer irregulares ou dentados quando houver uma variação do fundo

ÍCONES

Recomendações

7. Avalie os projetos de ícones mostrando-os para usuários potenciais. (Marcus, 1992)

Quando os protótipos estiverem disponíveis, eles devem ser revisados e testados por usuários típicos. As avaliações que podem afetar todos os aspectos do projeto do ícone devem ser repetidas

ÍCONES

Recomendações

8. Use um estilo comum para todos os ícones. (Windows, 1995)

Repita as características comuns como o uso da mesma fonte de luz (canto superior esquerdo) e evite os contornos em preto; eles aumentam a poluição visual.

ÍCONES

Recomendações

9. Recomenda-se que se comece a projetar os ícones em preto e branco. (Window 95)

Considere a cor como uma propriedade adicional. Também teste as imagens em diferentes fundos, pois o usuário pode mudar o padrão de fundo do seu browser.

ÍCONES

Recomendações

10. Recomenda-se o uso de cor com discrição. (Marcus, 1992)

Para a criação de um ícone é suficiente o uso de cinco cores ou até menos, incluindo o preto, o branco e/ou o cinza. Muita variação de cores distrai a atenção do usuário.

ÍCONES

Recomendações

11. Recomenda-se o uso da paleta de 256 cores. (Window,s1995)

Isto permite ícones com aparência muito realística e faz com que eles possam ser corretamente lidos em monitores configurados para exibir 256 cores ou mais

ÍCONES

Recomendações

12. Finalmente, lembre de considerar o potencial cultural do impacto dos seus ícones. (Windows,

1995)

O que pode ter um certo significado em uma país ou cultura pode ter significados imprevistos em outro. É melhor evitar letras ou palavras, se possível, pois podem fazer com que os desenhos sejam difíceis de aplicar em outras culturas.

Briefing

BRIEFING - CONCEITOS

O briefing é um documento que contém todas as informações e orientações necessárias para desenvolver eficazmente uma estratégia de marketing, campanha de comunicação ou uma simples ação de comunicação.

O briefing vai estabelecer as orientações gerais da campanha que resultam da reflexão entre anunciante e agência. Devem ficar definidos os alvos, objetivos e possíveis limitações.

O briefing em inglês quer dizer instruções

Introdução: - Qual o conceito do produto? - Qual o posicionamento? - Quais os alvos?

Antecedentes: - História da marca, - Outras ações de comunicação- Mercado (evolução, segmentação, posicionamento do produto,

investimento)- Objetivos (market share (parte de mercado), distribuição, vendas,

comunicação)- Produto (nome, característica, embalagem, preço, concorrência)

Ações: Ação de comunicação publicitária ou não, orientação da agência.

MODELO DE BRIEFING

MODELO DE BRIEFING

- Ações:

1. Contexto do Produto ou ServiçoDescrição do Produto, histórico da comunicação anterior da marca,

decrição da concorrência, análise de mercado, comportamento e atitudes dos consumidores e influenciadores.

2. Estratégia de MarketingObjetivos de Marketing (volume de vendas e quotas de mercado),

posicionamento, segmento alvo e fontes de mercado, mix da comunicação.

- Plano de Meios: - Produto e Concorrência (marca produtos, embalagem preço e

distribuição, consumo)- Objetivos (de marketing, de comunicação)- Grupo alvo, tempo, regionalização.

Exemplo de Briefing

Cliente: Sony do Brasil

Data de Fundação: 7 de maio de 1946

Fundadores: Masaru Ibuka e Akio Morita

Área de atuação da empresa: nacional e internacional

Ações da Sony em Manaus:- Produzir produtos Sony com qualidade Sony- Campanha de conservação do meio ambiente- Incentivo ao Festival de Opera do Amazonas na primeira edição.

Produtos: -Micro-system, mini-system, câmeras fotográficas e de vídeo, televisão, DVD player, Playstation (player direcionado para jogos eletrônicos), CD, CD player etc.

Principais pontos positivos (fortes) da empresa:- Investimento em qualidade, design e tecnologia-Marca reconhecida como sinônimo de qualidade

Principais pontos negativos (fracos) da empresa:Preços diferenciados (preços elevados comparados aos dos concorrentes), investimento constante em inovação (alto custo), dificuldade de entrada em determinados mercados

Principais oportunidades:- Surgimento da tecnologia da TV digital

Exemplo de Briefing

Imagem do produto no mercado:-Marca consolidada, associada à tecnologia, média e alta fidelidade nos aparelhos, líder de qualidade.

Valores:Inovação em tecnologiaPraticidadeSegurançaModerno - quanto aos produtos desenvolvidosTradição - quanto ao tempo de existência no mercado

Segmento atingido pela empresa:-Classe alta, classe média-alta e classe média

Público consumidor: Jovens e adultos (maior enfoque), crianças

Exemplo de Briefing

Exemplo de Briefing

Hábitos e atitudes dos consumidores:Gostam de viajar, buscam produtos de qualidade, demonstram status através dos produtos (necessidade de ascensão social)

Comprador do produto e situação de compra:Produtos high-end - Chefe de família ou a pessoa Produtos low-end (por exemplo, discman e walkman) – jovens. Ambos tipos de produtos são comprados quando da necessidade de atualização ou status e podem ser encontrados em lojas de varejo, com pagamento à prestação ou à vista.

Objetivos da empresa (gerais):- Fascinar o cliente, através do sentimento-Produzir produtos de qualidade para satisfazer o cliente

Exemplo de Briefing

Perfil dos concorrente direto:-Investe em tecnologia, ações relacionadas a comportamento e publicidade

Diferencial do produto comparado a similares-A diferença se encontra na marca e na qualidade

Diferencial da empresaAgressivos quanto a lançamento de novos produtosDesenvolvimento rápido da produção

Posicionamento:- Líder de mercado em inovação em seu segmento de produtos- Líder em tecnologia e qualidade

Exemplo de Briefing

Objetivo básico de comunicação:

Manter e fazer novos clientes no Brasil e manutenção da imagem de qualidade

Exemplo de Requisitos Projetuais

Objetivo Geral

Lançar um produto inovador no mercado, no ramo de tintas a óleo, para artistas plásticos.

Título

Lançamento de um produto aplicando estratégias de marketing e design.

componentes de interfaces recomendações ergonômicas para cor aula baseada na aula de walter de...

Documents