Machine Translated by Google

Veja discussões, estatísticas e perfis de autores desta publicação em: https://www.researchgate.net/publication/228881522

Linguagens de padrões em design de interação: estrutura e organização

Artigo · Outubro de 2011

CITAÇÕES LÊ

138 2.638

2 autores:

Martin Van Welie Gerrit van der Veer

Universidade Vrije de Amsterdã Universidade Vrije de Amsterdã

37 PUBLICAÇÕES 1.446 CITAÇÕES 264 PUBLICAÇÕES 3.086 CITAÇÕES

VER PERFIL VER PERFIL

Todo o conteúdo desta página foi enviado por Gerrit van der Veer em 31 de maio de 2014.

O usuário solicitou aprimoramento do arquivo baixado.

Machine Translated by Google

Linguagens de padrões em design de interação:

Estrutura e Organização

Martijn van Welie, Gerrit C. van der Veer Vrije

Universiteit, Faculdade de Ciências, Departamento de Ciência da Computação, Subseção

"Interação Humano-Computador, Multimídia e Cultura", de Boelelaan 1081a,
Amsterdã, Holanda, {martijn,gerrit}@cs .vu.nl

Resumo: Agora que padrões individuais para Design de Interação começaram a aparecer, a questão da estruturação de coleções de padrões
em Linguagens de Padrões torna-se relevante, tanto do ponto de vista teórico quanto prático.
perspectiva. Neste artigo, investigamos como as Linguagens de Padrões em Design de Interação podem ser estruturadas de maneira
significativa e prática. É adotada uma abordagem de cima para baixo, onde os padrões para Design de Interação são organizados
hierarquicamente, desde problemas de design de alto nível até problemas de design de baixo nível. Além disso, é discutida a utilidade de
visões e classificações adicionais para uso prático.

Palavras-chave: Padrões, Linguagens de Padrões, Design de Interação, Web design, Modelos Mentais

1. Introdução 2 A ideia de uma linguagem

