Buscar

Técnicas para Concepção de Interfaces

Esta é uma pré-visualização de arquivo. Entre para ver o arquivo original

ENGENHARIA DE USABILIDADE
Aula 06 - Técnicas para concepção de interfaces
Introdução
Aula 1 - Reflexões iniciais sobre a interação 
 humano-computador
Aula 2 - Usabilidade e interação humano-computador
Aula 3 - Heurísticas de usabilidade
Aula 4 - Critérios ergonômicos para a interação 
		 humano-computador
Aula 5 - Objetos de interação em interfaces
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Conteúdo Programático desta aula
Conhecer as técnicas para modelagem de interfaces:
Técnicas para definição de requisitos 
Técnicas para projeto e implementação.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Técnicas para definição de requisitos
A informação pode coletada através de várias técnicas, dentre elas a de tempestade de ideias, ou brainstorming. Uma vez coletadas, essas informações podem ser estruturadas utilizando-se os métodos de arranjo de cartas, ou card sorting, e diagrama de afinidades. 
Um requisito é a definição documentada de uma propriedade ou de um comportamento a ser contemplado em uma aplicação.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Coleta de informações: Brainstorming
O que é brainstorming?
O brainstorming, traduzido como “tempestade de ideias”, é um dos métodos mais antigos para estímulo da criatividade em grupo. Para que ocorra, algumas pessoas se reúnem e se concentram na discussão de um problema ou proposta buscando soluções para os mesmos. 
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Aumentar a coesão do grupo e criar um senso comum de responsabilidade;
Identificar uma vasta gama de ideias e soluções para problemas novos ou já existentes.
O brainstorming é útil para quê?
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Geração de ideias
Fase na qual os integrantes do grupo dão suas ideias 
sobre o tema ou problema definido.
Garantir que todos do grupo tenham igual oportunidade de expressar suas ideias;
Não permitir que haja crítica às ideias sugeridas ou qualquer tentativa de avaliá-las;
Registrar todas as ideias sugeridas de modo que todos possam vê-las.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Avaliação de ideias
Fase na qual ideias semelhantes são agrupadas e aquelas consideradas impraticáveis ou incorretas são modificadas ou descartadas.
O objetivo é organizar a gama de ideias geradas na fase anterior e filtrá-las por meio da crítica do grupo;
Ao final desta fase, é preciso dispor de uma classificação na qual os grupos de ideias apareçam conforme sua prioridade, viabilidade e aceitação.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Benefícios
Demanda poucos recursos materiais;
Muitas ideias podem ser geradas em um curto espaço de tempo;
Os resultados podem ser imediatamente utilizados ou preservados para uso em projetos futuros.
Vantagens
É fácil compreender os objetivos deste método;
Quando se tem um bom facilitador, é uma maneira democrática de gerar ideias;
Ajuda a ultrapassar eventuais obstáculos que estejam atrapalhando o progresso do projeto.
Desvantagens
Pode ser caótico e intimidador para os mais tímidos;
Requer um compromisso com quantidade, e não qualidade;
Demanda um facilitador experiente e sensato, que compreenda a psicologia social de pequenos grupos.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
O arranjo de cartas, também conhecido como card sorting, é utilizado na estruturação de uma lista de itens. 
O card sorting é útil para:
Desenvolver a estrutura de navegação para um site ou aplicação;
Organizar ícones, imagens, itens de menu e outros objetos em grupos relacionados.
Estruturação de informações: Card sorting
O que é card sorting?
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Condução do card sorting
Liste os itens que deseja analisar escrevendo cada um deles em uma carta separada e numere-os.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Condução do card sorting
Se dispuser de categorias pré-definidas nas quais deseja organizar os itens, prepare áreas nomeadas conforme essas categorias para que os informantes organizem as cartas sobre as mesmas;
Se as categorias ainda não foram criadas, peça aos informantes que nomeiem os grupos de itens que criarem.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Vantagens
Esta técnica é simples, barata e de rápida execução;
Já vem sendo empregada há mais de dez anos, o que a torna sólida;
Os informantes são usuários e, portanto, os resultados produzidos são reais.
Desvantagens
Não considera as tarefas do usuário, pois é centrada no conteúdo;
Os informantes podem não considerar sobre o que se trata o conteúdo ou de que forma ele está envolvido na conclusão de uma tarefa e organizar os itens de forma superficial.
Demanda um facilitador experiente e sensato, que compreenda a psicologia social de pequenos grupos.
Benefícios
Permite que se compreenda de que maneira os usuários agrupam os itens;
Identifica itens que podem ser de difícil categorização e localização;
Identifica a terminologia que pode ser mal compreendida.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Um diagrama de afinidades é uma técnica simples, mas poderosa, para agrupamento e compreensão de informações. É uma ferramenta comum na gerência de projetos e permite que as ideias vindas do brainstorming sejam organizadas.
Estruturação de informações: Diagrama de afinidades
O que é um diagrama de afinidades?
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Condução do diagrama de afinidades
Agende uma reunião com os participantes;
Explique o problema a ser discutido;
Peça que os participantes colem suas notas próximas a outras afim.
O diagrama de atividades é útil para:
Identificar o que deve ser incluído no protótipo da interface;
Obter consenso sobre como as informações devem estar estruturadas.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Vantagens
Consolidam dados do usuário conforme critérios significativos;
Identifica as práticas de trabalho dos usuários.
Desvantagens
Podem ser cansativas e demandar muito tempo.
Benefícios
Permite que as dificuldades sejam identificadas;
Promove a comunicação na equipe;
Traz simplicidade ao que parece caótico.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Técnicas para projeto e implementação
Têm o objetivo de criar e desenvolver o projeto de interface de usuário com base nos requisitos de informação e nos princípios de usabilidade.
Os projetos iniciais costumam ser simples e amadurecem até chegarem ao projeto final por meio de um processo iterativo de avaliação e reprojeto. 
Existem diferentes técnicas de projeto, dentre elas a narrativa gráfica (ou storyboarding) e a prototipagem em papel. 
Como métodos de implementação, temos os guias de estilo e a prototipagem rápida.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
É uma técnica utilizada na ilustração das interações entre a aplicação e o usuário que conta com uma série de desenhos e, algumas vezes, palavras ou frases curtas que contam uma história. 
Projeto de interfaces: Narrativa gráfica
O que é um narrativa gráfica?
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
A narrativa gráfica serve para quê?
Simular funcionalidade sem a preocupação com a implementação;
Demonstrar o esquema de navegação da aplicação.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Condução da criação da narrativa gráfica
Antes de
iniciar a narrativa gráfica, é preciso compreender quem são os usuários, suas experiências anteriores e seus objetivos com a aplicação. 
É preciso ter uma visão bastante clara do sistema e seus recursos.
A narrativa gráfica deverá ser decomposta em seções menores, denominadas quadros.
Cada quadro deve ser descrito com uma frase curta que garanta seu entendimento. A cada frase estará associada uma imagem.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Vantagens
Não requer habilidades de programação;
Complementa cenários verbais ou textuais;
É mais significativa do que os fluxogramas e outros diagramas.
Desvantagens
A interação entre a narrativa gráfica e o usuário é limitada;
Não são práticas no detalhamento do projeto ou na abrangência de todas as funcionalidades.
Benefícios
Ajuda na compreensão do desenho da tarefa com o auxílio da tecnologia;
Ilustra o que a interface deve fazer ou de que maneira deve reagir às entradas e solicitações dos usuários.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
É um modelo de algo ainda por ser desenvolvido. A prototipagem é uma maneira rápida de obter feedback de usuários reais sobre um projeto. Os protótipos em papel minimizam o tempo e o esforço gastos na criação de interfaces funcionais.
Projeto de interfaces: Prototipagem em papel
O que é um protótipo em papel?
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
O protótipo em papel serve para quê?
Promover a comunicação entre projetistas e usuários da aplicação;
Identificar problemas no estágio inicial do projeto, antes que a implementação ocorra.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Condução da criação da narrativa gráfica
A prototipagem em papel pode demandar quatro estágios:
Projeto do conceito: Exploração de diferentes metáforas e estratégias de design;
Projeto da interação: Organização da estrutura das telas e páginas componentes do protótipo;
Projeto das telas: Confecção do projeto inicial de cada tela da aplicação;
Teste das telas: Refinamento das telas construídas no estágio anterior.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Vantagens
Nenhuma habilidade de programação é necessária para a criação dos protótipos;
O usuário pode sentir-se mais confortável para criticar os protótipos em papel, pois eles estão em “estado bruto”.
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Projeto de interfaces: Guias de estilo
O que é um guia de estilo?
Garantir a consistência da aplicação;
Padronizar os módulos produzidos por diferentes equipes.
É um documento objetivo, intuitivo e informativo cuja finalidade é padronizar as definições relacionadas à marca, uso de cores, leiaute de páginas, dentre outras. 
A recomendação é que o guia de estilo contemple, no mínimo, informações sobre leiaute e composição, tipografia, paleta de cores, imagens, instruções sobre a marca.
O guia de estilo serve para quê?
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Implementação de interfaces: Prototipagem rápida
O que é prototipagem rápida?
Dar aos usuários uma demonstração tangível sobre o que se trata a aplicação;
Aumentar a fidelidade entre o protótipo e o produto final a ser entregue ao usuário.
É a criação de protótipos interativos que podem ser rapidamente substituídos ou modificados a partir do feedback a respeito do projeto;
A criação de um protótipo do novo sistema pode ser muito útil, visto que permite que os usuários visualizem a aplicação e a critiquem positiva ou negativamente. O protótipo é muito útil na elucidação dos requisitos. 
A prototipagem rápida serve para quê?
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE
Exemplos de projetos criados com a ferramenta Pencil – http://pencil.evolus.vn
TÉCNICAS PARA CONCEPÇÃO DE INTERFACES - AULA 06
ENGENHARIA DE USABILIDADE

Teste o Premium para desbloquear

Aproveite todos os benefícios por 3 dias sem pagar! 😉
Já tem cadastro?

Materiais relacionados

Perguntas relacionadas

Perguntas Recentes