7 regras para criar um design simples
Mantenha simples, idiota. Esse conceito data de 1960, quando a Marinha dos EUA implementou o princípio KISS, que afirma que a maioria dos sistemas funciona melhor se forem simples, e não complicados. O mesmo se aplica a praticamente qualquer projeto de design.
A maioria dos designers gráficos aprende sobre o KISS no início de suas carreiras. Então, como você pode fazer isso? Criar um design simples é um pouco mais complicado do que você imagina. Aqui estão sete regras para criar, que ajudam você a eliminar toda a confusão e a criar uma conta lindamente simples.
Explorar recursos de design
1. Defina uma meta por página
O início de um design simples começa com uma meta para o projeto e metas específicas para cada página do site. Cada página deve levar os usuários a uma ação, excluindo a navegação e o rodapé.
Pode ser qualquer coisa, desde clicar em um link, inserir informações em um formulário, assistir a um vídeo ou jogar um jogo. Mas cada página deve se concentrar em uma única ação ou conversão do usuário.
Muitas coisas a fazer podem sobrecarregar os usuários. Eles podem perder de vista quais ações devem ser concluídas e podem fazer a escolha menos desejável. Planeje o design para que cada página leve os usuários a uma única meta. Todos os botões acionáveis acima do rolo e abaixo do rolo na mesma página devem fazer a mesma coisa. Essa consistência ajuda os usuários a entender por que eles estão no seu site e o que devem fazer; a simplicidade dessas opções torna o design fácil e envolvente.
2. Atenha-se a duas famílias de tipos
Existem muitas diretrizes de design que recomendam três tipos de letra para um projeto. Você pode otimizar ainda mais isso com duas famílias de tipos robustas.
Procure uma família de tipos que inclua vários pesos com bastante contraste entre as opções normal e negrito ou preto. Para ainda mais elegância, opte por uma opção de exibição que inclua alguns caracteres alternativos que você pode usar em títulos grandes.
Tudo o que você precisa fazer é misturar e combinar a partir de um tipo de corpo e exibir o tipo de letra para obter ótimas combinações de letras para todo o design. Use duas famílias de tipos da mesma forma que faria se tivesse selecionado mais opções com usos específicos para determinados pesos ou estilos.
Você descobrirá que isso pode ajudá-lo a criar uma paleta de tipografia altamente legível e fácil de usar, fácil de gerenciar e com consistência visual.
3. Use alinhamento consistente
Esquerda, central ou mesmo à direita - seja qual for o alinhamento que você desejar, mantenha-o em todo o design. Isso inclui alinhar itens como caixas de texto e elementos que não são parecidos, mas que se encaixam em agrupamentos.
O Adaptable faz um ótimo trabalho com o texto no controle deslizante da página inicial. Apesar do texto com diferentes números de linhas na imagem, cada título se alinha com o botão de chamada à ação. O espaçamento entre os elementos também é consistente.
Além disso, esse alinhamento consistente é executado no pergaminho com outros títulos e pares de CTA.
O alinhamento corresponde ao fluxo do controle deslizante, que também se move em uma direção complementar. Os alinhamentos esquerdo e central são as opções mais comuns quando se trata de elementos de texto, porque são os mais legíveis. Com texto mais longo, o alinhamento à esquerda é a opção preferida.
4. Estabelecer Hierarquia
Os usuários não devem ter que pensar no que olhar ou como se mover no design. Mesmo as composições visuais mais simples devem ter uma hierarquia distinta.
Começa com um visual dominante. Pode ser uma imagem ou vídeo ou exibição de texto ou qualquer outra coisa que cause uma primeira impressão.
Depois, deve haver algum tipo de texto que informe ao usuário o que o design e o site estão tentando se comunicar. Isso geralmente ocorre na forma de um título simples que funciona com o visual dominante.
Terceiro, é um texto secundário ou ação para os usuários concluírem. O elemento visual final é um menu de navegação. Os usuários esperam encontrar todos esses elementos e o olho é treinado para percorrer os elementos basicamente nessa ordem. Facilite para eles projetando dessa maneira.
5. Dê muito espaço aos elementos
Se você ainda não o conhece, lembre-se disso: o espaço em branco é seu amigo.
Dê a todos os elementos do design espaço suficiente. O espaço ajudará a chamar a atenção para elementos individuais, ocupará "espaço" para que você não seja tentado a desordenar a tela e ajudar a criar um design geral que tenha foco.
O truque para usar bem o espaço é a consistência. Defina regras para a quantidade de espaço que envolverá elementos individuais ou caberá nas linhas de texto. Se o design parecer muito estéril, talvez seja necessário diminuir um pouco o espaçamento. Você saberá que o espaçamento é correto quando você abre o design de novo e vai direto para os lugares que deseja que os usuários vejam primeiro. (Não tem certeza do que são? Volte para o número 4 - Estabelecer hierarquia.)
6. Amplificador de contraste
Os elementos de design de alto contraste - das opções de cores ao tamanho dos elementos - podem fornecer a um projeto a quantidade certa de requinte visual necessária, mesmo nas estruturas mais mínimas.
Para uma opção moderna, tente uma paleta de cores contrastantes para atrair a atenção do usuário. As cores fortes farão com que um design simples pareça mais complexo e interessante do que uma opção em preto e branco. Para aproveitar ao máximo as cores contrastantes, opte por tons de posições opostas na roda de cores com saturações semelhantes. Se essa opção for demais para o seu gosto, tente outros pares de roda de cores. (Você pode até encontrar um novo favorito inesperado, como a combinação de roxo e verde-azulado acima.)
7. Use ícones e elementos consistentes
A consistência no design é um dos melhores (e piores) segredos do design matador. É uma daquelas coisas que é esquecida com muita frequência, pois os projetos de design estão repletos de vários estilos de botões ou ícones de mídia social que simplesmente não correspondem ao restante da iconografia do site.
Os elementos da interface do usuário não devem ser uma reflexão tardia.
É importante criar um conjunto de regras e ícones de elementos de interface e usuário e utilizá-los durante todo o projeto da mesma maneira. (Você pode até comprar ou fazer download de uma fonte de ícone ou kit de elementos da interface do usuário, se não quiser criá-los do zero.)
Escolha uma cor para os elementos, use a mesma ação ou efeito de foco para cada um (um para elementos clicáveis e outro para elementos que não são) e dimensione os elementos com base no uso. (É aceitável ter um tamanho de ícone e uma opção superdimensionada para elementos um pouco mais gráficos.)
As Praticca Vending Machines usam ícones grandes demais, por exemplo, para indicar aos usuários que há mais informações. A + está localizado dentro de um ícone colorido. Todos os três ícones são idênticos, além da cor. Todos eles fazem a mesma coisa ao passar o mouse e agem da mesma maneira quando um usuário clica. O mesmo ícone é usado menor em todo o site para iniciar novos bits de conteúdo e ajudar os usuários a digitalizar a cópia.
Conclusão
Um design simples não precisa ser completamente mínimo ou não possui elementos divertidos ou itens de interface do usuário. Um design simples é altamente utilizável e intuitivo, permitindo que os usuários se envolvam sem perguntas ou instruções complicadas.
Embora exista um local para sites mais complexos ou interações com o usuário, a maioria dos designs de sites pode se beneficiar da abordagem do KISS. Não pense demais, e os usuários também não precisarão.