O uso de padrões em Design de Interação, ou campos relacionados,
como web design e design de GUI, está lentamente
ganhando impulso na prática. Após investigações iniciais sobre a
aplicabilidade de padrões para Design de Interação (Borchers
2001), coleções de padrões reais estão agora disponíveis
publicamente em livros (van Duyne, 2002, Graham 2003, Borchers
2001) ou online (van Welie, 2000, Tidwell 1998). Com um total
contagem de mais de 250 padrões publicados, a organização e
classificação dos padrões é
tornando-se uma questão prática. A organização do padrão é
necessário para facilitar a seleção de padrões individuais, mas
também para encontrar padrões que sejam aplicáveis em um
contexto mais amplo de qualquer problema de projeto.
Um padrão por si só é apenas uma pequena peça de todo o
“quebra-cabeça” do conhecimento do design. Cada padrão
descreve uma solução comprovada para um problema em um
determinado contexto de design. Quando todas as peças do quebra-
cabeça são “montadas”, podemos ver como todo um corpo de
conhecimento de design se desdobra. Compreender esse quebra-cabeça é uma tela 2D envolvida, mas o que é mostrado nela varia com o
o objetivo de longo prazo na pesquisa de padrões. Mostrará as
estradas pavimentadas do projeto, mas também dirá quando
a estrada deve ser abandonada em busca de soluções novas e
inovadoras.
Este artigo foi publicado no Interact 2003
Um padrão individual já pode ser muito valioso
para designers, mas quando os padrões estão relacionados entre
si, podemos potencialmente alcançar algo muito mais valioso. Esse
conjunto de padrões conectados é chamado de linguagem de
padrões. Quando Alexander escreveu seu livro sobre padrões de
projeto de arquitetura (Alexander et al
1977), não continha apenas padrões; os padrões formaram uma
linguagem. Sua linguagem era hierárquica
e começou no nível das cidades, depois
bairros, casas até atingir o nível das janelas ou dos assentos. Na
ideia de Alexander, a linguagem na verdade “gerou” o design
atravessando de padrões de alto nível até o nível mais baixo de
padrões. Desde o desenho das cidades até
o design dos assentos nas janelas, uma hierarquia de escala.
A questão agora é se podemos criar um tipo semelhante de
linguagem de padrões para Design de Interação. Uma grande
diferença com a arquitetura é que as interfaces de usuário não são
estritamente hierárquicas no sentido geométrico. Certamente há
tempo.
Portanto, uma hierarquia estrita baseada no uso do espaço da tela
não é adequada para o design de interação.
No entanto, a natureza hierárquica dos padrões arquitetônicos
também pode ser interpretada como uma hierarquia de
Machine Translated by Google
problemas. Os problemas de nível mais alto são divididos
em problemas menores para os quais parecem existir
soluções. Acontece que eles mapeiam diretamente uma
metáfora geométrica na arquitetura, trabalhando de grandes
áreas para pequenas áreas. O importante a entender é que
essa abordagem de hierarquia de problemas também pode
ser aplicada a outros domínios.
Para Alexander, a ideia de “linguagem” era a forma mais
importante de estruturar e relacionar padrões entre si. No
entanto, não é de forma alguma a única organização
possível. Outros campos que 'adotaram' padrões, como
Design de Software Orientado a Objetos, utilizam uma
organização diferente, categorizando-os em criacionais,
estruturais e comportamentais .
(Gamma et al 1995). Essa categorização é pragmática e faz
sentido nesse campo, embora não corresponda às ideias
de Alexander. Surge agora a questão se deveríamos tentar
formar linguagens de padrões no sentido alexandrino ou se
deveríamos encontrar organizações mais específicas que
se adaptassem melhor ao Design de Interação. No Design
de Interação foram propostas diversas organizações
alternativas. Mahemoff (1998) distingue padrões para
tarefas, usuários, elementos da interface do usuário e
sistemas inteiros. Fincher (2000) e Mullet (2002) também
investigaram possibilidades de estruturação de linguagens
de padrões. Contudo, a maioria destas abordagens foi
desenvolvida numa altura em que quase nenhum padrão
tinha sido escrito, o que tornou difícil chegar a um esquema
de organização sensato. Mais recentemente, foram
publicados conjuntos substanciais de padrões, por exemplo,
van Duyne et al (2002), o que torna a discussão mais
relevante. Agora que temos padrões e estamos começando
a descobrir como escrever padrões que façam sentido,
podemos reinvestigar as direções para linguagens de
padrões.
3 Padrões de conexão
A suposição básica no conceito de linguagem de padrões é
que os padrões estão relacionados entre si, formando uma
rede de padrões conectados . Esses relacionamentos estão
no cerne da linguagem de padrões porque criam valor
adicional real em relação a padrões únicos. Esse valor
adicional é o tipo de sinergia que procuramos ao construir
linguagens de padrões. Nos padrões que estão disponíveis
publicamente, já existem padrões que se “ligam” a outro
padrão de diversas maneiras diferentes. Um olhar mais
atento revela que existem alguns relacionamentos
fundamentais distinguíveis, semelhantes aos tipos de
relacionamentos conhecidos da Orientação a Objetos.
Modelagem. Para ilustrar essas relações, veremos os
padrões de web design como exemplo.
3.1 Agregação Considere
o padrão SHOPPING CART . Usando esse padrão, os
usuários podem gerenciar uma lista de itens em um carrinho.
O carrinho é na verdade uma lista persistente de itens nos
quais os usuários podem realizar algumas operações como
excluir, visualizar, alterar quantidade. Este comportamento
básico é coberto pelo padrão LIST BUILDER . Da mesma
forma, o procedimento de checkout é na verdade apenas um ASSISTENTE
com etapas específicas como ‘especificar endereço de
entrega’, ‘seleção de pagamento’, ‘confirmar’ etc. O
CARRINHO DE COMPRAS é um padrão que agrega vários
outros padrões. Esta é uma forma de relacionamento “tem
um” . O CARRINHO DE COMPRAS possui um
CONSTRUTOR DE LISTAS e também possui um ASSISTENTE.
3.2 Especialização Os
padrões também podem ser especializações de outros padrões.
Por exemplo, o padrão ADVANCED SEARCH é basicamente
uma PESQUISA SIMPLES , mas com opções estendidas.
Ele “herda” a ideia básica do padrão SIMPLE SEARCH e a
estende com escopo avançado, correspondência de termos
e opções de saída. Chamamos isso de relacionamento “é
um” , um padrão é uma versão mais específica de outro
padrão.
3.3 Associação Ao
projetar a experiência de “compras” para um determinado
site, existem vários padrões que também podem ser úteis.
Por exemplo, ao construir uma COMPARAÇÃO DE
PRODUTOS você pode oferecer a possibilidade de comprar
o item diretamente de lá, usando o padrão CARRINHO DE
COMPRAS . Este não é um relacionamento “tem um” ou “é
um”, mas simplesmente um relacionamento “relacionado
a” . Um padrão pode ser associado a outros padrões porque
eles também ocorrem frequentemente no contexto mais
amplo do problema de projeto ou porque os padrões são
alternativas para o mesmo tipo de problema.
4 Uma linguagem padrão
para design de interação
Se tentarmos aplicar a ideia de Alexander para uma
linguagem padrão de escala, devemos adoptar a
interpretação de que “escala” significa escala de “problemas”
em vez de geometria. No Design de Interação há certamente
uma “hierarquia de escala” de problemas. Podemos nem
sempre estar explicitamente conscientes disso, mas é à
hierarquia que nos referimos quando falamos de design de
cima para baixo. Normalmente o design é uma atividade de
cima para baixo onde começamos com a compreensão dos
usuários e suas tarefas, dos desejos do cliente, do ambiente técnico, do negócio
Machine Translated by Google
contexto etc. Tomando novamente o exemplo do web design, o
design continua estabelecendo as bases do aplicativo em termos
de conceito do site, arquitetura da informação e funcionalidade
básica. O conceito descreve as características básicas do site
que serão preenchidas posteriormente até o momento da
disposição das telas e widgets individuais. Essa abordagem de
cima para baixo “gerará” um projeto quando os padrões estiverem
disponíveis em todos os níveis. Esta rede de padrões utiliza todos
os três tipos de conexões entre padrões. Nos próprios padrões,
o tipo de conexão geralmente não é explicitado, mas é
simplesmente incorporado ao padrão de maneira natural.
Ao observar esse conjunto de padrões em rede, também podemos
ver o surgimento de camadas de padrões, ao passar de padrões
de alto nível para padrões de nível inferior. Essas camadas são
delineamentos aproximados dos níveis típicos encontrados no
projeto. Os níveis que identificamos até agora são postura,
experiência, tarefa e ação.
4.1 Padrões de tipo de postura Todo
site ou aplicativo existe com um propósito ou tem uma razão de
existência, para sites comerciais geralmente existem objetivos de
negócios a serem alcançados enquanto outros sites possuem
objetivos mais pessoais ou sociais . O design adequado tem
como base a compreensão do motivo pelo qual o projeto de
design é iniciado. Esses objetivos comerciais declarados
contribuem para a escolha de um “tipo de site” que seja adequado
e eficaz.
Por experiência, sabemos que muitos sites são, na verdade,
bastante semelhantes, no sentido de que atendem aos mesmos
objetivos e têm um conceito de site estruturalmente semelhante.
Isto pode ser chamado de 'postura' (Cooper95), 'gênero' (van
Duyne et al 2002) ou 'tipo' do site. Por exemplo, pequenos sites
corporativos costumam ser tão semelhantes que podemos
escrever padrões que os descrevem. O mesmo vale para sites
de notícias, sites de comunidades e assim por diante. Podemos
definir várias dessas posturas de site que podem ser tomadas
como base para novos projetos de design de site. Os padrões
que descrevem essas posturas típicas do local são, portanto,
chamados de padrões de postura.
Van Dyne et al (2002) também descrevem várias dessas posturas
de site.
Um padrão de postura descreve quais são os fundamentos dessa
postura: que tipo de estrutura de site geralmente é
utilizados, quais elementos normalmente compõem a página
inicial, mas também as principais experiências que tal site deve
oferecer. É como decidir se vai conceber um “carro desportivo”,
um “carro familiar”, um “4x4” ou um “carro citadino”. Cada um
deles possui características e experiências específicas que juntas
formam um tipo de carro.
Muitos sites podem ser derivados diretamente de posturas
conhecidas, mas também é comum projetar um site como uma
mistura de posturas. Quando uma postura for selecionada, vários
padrões de postura de nível inferior ajudarão a definir questões
de nível conceitual, como design da página inicial, áreas de
promoção, navegação, modelos, etc.
A pesquisa do usuário ou a investigação contextual ajudarão os
designers a decidir quais posturas são mais relevantes.
4.2 Padrões de experiência A partir
da postura básica e da pesquisa do usuário, os designers terão
que determinar quais são os principais objetivos e tarefas do
usuário que precisam ser apoiados e em que medida.
Chamaremos isso de “experiência”. A experiência do usuário não
se trata apenas de tarefas e objetivos, mas também de como os
usuários alcançam seus objetivos usando um conceito de site,
como eles percebem o site e se ele lhes proporciona a satisfação
adequada.
As experiências devem, portanto, ser entendidas como um
objetivo mais amplo para o qual estamos projetando. Os padrões
de nível de experiência descrevem experiências comuns e quais
padrões de nível inferior podem ser usados para criar essa
experiência. Experiências típicas são atividades como “fazer
compras”, “brincar”, “navegar”, “recolher informações”, “resolver
problemas” ou “partilhar pensamentos”. Ao descrever, por
exemplo, 'compras', é necessário especificar o que é sem levar
em conta a tecnologia que utilizamos. Quando entendemos como
funciona a compra, podemos então adicionar referências a
padrões de nível inferior que podem ser usados para criar a
experiência. Veja a Figura 1 para ver um trecho do nosso padrão
de compras, onde tentamos resumir os aspectos mais importantes
das compras e listamos quais padrões de nível inferior podem
ser usados para implementá-los.
Experiências são os objetivos de alto nível pelos quais os usuários
acessam um site. Ao aplicá-lo ao design de automóveis, as
experiências podem incluir “comportamento de condução
desportivo” ou “sensação de luxo”.
Machine Translated by Google

