aula10_dcu_design_conversacional pptx

Prévia do material em texto

arara.school
Design Centrado na Usuária
Aula 10 - DCU e Design Conversacional
Yago Henrique
arara.school
Aula 10 - DCU e Design Conversacional
01 Design Conversacional
02 Etapa de Exploração
03 Etapa de Definição e Ideação
04 Etapa de Prototipação
05 Etapa de Testes
06 Recapitulando
https://unsplash.com/photos/uIZFx2kvqHI
arara.school
01 - Design Conversacional
Definição, UX Writing e aplicação contextual
arara.school
O Design Conversacional é o 
desenvolvimento de uma 
linguagem humanizada para 
máquinas, baseada em conversas 
e experiências humanas, com o 
objetivo de tornar as interações 
mais naturais e agradáveis.
Adaptado de: Design Conversacional: como tornar a interação 
entre consumidores e bots mais humanizada e fluida.
Baseado em: Fundamentos de UX, por Guilhermo Reis (2022)
https://www.digitalhouse.com/br/blog/design-conversacional/#:~:text=O%20que%20%C3%A9%20Design%20Conversacional,intera%C3%A7%C3%B5es%20mais%20naturais%20e%20agrad%C3%A1veis.
https://www.digitalhouse.com/br/blog/design-conversacional/#:~:text=O%20que%20%C3%A9%20Design%20Conversacional,intera%C3%A7%C3%B5es%20mais%20naturais%20e%20agrad%C3%A1veis.
https://fundamentosdeux.com/
arara.school
Quadro - Princípio Cooperativo de Grice : categorias, supermáximas, máximas e submáximas
Quantidade
Faça sua contribuição o mais informativa possível (tendo um propósito de troca) Máxima
Não faça sua contribuição mais informativa do que o necessário Máxima
Qualidade
Faça sua contribuição de forma verdadeira Supermáxima
Não diga nada que acredita ser falso Máxima
Não diga o que carece de evidência Máxima
Relevância Contribuição relevante Supermáxima
Modo
Seja claro Supermáxima
Evite obscuridade na expressão Máxima
Seja breve (evite a prolixidade desnecessária) Máxima
Seja ordenado Máxima
Retomada breve… Adaptado de: Atividade de escrita colaborativa: 
percepção de alunos, princípio cooperativo de Grice e 
social loafingI, dos autores Marchiori e Greef.
https://www.google.com/url?q=http://educa.fcc.org.br/scielo.php?script%3Dsci_arttext%26pid%3DS1517-97022014000200011%26lng%3Des%26nrm%3Diso&sa=D&source=editors&ust=1654358328269969&usg=AOvVaw0jYwFq40mJxkpupJ0dujkR
https://www.google.com/url?q=http://educa.fcc.org.br/scielo.php?script%3Dsci_arttext%26pid%3DS1517-97022014000200011%26lng%3Des%26nrm%3Diso&sa=D&source=editors&ust=1654358328269969&usg=AOvVaw0jYwFq40mJxkpupJ0dujkR
https://www.google.com/url?q=http://educa.fcc.org.br/scielo.php?script%3Dsci_arttext%26pid%3DS1517-97022014000200011%26lng%3Des%26nrm%3Diso&sa=D&source=editors&ust=1654358328269969&usg=AOvVaw0jYwFq40mJxkpupJ0dujkR
arara.school
02 - Etapa de Exploração
Benchwriting como pesquisa semântica da usuária
Iniciando os trabalhos: Benchwriting 🔍
“Quando falamos de processos em 
Design, é imprescindível olhar para 
fora e fazer benchmarking para 
coletar inspirações e outras 
perspectivas para determinadas 
soluções. Mas, e quando o foco é 
conteúdo, como isso é (ou deveria 
ser) feito?
Benchwriting é nosso neologismo 
para falar da análise de referências 
de Design focadas em UX Writing.”
https://medium.com/quintoandar-design/benchwriting-um-estudo-sobre-as-refer%C3%AAncias-de-mercado-para-metodologias-em-ux-writing-480c989bf93c
arara.school
Benchwriting: detalhamento 🔬
1. Mapeamento dos canais;
2. Informações institucionais: missão, 
visão, valores e objetivos;
3. Linguagem audiovisual (Youtube);
4. Linguagem nas peças publicitárias do 
dia a dia;
5. Elaboração de um repositório de 
copys;
6. Análise gramatical, ortográfica, verbal 
e conversacional;
7. Construção de persona voltada para 
conteúdo. 
arara.school
03 - Etapa de Definição e 
Ideação
Content-first = Skill-first
arara.school
Definição de Content-First 🎨
“Content-First é criar o conteúdo antes 
do design, com o objetivo de 
proporcionar uma experiência mais 
consistente para o visitante de um site.
 Imagine que você está projetando um 
