Livro: Princípios Universais do Design

Capa do livro Princípios Universais do Design, 125 maneiras de aprimorar a usabilidade, influenciar a percepção, aumentar o apelo e ensinar por meio do design. Conheço este livro desde 2007, quando fui sorteado no EBAI — Encontro Brasileiro de Arquitetura da Informação — com a primeira edição original em inglês da Rockport americana. No início de 2010 fiquei sabendo que os autores haviam lançado uma edição revista e atualizada, e com 25 princípios a mais que a edição anterior. Oras, isso seria 25% a mais de princípios de design : ) Meses atrás a Editora Bookman publicou essa mesma cobiçadissima segunda edição ampliada e revisada, em português. Princípios Universais do Design125 maneiras de aprimorar a usabilidade, influenciar a percepção, aumentar o apelo e ensinar por meio do design (Autores: William Lidwell, Kristina Holden & Jill Butler — 272 páginas — Formato: 22×26 — ISBN:9788577807383 — Ano: 2011) da Editora Bookman.

O livro contém 125 princípios descritos cada um nas páginas pares, e nas páginas ímpares estão as ilustrações, aplicações e exemplos dos conceitos. É o tipo de livro que eu gosto que esteja sempre por perto como um manual pra obter inspiração e argumentos pro meu próprio trabalho. A dica que eu te dou é: quanto melhor você entender esses princípios, mais o resultado do seu trabalho será algo inteligente, racional, fácil e simplesmente útil.

Fotos do livro

Lista completa dos princípios de design:

Abaixo está a lista completa de todos os princípios do livro Princípios Universais do Design (272 páginas — Editora Bookman, 2011) e a página em que o princípio se encontra.

Regra 80/20 (14)
Em qualquer grande sistema, uma alta percentagem de efeitos é causada por uma baixa porcentagem de variáveis
Acessibilidade (16)
Os objetos e ambientes devem ser projetados para serem utilizados, sem modificação, pelo maior número de pessoas possível
Organizador prévio (18)
Técnica de ensino que ajuda a entender informações novas com base naquilo que já sabemos.
Efeito estética/usabilidade (20)

Os designs estéticos parecem mais fáceis de utilizar do que os menos estéticos

Affordance (22)

Propriedade em que as características físicas de um objeto ou ambiente influenciam sua função

Alinhamento (24)
Posicionamento de elementos para que as bordas estejam alinhadas ao longo de fileiras ou colunas, ou para que suas partes tenham um centro comum;
Antropomorfismo (26)

Tendência de considerar atraentes as formas de aparência humanoide ou que demonstrem características humanas;

Arquétipos (28)
Padrões universais de tema e forma resultante de tendências ou disposições inatas;
Alinhamento de área 30)
Alinhamento com base na área dos elementos em oposição as suas bordas
Viés estético (32)
Tendência de ver pessoas atraentes como mais inteligentes, competentes, éticas e sociáveis do que as não atraentes;
Viés do rosto de bebê (34)
Tendência de ver pessoas e objetos com traços de rosto de bebê como mais ingênuo, desamparados e honestos do que aqueles com características mais maduras
Biofilia (36)
Ambientes ricos em imagens e paisagens naturais reduzem o estresse e aumentam o foco e a concentração
Efeito catedral (38)
Relação entre a altura percebida de um teto e a cognição. Tetos altos inspiram o raciocínio abstrato e a criatividade. Tetos baixos promovem raciocínio concreto e orientado a detalhes;
Segmentação (40)
Técnica de combinar várias unidades de conteúdo em uma pequena quantidade de segmentos para que a informação seja mais fácil de processar e memorizar;
Condicionamento clássico (42)
Técnica empregada para associar estímulo a uma resposta física ou emocional inconsciente;
Fechamento (44)
Tendência de perceber um conjunto de elementos distintos como padrão único e reconhecido em vez de múltiplos elementos individuais;
Dissonância cognitiva (46)
Tendência de buscar coerência entre atitudes, pensamentos e crenças;
Cor (48)
As cores são utilizadas no design para chamar a atenção, agrupar elementos, indicar significados e realçar a estética;
Destino comum (50)
Os elementos que se movem na mesma direção parecem ter uma relação mais próxima do que os elementos que se movem em direções diferentes ou estão parados;
Comparação (52)
Método para ilustrar relações e padrões em sistemas de comportamentos pela representação controlada de duas ou mais variáveis do sistema;
Confirmação (54)
Técnica de verificar ações antes da sua execução a fim de prevenir erros;
Consitência (56)
A usabilidade de um sistema melhora quando partes similares de expressas de modo semelhante;
Constância (58)
Tendência de perceber objetos como imutáveis, apesar das mudançás em estímulos sensoriais;
Restrição (60)
Método de restringir as ações que podem ser realizadas em um sistema;
Preferência pelo contorno (62)
Tendência de preferir objetos com contornos a objetos com pontas ou ângulos agudos;
Controle (64)
O nível de controle oferecido por um sistema deve estar relacionado aos níveis de proficiência e experiência dos usuários do sistema;
Convergência (66)
Processo em que características semelhantes evoluem independentemente em múltiplos sistemas;
Custo/benefício (68)
Uma atividade só será realizada se seus benefícios forem iguais ou maiores do que os custos;
Espaço defensável (70)
Espaço com marcos territoriais, oportunidades de vigilância e indicadores claros de atividade e propriedade;
Profundidade de processamento (72)
Fenômeno de memória no qual as informações analisadas com profundidade são mais lembradas do que aquelas examinadas superficialmente;
Design por comitê (74)
Processo de design baseado na construção de consenso, tomada coletiva de decisões e inúmeras iterações
Linha do desejo (76)
Traços de uso ou desgaste que indicam os métodos preferidos de interação com um objeto ou ambiente;
Ciclo de desenvolvimento (78)
Em geral, os produtos de sucesso seguem quatro estágios de criação: requisitos, design, desenvolvimento e testes;
Ponto de entrada (80)
Ponto de entrada física ou de atenção em um design;
Erros (82)