Experiência de compra

www.bn.com De

Problema Os usuários desejam procurar produtos de interesse e potencialmente comprá-los

Use quando você estiver construindo um site onde vende produtos, normalmente um site de comércio eletrônico , mas também pode
ser um site com conteúdo pago. O tipo de produto que você está tentando vender pode variar muito, variando
de livros, eletrônicos a férias e roupas. Alguns produtos podem ser entregues diretamente através de download e outros terão
que ser entregues 'mais tarde' por algum processo logístico. Não importa
qual produto você está tentando vender, existem aspectos bem conhecidos das compras que se aplicam a todos
produtos e a todas as formas de compras.

Solução Crie uma experiência de compra on-line que corresponda às experiências de compra off-line

Comprar envolve várias atividades fundamentais que se aplicam tanto às compras online quanto offline
Atividades. Essas atividades precisam ser apoiadas para cada tipo de produto e domínio. Como fazer
esse melhor depende em grande parte do domínio, mas algumas ideias básicas podem ser definidas:

- Descobrindo. As pessoas precisam saber o que podem comprar na loja, desde que ainda não saibam. Mesmo que já tenham estado
na loja antes, precisam ser informados sobre novos produtos que estão à venda. Mesmo que não haja novos produtos para vender,
pode haver produtos que devam ser
chamaram a atenção dos usuários por outros motivos, por exemplo, porque eles têm descontos, são muito populares, etc.
Listas de favoritos

