Eu não sei desenhar. Como posso fazer aplicativos refinados?


41

Eu não sou um designer gráfico. Eu sou muito ruim em desenhar qualquer coisa. Eu luto para criar coisas que pareçam tão boas quanto aplicativos de "amostra" empacotados com ferramentas de desenvolvimento; principalmente porque não tenho agachamento no que diz respeito aos ativos de arte.

Que estratégias posso tomar para mitigar isso?


3
Só para esclarecer: você deseja criar GUIs que não usam a aparência e o padrão da plataforma? A primeira pergunta seria: por que não confiar no sistema operacional para desenhar sua interface do usuário?
amigos estão dizendo sobre Konrad Rudolph

2
@KonradRudolph: Mesmo com a aparência padrão (que é realmente o que eu acho mais agradável do que qualquer outra coisa na maioria das vezes), ainda existem recursos de arte normalmente necessários para um aplicativo sofisticado, como ícones.
precisa saber

5
Ativos de ícone: use conjuntos de ícones de código aberto. ;-) Há alguns bastante alta qualidade, por exemplo, do Silk Icons FamFamFam ou Glyphicons ... Pessoalmente eu prefiro evitar muitos outros gráficos, mas para aqueles contrato de trabalho é provavelmente a melhor solução ...
Konrad Rudolph

method.ac pode ser útil, uma vez lançado.
Maxpm

Respostas:


24

Pessoalmente , não acho que você precise ser bom artisticamente para criar interfaces de usuário agradáveis .

O que cria uma boa interface do usuário não depende da criatividade, mas está mais relacionado a algumas diretrizes bem estabelecidas. Se você seguir estas diretrizes e praticar algumas, poderá criar ótimas interfaces.

Eu sugeriria fazer o seguinte ...

  • Leia sobre o que faz uma boa interface de usuário. (on-line principalmente)
  • Pesquise e encontre algumas interfaces de usuário que são agradáveis ​​para você.
  • Compare vários bons designs e tente escolher coisas semelhantes entre eles.
  • Agora olhe para o seu próprio design e veja se você possui esses elementos.
  • Tente recriar sua interface do usuário para ser semelhante à que você gostou.

Eu prevejo que, se você fizer esse exercício por uma semana ou duas (e se você me perguntar, uma semana ou duas para aprender como criar boas interfaces não é tão longo), você aprenderá a maior parte do que faz uma boa interface de usuário .

Descobri apenas algumas coisas que tornam as interfaces de usuário agradáveis:

  • Simplicidade
  • Consistência (cores, fontes, uso de botões, links, etc ...)
  • Espaçamento
  • Menos é mais (oculte o máximo possível do usuário sem diminuir a usabilidade)
  • Não use fundo branco e fonte preta. Verifique se o contraste é bom o suficiente, mas geralmente altere o plano de fundo para um tom claro de cinza, enquanto a fonte ficará cinza escuro.

Além disso ... não comece com o design. Comece com a funcionalidade e deixe o design evoluir. Além disso, experimente! Não fique chateado se não parecer perfeito após 1-2 'iterações'. Fica melhor com o tempo. Mas o mais importante, você tem que tentar .


3
Estou falando de polonês, não UX. Saber como criar uma interface do usuário "agradável" não ajuda (por exemplo) seus ícones a ficarem melhores.
precisa saber é o seguinte

5
@ Billyilly: Desculpe, mas sua pergunta para mim foi muito mais ampla do que 'criar ícones'.
c_maker

3
Isto é; ícones são apenas um exemplo simples. Meu argumento foi que isso não está "escondido atrás de uma desculpa" - há partes legítimas do design decente da interface do usuário que exigem, bem, arte. Existem interfaces bonitas e inutilizáveis, interfaces utilizáveis ​​e feias, interfaces inutilizáveis ​​e feias e interfaces utilizáveis ​​e bonitas; um aplicativo aprimorado precisa ser útil e visualmente atraente. Você aborda bem a usabilidade nesta resposta (+1); mas o "bonito" também é uma preocupação legítima.
Billy ONeal

Eu acho que a cor da fonte / coisa da cor de fundo está seguindo o caminho certo aqui. A questão do contraste foi um dos primeiros itens para os quais recebi feedback público do primeiro site que publiquei. Talvez outras dicas, como escolher / aplicar cores - quantas? Um ou dois? Mais? Claro ou escuro? Colocá-lo nos títulos? Fronteiras? Fundo? Todos / nenhum / alguns dos itens acima?
Stoive

12

Minha habilidade artística é sobre a 5ª série em um bom dia :). Emprego um designer gráfico, profissionalmente no trabalho, ou minha esposa, que possui excelentes habilidades artísticas e adora usá-las.

Observe que, em minha opinião, o design gráfico não é um design de interface do usuário / UX. Faço a maioria do UX ou emprego um especialista em UX para manter o controle do UX, que trabalha com o GD para torná-lo bonito. Embora eu tenha certeza de que existem bons profissionais combinados de UX / GD, tive experiências muito ruins com GDs fazendo coisas que pareciam bonitas, tinham uma UX muito ruim e estavam desatualizadas em alguns meses, e não correrei esse risco até que eu trabalharam com o GD em alguns projetos.


1
Então, pague alguém para fazer isso ou seja atrelado a alguém que possa fazer isso de graça? : p. E se for muito cedo para pagar um designer - uma prova de conceito ou experimentar a funcionalidade? É necessário que haja uma atenção estética mínima ao software, para que as pessoas que demonstram não se distraiam com cores e fontes estranhas, pelas quais eu não sei como melhorar.
Stoive

