SlideShare ist ein Scribd-Unternehmen logo
1 von 13
Linguagem visual
As formas de linguagem são
    dividas em:

   Formas;

   Cores;

   Texturas;

   O desenho de pode ser aprendido de forma semelhante
    ao aprendizado de outras linguagens, como a textual
    ou a musical.
As cores na interface:


 vermelho pode ser relacionado a situações
  de perigo, alarme, atenção, alerta, calor e comandos
  de interrupção;
 amarelo serve bem para advertências;
 verde é relacionado a passagem livre (saída),
  normalidade, vegetação e segurança;

   azul para frio, água (como em cartografia), céu e
    calma.
   Outro fator importante é considerar as características
    físicas do sistema visual do usuário. Elas podem nos
    indicar cuidados com fatores como daltonismo, onde a
    não distinção entre vermelho e verde é significativa. A
    área do centro do campo visual do usuário é mais
    sensível ao verde e ao vermelho. A área periférica do
    campo é mais sensível ao azul, preto, branco e
    amarelo. Se o usuário for de mais idade é aconselhado
    o uso de cores mais saturadas (com mais
    pigmentação).
ícones e textos:


   Um ícone é uma imagem que se assemelha ao objeto
    ao qual se refere. A importância de compreender o
    funcionamento dos ícones na interface e de como
    usá-los num projeto se dá pelo fato deles facilitarem
    muito as operações, economizarem espaço.
Utilidades do ícone:

 O ícone é de reconhecimento mais rápido. O ícone
 permite que pessoas sem domínio ou domínio limitado
 de leitura possam interagir com um software por meio
 da interface.


* Ações, como: salvar, imprimir, recortar, confirmar,
  cancelar;
 * Navegação, indicando a direção e local onde irá
  chegar;
 * Operadores simples como os de vídeo, partes do
  sistema como discos, arquivos, e periféricos.
•   Numa interface digital, o afastamento entre as fontes
    deve ser maior que em documentos impressos temos
    que ter cautela e manter uma unidade na interface por
    meio de estilo, tamanho e cores. Estas características
    podem auxiliar ou prejudicar o usuário durante a
    leitura. Se for possível, o ideal é usar apenas um estilo
    e tipo de fonte, e que seja adequada ao tema da
    interface. Um exemplo é o uso de fontes com
    aparência de antigo para um objeto de história
    medieval.
   Função ilustrativa- podemos ter uma ilustração que
    acompanhe um texto e representa visualmente uma idéia

   Função taxômica- para definir como elemento de uma
    interface(textos,ícones,animações,barras de menus)

   Função sinalização- quando o usuário esta fazendo um
    download da Internet aparece uma barra que vai sendo
    preenchida para sinalizar quanto falta o processo
    permitindo que o usuário escolha entre continuar ou
    cancelar.
   Função operativa- Para operar qualquer aparelho
    necessitamos de botões de áreas que podemos
    escrever os mais comuns são os botões de caixa de
    ferramentas setas de navegação ou menus com
    palavras ou ícones explicativos.

   Proximidade de Alinhamento- as imagens que
    pertencem ao mesmo grupo devem estar próximas .
    Esses traços são características como cor, contraste e
    forma estilo de desenho. Isso facilita a interpretação
    do usuário quanto ao significado da imagem. O
    alinhamento permite estabelecer uma ordem de
    leitura no interface.
•   Equilíbrio Proporção e simetria- as imagens do
    interface deve ter uma relação dinâmica ou estática esta é
    quando temos pesos iguais ou todos os elementos
    centralizados.
   Cores e contrastes- as cores e as áreas claras e escuras
    orientam a atenção do usuário para as partes do interface
    são úteis para dar ênfase orientar a leitura isto é focar o
    assunto.

   Consistência identidade- uma interface pode ser por
    diversas partes ou paginas que dever ter consistência de
    identidade visual, devemos usar cores ,estilos de
    desenhos ,formas de textos animações como padrões que
    dão identidade ao interface.

•   Concisão- devemos usar as palavras certas no momento
    certo. No interface devemos usar as imagens adequadas
    nos lugares de ordem certos para o melhor aprendizado.
   Visibilidade e legibilidade- numa interface temos
    que poder ler tanto como os textos e as imagens de
    forma confortável. Neste caso a dimensão tem
    importância fundamental ex: os vídeos se a área do
    vídeo é muito pequena pode não ser possível ler os
    sinais produzido pela mãos.
Nomes: Viviana, Cristiane e Clarissa.