- Navegando. A maioria das pessoas gosta de navegar pela loja para ver o que tem e se algo chama sua atenção. A navegação fica
mais fácil quando os produtos são categorizados de maneiras
que os clientes esperam que eles sejam. As categorias permitem que eles naveguem de uma maneira específica, um pouco mais
direcionada do que nenhuma estrutura. Use navegação estruturada, como guia dupla com
Pão ralado para que as pessoas tenham plena consciência de onde estão e para onde podem ir.

- Comparando. Muitas vezes as pessoas não sabem exatamente qual produto desejam. Eles podem ter vários
opções que desejam comparar usando uma comparação de produtos ou um configurador de produtos.

- Tentando. Quando as pessoas experimentam um produto, elas querem ter certeza de que é o produto certo para elas.
Tentar tem tudo a ver com “ver” certos aspectos do produto. Em muitos casos é até possível
'interagir' com o produto 'tocando-o virtualmente', vendo close-ups, índice ou uma prévia de uma parte do objeto. Às vezes
também pode ser possível tentar a coisa real com alguns
limitações para seu uso. Em outras palavras, crie um Exibição virtual de produtos

- Pedindo opiniões. Muitas lojas têm vendedores que ajudam os clientes a encontrar o produto certo para eles. Online isto é
difícil de conseguir, mas pode-se criar Consultores de produtos ou a cobrar
recomendações/classificações/comentários de outras pessoas que compraram o produto.

- Escolhendo. Escolher não é o mesmo que comprar. O cliente pode escolher vários produtos e, antes de começar a comprar,
descartar vários deles no último minuto. Dê-lhes um lugar para
manter produtos que eles possam querer comprar, como um Carrinho de compras ou lista de desejos