2
@Stoive. Ótimo ponto, agora você me iniciou. As impressões iniciais são realmente importantes. Para qualquer não-engenheiro (e muitos engenheiros), o GD é geralmente crítico, infelizmente supera o design e a engenharia do UX em várias ordens de magnitude. Faça com que os gráficos pareçam mais claros e brilhantes, e as pegas se aglomeram no produto, não importa o quão ruim seja. Obter o errado GD ......
mattnz

1
Para elaborar - eu convenci um cliente a contratar um designer gráfico antes (design de interface do usuário é bom, gráficos é horrendo), afirmando que bons visuais projetam confiança e confiabilidade para os usuários. Nesse caso, o cliente já estava pagando (suas idéias, eu estava apenas codificando), mas em outras circunstâncias você precisa transmitir confiança e credibilidade aos clientes antes de conseguir dinheiro para recursos de design gráfico. Ou, de acordo com o OP (projetos de hobby?), O dinheiro nunca estará envolvido - a contratação de um designer não é viável, mas a apresentação ainda é importante.
Stoive

9

Se você está procurando por recursos gráficos, existem alguns sites que coletam gráficos de alta qualidade para uso gratuito :

  • Bootstrap para indiscutivelmente a melhor (mas definitivamente a mais quente agora) estrutura da Web da interface do usuário
  • Glyphicons para um conjunto de ícones que complementa a estrutura da interface do usuário Bootstrap do Twitter
  • Padrões sutis para, bem, padrões sutis de fundo
  • Ícones de seda do FamFamFam, que são usados ​​em muitos softwares por todo o lado
  • Mercado Criativo para diversos elementos

E muito mais, como o projeto de arte do GNOME , que também inclui muitos recursos gráficos gratuitos.

Não sendo nem um pouco criativo, e sem educação em design, sempre me esforço do lado do conservadorismo: use padrões estabelecidos (ou seja, estruturas) e me afasto o menos possível dos caminhos trilhados. Isso não será necessariamente muito interessante, mas pelo menos você minimiza sua chance de falha e desastre de UX.

Picasso disse que “grandes artistas roubam”, mas na realidade são principalmente os hacks sem talento, e veja onde isso levou a Microsoft e a Samsung: a plataformas de grandes vendas.


8

Você pode contratar especialistas para esse tipo de coisa, mas não precisa de capacidade artística inata para aprender algumas técnicas básicas. Meu diploma de graduação na verdade exigia um semestre de "arte para engenheiros". Ter uma aula ou duas na faculdade comunitária local pode ser muito benéfico. Você ainda não será tão bom quanto as pessoas especialmente treinadas no campo, mas pode definitivamente melhorar a ponto de seus programas parecerem mais profissionais.

Também existem livros voltados para amadores relativos. Um livro que achei útil para web design é Os princípios de belo web design, de Jason Beaird. Mesmo que seus designs não melhorem muito, obter um pouco de educação pode ajudá-lo a verbalizar melhor o que há de errado com um design. Em vez de sempre dizer: "Eu sei que parece ruim, mas não consigo entender o porquê", você poderá identificar problemas como kerning ruim ou falta de espaço negativo, e definir o problema é metade da batalha.


3

O que você pode estar procurando é "UI / UX Design for Developers". Um livro relacionado a este tópico é Design de interface do usuário para programadores

Se você não está procurando design de interface do usuário / UX, mas quer melhorar as habilidades de design gráfico, recomendo encontrar uma aula sobre como usar o Adobe Photoshop ou o Adobe Illustrator (caso contrário, pelo menos alguns tutoriais na Internet). Aprendendo algumas técnicas e analisando o trabalho de outras pessoas em busca de inspiração, você ficaria surpreso com a pouca criatividade artística necessária.

Por exemplo, você pode aprender a Ferramenta Gradiente no Photoshop, juntamente com a ferramenta Retângulo arredondado, e pode criar algo semelhante ao botão "Inscreva-se no boletim informativo" à direita (embora, neste caso, seja feito com CSS puro).


A maioria (? Todos) do livro de Joel pode ser encontrada em seu site: joelonsoftware.com/uibook/fog0000000249.html
Fara

Parece que cerca de 2/3 do livro está lá. Não possui capítulos 13-18.
26512 Steve Bennett

1

Deixe que outros "façam o trabalho para você" na forma de usar estruturas, modelos e componentes de interface gráfica pré-criados. Por exemplo, eu não posso desenhar ou desenhar. Assim, para cada novo projeto da Web, inicio com um modelo de CSS (dos muitos sites gratuitos de modelo de CSS) para o layout e o design e, em seguida, o 'ajuste' a partir daí. Esses modelos incluem um design completo que pode ajudá-lo a solucionar essa lacuna.

Eu concordo com o c_maker em que boa usabilidade é um bom design, embora pareça que você está sendo mais específico no final 'arty' de design.

Se você estiver trabalhando com design e layout da web, aqui estão alguns desses sites de css:
http://www.freecsstemplates.com/
http://www.templatemo.com/
http://www.free-css.com/
http : //www.oswd.org/
http://www.openwebdesign.org/


Isso funciona bem para desenvolvedores da Web, eu acho. Pensando realmente mais linguagem - magnético aqui embora. Clientes grossos também precisam de interface do usuário.
Billy ONeal
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.