#Design David Benyon 21/11/2021 15min de leitura

Design de interface: aspectos visuais

Entendendo os diferentes tipos de interação, diretrizes e interfaces gráficas do usuário.

Article

Introdução

O design da interface que faz a mediação da interação das pessoas com os dispositivos é uma característica crucial do design de interação como um todo. Ela é frequentemente chamada interface do usuário (ITU) e consiste de tudo o que há no que as pessoas entram em contato seja física, perceptiva ou conceitualmente.

Perceptivamente as s interagem com um sistema por meio daquilo que elas podem ver, ouvir e tocar. Os aspectos visuais do design de interface preocupam-se em elaborar um design de forma que as pessoas vejam e percebam coisas em uma tela. Os botões devem ser grandes o suficiente para serem vistos e precisam ser identificados de forma compreensível para as pessoas. Instruções precisam ser dadas para que as pessoas saibam o que se espera que elas façam. A exibição de grandes quantidades de informação precisa ser cuidadosamente considerada para que as pessoas possam ver a relação entre os dados e entender o que ela significa.

Interfaces Gráficas do Usuário

Interfaces gráficas do usuário (GUIS), que são encontradas em todos computadores pessoais, em smartphones, em dispositivos de exibição com touchscreen e assim por diante, têm uma história curta, porém interessante, As GUIS do Windows da Microsoft? foram, de forma geral, baseadas (talvez influenciadas seja uma palavra melhor) no Macintosh? que, por sua vez, foi inspirado no trabalho do PARC da Xerox” que, por sua vez, foi desenvolvido e construído nas pesquisas iniciais do Laboratório de Pesquisas Stanford do Instituto Tecnológico de Massachusetts(MIT). Durante as décadas de 1980 e 1990, vários designs diferentes de GUIs foram produzidos, mas gradualmente Windows e Apple Macintosh chegaram ao domínio do mercado de sistemas operacionais GUL. No entanto, talvez 0 Google Chrome OS estejam começando a desafiá-los.

Ícones

Ícones são usados para representar características e funções em tudo, desde aplicações de software, leitor de DVD e quiosques de informações para o público, a roupas (como aqueles incompreensíveis símbolos de lavagem no verso da etiqueta), cones são geralmente considerados úteis para ajudar as pessoas a reconhecerem quais características elas devem acessar. Os ícones primeiro apareceram no Xerox Star (Boxe 14.2) e tornaram-se um importante assunto de pesquisa na década de 1980 e início da década de 1990, embora de lá para cá tenham atraído consideravelmente menor interesse.

Icones

O uso de mapeamento direto é provavelmente a técnica mais simples no designer de ícones, já que implica criar uma imagem mais ou menos direta daquilo que o ícone pretende representar. Dessa forma, o ícone de uma impressora se parece com uma impressora.

Uma miscelânea de widgets

As modernas interfaces gráficas do usuário têm como parte de sua composição uma gama de widgets que incluem botões, botões de rádio, controles deslizantes, barras de rolagem e caixas de verificação. Elas frequentemente combinam vários aspectos dos objetos WIMP básicos. Criar uma GUI para uma aplicação não garante que o sistema acabado será usável. De fato, dada a facilidade com a qual as GUIS podem ser criadas com as modernas ferramentas de desenvolvimento, hoje é muito simples criar interfaces deselegantes « imprestáveis. Este problema está bem reconhecido e resultou na criação de guias de estilo que fornecem uma variedade de conselhos para o desenvolvedor de interfaces. Existem guias de estilo disponíveis para os diferentes tipos de sistemas com janelas e eles são ocasionalmente escritos por fornecedores ou empresas de softwares específicos a fim de garantir que seus produtos sejam consistentes, usáveis e diferenciados.

Muitas aplicações de sistemas interativos utilizam menus para organizar « armazenar os comandos disponíveis. Elas são frequentemente chamadas interfaces baseadas em menu. Para escolher um item do menu ele é destacado e em seguida clica-se , ou simplesmente aponta-se para o item com o mouse e clica-se em um de seus botões. Os menus também são muito utilizados nos telefones celulares, quiosques com touchscreen e, é claro, em restaurantes nos quais as opções para o cliente estão listadas em um menu.

Na criação de menus, os comandos devem ser agrupados em tópicos que são uma lista de itens do menu. Quando um comando ou opção (item do menu) é selecionado da lista, uma ação é realizada. Menus São também muito utilizados em sites para estruturar a informação e proporcionar o principal método de navegação pelo conteúdo do site.

Botões de rádio

Use uma série de botões de rádio para permitir que as pessoas façam escolhas exclusivas. Pense sobre os botões em um rádio: você pode ouvir EM ou AM a qualquer momento, mas não ambas. A Figura abaixo é um detalhe de um diálogo de interface no PhotoShop, no qual três botões de rádio restringem as pessoas a escolher Padrão ou Preciso ou Tamanho do Pincel, Essas três escolhas são exclusivas.

RadioButton

Alertas