Figura 1: Um trecho do padrão de experiência “Compras”

Machine Translated by Google

Vendendo produtos

Metas de negócios Satisfação do cliente

Fornecimento de informações

Postura Comércio eletrônico Portal Pequenas empresas Site pessoal

Site
Suporte ao produto
Nível Site
Site da comunidade
Site de notícias Sites temáticos

Modelos

Layout de 3 colunas Pagina inicial

Experiência Jogando Localizando

Expressando Navegando
Nível
Compras Informando
Descobrindo

Enquete Fórum Obtendo visão geral

Tarefa Visita guiada
Carrinho de compras
produtos
Nível Identificar
Comparações
Menu Teaser
Procurando Mapa do site
Boletim de Notícias Migalhas de pão

Meu site Progressivo

O que há de novo
Mago Construtor de lista Filtragem

Ordenação

Ação Paginação Bons padrões Escolhas Saída

Nível Conecte-se

Pisando

Botões de ação

Figura 2: Uma linguagem de padrão parcial para web design (centrada em “compras”)

Cada tipo de site tem uma experiência principal que deseja oferecer. Por
exemplo, um site de comércio eletrônico serve principalmente para uma
experiência de compra . Contudo, as experiências secundárias podem
incluir a construção de comunidades (entre compradores) ou a recolha de
informações (sobre os produtos). Os designers de interação precisam
equilibre essas experiências e crie experiências de usuário consistentes
para todo o site.
série de interações em um ou mais objetos para resolver um problema. Tal
série corresponde a uma sequência de tarefas necessária para atingir um
objetivo de tarefa. Tarefa
os padrões são relativamente independentes de domínio. A postura e os
padrões de experiência definem o contexto
especificidades e os padrões de tarefa são usados para preencher os
espaços em branco. Os padrões de tarefas muitas vezes podem ser
“desenhados” usando diagramas de fluxo e esboços.

4.4 Padrões de ação Os padrões de

Na prática, isso significará que um site de comércio eletrônico utilizará
nível de ação não estão realmente relacionados a um objetivo claramente
alguns elementos de experiências secundárias.
definido do usuário. UM BOTÃO ou SAÍDAS CLARAS são ações que só
De forma semelhante, um site de notícias pode usar elementos de
têm significado em tarefas reais, como “ordenar”, “dar o próximo passo” etc.
uma experiência de compra para lidar com produtos premium
Chamamos isso de “padrões de ação” e geralmente são semelhantes a
pago pelo conteúdo.

4.3 Padrões de tarefas widgets. Eles ocorrem em quase todos os padrões de tarefas e
O nível de tarefa é o nível onde começamos a ver padrões são o nível mais baixo de blocos de construção que ainda queremos

mais concretos e conhecidos, como CARRINHO DE para chamar um padrão. As soluções neles descritas são geralmente usos

COMPRAS ou COMPARAÇÃO DE PRODUTOS . Estes apontarão para

