dialética





artigos


UI design patterns

22/04/10 | Comments Off on UI design patterns

Entrevista concedida a revista webdesign para a reportagem: UI design patterns, MAI/10


Quais princípios de design interferem na experiência em ambientes digitais?

É responsabilidade do designer projetar a melhor maneira possível para conduzir o usuário a seguir o fluxo desejado com o mínimo de erros e ainda ponderar fatores estratégicos comeciais do segmento.

A interface deve facilitar as tomadas de decisão de acordo com o que se pretende e, para isso, o designer deve fazer o uso coerente de conceitos fundamentais de design (como diagramação, hierarquia, legibilidade, organização, etc) em prol de uma experiência satisfatória.

A interação é satisfatória quando atinge o objetivo pretendido e, para isso, cada elemento da interface deve cumprir suas funções da melhor maneira possível. Uma vez feito isso corretamente, não será problema reciclar os mesmos elementos que já atendem este resultado. Assim, será possível dedicar esforços a novos elementos ou ambientes que realmente tragam valor de negócio.

Quais são as principais vantagens que o uso de biblioteca de padrões de interface pode trazer para o cotidiano de produção do designer?

Não apenas para o designer, o uso de bibliotecas internas é uma estratégia operacional que atinge todos os profissionais de desenvolvimento e permite o lançamento de novos produtos de forma mais ágil.

Seguir um padrão significa diminuir operações de aprendizado. Essa regra é aplicada em todos os níveis, desde a nomenclatura de arquivos ou classes, até elementos de interface para o usuário.

Se temos componentes com funções comuns em diferentes interfaces, esses elementos devem ser iguais (ou pelo menos o mais semelhante possível). Assim, para correções ou melhorias, o processo de evolução dos produtos como um todo é mais simples de ser executado.

Nem sempre a padronização minuciosa é possível, mas visar constantemente essa direção irá significar em menor tempo operacional.

Alguns exemplos que poderiam ser observados em um fluxo completamente padronizado:

  • compatibilidade tecnológica
  • profissionais conseguem achar os arquivos facilmente
  • desenvolvedores sabem as classes que devem ser alteradas
  • designers avaliam com mais clareza o que não está perfeito
  • métricas são mais fáceis de serem instaladas
  • usuários já estão familiarizados com o uso da interface (ou pelo menos parte)

Todos acima podem (devem) sugerir/providenciar melhorias, até mesmo o usuário.

Pela sua experiência na área, como você enxerga a aplicação e o conhecimento sobre bibliotecas de padrões de interfaces entre as agências digitais e os profissionais brasileiros? O que é preciso para tornar esta prática mais comum em projetos nacionais?

O uso de padrões de interface é muito pouco praticada por agências/profissionais no país.

Ainda é comum a mentalidade de que o designer deve contribuir com adornos e impacto visual emotivo, quando deveria estar planejando uma experiência mais consistente e funcional.
O designer não deve ter como objetivo evidenciar suas habilidades, mas sim, utilizá-las para criar um bom produto.

Quando utilizamos as mesmas formas para elementos de mesmas funções, estamos sendo consistentes. A função de cada elemento deve ser facilmente identificada e a consistência propõe que essas funções não precisam ser reaprendidas novamente.

Investir em bibliotecas de elementos funcionais também auxilia a conter custos de desenvolvimento à medida que são reaproveitados.

É comum investir tempo de design e desenvolvimento elaborando diversas formas de fazer as mesmas coisas quando poderiam ser feitas uma só vez corretamente e personalizável (cores e estilos) – quando necessário. Pra que desenhar diferentes páginas de login se todas terão a mesma função?

Ainda sobre o mercado brasileiro, o departamento de novas mídias da Globosat vem dando um bom exemplo na área, ao aplicar tais conceitos na construção de sites como o da série House e o programa Nós3. Diante disso, quando é recomendada a criação interna de uma biblioteca de padrões de interfaces? E quais são os recursos/etapas necessários para a sua construção?

Devemos estar sempre em busca da padronização e o que for considerado estrategicamente interessante para ser específico deve ser identificado.

Os produtos da Globosat são exemplos de aplicações de um padrão planejado. Cada produto mantém sua personalidade com um skin próprio, principalmente na home e em elementos pontuais (como headers, fundos, estilos, etc.); à medida que nos aprofundamos na experiência desses produtos, percebemos um padrão entre os elementos de interface.

O usuário que já teve a experiência de usar o site de um programa do canal multishow terá uma curva de aprendizado menor quando visitar o site de alguma série do canal Universal.

Na Globosat o objetivo do núcleo de novas mídias é atender as necessidades dos canais na TV, que são bastante semelhantes, e criar novos ambientes participativos que complementam a experiência da TV na web. Por conta disso, padronizamos as necessidades funcionais comuns para investir mais tempo em novos produtos ou em pontos necessariamente específicos.

No artigo “Componentes de uma interface web” são apontados os elementos mais comuns utilizados em interfaces digitais. Como justificar a mudança de padrões dos elementos de uma interface?

Durante o fluxo de desenvolvimento devemos separar o que não poderá ser reaproveitado e a equipe deve conduzir o que pode ser reciclável para construir seus padrões internos. Uma forma coerente de iniciar um novo modelo de padrões é investigar e analisar exemplos de interação já consagrados.

O padrão adotado deve estar em constante melhoria, para isso, é necessário avaliar as métricas de aceitação ou rejeição de cada elemento para correções ou remodelagens.

Essas métricas podem ser em forma de números ou de feedback feito pelos usuários ou editores.

Na segunda edição do livro “Não me faça pensar”, Steve Krug faz a seguinte recomendação: “inove quando souber que tem uma ideia melhor, caso contrário, aproveite as convenções”. O uso de biblioteca de padrões no design de interfaces pode limitar o trabalho criativo e inovador? Como utilizar padrões e evitar que isso aconteça?

O uso de uma biblioteca de padrões justamente serve para que se possa investir mais no que realmente é inovador.

A criação, em seu aspecto visual emotivo, possui uma intensidade mensurável no escopo de um produto. Normalmente com pequenas mudanças de estilos é possível oferecer uma identidade específica ao produto, e assim, reutilizar todos os componentes possíveis.

Nos modelos padronizados, podemos definir áreas de personalização para dar mais personalidade a cada produto, além disso, temos ainda a oportunidade de fazer uso de áreas editoriais (conteúdo) para ofertar o posicionamento específico do produto.

Afirmar que seguir modelos padronizados de interface limitam a criatividade é uma mentalidade ultrapassada quando se produz sites ou aplicações que têm como objetivo ofertar conteúdo.

Por favor, indique projetos que sirvam como bons exemplos na aplicação de UI design pattern library.

Mac OSX Reference Library
Getting Started with User Experience
Os estudos dos sistemas operacionais da apple são fontes obrigatórias de aprendizado sobre o uso consciente de uma biblioteca de padrões em interfaces.

Yahoo design stencils
A biblioteca de padrões de desenvolvimento do Yahoo é bastante organizada. Mantém à disposição documentação funcional e visual dos componentes utilizados pelos aplicativos e sites de empresa.

msdn.microsoft.com
A microsoft constrói interfaces que devem ser compatíveis com uma variação muito grande de hardwares e, consequentemente, de performance. Para resolver estas questões, a empresa detém um acervo de estudos bastante detalhado e útil sobre o assunto.

ps. teste de indexação do Spin Doctors #seo

Comments are closed.