O documento discute padrões de interação em interfaces, definindo padrões como estruturas recorrentes que possibilitam diversas interações. Explica que designers reproduzem padrões por diferentes razões e que tanto seguir padrões quanto quebrá-los têm vantagens e desvantagens. Também apresenta um processo de design baseado em padrões que inclui identificação, seleção, articulação e teste de padrões.
16. O que é interface?
Amálgama entre comportamentos das pessoas e dos sistemas.
17. O que é interface?
Forma que possibilita Informação
Estrutura que possibilita Interação
Função que possibilita Experiência
Sistemas
Pessoas
Interface é uma área cinza com diversas
possibilidades de comportamento.
18. Padrão de interação é uma
estrutura recorrente em interfaces
que possibilita diversas interações.
(interaction design pattern / ui pattern)
19. Padrão "Puxe para atualizar” típico de aplicativos
baseados no padrão "Feeds de notícias”.
44. Diagrama dos padrões urbanísticos e arquitetônicos em
um vilarejo indiano. (Alexander, 1964)
Vilarejo
Pasto e celeiro Plantações
Escolas, oficinas e
templos
Rios manejados
45. Decomposição de problemas em partes e composição
de soluções em todos organizados (Alexander, 1964)
Decomposição Composição
47. O fluxo de Design Atômico estabelece uma etapa
intermediária de sistematização (Brad Frost, 2013)
48. Processo de design
baseado em padrões
1. Identificação de padrões (constante)
2. Seleção de padrões (para o projeto)
3. Articulação de padrões (para a interface)
4. Teste de padrões (com usuários)
5. Aprendizado por padrões (constante)
49. Identificação de padrões
• Avidez por observar exemplos
• Perceber estruturas recorrentes nos trabalhos
de outros designers
• Documentar o padrão (problema, quando usar,
descrição da solução, justificativa)
50. Seleção de padrões
• Definir as necessidades do
projeto de maneira abstrata
(a necessidade de ação ao
invés da necessidade do
botão)
• Consultar bibliotecas de
padrões
• Elaborar uma lista ou painel
com padrões selecionados
51. Articulação de padrões
• Agrupar padrões por
função
• Encaixar ou adaptar
padrões
• Verificar consistência
com o todo
• Experimentar
alternativas
52. Teste de padrões
• Teste A/B, teste de
usabilidade, eyetracking
• As pessoas reconhecem
o padrão?
• As pessoas conseguem
realizar seus objetivos?
• Quais padrões
funcionam melhor?
53. Aprendizado por padrões
• Organizar o conhecimento sobre interfaces em
padrões
• O aprendizado individual e coletivo sempre
estarão muito à frente daquilo que é
documentado em bibliotecas de padrões
• Padrões mudam ao longo do tempo e exigem
constante aprendizado
54. Exercício
• Identificar um padrão de interação em
aplicativos iOS
• Documentar o padrão na Plataforma Corais
como um conhecimento filho deste:
corais.org/node/97082
• Utilizar a estrutura: Descrição, Contextos em
que aparece, Como é projetado, Como é
usado, Exemplos de interfaces