específicos de widgets bem conhecidos ou descrevem widgets personalizados.
padrões de tarefas de nível inferior, como WIZARD ou LIST
BUILDER que são necessários em padrões de tarefas de alto nível.
Padrões de tarefas descrevem soluções para pequenos problemas de Os diferentes níveis e padrões associados podem ser mostrados em um
usuários que fazem parte de um nível superior gráfico de padrões conectados, veja a Figura 2. No gráfico todos os tipos
"experiência". Normalmente, um padrão de tarefa descreve um de relacionamentos entre padrões
Machine Translated by Google
são mostrados usando um arco direcionado. Na verdade, os
relacionamentos também estão contidos nos próprios padrões,
sempre que uma referência é feita a outros padrões como parte de
um contexto ou de uma declaração de solução.
A Figura 2 mostra apenas um gráfico parcial centrado na
experiência de compra. Devido à complexidade do domínio, um
gráfico completo pode ter mais de 250 padrões conectados levando
a um diagrama, talvez não muito compreensível.
5 Linguagens de padrões como
modelos mentais
Embora os padrões descrevam soluções comprovadas vistas em
produtos do dia a dia, reconhecê-los como padrões e estruturá-los
exige experiência substancial.
Linguagens inteiras, portanto, capturam o conhecimento dos
designers que escreveram os padrões e tornam esse conhecimento
acessível a outros. Designers iniciantes têm uma linguagem de
padrões muito limitada em seu repertório de conhecimento e à
medida que os designers se tornam mais experientes, a escala e a
complexidade da linguagem de padrões que eles usam aumentam.
Linguagens de padrões são definitivamente coisas “vivas”.
Uma linguagem de padrões pode ser vista como um modelo mental
(van der Veer & Puerta Melguizo, 2002) que um designer possui.
Escrever o conhecimento de design usando uma linguagem de
padrões é uma atividade de fazer uma representação estruturada
e explícita do modelo mental. Pode-se perguntar até que ponto os
especialistas têm modelos mentais diferentes e, portanto,
escreveriam padrões e linguagens de padrões diferentes. Já hoje
vemos que padrões com o mesmo nome, mas escritos por
designers diferentes, diferem em termos de conteúdo real. Além
disso, os padrões podem diferir no âmbito que assumem e nas
prioridades em questões específicas, conforme descrito nos
padrões.
Embora existam diferenças nos modelos mentais dos designers, o
processo de torná-los explícitos provavelmente levará à
convergência dos seus modelos mentais.
Quando os designers tiverem “acesso” aos modelos mentais
externalizados de outros através destas linguagens de padrões,
aprenderão uns com os outros e ajustarão o seu próprio modelo
mental do campo.
Portanto, espera-se que ocorra uma certa convergência, embora
sempre haja espaço para opiniões mais pessoais. As implicações
destas observações são que devemos estar cientes de que os
criadores de padrões escreverão padrões diferentes e que não
será fácil convergir para uma única linguagem de padrões para o
Design de Interação num futuro próximo.
6 Rumo a linguagens “completas”
Agora que chegamos ao ponto em que muitos padrões estão
disponíveis, pode-se perguntar quantos padrões precisarão ser
adicionados para tornar uma linguagem “completa”. Por um lado,
não é provável que possamos estabelecer um critério objetivo para
quando as línguas estão completas, uma vez que elas apenas
descrevem o conhecimento de um grupo seleto de escritores.
Por outro lado, podemos esperar alguma convergência e
precisamos encontrar uma maneira de descobrir padrões ausentes
e reconhecer padrões que já foram escritos.
Portanto, um critério poderia ser que a completude seja alcançada
quando os padrões disponíveis puderem explicar todos os
diferentes designs qualitativamente bons que pudermos encontrar.
Em outras palavras, quando cada site “utilizável” pode ser descrito
usando um conjunto de padrões, a linguagem está completa.
Dizemos “sites utilizáveis” porque estamos interessados apenas
em descrever um “bom” design. Alexander (1977) afirma que uma
linguagem de padrões é boa quando é 'morfologicamente completa'.
No entanto, sempre que novos sites bons começam a aparecer, a
linguagem pode ficar incompleta novamente. No entanto, nos dá
um método prático para extrair padrões e aperfeiçoar linguagens
de padrões.
7 Organizando padrões para
uso prático
Conectar todos os padrões em uma linguagem de padrões é uma
forma de organizá-los. Uma linguagem pode ser representada
como um gráfico mostrando todos os nomes de padrões e
conexões; consulte a Figura 2 para obter um exemplo parcial de tal
gráfico. Entretanto, na prática, quando projetistas ou engenheiros
precisam procurar padrões para um problema específico, o gráfico
pode não ser a melhor representação. O gráfico mostra as relações
fundamentais, mas existem muitas outras maneiras práticas pelas
quais os padrões de uma coleção podem ser classificados.
Um outro princípio organizador é por semelhança de função ou
problema . A ideia aqui é agruparmos os padrões de acordo com
seus aspectos funcionais.
Certos grupos de padrões podem lidar com um problema comum
e, portanto, agrupar-se.
Os designers muitas vezes precisam tomar uma decisão sobre um
aspecto funcional e podem ser melhor atendidos por um conjunto
de padrões que podem ser classificados como pertencentes a esse
aspecto funcional. Os aspectos funcionais podem incluir navegação,
pesquisa, exibição de produtos, layout e assim por diante. A maioria
das coleções de padrões existentes usa essa organização.
Consulte a Tabela 1 para obter um exemplo que mostra
Machine Translated by Google

a organização que usamos atualmente em nossa coleção de padrões, Os 'usuários' de padrões poderiam formar uma comunidade que
consulte www.welie.com/patterns. avalia padrões e ajuda outros a descobrir novos padrões ou outros
exemplos de uso de padrões.
Outro princípio de organização é baseado na usabilidade
defeito. Por exemplo, quando há um problema em determinada Tipos de sites Experiências do usuário