A Figura 14.21 ilustra duas abordagens diferentes (do mesmo fornecedor de software), para alertar pessoas quanto à chegada de novos e-mails. A Figura 1á.21a é a exibição discreta do símbolo de um envelope ou e postal. Nesse caso, espera-se que o usuário observe a mensagem, mas no seu próprio tempo. A segunda abordagem, por contraste, pode interromper o trabalho das pessoas, de forma que não mostre esse tipo de caixa de alerta que requer interação, a menos que seja importante, urgente, ou caso de vida ou morte. Permite que a pessoa configure a aplicação para desligar esse tipo de alerta, A Figura 14.21b é a ilustração de um alerta discreto avisando da chegada de uma nova mensagem de e-mail.

Alert

Usando a proximidade para organizar botões

Um dos princípios de percepção da Gestalt é a observação de que os objetos que parecem mais próximos uns dos outros, no espaço ou no tempo, tendem a ser percebidos juntos. A utilidade dessa lei pode ser vista comparando-se as duas próximas figuras. A figura 14.23 é uma caixa de alerta padrão do Windows XP da Microsoft com os botões igualmente espaçados. A Figura 14.24 é o seu equivalente no Mac OS X. À versão do Mac utiliza claramente a proximidade. Os botões de Cancelar e Salvar estão agrupados longe da opção Não Salvar. Isso provoca o efeito de se enxergar os dois comandos - Salvar ou Cancelar - como um par separando claramente do possivelmente ambíguo Não Salvar.

Alert

Lembrança e reconhecimento

Outra diretriz derivada do nosso conhecimento da memória é a de fazer o design para o reconhecimento e não para a lembrança. Lembrança é o processo pelo qual os indivíduos ativamente buscam na memória para recuperar uma determinada informação. O reconhecimento implica buscar na memória e decidir se a informação combina como que você tem armazenado na memória. O reconhecimento é geralmente mais fácil e mais rápido do que a lembrança.

As cores no design

A cor é muito importante para nós. Descrever alguém como uma pessoa sem cor equivale a dizer que ela não tem personalidade e não é interessante. O uso de cores no design de sistemas interativos é muito difícil, Se não fosse esse o caso, por que a maioria dos eletrônicos domésticos, seriam pretos? Observem a escolha das cores padrão nas aplicações de software. A Microsoft, aparentemente, gosta de azuis, como é possível observar na aparência das telas. Já 008 X da Apple oferece a escolha entre azul e grafite.

O excelente livro de Aaron Marcus, Graphic design “for electronic documents and user interfaces (1992) fornece as seguintes regras.

  • Regra 1. Use no máximo cinco mais ou menos duas cores.
  • Regra 2. Use cores centrais e periféricas apropriadamente.
  • Regra 3. Use uma área de cor que exiba o mínimo de mudança de cor e/ou tamanho se a área colorida mudar de tamanho.
  • Regra 4. Não use simultaneamente cores de alta pureza (bigh-chroma), espectrais.
  • Regra 5 Use um código de cores consistente, familiar, com referências apropriadas.

Visualização de Dados

Além do design de telas e widgets individuais para que pessoas interajam com um sistema ou dispositivo, os designers de interação precisam considerar como esquematizar as grandes quantidades de dados e de informação que estão frequentemente envolvidos nas aplicações. Uma vez que O designer tenha chegado a uma conclusão de como melhor estruturar e organizar a informação, será preciso dar às pessoas métodos para interagir com ela. As ferramentas e técnicas para navegar através de grandes quantidades de informação têm um grande impacto nas inferências que as pessoas serão capazes de fazer a partir dos dados e da experiência geral que terão.

Design de informação

Jacobson (2000) argumenta que a característica-chave do design de informação é que se trata de um design que lida com significados em vez de materiais. O design de informação refere-se, essencialmente, a fazer sentido, a como apresentar dados (frequentemente em grandes quantidades) de uma maneira que as pessoas possam facilmente entendê-los e usá-los. Designers de informação precisam entender as características das diferentes mídias que estão sendo usadas para apresentar os dados e como o meio afeta a forma como as pessoas se movimentam através das estruturas.

Visualizações interativas

Outra característica-chave do design de informação com a qual o moderno arquiteto ou designer de informação pode se envolver é a visualização interativa. Com as vastas quantidades de informação que estão disponíveis novas maneiras de apresentar e interagir são necessárias. O livro de Card e colegas (1999) é um excelente conjunto de leituras abordando muitos dos sistemas pioneiros. Spence (2001) fornece uma boa introdução para a área e Card (2007) faz um tratamento minucioso e acessível das opções. As visualizações interativas preocupam-se em dominar o poder das novas técnicas interativas com novas formas de apresentação de grandes quantidades de dados. De fato, Card (2007) argumenta que a visualização se preocupa em “amplificar a cognição e atinge esse objetivo, aumentando os recursos de memória e processa mento disponíveis para as pessoas reduzindo a busca por informação, ajudando as pessoas a detectarem padrões nos dados.