Weitere ähnliche Inhalte

Andere mochten auch

meninXs - TCC de Design Estratégico
meninXs - TCC de Design EstratégicomeninXs - TCC de Design Estratégico
meninXs - TCC de Design EstratégicoMateus Oazem
 
Horario total de clases
Horario total de clasesHorario total de clases
Horario total de clasesJulio Guardado
 
áLbum de fotografías
áLbum de fotografíasáLbum de fotografías
áLbum de fotografíasjavierlucero16
 
Examiner new frontiers july 2011 page 1
Examiner   new frontiers july 2011 page 1Examiner   new frontiers july 2011 page 1
Examiner new frontiers july 2011 page 1retreathouse
 
Intenção dos micro e pequenos empresários em tomar crédito tem leve melhora, ...
Intenção dos micro e pequenos empresários em tomar crédito tem leve melhora, ...Intenção dos micro e pequenos empresários em tomar crédito tem leve melhora, ...
Intenção dos micro e pequenos empresários em tomar crédito tem leve melhora, ...Gustavo Salgado
 
Poster Design Two
Poster Design TwoPoster Design Two
Poster Design TwoParnyan
 
U.S. EIA's Drilling Productivity Report - November 2016
U.S. EIA's Drilling Productivity Report - November 2016U.S. EIA's Drilling Productivity Report - November 2016
U.S. EIA's Drilling Productivity Report - November 2016Marcellus Drilling News
 
pareamento e compartilhamento com windows 7
pareamento e compartilhamento com windows 7pareamento e compartilhamento com windows 7
pareamento e compartilhamento com windows 7rphasaigg
 

Andere mochten auch (16)

DEEPAK
DEEPAKDEEPAK
DEEPAK
 
meninXs - TCC de Design Estratégico
meninXs - TCC de Design EstratégicomeninXs - TCC de Design Estratégico
meninXs - TCC de Design Estratégico
 
Horario total de clases
Horario total de clasesHorario total de clases
Horario total de clases
 
áLbum de fotografías
áLbum de fotografíasáLbum de fotografías
áLbum de fotografías
 
Sopa de letras
Sopa de letrasSopa de letras
Sopa de letras
 
Centro
CentroCentro
Centro
 
Entornos virtuales
Entornos virtualesEntornos virtuales
Entornos virtuales
 
Examiner new frontiers july 2011 page 1
Examiner   new frontiers july 2011 page 1Examiner   new frontiers july 2011 page 1
Examiner new frontiers july 2011 page 1
 
Ane
AneAne
Ane
 
Intenção dos micro e pequenos empresários em tomar crédito tem leve melhora, ...
Intenção dos micro e pequenos empresários em tomar crédito tem leve melhora, ...Intenção dos micro e pequenos empresários em tomar crédito tem leve melhora, ...
Intenção dos micro e pequenos empresários em tomar crédito tem leve melhora, ...
 
bevraging huisartsen
bevraging huisartsenbevraging huisartsen
bevraging huisartsen
 
Poster Design Two
Poster Design TwoPoster Design Two
Poster Design Two
 
U.S. EIA's Drilling Productivity Report - November 2016
U.S. EIA's Drilling Productivity Report - November 2016U.S. EIA's Drilling Productivity Report - November 2016
U.S. EIA's Drilling Productivity Report - November 2016
 
Catalogo
CatalogoCatalogo
Catalogo
 
Materiais equipamentos
Materiais equipamentosMateriais equipamentos
Materiais equipamentos
 
pareamento e compartilhamento com windows 7
pareamento e compartilhamento com windows 7pareamento e compartilhamento com windows 7
pareamento e compartilhamento com windows 7
 

Ähnlich wie A linguagem visual pronto

Web 2.0 uso_das_cores_nas_interfaces_digitais
Web 2.0 uso_das_cores_nas_interfaces_digitaisWeb 2.0 uso_das_cores_nas_interfaces_digitais
Web 2.0 uso_das_cores_nas_interfaces_digitaisCris Souza
 
Web 2.0 uso_das_cores_nas_interfaces_digitais_cris_souza
Web 2.0 uso_das_cores_nas_interfaces_digitais_cris_souzaWeb 2.0 uso_das_cores_nas_interfaces_digitais_cris_souza
Web 2.0 uso_das_cores_nas_interfaces_digitais_cris_souzaCris Souza
 
Grupo6 Cmm Legibilidade
Grupo6 Cmm LegibilidadeGrupo6 Cmm Legibilidade
Grupo6 Cmm LegibilidadeJoão Graça
 