sequência de tarefas um projetista precisa de alternativas para Meu site Compras

Portal Edifício comunitário
diminuir o tempo de execução da tarefa. Nesse caso, o designer Site de comércio Aprendizado
pode querer filtrar padrões que possam aumentar a velocidade de Site da comunidade Recuperação de documentos

entrada ou ter impacto na taxa de erro. Site promocional de marca Entretenimento

Site Corporativo
Site de notícias
Site de folhetos
O agrupamento por tarefa e tipo de usuário também pode ser um Navegação Comércio eletrônico

princípio organizacional relevante. Poderíamos ter padrões que Migalhas de pão Carrinho de compras
Guia dupla Identificar
tratam de selecionar coisas, encontrar coisas, classificar, criar coisas
Metanavegação Registrando
para usuários novatos, usuários intermediários ou usuários
Navegação dividida Comparação de Produto
experientes. Menu repetido Configurador de Produto
Filtragem Progressiva Consultor de Produto
Menu Teaser Bloqueio de conteúdo premium
Na prática, os designers muitas vezes trabalham em uma determinada
Menu Combinado Perguntas frequentes

postura de site e podem estar interessados apenas em padrões que Menu suspenso Boletim de Notícias

se aplicam a tais sites. Por exemplo, ao trabalhar em um site de Diretório

Menu Trilha
comércio eletrônico, a coleção pode ser filtrada para mostrar apenas
Menu de rolagem
os padrões que estão “conectados” ao padrão do site de comércio Caixa de atalho
eletrônico. Neste artigo usamos web design como domínio para a Menu de imagens
construção de uma linguagem de padrões, mas também é possível Visita guiada

criar uma linguagem semelhante para design de GUI ou para projetar Elementos da página Procurando
Caixa de notícias Pesquisa Simples
interfaces para dispositivos móveis.
Lar Busca Avançada
Seletor de idioma Área de pesquisa
Lista de favoritos
Mapa do site
Janela de personalização Páginas de tópico
Para uso prático, vários tipos de classificações de padrões podem
Favoritos Dicas de pesquisa
ser úteis. Estas são apenas 'visões' diferentes sobre uma linguagem, Enquete Índice de pesquisa
enquanto as relações fundamentais dos padrões ainda são Barra de rodapé

respeitadas, uma vez que estão incorporadas nos próprios padrões. Links de saída
Interações Básicas
As visualizações possíveis são em grande parte construídas usando
Construtor de lista
certos “atributos” de padrões ou dos próprios campos de padrões.
Tabulação
Paginação
Mago
Seletor de peças
Ordenação
8 ferramentas para linguagens de padrões Área de clique ampliada

Tabela 1: Um exemplo de classificação de padrões