site. As cores já foram definidas, as 
fontes, o layout e a quantidade de 
páginas…”
Como fica a Arquitetura da Informação?
https://abrasileira.me/content-first-design-de-conteudo/#:~:text=Content%20First%20%C3%A9%20criar%20o,e%20a%20quantidade%20de%20p%C3%A1ginas.
arara.school
Skill-first 🤖
Todo chatbot tem funcionalidades, 
mesmo que seja uma FAQ simples ou um 
direcionar para transbordo.
Skills mais complexas como: gerar 
boletos, coletar status, realizar 
agendamentos etc, são funcionalidades 
que contam majoritariamente com APIs.
E como fica a AI nestes casos?
Mapa de oportunidades 🆕
“Mapa de oportunidades é uma ferramenta muito eficaz para conquistar novos 
clientes e alavancar as vendas de maneira simples e eficaz em sua empresa.
O próprio nome já é bem autoexplicativo! Mapa de oportunidade visa encontrar 
novas oportunidades de negócios, ou seja, gerar novas oportunidades de vendas.
Oportunidades de vendas [acontecem] por conta da identificação inicial de uma 
possível oportunidade de vendas do time de inteligência comercial na hora de 
gerar os Smart leads.
Por isso as oportunidades precisam ser identificadas ou criadas.”
https://reev.co/mapa-de-oportunidades/
Algumas dicas:
1. Planilha, 
documento no 
GDocs, Slides, 
Organograma, 
Fluxos ou Redes 
de Informação;
2. Trace objetivos;
3. Skills como 
funcionalidades;
4. Desmembre 
conforme o 
contexto;
5. Faça um 
storytelling.
arara.school
04 - Etapa de Prototipação
Figma, Miro e folhas de papel
arara.school
Protótipo de baixa fidelidade ⏬
“No processo de prototipagem, a 
fidelidade está relacionada com o quão 
realista é a aparência do protótipo com o 
produto final. Sendo assim, um protótipo 
de baixa fidelidade não é semelhante com 
o resultado de toda a criação.
Ele é a melhor alternativa para um início 
de projeto, descartando as maiores 
incertezas de suas ideias, identificando 
problemas de usabilidade, testando 
conceitos e descobrindo o valor que o 
produto final pode gerar aos seus 
clientes.”
https://www.digitalhouse.com/br/blog/prototipo-de-baixa-fidelidade/
Um rabiscoframe também poderia estar de bom tamanho… 🤔
https://medium.com/ladies-that-ux-br/prot%C3%B3tipos-baixa-m%C3%A9dia-ou-alta-fidelidade-71d897559135
arara.school
Protótipo de alta fidelidade ⏫
Se o protótipo de baixa fidelidade diz 
respeito ao quão não fidedigno é o 
entregável em relação ao produto final.
Então o protótipo de alta fidelidade é 
justamente o oposto, não sendo o 
produto final, mas integrando tudo (ou 
quase tudo) aquilo que o produto final 
representa na sua versão de lançamento.
https://dribbble.com/shots/19153569-Mobile-App-iOS-Android-UI
arara.school
Esquemas micro, vulgo Fluxos Conversacionais 🗣
arara.school
Design System
“Design System é um ecossistema de 
bibliotecas instaláveis, com 
componentes programados e padrões 
semânticos de design, que reúne 
padrões de comportamentos.”
Fonte: Afinal, o que é Design System?, por 
Renato Lopes Lidio, no UX Collective BR.
https://brasil.uxdesign.cc/afinal-o-que-%C3%A9-design-system-448c257b0021
https://brasil.uxdesign.cc/afinal-o-que-%C3%A9-design-system-448c257b0021
https://unsplash.com/photos/LPWl2pEVGKc
Canais de mensageria 💬
arara.school
05 - Etapa de Testes
Testes iniciais, equipe de QA, testes de usabilidade etc
arara.school
Tudo começa pelo 
próprio profissional
● Além da elaboração, existe a 
revisão;
● Após o lançamento os testes pelo 
próprio modelador, redator, 
desenvolver etc, é o primeiro 
passo a se dar para um teste;
● Essa visão faz parte da cultura 
ágil e de qualidade como um 
todo.
arara.school
Equipe de QA
“Quality Assurance (QA), ou Garantia 
da Qualidade, em português, pode ser 
definida como um conjunto de ações 
que as empresas realizam com o 
objetivo de entregar aos consumidores 
um produto ou serviço com alto nível 
de qualidade. No desenvolvimento de 
software, aplicar os métodos de QA 
geram confiança e segurança aos 
clientes, indicando que os seus 
produtos terão a qualidade esperada 
na etapa de implantação.”
https://www.treinaweb.com.br/blog/quality-assurance-qa-e-sua-importancia-no-desenvolvimento-de-softwarehttps://unsplash.com/photos/G1N9kDHqBrQ
arara.school
Testes de Usabilidade
“Teste de usabilidade é um método de 
verificação de funcionalidades da 
interface de uma plataforma digital. É 
empregado em websites, aplicações e 
outras ferramentas, levando usuários 
reais à execução de determinadas 
tarefas. Após sua realização, é realizada 
uma análise de usabilidade e das 
principais dificuldades.”
Fonte: Teste de Usabilidade: o que é e 
como fazer [o] passo a passo, redigido pela 
equipe de redação Nell Patel.
https://neilpatel.com/br/blog/teste-de-usabilidade/
arara.school
E quando a pauta é somente o teste de conteúdo 
com as pessoas usuárias? 🤔
💭 Lembre-se: acesse a aula 8 “Etapa de Testes” para rememorar as boas práticas e a 
diagramação de diretrizes para um teste de usabilidade.
arara.school
Finalização com usuárias: 
Teste de Cloze 📊
“Um teste de cloze é um exercício, teste ou 
avaliação que consiste em uma parte da 
linguagem com certos itens, palavras ou 
sinais removidos, em que o participante é 
solicitado a substituir o item de 
linguagem ausente.”
Fonte: Close test, na Wikipédia.
https://en.wikipedia.org/wiki/Cloze_test
arara.school
Um exemplo mais prático… ✍
“____ seu boleto de forma ___ e ____. 📄
Os boletos do banco azul são digitais, eles podem ser ____ pelo aplicativo, assim 
você consegue ___ PDFs de ___ mais __ e ____ a qualquer momento. ___ o seu 
agora mesmo através do app: boletos.bancoazul.com 🌐
______ sobre o nosso processo de gestão documental? Então vem comigo… 👇”
arara.school
06 - Recapitulando
O que vimos nesta décima aula?
arara.school
Recapitulando…
arara.school
Até a próxima aula!
arara.schoolarara.school