Interfaces
InterfacesInterfaces
InterfacesCBMERJ
 
Apresentação de LINGUAGEM DE Programação para Internet
Apresentação de LINGUAGEM DE Programação para InternetApresentação de LINGUAGEM DE Programação para Internet
Apresentação de LINGUAGEM DE Programação para Internetfmota2
 
Diretrizes | Construção de um doc word acessível
Diretrizes | Construção de um doc word acessívelDiretrizes | Construção de um doc word acessível
Diretrizes | Construção de um doc word acessívelPaula CAA
 
Apresentacoes eficientes
Apresentacoes eficientesApresentacoes eficientes
Apresentacoes eficientesperes marlene
 
Semiotica fundamentos da composição visual (atv07)
Semiotica   fundamentos da composição visual (atv07)Semiotica   fundamentos da composição visual (atv07)
Semiotica fundamentos da composição visual (atv07)aline totti
 
3 critérios ergonômicos
3  critérios ergonômicos3  critérios ergonômicos
3 critérios ergonômicosEdson Soares
 
Laboratório Web 2013-2014 - Etapas na Produção: Desenho e Composição
Laboratório Web 2013-2014 - Etapas na Produção: Desenho e ComposiçãoLaboratório Web 2013-2014 - Etapas na Produção: Desenho e Composição
Laboratório Web 2013-2014 - Etapas na Produção: Desenho e ComposiçãoRicardo Pereira Rodrigues
 
A usabilidade na interface
A usabilidade na interfaceA usabilidade na interface
A usabilidade na interfaceOdair Cavichioli
 

Ähnlich wie A linguagem visual pronto (20)

Web 2.0 uso_das_cores_nas_interfaces_digitais
Web 2.0 uso_das_cores_nas_interfaces_digitaisWeb 2.0 uso_das_cores_nas_interfaces_digitais
Web 2.0 uso_das_cores_nas_interfaces_digitais
 
Web 2.0 uso_das_cores_nas_interfaces_digitais_cris_souza
Web 2.0 uso_das_cores_nas_interfaces_digitais_cris_souzaWeb 2.0 uso_das_cores_nas_interfaces_digitais_cris_souza
Web 2.0 uso_das_cores_nas_interfaces_digitais_cris_souza
 
Sm C1
Sm C1Sm C1
Sm C1
 
Grupo6 Cmm Legibilidade
Grupo6 Cmm LegibilidadeGrupo6 Cmm Legibilidade
Grupo6 Cmm Legibilidade
 
Design interfaces para internet
Design interfaces para internetDesign interfaces para internet
Design interfaces para internet
 
Interfaces
InterfacesInterfaces
Interfaces
 
Aula04 criacaomoda
Aula04 criacaomodaAula04 criacaomoda
Aula04 criacaomoda
 
9 regras usabilidade
9 regras usabilidade9 regras usabilidade
9 regras usabilidade
 
Apresentação de LINGUAGEM DE Programação para Internet
Apresentação de LINGUAGEM DE Programação para InternetApresentação de LINGUAGEM DE Programação para Internet
Apresentação de LINGUAGEM DE Programação para Internet
 
Ihm07
Ihm07Ihm07
Ihm07
 
Diretrizes | Construção de um doc word acessível
Diretrizes | Construção de um doc word acessívelDiretrizes | Construção de um doc word acessível
Diretrizes | Construção de um doc word acessível
 
Análise de Webstandars
Análise de WebstandarsAnálise de Webstandars
Análise de Webstandars
 
Apresentacoes eficientes
Apresentacoes eficientesApresentacoes eficientes
Apresentacoes eficientes
 
Guia para Desenvolver Interfaces Digitais Acessíveis
Guia para Desenvolver Interfaces Digitais AcessíveisGuia para Desenvolver Interfaces Digitais Acessíveis
Guia para Desenvolver Interfaces Digitais Acessíveis
 
Semiotica fundamentos da composição visual (atv07)
Semiotica   fundamentos da composição visual (atv07)Semiotica   fundamentos da composição visual (atv07)
Semiotica fundamentos da composição visual (atv07)
 
Design de interfaces para internet
Design de interfaces para internetDesign de interfaces para internet
Design de interfaces para internet
 
3 critérios ergonômicos
3  critérios ergonômicos3  critérios ergonômicos
3 critérios ergonômicos
 
