Modelagem de Interação
Conteudista: Prof. Me. Artur Marques
Revisão Textual: Prof.ª Dra. Selma Aparecida Cesarin
Objetivos da Unidade:
Fundamentar o discente em modelagem de interação;
Conhecer sobre o Design Thinking.
ʪ Material Teórico
ʪ Material Complementar
ʪ Referências
1/3
ʪ Material Teórico
Fundamentos de Design Thinking
De forma geral, o Design Thinking é uma técnica criativa de resolução de problemas. Ele
começou como um processo de criação de novas Tecnologias e Produtos funcionais.
Mas agora, é amplamente usada nos setores público e privado, para negócios ou projetos
pessoais, em todo o mundo.
Começou por volta de 2008 quando Tim Brown escreveu um Artigo sobre usar essa
metodologia que veio do mundo dos designers adaptada para os negócios. Bem, parece que deu
certo!
Vamos tentar de nir isso tudo, então.
O Design Thinking é um processo de resolução de problemas priorizando as necessidades do
consumidor acima de tudo. Baseia-se na observação, com empatia, de como as pessoas
interagem com seus ambientes e emprega uma abordagem iterativa e prática para criar
soluções inovadoras.
É centrado no ser humano, o que signi ca que ele usa evidências de como os consumidores,
ou seja, gente, realmente se envolvem com um produto ou serviço, em vez de como outra
pessoa ou uma Organização pensa que eles se envolverão com ele.
Vamos entender o contexto:
“No início dos anos 70 do século XX, fabricar produtos mais baratos era um dos
grandes objetivos das empresas. Se você projetou um produto com um preço de
custo mais baixo, é muito provável que domine o mercado. Uma década depois,
as empresas se concentraram em tornar esses produtos melhores. No entanto,
no início dos anos 2000, o foco era fazer produtos melhores, aprimorando seus
recursos, design e usabilidade. Nos últimos tempos, o foco das empresas é fazer
produtos melhores com pessoas para pessoas. Isso signi ca improvisar produtos
com dados reais para fornecer aos usuários uma solução de que eles realmente
precisam.”
- KHAN, 2015, p. 1
Por que isso é importante?
Bem, porque praticamente tudo que é ofertado ou vendido na web passou durante seu
processo de criação por essa Metodologia, fora isso, o seu empregador atual ou futuro, aposta
que você sabe fazer isso. Então isso parece importante a nal 10 entre 10 Universidades,
Cursos Livres, e gurus, em geral, tentam ensinar pessoas a adotarem DT como vamos chamar
daqui por diante em sua vida pro ssional e pessoal.
Ele é a chave que favorece uma movimentação rápida para colocar protótipos para teste, em
vez de pesquisas ou planejamentos intermináveis.
Em contraste com a solução de problemas tradicional, que é um processo linear de
identi cação de um problema e, em seguida, o brainstorming de soluções, o DT só funciona se
for iterativo.
É menos um meio de chegar a uma solução única e mais uma maneira de desenvolver
continuamente seu pensamento e responder às necessidades do consumidor. O melhor é que
DT permite que as Organizações criem valor duradouro para os consumidores.
Pense: seus concorrentes – que você nem sabe quais são, na web, atuando em seus negócios
digitais, estão, exatamente nesse momento, usando DT para fazer com que seu cliente vá para
eles!
Os motivos podem ser porque o DT:
Visa resolver uma necessidade humana concreta;
Resolve problemas ambíguos ou difíceis de de nir;
Leva a soluções mais inovadoras;
Faz com que as Organizações funcionem com mais rapidez e e ciência.
DT possui 5 grandes fases, mas é importante observar que essas fases, estágios ou modos
nem sempre são sequenciais e não precisam seguir nenhuma ordem especí ca e, muitas
vezes, podem ocorrer em paralelo e se repetir de forma iterativa.
Portanto, não se deve entender as fases como um processo hierárquico. Ao invés disso,
devemos olhar como uma visão geral dos modos ou fases que contribuem para um Projeto ser
inovador:
Empatia: DT coloca as pessoas e suas necessidades em primeiro lugar. Portanto, a
primeira etapa do Processo é entender o problema a partir da perspectiva do
usuário nal, ou seja, tentaremos entender a maneira como o consumidor faz as
coisas e por que ele as faz, suas necessidades e o que é signi cativo para ele. A
forma de aprender sobre o usuário nal praticamente se resume a duas:
observação e entrevistas. Portanto, tem de ser tudo muito prático;
De nir: a partir das informações coletadas durante a fase de empatia, o
solucionador de problemas está mais bem equipado para determinar qual é o
verdadeiro problema ou desa o. Nesse estágio, as necessidades e as percepções,
que foram notadas na etapa anterior, são catalogadas e inventariadas e o
verdadeiro problema surge. Bem, é o que esperamos, senão voltamos para a
empatia e começamos novamente, a nal algo deve ter passado despercebido. É
importante ter em mente que “enquadrar” o problema certo é a única maneira de
criar a solução certa. Então, só paramos quando uma declaração de problema é
elaborada;
Idealizar: nesta etapa, o solucionador de problemas usa uma mentalidade criativa
para gerar tantas ideias quanto possível para resolver o problema, sem a restrição
das soluções existentes e “sem vergonha ou pensamentos de pré-julgamento”. O
objetivo não é tentar encontrar a resposta certa, a nal sabemos que é algo que
não existe. Em vez disso, muitas possibilidades e alternativas são exploradas.
Algumas das ferramentas disponíveis para a idealização incluem brainstorming,
mapeamento mental, rabiscos, rascunhos, esquetes e assim por diante, tudo pode,
nada está fora dos limites;
Prototipagem: como os pensadores de design aprendem fazendo e constroem seu
caminho a seguir, as melhores ideias do estágio de idealização são escolhidas para
serem transformadas em protótipos simples, na média entre 3 e 5, sempre
número ímpar. Portanto, algumas soluções físicas são criadas. Um dos principais
elementos dessa etapa é a velocidade. A ideia não é apresentar algo perfeito, mas
algo que possamos testar rapidamente. Nesta etapa, o objetivo é divulgar as ideias
antes mesmo que o solucionador de problemas possa pensar que estão prontas e,
se for o caso, falhar de forma rápida e econômica. Falhas diminuem a curva de
aprendizagem e, com isso, cria-se um produto/serviço melhor;
Teste: depois de ter os protótipos, vamos para o mundo real para testar. Aqui vem
a grande lição disso tudo, aceite que o fracasso faz parte do processo do DT. Na
verdade, o objetivo no estágio de teste não é ouvir que seus protótipos são um
sucesso, mas obter feedback “nu e cru” para fazer ajustes e re namentos e
construir um protótipo melhor, até que a “coisa ande”.
Como escrevi um pouco antes, o processo de idealização, protótipo e teste é repetido até que o
protótipo atenda às necessidades do usuário nal.
Na verdade, podemos ir além, passar por todo o processo, da primeira à última etapa, várias
vezes. A iteração é uma parte fundamental do DT.
Figura 1 – Processo do DT – Design Thinking
Análise Hierárquica de Tarefas
Um objetivo comum dos Processos de Projeto de HCI – Interação Humano Computador é
fornecer um conjunto organizado de procedimentos e representações para desenvolver
Sistemas interativos de alta qualidade.
No entanto, encontramos grandes lacunas entre as representações para essas abordagens.
A Análise Hierárquica de Tarefas tenta auxiliar nessa lacuna. Trata-se de uma abordagem
estruturada e objetiva para descrever o desempenho de tarefas dos usuários, análise
hierárquica de tarefas originada em fatores humanos.
Em sua forma mais básica, uma análise hierárquica de tarefas fornece uma compreensão das
tarefas que os usuários precisam realizar para atingir certos objetivos.
Você pode dividir essas tarefas em vários níveis de subtarefas. Na experiência do usuário, você
pode usar a análise hierárquica de tarefas para descrever as interações entre um usuário e um
Sistema de Software.
Ao projetar um novo Sistema, a análise hierárquica de tarefas permite explorar várias
abordagens possíveis para concluir a mesma tarefa. Analisar um sistema existente, pode
ajudá-lo a otimizar interações especí cas.
Depois de criar uma análise hierárquica de tarefas, ela pode servir como uma forma e caz de
documentação do Sistema, permitindo que os desenvolvedores entendam rapidamente como
os usuários interagem com um Sistema.
Como os Engenheiros de Software estão bem cientes, a familiaridade íntima que você pode ter
adquirido com o motivo pelo qual os usuários fazem algo de determinada maneira pode
desaparecer rapidamente em apenas alguns dias ou semanas.
Uma análise hierárquica de tarefas é um meio e caz de capturar essas informações.
A análise hierárquica de tarefas requer uma compreensão detalhada das tarefas dos usuários.
Você pode alcançar esse entendimento ao identi car os objetivos principais dos usuários
detalhando as etapas que os usuários devem executar para cumprir seus objetivos otimizando
esses procedimentos.
Como fazemos para utilizar esse artefato, bem, aqui vai uma sequência de ações sugeridas:
1 De nir a tarefa a ser analisada, bem como o propósito da análise da tarefa;
2 Coletar dados de conduta. Preste atenção especial a áreas como tecnologia,
interação da máquina e dos membros da Equipe, tomada de decisões e restrições
de tarefas para entender melhor o processo;
3 Determinar o objetivo geral da tarefa. Isso deve estar no topo da hierarquia de
tarefas;
4 Determinar os subobjetivos de tarefa. Decomponha a meta geral em submetas
correspondentes. Juntos, esses subobjetivos devem incluir as tarefas necessárias
para cumprir o objetivo geral;
5 Executar a decomposição das submetas. As submetas devem ser subdivididas em
submetas e operações adicionais. Continue esse processo até chegar a uma
operação apropriada, que especi ca a ação que realmente precisa ser realizada
para atingir a meta. Sempre deve haver uma operação no nível inferior de qualquer
rami cação de uma análise hierárquica de tarefas;
6 Desenvolver planos de análise. Depois de descrever todas as submetas e
operações, adicione os planos. Os planos explicam como uma meta deve ser
alcançada. Eles podem estar no formato "faça a, então, faça b, então faça c", ou
"faça a, ou faça b e faça c".
Como toda metodologia ou ferramenta, há vantagens e desvantagens em seu uso.
Creio que seja o momento ideal de você conhecê-los.
Vantagens
Fornece uma visão signi cativa sobre a tarefa que está sendo analisada;
Cria uma saída que é útil para vários outros métodos e ferramentas de análise de
fatores humanos;
Fornece uma descrição abrangente da tarefa;
É útil em quase todos os domínios.
Desvantagens
Sua utilidade não é direta para determinar soluções de design;
Principalmente, trata-se de algo descritivo em vez de analítico.
Vamos ver um exemplo grá co para poder ilustrar como fazer uma análise hierárquica de
tarefa.
Ela nos ajuda a criar uma sequência lógica de eventos durante a interação do usuário e fazer
com que ele consiga atingir seus objetivos:
Figura 2 – Elementos da Análise Hierárquica de Tarefas
Com base na gura anterior, percebemos que essa análise de tarefas é mais adequada para
tarefas que têm uma estrutura bem de nida, ou seja, tarefas que tendem a ser executadas de
maneira semelhante todas as vezes, em vez daquelas que têm estrutura muito exível.
A técnica envolve a descrição da tarefa em termos de hierarquia tarefa-subtarefa (ela se parece
com um varal no qual as tarefas são postas de forma hierárquica) e um conjunto de planos
que de nem em que ordem as subtarefas podem ser executadas ou sob que circunstâncias
determinadas subtarefas são executadas.
Veja:
Figura 3 – Exemplo de hierarquia (Cadastro de Usuário)
Para poder dar substância para você perceber o que estou escrevendo e exempli cando, pense
no seguinte:
Imagine em uma sequência de tarefas em que você vai comprar algo que lhe seja pedido para
completar o seu endereço.
Imagine que temos um diagrama como no exemplo da gura anterior, só que agora com um
dos itens sendo [completar o endereço].
Uma divisão dessa subtarefa [completar o endereço] pode ser dada da seguinte forma:
Subtarefa 1.4, “Endereço completo”, seria dividida da seguinte forma:
Localize o campo Nome completo;
Mova o ponto de inserção para o campo;
Digite o nome completo;
Localize o campo Linha de endereço;
Mova o ponto de inserção para o campo;
Digite o endereço;
Localize o campo Cidade;
Mova o ponto de inserção para o campo;
Digite a cidade;
Localize o campo Estado;
Mova o ponto de inserção para o campo;
Digite o estado;
Localize o campo Código Postal;
Mova o ponto de inserção para o campo;
Digite o Código Postal;
Localize o campo Número de telefone;
Mova o ponto de inserção para o campo;
Digite o número do telefone.
Você poderá fornecer uma ilustração da tela em que um usuário executa essa tarefa, ajudando
a colocar essa interação em contexto ou não.
Use um wireframe ou um desenho da tela mais re nado, se quiser. O importante é que se
entenda o que se deseja e o apresente.
Diagramas de Interação e MoLIC
O processo de Design de Interação é o que os designers usam para criar soluções centradas nas
necessidades, objetivos e comportamento dos usuários ao interagir com os produtos.
O processo em si envolve cinco etapas: descobrir o que os usuários precisam ou querem,
analisar, projetar uma solução potencial, prototipá-la e implementá-la e implantá-la.
O designer não começa com alguma ideia pré-concebida. Ao invés disso, essa ideia é o
resultado de estudo e de observação cuidadosos, portanto, o que colocamos como design de
qualquer coisa, mesmo sendo um produto de software, nada mais é do que a substanciação
dessa ideia.
O Design de Interação apresenta dimensões e elas representam os aspectos que devemos
considerar ao projetar interações, a saber:
Palavras: abrangem texto, como rótulos de botão, que ajudam a fornecer aos
usuários a quantidade certa de informações;
Representações visuais: são elementos grá cos como imagens, tipogra a e
ícones que auxiliam na interação do usuário;
Objetos físicos e espaço: refere-se ao meio pelo qual os usuários interagem com o
produto ou o serviço, por exemplo, um laptop por meio de um mouse ou um
telefone celular por meio dos dedos;
Tempo: refere-se a Mídias que mudam com o tempo, como animações, vídeos e
sons;
Comportamento: está relacionado a como as dimensões anteriores de nem as
interações que um produto ou software oferece, por exemplo, como os usuários
podem realizar ações em um site ou como os usuários podem operar um carro
autônomo. Também se refere a como o produto reage às entradas dos usuários e
fornece feedback.
Perceba que o Design de Interação faz parte do design da UX – Experiência do Usuário, e não o
contrário.
O mundo do UX está preocupado com toda a jornada do usuário, incluindo aspectos de marca,
design, usabilidade e função.
Por outro lado, o papel central do Design de Interação visa ao momento de uso e como
melhorar a experiência interativa. Assim, o Design de Interação é fundamental no domínio da
experiência do usuário, vez que o momento de uso é o teste mais importante de um design, em
que, na manipulação das dimensões que você leu, o designer das cinco dimensões deve
oferecer aos usuários uma experiência satisfatória, se não melhor.
Se os usuários se veem prejudicados por recursos impraticáveis, como noti cações com muito
texto ou animações muito longas, são desencorajados pela estética, ou se a capacidade de
resposta do design não corresponder às suas necessidades no contexto, o design falhará,
independentemente da marca por trás disso.
O Design de Interação de um produto de software re ete seu valor absoluto.
Com o processo de Design de Interação, você pode construir interfaces altamente intuitivas e
reconhecíveis que fornecem experiências perfeitas para os usuários e provar que sua solução
os compreende em seus contextos e as metas que procuram atingir. E isso é fundamental
quando desenvolvemos software de qualquer natureza.
Aqui estão os cinco estágios que o processo normalmente envolve:
Encontrar as necessidades e desejos dos usuários: é fácil presumir que você sabe
o que os usuários precisam e seus contextos relevantes. Descubra seus reais
requisitos. Portanto, observe as pessoas, converse com elas e as entreviste,
examine as soluções existentes, porém, lembre-se de que é difícil prever as
necessidades futuras, as Tecnologias etc.;
Fazer análises para classi car e ordenar suas descobertas para que façam sentido.
Podemos realizar isso por meio de narrativas e histórias de como alguém usa um
Sistema. Também podemos analisar as tarefas, dividindo as etapas e as subetapas
de um usuário;
Projetar uma solução potencial de acordo com as diretrizes de design e os
princípios fundamentais de design, por exemplo, fornecer feedback apropriado
para as ações dos usuários. Usar as melhores técnicas para combinar como os
usuários irão interagir com a solução de software em termos de navegação;
Iniciar prototipação com urgência para dar aos usuários uma ideia de como o
produto será e os deixe testá-lo ou entregue a especialistas para avaliar sua
e cácia usando heurísticas;
Implementar e implantar o que se construiu.
O processo, como se percebe é iterativo, portanto, tem agilidade embarcada, a nal, ninguém
projeta nada certo na primeira vez, especialmente em relação a soluções mais inovadoras.
Na verdade, podem ser necessárias muitas iterações antes de localizar a versão ideal de uma
solução. Assim, você (e sua Equipe de Design) devem continuar testando e adaptando as
mudanças apropriadas em torno de uma compreensão cada vez mais clara das necessidades
de seus usuários.
Por exemplo, você pode obter feedback do usuário e monitorar bate-papos de suporte para
encontrar Áreas de melhoria.
Figura 4 – Fluxo geral do processo de Design de Interação
É importante entender que o Processo de Design de Interação é uma ideia geral de como você
pode começar a partir das necessidades dos usuários e progredir em direção a uma solução
adequada. Existem Processos de Design semelhantes.
O Design Thinking é um dos mais notáveis deles, em que você trabalha para obter e aproveitar
insights vitais para ajustar os recursos ideais. Somente quando você conhece seus usuários e
tem empatia por eles você pode avaliar suas necessidades, seus desejos e seus pontos de “dor
do mundo real”.
Figura 5 – Processo de UX suportando e se mesclando
como um processo de interação
Fonte: Adaptada de ELLWANGER et al., 2018
Baseado na imagem anterior, Ellwanger et al. (2018) descreve cada uma dessas 4 fases do UX
integrado:
“A fase de Análise compreende uma série de subatividades que incluem as
investigações e análise de contexto do usuário/cliente e suas práticas de trabalho
“in loco”; a extração de requisitos, provenientes de dados contextuais ou ainda o
design informado por meio de modelos. As investigações e análises iniciais
permitem inferir necessidades de usuários em novos designs de sistemas. A
extração de requisitos relaciona-se aos requisitos de Design de Interação, guia o
processo de projeto e ajuda a determinar suas características em termos visuais,
sentimentais e de comportamento.
Além disso, requisitos são utilizados como um checklist para se garantir que
sejam contemplados no projeto, antes de qualquer avaliação de UX ser realizada.
Já o projeto informado por meio de modelos consiste em abstrações de diferentes
dimensões da atividade de trabalho e do espaço do projeto. Seu uso inclui
modelos que descrevem como as coisas são feitas e como diferentes regras de
trabalho se re etem na interação e nos artefatos criados.
A fase de Design envolve a criação do design conceitual, a forma de interação e o
look and feel, inclusive o redesenho de versões. Suas subatividades são a ideação
e o desenvolvimentos de esboços iniciais (sketching). A ideação conduz à
representação de modelos, ao conceito e a histórias de usuários e pode incluir
um grande número de mockups físicos provenientes das ideias iniciais. A
produção é uma subatividade da etapa de Design e envolve detalhamento de como
requisitos são aplicados, como os modelos informam o projeto e a re exão de
como estes modelos podem direcionar e informar a emergente necessidade do
Design de Interação. Assim, a produção conduz à prototipação, à interação do
projeto conceitual, aos designs intermediários e ao detalhamento do projeto.
A fase de Prototipação ocorre em paralelo e em conjunção com a fase de design e
se direciona à produção de vários tipos de protótipos, tendo em vista que eles
podem ser desenvolvidos para diferentes propósitos e em diferentes níveis de
delidade (baixa, média e alta), incluindo, nestes casos, os protótipos em papel,
os protótipos funcionais e ainda as composições visuais para a estruturação do
look and feel.
Fase de Avaliação é conduzida pela utilização de métodos rápidos ou rigorosos de
avaliação. A partir delas, é possível se veri car o alinhamento entre metas e
métricas de UX relacionado ao uso e objetivos de negócio.”
- ELLWANGER et al., 2018, p. 4-5
O trabalho centrado no usuário, como o Design de Interação, pode ser combinado com o
Processo de Desenvolvimento Ágil.
Projetos de Desenvolvimento Ágil que funcionam de acordo com o exemplo XP ou Scrum têm
sido adotados por muitas Organizações nos últimos anos, principalmente, como resultado das
vantagens dos métodos sobre os métodos de desenvolvimento tradicionais.
Os benefícios do Desenvolvimento Ágil incluem entregas regulares e adaptação às mudanças
que ocorrem durante o processo.
O tempo que leva para entender as necessidades do usuário e, em seguida, para visualizá-los
na forma de protótipos deve ser reduzido ao mínimo devido ao ritmo acelerado do
Desenvolvimento Ágil.
Design de Interação é um termo que se traduz aproximadamente como "design de produtos,
sistemas e dispositivos interativos". A interação é fortemente centrada no usuário e seu
objetivo é satisfazer as necessidades e as preferências do usuário.
O Design de Interação pode ser dividido em duas grandes áreas:
Design de Interface: para demonstrar recursos e projetar o layout grá co;
Design Comportamental: o design de um produto ou Sistema apresenta como
devem se comportar ao serem utilizados, por exemplo, como a navegação deve ser
projetada para que o usuário possa uir facilmente no site.
O Desenvolvimento Ágil e o Design de Interação, ao nal, têm o mesmo objetivo, mas sob
óticas diferentes sobre o produto do software.
O Design de Interação tem como foco os usuários nais e como eles irão interagir e trabalhar
com o software, enquanto o Desenvolvimento Ágil se concentra em como produzir código
durante os sprints.
Comum ao Design de Interação e ao Desenvolvimento Ágil é o objetivo de criar sistemas e
produtos de software úteis com ênfase na avaliação da satisfação do cliente.
Vejamos alguns desa os do Design de Interação quanto a Projeto Ágil:
Criar o Design de Interação em paralelo ao software que está sendo desenvolvido e
posto em produção, pois conforme as sprints vão sendo validadas podem causar
efeitos adversos. Por exemplo, podem fazer com que o Design de Interação seja
visto como um gargalo para a Equipe de Desenvolvimento (Time Scrum, no caso),
pois os desenvolvedores precisam simplesmente esperar que o design seja criado e
depois implementado, o que vai contra a abordagem ágil;
Requisitos, e aqui os designers de interação adotam uma abordagem holística em
que os requisitos geralmente já foram concluídos antes do início da
implementação. A abordagem holística pode ser vista como uma abordagem em
que os designers de interação assumem que os requisitos já foram concluídos e
podem ser usados como base para a criação de um design. Portanto, isso nos leva
a uma abordagem sequencial, ou seja, em cascata. Só que no Desenvolvimento
Ágil, os desenvolvedores começam a desenvolver o Sistema desde o início, antes
que todos os requisitos sejam conhecidos e novos requisitos possam surgir
durante o Projeto (tanto os requisitos quanto a arquitetura vão se revelando aos
poucos).
Duas estratégias para fazer frente a esse desa o são sugeridas por Jovic:
“O Design Up Front é uma abordagem sequencial, em que uma grande parte do
design é criada antecipadamente, antes que a implementação assuma e oriente o
restante das atividades de desenvolvimento.
Design Up Front: O Design de Interação é um processo separado no
desenvolvimento ágil, onde o design criado se destina a cobrir a maioria dos
sprints que estão por vir. As atividades de Design de Interação incluem a
identi cação das necessidades e objetivos do usuário, atividades de design
especí cas, design comportamental e design de interface.
Processo mesclado: As vantagens dessa abordagem incluem o fato de que o
sistema é projetado antes do início da implementação, o que signi ca que a
equipe obtém uma imagem do que será desenvolvido e uma base mais sólida
para se rmar. Desenhar desde o início, antes da implementação, pode levar a
efeitos positivos, uma vez que as necessidades e objetivos do cliente e do
usuário nal já foram identi cados e têm um impacto positivo no resultado.
Outras vantagens são que o Design de Interação criado é econômico quando os
protótipos produzidos, em contraste com o código, são relativamente fáceis de
serem revisados e corrigidos posteriormente. É sempre mais fácil e barato
rejeitar uma proposta feita visualmente com Adobe Fireworks, Mockups ou Visio,
em vez de alterar o código posteriormente.
Um desa o de projetar com antecedência está relacionado às mudanças que
podem ocorrer durante o desenvolvimento. Os requisitos podem simplesmente
ser alterados durante o processo ágil de forma que o design, por sua vez, possa
precisar ser alterado dependendo do tamanho da alteração. Isso leva à importante
questão de quanto do sistema deve realmente ser projetado desde o início. Uma
proposta é que o design não seja concluído em 100%, mas talvez em até 70% -
80%, permitindo alterações durante os sprints onde detalhes como opções de
cores para botões e pequenas alterações de design podem ser modi cados
durante os sprints.
Outro desa o com essa abordagem é que o Design de Interação em si não envolve
apenas o trabalho de design concreto, mas envolve a colaboração próxima com
várias partes interessadas, incluindo usuários nais, proprietários de produtos e
analistas de requisitos. Criar um design de interface utilizável e um design
comportamental usando essa abordagem requer informações de várias partes
interessadas e é necessário para minimizar o risco de que o design "errado" seja
criado, o que, por sua vez, causa mais danos do que benefícios no projeto de
desenvolvimento. Isso requer que uma quantidade relativamente grande de
tempo seja alocada para esse trabalho, o que nem sempre é possível.
Nesse caso, o designer de interação é inicialmente totalmente protegido da
equipe. Quando o desenvolvimento começa e o design é amplamente criado, o
designer de interação torna-se parte da equipe e fornece suporte aos
desenvolvedores e é responsável pela criação de novas revisões de design.
O Design de Interação e o desenvolvimento ágil como um processo é uma
estratégia na qual o Design de Interação e o desenvolvimento ágil juntos formam
um processo. A abordagem é que as atividades realizadas por um designer de
interação sejam realizadas paralelamente às atividades de desenvolvimento ágil.
O design é criado durante os sprints e é uma abordagem em que o design cresce
em relação ao quanto é implementado, ou seja, uma espécie de design evolutivo.
O design criado neste caso, ao contrário da estratégia de design inicial, é limitado
no sentido de que normalmente, apenas o que será implementado nos próximos
um ou dois sprints à frente é projetado ao mesmo tempo em que o que foi
implementado por último está sendo avaliado.”
- JOVIC, 2014, p. 6
A Linguagem de Modelagem para interação como conversa, ou MoLIC, foi concebida para
representar a interação homem-computador como o conjunto de conversas que os usuários
podem ter com o Sistema para alcançar seus objetivos.
Nessas conversas, para que os usuários entendam melhor seu interlocutor, ele deve
comunicar adequadamente a eles: o que o Sistema fez ou não fez, o que está fazendo ou não
está fazendo, o que permite ou não permite que os usuários façam, como e por quê.
Essa comunicação é particularmente importante quando ocorre uma situação inesperada,
como um erro ou qualquer outra coisa.
MoLIC foi concebido para ser uma ferramenta epistêmica. Ferramentas epistêmicas são
utilizadas para aumentar a compreensão de um determinado problema que está sendo
resolvido ou artefato sendo projetado, e não para fornecer soluções e respostas diretas para os
problemas em questão. Além disso, é importante notar que o MoLIC foi proposto para uso
humano, dessa forma, não é um modelo formal, processável por computador.
Também não foi concebido para substituir as representações existentes, mas para
complementá-las. Por exemplo, sequências de eventos descritas em cenários, modelos de
tarefas ou casos de uso podem ser articuladas em um diagrama MoLIC, guardando as devidas
proporções, o que motiva a representação de relacionamentos e intersecções entre objetivos,
cenários ou tarefas.
No tempo presente, MoLIC é composto pelos seguintes artefatos:
Diagrama de metas;
Esquema de sinal conceitual;
Diagrama de interação;
Especi cação de sinal situado.
O diagrama de metas indica o que os usuários podem fazer com o aplicativo, ou seja, quais
metas os usuários poderão alcançar ou para que o aplicativo é.
O esquema de sinais conceituais de ne e organiza os conceitos envolvidos no sistema,
especialmente aqueles que surgem na interface do usuário. Ele inclui informações envolvidas
em cada ação do usuário ou nas ações de outros usuários ou sistemas que afetam a interação
atual usuário-sistema.
O diagrama de interação representa como os objetivos podem ser alcançados durante a
interação.
A especi cação do sinal situado detalha ainda mais os sinais utilizados no diagrama de
interação, para servir de base entre a modelagem de interação e o design concreto da interface
do usuário.
Durante o Design de Interação, modelos de interação são desenvolvidos para ajudar a projetar
a interação adequada do usuário com o Sistema.
MoLIC (Linguagem de Modelagem de Interação como Conversa) é uma linguagem usada para
representar um modelo de interação, que pode, então, ser usado como base para a construção
de outros artefatos, como maquetes e protótipos.
No entanto, as inspeções são necessárias para veri car se os diagramas MoLIC são completos,
consistentes, inequívocos e contêm poucos ou nenhum defeito, para evitar a propagação de
defeitos evitáveis em artefatos derivados.
Precisamos entender como o diagrama funciona e seus elementos básicos. Vamos nos
orientar pela gura a seguir e explicá-la conforme os escritos de Lopes et al. (2018).
Vejamos como funcionam os elementos em conjunto:
Figura 6 – Um exemplo de diagramas MoLIC
Fonte: Reprodução
Assim:
“O diagrama MoLIC tem os seguintes elementos:
Ponto de Abertura: Indica onde a interação pode começar, ou seja, quando o
usuário seleciona o jogo. Um círculo preto preenchido representa o Ponto de
Abertura (os números nos círculos azuis).
Cena: Representado como um retângulo arredondado. A cena mostra o momento
da interação em que o usuário decide como a conversa deve prosseguir. O
compartimento superior contém o tópico da cena e representa o objetivo do
usuário. O segundo compartimento detalha os seguintes elementos:
Sinais: representam as informações envolvidas nas declarações emitidas pelo
usuário (ou seja, entrada do usuário) e pelo representante do designer (ou seja,
saída do sistema) durante os diálogos. Temos os seguintes sinais na cena “Fase
de jogo”: “omissão, ambiguidade, fato incorreto, inconsistência, informação
estranha”.
Diálogos: compor uma conversa sobre um tópico e consistir em enunciados
sobre sinais. Um exemplo de diálogo é “selecionar defeito de ambiguidade” (na
cena “Fase de jogo”).
Estruturas de diálogos: os diálogos podem ser compostos de outros diálogos de
acordo com alguma estrutura. Nestes casos, essas estruturas podem ser
representadas pelas palavras reservadas SEQ, XOR, OR ou AND. A estrutura SEQ
representa os diálogos que devem ser trocados na sequência especi cada. A
estrutura XOR representa diálogos mutuamente exclusivos. A estrutura OR
representa a escolha de trocar um ou mais diálogos. A estrutura AND representa
o uso de todos os diálogos, mas não em uma sequência prede nida. A estrutura
AND representa o uso de todos os diálogos, como “selecionar defeito de
omissão” e “selecionar defeito de ambiguidade”.
Expressão de transição: Representa a tomada de turnos, ou melhor, a
distribuição de turnos, onde ou o usuário ou o sistema dá a vez ao outro, por
exemplo, para mudar o assunto da conversa. É representado por uma seta no
diagrama, marcada com um indicador de expressão do usuário (u :) ou indicador
de expressão do designer (d :), por exemplo, “u: reproduza novamente”.
Processo do sistema: É representado por uma caixa preta no diagrama. Ele
representa o processamento interno (de uma solicitação do usuário) que precisa
fornecer feedback adequado ao usuário quando houver diferentes resultados
possíveis, por exemplo, “Ver nalização positiva” e “Ver nalização negativa”.
Enunciado de recuperação de avaria: é um tipo de expressão fornecida para
ajudar o usuário a se recuperar de uma falha de comunicação. É representado por
uma seta tracejada no diagrama, por exemplo, “veja o cenário novamente”.
Acesso ubíquo: representa uma oportunidade para o usuário mudar o assunto da
conversa de qualquer outra cena. É representado por um retângulo arredondado
cinza, por exemplo, “saia do jogo”.
Ponto de fechamento: representa o m da interação. Um círculo preto preenchido
dentro de um círculo sem preenchimento representa o Ponto de Fechamento.”
- LOPES, 2018, p. 7-8
Figura 7 – Descrição das decisões para o Mapeamento do
Diagrama MoLIC para os protótipos
Fonte: Reprodução
2/3
ʪ Material Complementar
Indicações para saber mais sobre os assuntos abordados nesta
Unidade:
Vídeos
Processo Criativo – Design Thinking
Processo Criativo - Design Thinking
Interação Humano Computador – Análise de Tarefas: Parte
1
Interação Humano Computador Capítulo 11 Análise de Tarefas - P…
Interação Humano Computador – Análise de Tarefas: Parte
2
Interação Humano Computador Capítulo 11 Análise de Tarefas - P…
Projeto da Interface e da Interação – MOLIC
Projeto da Interface e da Interação
3/3
ʪ Referências
ELLWANGER, C.; SILVA, R. P.; ROCHA, R. A. Modelagem sistêmica e simulação: estratégia de
gestão no Processo de Projeto para a Experiência do Usuário (UXD). 2018. Disponível em:
<https://www.scielo.br/j/gp/a/p6VH8KQbSKngBBjzjNVPFXg/?lang=pt>. Acesso em:
20/08/2021.
JOVIC, I. Integrando o Design de Interação no desenvolvimento ágil. 2014. Disponível em:
<https://reqtest.com/agile-blog/integrating-interaction-design-in-agile-development/>.
Acesso em: 20/08/2021.
KHAN, S. Design Thinking e suas técnicas. 2015. Disponível em:
<https://www.cygnismedia.com/blog/design-thinking-techniques/>. Acesso em:
20/08/2021.
LOPES, A. et al. Aplicação de técnicas centradas no usuário para analisar e projetar um
aplicativo móvel. 2018. Disponível em: <https://link.springer.com/article/10.1186/s40411-
018-0049-1>. Acesso em: 20/08/2021.