Como está claro que existem diversas maneiras úteis de organizar
padrões, os designers não devem ser forçados a escolher uma visão
Os potenciais usuários de tais ferramentas podem ser bastante
específica. Uma consequência lógica é que há necessidade de
diversos, desde engenheiros de software, designers de interação,
ferramentas que tornem os padrões acessíveis de mais de uma
designers visuais, gerentes de projeto até avaliadores e clientes.
maneira. As ferramentas podem gerar diferentes visualizações ou Cada um deles terá seus próprios requisitos para suporte de
oferecer funcionalidade de pesquisa dedicada para selecionar
ferramentas, seja nas visualizações suportadas ou em relação à
padrões apropriados. Um ambiente de ferramentas baseado na Web
funcionalidade de desenvolvimento de padrões. Vários projetos já
é provavelmente mais adequado para a tarefa, uma vez que a própria
estão em andamento que investigam o suporte de ferramentas para
linguagem de padrões já consiste em padrões com hiperlinks que
padrões. Por exemplo, a ferramenta UPADE (Javahery & Seffah
permitem aos usuários passar de um padrão para outro.
2002) é uma ferramenta onde o designer pode criar designs
diretamente usando padrões usando a funcionalidade de arrastar e
soltar.
Além disso, as ferramentas podem auxiliar no desenvolvimento de
uma linguagem de padrões. Os criadores de padrões devem ser
capazes de contribuir com padrões ou comentar sobre padrões existentes.
Machine Translated by Google
9 Conclusões
A criação de linguagens de padrões em vez de coleções de
padrões oferece um valor agregado significativo.
Descrevemos uma maneira de aplicar o conceito de
linguagem de padrões em Design de Interação usando
Web Design como exemplo. Nossa abordagem segue uma
metodologia de projeto de cima para baixo, onde problemas
de projeto de alto nível são gradualmente decompostos em
problemas de projeto menores. Além da proposta de uma
linguagem para Design de Interação, também argumentamos
que a estrutura da linguagem de padrões deve ser vista
separada das diferentes visões que podemos ter da coleção
de padrões. Tais visões podem ser úteis em diferentes
contextos de design e devem, portanto, ser apoiadas por
ferramentas. As ferramentas devem facilitar a utilização de
padrões na prática por uma variedade de utilizadores-alvo,
não apenas designers, mas também engenheiros e outras
partes interessadas no processo de design.
Prevemos que o conceito de uma linguagem de padrões
com suporte adequado será uma das ferramentas de
gerenciamento de conhecimento de design mais eficazes
disponíveis. Para fundamentar esta afirmação, precisamos
escrever linguagens de padrões bem estruturadas com
padrões de alta qualidade que possam ser acessados
através de ferramentas com múltiplas maneiras de encontrar
e selecionar padrões. Somente uma avaliação de tal
sistema pode verdadeiramente apoiar afirmações relativas
à eficácia dos padrões no Design de Interação.
Referências
Alexander, C., Ishikawa, S., Silverstein, M., Jacobson, M., Fiksdahl-
King, I. & Angel, S. (1977), A Pattern Language, Oxford
University Press, Nova York.
Borchers (2001) Uma abordagem padrão para interação
Design, John Wiley & Filhos; ISBN: 0471498289
Cooper, A. (1995) Sobre o Face: Os fundamentos do design de
interface do Windows, John Wiley & Sons Inc; ISBN:
1568843224
Dearden, A., Finlay, J, Allgar, E. e McManus, B. (2002)
Usando linguagens de padrões no design participativo. Em
Binder, T., Gregory, J. & Wagner, I (Eds.) PDC 2002,
Proceedings of the Participatory Design
Ver estatísticas de publicação
Conferência. CPSR, Palo Alto, CA., 2002. ISBN 0
9667818-2-1. págs. 100-1 104 - 113
van Duyne, DK, Landay, JA, Hong, J. 2002, O design de sites,
Addison-Wesley, Boston, EUA.
Fincher, S., Windsor, P. (2000), Por que os padrões não são
suficientes: algumas sugestões sobre um princípio organizador
para padrões de design de UI, documento de posição para o
workshop CHI2002 Linguagens de padrões para design de
interação: construindo impulso
Gamma, E., Helm, R., Johnson, R. & Vlissides, J. (1995), Padrões
de Design: Elementos de Software Orientado a Objetos
Reutilizáveis, Addison-Wesley, Reading, Mass.
Graham, I. (2003), Uma linguagem de padrão para usabilidade na
Web, Addison-Wesley, Boston, EUA.
Javahery, H., Seffah, A. (2002) A Model for Usabilidade Pattern-
Oriented Designs, anais do TAMODIA 2002, 18 a 19 de julho
de 2002, Bucareste, Romênia.
Mahemoff, MJ e Johnston, LJ (1998). Linguagens de padrões para
usabilidade: uma investigação de abordagens alternativas.
Em Tanaka, J. (Ed.), Conferência Ásia-Pacífico sobre
Interação Humano-Computador (APCHI) 98 Proceedings,
25-31. Los Alamitos, CA: IEEE Computer Society.
Mullet, K. (2002), Structuring Pattern Languages to Facilitate Design,
documento de posicionamento para o workshop CHI2002
“Patterns in Practice”.
Tidwell, J. (1998), Padrões de Design de Interação, em 'Proceedings
of the Pattern Languages of Programming PLoP'98'.
Van der Veer, GC e Puerta Melguizo, MC (2002).
Modelos mentais. In: JA Jacko & A. Sears (Eds.)
O Manual de Interação Humano-Computador: Fundamentos,
tecnologias em evolução e aplicações emergentes. Lawrence
Erlbaum & Associados.
ISBN: 080583834. pp. 52-80
van Welie, M., van der Veer, G. & Eli¨ens, A. (2000), Patterns as
Tools for User Interface Design, em 'International Workshop
on Tools for Working with Guidelines', Biarritz, França, pp. –
324.