Laboratório Web 2013-2014 - Etapas na Produção: Desenho e Composição
Laboratório Web 2013-2014 - Etapas na Produção: Desenho e ComposiçãoLaboratório Web 2013-2014 - Etapas na Produção: Desenho e Composição
Laboratório Web 2013-2014 - Etapas na Produção: Desenho e Composição
 
Tipografia ii
Tipografia iiTipografia ii
Tipografia ii
 
A usabilidade na interface
A usabilidade na interfaceA usabilidade na interface
A usabilidade na interface
 

A linguagem visual pronto

  • 2. As formas de linguagem são dividas em:  Formas;  Cores;  Texturas;  O desenho de pode ser aprendido de forma semelhante ao aprendizado de outras linguagens, como a textual ou a musical.
  • 3. As cores na interface:  vermelho pode ser relacionado a situações de perigo, alarme, atenção, alerta, calor e comandos de interrupção;  amarelo serve bem para advertências;  verde é relacionado a passagem livre (saída), normalidade, vegetação e segurança;  azul para frio, água (como em cartografia), céu e calma.
  • 4. Outro fator importante é considerar as características físicas do sistema visual do usuário. Elas podem nos indicar cuidados com fatores como daltonismo, onde a não distinção entre vermelho e verde é significativa. A área do centro do campo visual do usuário é mais sensível ao verde e ao vermelho. A área periférica do campo é mais sensível ao azul, preto, branco e amarelo. Se o usuário for de mais idade é aconselhado o uso de cores mais saturadas (com mais pigmentação).
  • 5. ícones e textos:  Um ícone é uma imagem que se assemelha ao objeto ao qual se refere. A importância de compreender o funcionamento dos ícones na interface e de como usá-los num projeto se dá pelo fato deles facilitarem muito as operações, economizarem espaço.
  • 6. Utilidades do ícone: O ícone é de reconhecimento mais rápido. O ícone permite que pessoas sem domínio ou domínio limitado de leitura possam interagir com um software por meio da interface. * Ações, como: salvar, imprimir, recortar, confirmar, cancelar; * Navegação, indicando a direção e local onde irá chegar; * Operadores simples como os de vídeo, partes do sistema como discos, arquivos, e periféricos.
  • 7. Numa interface digital, o afastamento entre as fontes deve ser maior que em documentos impressos temos que ter cautela e manter uma unidade na interface por meio de estilo, tamanho e cores. Estas características podem auxiliar ou prejudicar o usuário durante a leitura. Se for possível, o ideal é usar apenas um estilo e tipo de fonte, e que seja adequada ao tema da interface. Um exemplo é o uso de fontes com aparência de antigo para um objeto de história medieval.
  • 8. Função ilustrativa- podemos ter uma ilustração que acompanhe um texto e representa visualmente uma idéia  Função taxômica- para definir como elemento de uma interface(textos,ícones,animações,barras de menus)  Função sinalização- quando o usuário esta fazendo um download da Internet aparece uma barra que vai sendo preenchida para sinalizar quanto falta o processo permitindo que o usuário escolha entre continuar ou cancelar.
  • 9. Função operativa- Para operar qualquer aparelho necessitamos de botões de áreas que podemos escrever os mais comuns são os botões de caixa de ferramentas setas de navegação ou menus com palavras ou ícones explicativos.  Proximidade de Alinhamento- as imagens que pertencem ao mesmo grupo devem estar próximas . Esses traços são características como cor, contraste e forma estilo de desenho. Isso facilita a interpretação do usuário quanto ao significado da imagem. O alinhamento permite estabelecer uma ordem de leitura no interface.
  • 10. Equilíbrio Proporção e simetria- as imagens do interface deve ter uma relação dinâmica ou estática esta é quando temos pesos iguais ou todos os elementos centralizados.
  • 11. Cores e contrastes- as cores e as áreas claras e escuras orientam a atenção do usuário para as partes do interface são úteis para dar ênfase orientar a leitura isto é focar o assunto.  Consistência identidade- uma interface pode ser por diversas partes ou paginas que dever ter consistência de identidade visual, devemos usar cores ,estilos de desenhos ,formas de textos animações como padrões que dão identidade ao interface. • Concisão- devemos usar as palavras certas no momento certo. No interface devemos usar as imagens adequadas nos lugares de ordem certos para o melhor aprendizado.
  • 12. Visibilidade e legibilidade- numa interface temos que poder ler tanto como os textos e as imagens de forma confortável. Neste caso a dimensão tem importância fundamental ex: os vídeos se a área do vídeo é muito pequena pode não ser possível ler os sinais produzido pela mãos.