Uma ação ou omissão que produz resultados não intencionais;

Efeito de expectativas (84)
Fenômeno em que o comportamento e a percepção mudam devido as expectativas pessoais ou as expectativas alheias;
Efeito de mera exposição (86)
A exposição repetida a estímulos neutros aumenta a probabilidade de resposta positiva aos estímulos;
Razão entre rosto e corpo (88)
A proporção entre o rosto e o corpo em uma imagem influencia a forma como a pessoa é percebida na imagem;
Fator de segurança (90)
Uso de mais elementos do que o considerado necessário para compensar os efeitos de variáveis desconhecidas e prevenir falhas de sistema;
Ciclo de feedback (92)
Relação entre as variáveis de um sistema em que as consequencias de um evento retornam ao sistema na forma de insumo, modificando o evento no futuro;
Sequencial de Fibonacci (94)
Sequencia em que cada número é igual a soma dos dois números anteriores;
Relação figura/fundo (96)
Os elementos podem ser percebidos como figuras (objetos de foco) ou como fundo (o resto do campo perceptível)
Lei de fitts (98)
O tempo necessário para alcançar um alvo depende do tamanho e da distância do alvo;
Cinco cabides (100)
Existem 5 formas de organizar informações: categoria, tempo, local, ordem alfabética, continuo;
Compensação entre flexibilidade e usabilidade (102)
A medida que aumenta a flexibilidade de um sistema, diminui a usabilidade;
Condescendência (104)
Os designs devem ajudar a pessoas a evitar erros e a minimizar as consequencias negativas quando eles ocorrem;
Forma segue a função (106)
No design, a beleza é resultado da pureza da funçao;
Enquadramento (108)
Técnica que influencia a tomada de decisões e o julgamento ao manipular a maneira como são apresentadas as informações;
Congelamento/fuga/luta/entrega (110)
A sequência ordenada de respostas ao estresse agudo em seres humanos;
Entra lixo, sai lixo (112)
A qualidade do produto do sistema depende da qualidade de seus insumos;
Proporção áurea (114)
Proporção entre os elementos de uma forma, como altura e largura, aproximadamente igual a 0,618;
Boa continuidade (116)
Os elementos organizados em uma linha reta ou curva suave são percebidos como grupo e interpretados como algo que tem mais relação do que os elementos que não estão em linha ou curva;
Diagrama de gutemberg (118)
Diagrama que descreve o padrão geral seguido pelos olhos quando observam informações homogeneas e bem distribuidas.
Lei de hick (120)
O tempo necessário para tomar uma decisão aumenta proporcionalmente em relação a quantidade de alternativas possíoveis;
Hirarquia (122)
Organbização hierarquica é a estrutura mais simples para visualizar e compreender complexidade;
Hirarquia de necessidades (124)
Para que o design tenha sucesso, ele deve atender as necessidades básicas dos usuários antes que possa satisfazer as de nível mais alto;
Destaque (126)
Técnica para chamar a atenção para uma área de um texto ou imagem;
Horror ao vácuo (128)
Tendência a preferir preencher espaços em branco com objetos e elementos a deixar os espaços vazios
Fixação de caçador/criador (130)
Tendência dos meninos de se interessarem por ocupações e objetos relacionados a caça e das meninas de se interessarem por atividades e objetos relacionados a criação;
Representação incônica (132)
Uso de imagens pictóricas para melhorar o reconhecimento e a memorização de sinais e controles;
Imersão (134)
Estado mental de concentração tão intensa que a cosnciência do mundo real se perde, em geral, produzindo uma sensação e alegria e satisfação;
Cegueira por desatenção (136)
Não processamento de um estímulo apresentado às claras, deixando o observador sem consciência ou memória do estímulo;
Efeito de interferência (138)
Fenômeno em que o processamento mental fica mais lento e menos preciso por causa de processos mentais concorrentes;
Pirâmide invertida (140)
Método de apresentação de informações em que elas são expostas em ordem descrescente de importância;
Iteração (142)
Processo de repetir um conjunto de operações até que se alcance um resultado específico;
Lei da pregnância (144)
Tendência de interpretar imagens ambíguas como algo simples e completo, e não como complexo e incompleto;
Camadas (146)
Processo de organizar as informações em agrupamentos relacionados para gerenciar a complexidade e redorçar as relações entre elas;
Legibilidade (148)
Clareza visual do texto, em geral baseada em tamanho, tipografia, contraste, bloco de texto e espacejamento dos caracteres usados;
Ciclo de vida (150)
Todos os produtos avançam em sequência por 4 estágios de existência: introdução, crescimento, maturidade e declínio;
Mapeamento (152)
Relação entre os controles e seus movimentos ou efeitos. O bom mapeamento entre os controles e seus efeitos aumenta a facilidade de uso;
Modelo mental (154)
As pessoas compreendem e interagem com os sistemas e ambientes com base em suas representações mentais desenvolvidas a partir de suas experiências;
Mimetismo (156)
Ato de copiar pripriedades dos objetos, organismos ou ambientes familiares para obter os benefícios específicos oferecidos por ela
Mnemônica (158)
Método de reorganização de informações que permite torná-las mais memoráveis;
Modularidade (160)
Método de gerenciamento da complexidade dos sistemas que envolve a divisão de sistemas de grande porte em diversos sistemas menores e autossuficientes;
Mais avançado embora aceitável (162)
Método para determinar a estética mais comercisalmente viável para um design;
Efeito da aparência facial mais próxima da média (164)
Tendência a preferir rostos em que olhos, nariz, lábios e outras caracteísticas estão próximos à média da população;
Distribuição normal (166)
Termo usado para descrever um conjunto de dados que, quando marcados em um gráfico, formam uma curva simétrica em forma de sino;
Não inventado aqui (168)
Viés ontrário a ideias e inovações que se originam em outros lugares
Nudge (170)
Método para alterar comportamentos de modo previsível, mas sem limitar as opções ou alterar significativamente os incentivos;
Navalha de Occam (172)
Havendo a opção entre designs funcionalmente equivalentes, o design mais simples deve ser selecionado;
Condicionalmente operante (174)
Técnica utilizada para modificar o comportamento, reforçando os comportamentos desejados e ignorando ou punindo os indesejados;
Sensibilidade a orientação (176)
Fenômeno de processamento visual em que certas orientações de linha são processadas e distinguidas com mais rapidez e velocidade do que outras;
Carga de desempenho (178)
Quanto maior for o esforço para executar uma tarefa, menor será a probabilidade de a tarefa ser realizada com sucesso;
Desempenho versus preferência (180)
Os designs que ajudam as pessoas a realizar uma tarefa de maneira ideal normalmente são iguais aos designs que as pessoas consideram mais desejáveis;
Personas (182)
Técnica que emprega usuários fictícios para orientar as decisões em termos de funções, interações e estática;
Efeito de superioridade da imagem (184)
Imagens são mais lembradas do que as palavras;
Sugestão subliminar (186)
Ativação de conceitos específicos na memória com o propósito de influenciar os comportamentos subsequentes;
Revelação progressiva (188)
Estratégia para gerenciar a complexidade informacional na qual apenas as informações necessárias ou solicitadas são exibidas em um determinado momento;
Densidade proposicional (190)
Relação entre os elementos de um design e o significado que representam. Os designs com alta densidade proposicional são mais interessantes e especiais do que aqueles com baixa densidade proposicional;
Perspectiva/Refúgio (192)
Tendência a preferir ambientes com vistas (perspectivas) desobstruídas e áreas de abrigo e ocultamento (refúgios);
Protótipos (194)
Uso de modelos simplificados e incompletos de um design para explorar ideias, elaborar requisitos, refinar especificações e testar a funcionalidade;
Proximidade (196)
Elementos que estão próximos uns aos outros são percebidos como mais relacionados do que os elementos distantes entre si;
Facilidade de leitura (198)
Até que ponto a prosa pode ser compreendida com base na complexidade das palavras e das frases.
Reconhecimento versus lembrança (200)
Reconhecer objetos é mais fácil do que se lembrar deles.
Efeito vermelho (202)
Tendência de ver mulheres de vermelho como mais atraentes e homens de vermelho como mais dominantes.
Redundância (204)
Uso de mais elementos do que o necessário para manter o desempenho do sistema em caso de falha de um ou mais elementos.
Pedra de roseta (206)
Técnica para comunicar informações novas com o uso de elementos compreendidos por todos.
Regra dos terços (208)
Técnica de composição em que a mídia é divida em terços, criando composições estéticas para os elementos principais do design.
Satisfação (210)
Contentar-se com uma solução satisfatória geralmente é melhor do que correr atrás de uma solução ideal.
Preferência pela savana (212)
Tendência de preferir ambientes semelhantes à savana a outros tipos de ambiente.
Falácia da escalabilidade (214)
Tendência de presumir que um sistema que funciona em uma escala também funcionará em uma escala menor ou maior.
Escassez (216)
Itens e oportunidades se tornam mais desejáveis quando são vistos como raros ou pouco frequentes.
Autossemelhança (218)
Propriedade em que uma forma é composta de partes semelhantes ao todo ou entre si.
Efeitos da posição serial (220)
Fenômeno da memória em que os itens apresentados no começo e no fim de uma lista tem mais probabilidade de serem lembrados do que os itens do meio dela.
Modelagem (222)
Técnica usada para ensinar comportamentos desejados pelo reforço de aproximações progressivamente mais precisas do comportamento.
Relação Sinal/Ruído (224)
Proporção entre informações relevantes e irrelevantes em um display. A maior relação sinal/ruído possível é sempre desejável nos designs.
Semelhança (226)
Elementos semelhantes são percebidos como mais relacionados entre si do que os elementos diferentes.
Fator de fixação (228)
Método para aumentar significativamente o reconhecimento, a lembrança e o compartilhamento espontâneo de uma idéia ou expressão.
Narração (230)
Método de criação de imagens, emoções e compreensão de imagens por meio de uma interação entre narrador e público.
Formas estruturais (232)
Há 3 modos de organizar materiais para sustentar cargas ou conter e proteger objetos: estruturas massivas, estruturas em cofragem e estruturas em casca.
Simetria (234)
Propriedade de equivalência visual entre os elementos em uma forma.
Detecção de ameaças (236)
Capacidade de detectar estímulos ameaçadores com mais eficiência do que estímulos não ameaçadores.
Projeção tridimensional (238)
Tendência de perceber objetos e padrões como tridimensionais quando certas dicas visuais estão presentes;
Viés da iluminação de cima para baixo (240)
Tendência de interpretar as áreas sombreadas ou escuras de um objeto como sombras resultantes de uma fonte de luz acima do objeto.
Uncanny valley (242)
Formas antropomórficas são atraentes quando são diferentes ou idênticas aos seres humanos, mas repulsívas quando são muito parecidas com seres humanos.
Princípio da incerteza (244)
O ato de medir certas variáveis sensíveis em um sistema pode alterá-las e afetar o nível de precisão da medição.
Conectividade uniforme (246)
Elementos conectados entre si por propriedades visuais uniformes, como a cor, são percebidos como mais relacionados do que os elementos que não estão conectados.
Efeito Veblen (248)
Tendência de considerar um produto desejável apenas porque seu preço é alto.
Visibilidade (250)
A usabilidade de um sistema melhora quando seu estado e seus métodos de uso estão claramente visíveis.
Ressonância visuoespacial (252)
Fenômeno em que uma imagem recebe claridade ideal devido a ressonância entre a frequencia espacial da imagem e a distância entre o observador e imagem.
Efeito von Restorff (254)
Fenômeno da memória em que os objetos razoavelmente diferentes tem maior probabilidade de serem lembrados do que objetos comuns.
Wabi-sabi (256)
Objetos e ambientes que representam naturalidade, simplicidade e imperfeições sutis produzem uma estética mais profunda e mais repleta de significados.
Relação cintura/quadril (258)
Preferência por uma proporção especial entre cintura e quadril em homens e mulheres.
Wayfinding (260)
Processo de utilizar informações espaciais e ambientais para navegar até um destino.
Elo mais fraco (262)
Uso de um elemento fraco que vai falhar para proteger de danos os outros elementos do sistema.

Você encontra o livro Princípios Universais do Design pra comprar aqui.

  • Francisco dos Santos

    Gostei do post e decidi encomendar um exemplar, para que eu possa me aprofundar no tema. Valeu!

    Apenas duas correções:

    Hirarquia (122) -> Hierarquia (122) e
    Organbização hierarquica… -> Organização hierarquica…

    Hirarquia de necessidades (124) -> Hierarquia de necessidades (124)

  • http://www.srecosta.com Eduardo Costa

    Excelente dica, Henrique, obrigado.