Interfaces de usuário - cores e layout

votos
8

Embora eu sou especificamente interessado em informações do aplicativo web, eu também seria um pouco curioso sobre o desenvolvimento de aplicativos de desktop também. Esta questão é impulsionado por meu trabalho no meu site pessoal, bem como o meu trabalho, onde tenho desenvolvido algumas características, mas deixou para os outros a integrar-se na aparência do site.

Há algum guias ou regras de ouro para coisas como esquemas de cores, layouts, formatação, etc? Quero assegurar a legibilidade e clareza para os visitantes, mas não ser branda e aborrecido ao mesmo tempo.

Quanto ao meu conhecimento nesta área - Se você me entregar uma foto, eu tenho conhecimento suficiente para reproduzi-lo na tela, mas se você me perguntar para projetar uma nova interface ou reformular um já existente, eu não saberia por onde começar .

Publicado 07/08/2008 em 21:01
fonte usuário
Em outras línguas...                            


8 respostas

votos
5

Normalmente, cada sistema operacional tem diretrizes de interface de usuário. Para o Windows, têm uma olhada aqui . (Edit: Os links que estão quebrados pós Mas uma busca por " Diretrizes de interface do usuário " na MSDN tem artigos sobre tudo)

Apple tem o seu próprio bem. Além disso, você pode querer manter a acessibilidade em mente.

Respondeu 07/08/2008 em 21:04
fonte usuário

votos
3

Uma dica para verificar se suas cores têm bom contraste é tirar um instantâneo dele e converter em tons de cinza. Se você não pode ler alguma coisa, as cores eram certamente mal escolhido.

Além disso, embora não é sobre interfaces de usuário, Antes e Depois Revista pode lhe dar algumas boas dicas sobre cor, design e assuntos relacionados. Ele ainda tem alguns free pdf de fazer o download.

Respondeu 07/08/2008 em 21:10
fonte usuário

votos
2

Para UI web, eu vou sair em um membro aqui e dizer que a cor mais importante na web design é branco, ou "light". Esta é a cor em cima do qual você colocar extensões densas de conteúdo.

texto escuro, fundo claro, sempre, quando se trata de suas áreas de conteúdo primários.

E a regra mais importante em layouting é espaço em branco. Deixe o conteúdo respirar.

Após estas duas regras simples vale mais do que a maioria das diretrizes "interface de usuário de usabilidade".

E pelo modo, as orientações da interface de utilizador MS são (de um modo geral) terrível. Leia Jakob Nielsen, olhar para a estética de design da Apple, mas ficar longe do MS "neutra cinza / azul crunchbox" 12 passos Assistente filosofia texto 10pt de UI.

(E eu digo isso como um longo tempo MS GUI programador)

Respondeu 07/08/2008 em 22:37
fonte usuário

votos
2

O livro Designing Interfaces , por Jenifer Tidwell tem todo um capítulo sobre o assunto (Capítulo 9, trechos acessível online). O livro inteiro é vale a pena recomendar.

Respondeu 07/08/2008 em 21:15
fonte usuário

votos
1

Use altas combinações de cores de contraste; texto em preto sobre fundo branco é o melhor exemplo de uma alta combinação contraste.

Uma má combinação é texto verde no fundo vermelho. É horrível para pessoas daltônicas (como eu).

Veja o que seu site se parece com um cego de cor: colorfilter.wickline.org

Respondeu 07/08/2008 em 22:41
fonte usuário

votos
1

Eu sou horrível em encontrar cores que ficam bem juntos, então eu enganar e usar imagens da natureza que são principalmente a cor que eu quero (digamos, verde) e, em seguida, eu uso este site para retirar o esquema de cores principal. Geralmente a natureza faz um bom trabalho de definir os seus próprios esquemas de cores agradáveis.

Respondeu 07/08/2008 em 22:02
fonte usuário

votos
0

Aqui estão algumas dicas simples para a usabilidade em sua tipografia . Essas coisas tratar principalmente de legibilidade e acessibilidade preocupações.

DOs:

  • Use o dimensionamento da fonte relativa (em)
  • Identificar as alterações de linguagem dentro de um documento usando o atributo LANG
  • texto preto em um fundo branco
  • Para posições, usar H1, H2, etc, e incorporá-las de forma apropriada
  • Chunk-se o conteúdo e organizar com títulos que se encaixam o que seus usuários estão procurando
  • Escrever a cópia clara e simples
  • Alinhar a esquerda, direita irregular
  • cor de texto-para-fundo deve ser de alto contraste

Não é:

  • Use "clique aqui" ou "mais" como texto do link
  • Use sublinham para dar ênfase
  • Mais de 2 famílias de tipo de fonte
  • itálico
  • Blocos de texto usando todas as letras maiúsculas
  • Use verdadeiro texto azul vermelho ou verdadeiro no fundo branco (aberração cromática)
Respondeu 17/09/2009 em 19:12
fonte usuário

votos
0

Quanto aos aplicativos de desktop: Faça o que fizer, não use cores escolhidas a dedo. Ficar com as cores do sistema nomeadas como "fundo da janela", "Texto Menu", etc. Caso contrário, as pessoas que dependem de recursos de acessibilidade do sistema operacional será bloqueado com as opções de cores (incapazes de escolher um tema de alto contraste, por exemplo) e para pessoas que gostam de personalizar seus temas de desktop vão pensar que a sua aplicação é fugly.

Respondeu 07/08/2008 em 22:49
fonte usuário

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more