O que são as interfaces conversacionais?

Conheça o espectro e alguns dos elementos que constituem uma interface conversacional

Caio Calado
10 min readSep 22, 2022

“Essencialmente, toda interface é uma conversa.”
Fabricio Teixeira

Toda interface pode sim, ser uma conversa, mas nem toda interface é uma do tipo conversacional.

Com a evolução tecnológica que vimos nas últimas décadas, cada vez mais utilizamos as interfaces como artefatos que facilitam a interação com serviços, sistemas ou outras entidades. As interfaces estão presentes em todos os cantos e elas funcionam de diferentes formas de acordo com o escopo e configuração que ela tem.

A direção de um carro, por exemplo, é uma interface para controlar a navegação do automóvel. É um mecanismo que foi projetado para indicar onde posicionar as mãos ao mesmo tempo que guia você em relação aos movimentos que pode fazer, nesse caso, são movimentos circulares.

O mesmo vale para os websites ou apps atuais. A grande maioria funciona como uma abstração para um outro sistema que são conectadas através de uma outra interface, também conhecidas como APIs (interfaces de programação). Tanto o app quanto o website também utilizam recursos gráficos e vários artifícios para facilitar a interação como arquitetura da informação, alertas, animações, componentes, botões, entre várias outras coisas.

Quando são adaptáveis ou reaproveitadas entre si, dizemos que a interação em si, é responsiva e consegue lidar com diferentes tipos de interfaces. Por exemplo, o site de um grande veículo de comunicação vai ter uma apresentação muito semelhante no computador e no celular, contudo, pode ter algumas funcionalidades limitadas.

Há diversos outros detalhes e nuances que precisamos acompanhar conforme as tecnologias evoluem. Pode até não parecer, mas tem muita ciência e estudo do comportamento humano nessa área e o tempo todo surgem novos aprendizados.

Para quem deseja trabalhar na área, o famoso autor Jesse James Garret disse que “a prática de desenhar experiências de usuário envolventes e eficientes é chamada de design centrado no usuário. O conceito de design centrado no usuário é muito simples: levar o usuário em consideração em todas as etapas do desenvolvimento de seu produto. As implicações desse conceito simples, no entanto, são surpreendentemente complexas. Tudo o que o usuário experimenta deve ser o resultado de uma decisão consciente de sua parte”[1].

Essa complexidade também se faz presente no processo de desenho de uma experiência conversacional. Além disso, também há o fator subjetivo da conversa em si e como ela pode se desenvolver de acordo com o meio que ela existe. Adicione uma pitada de automação e tudo fica um pouco mais complexo.

Mas não se assuste. Quero mostrar para você que apesar de ser um conceito simples, há uma certa complexidade de se atuar nessa área. Inclusive também há uma certa complexidade para atuar em dos diferentes papéis que a indústria em si precisa para fazer essa “mágica toda funcionar”. Vamos por partes e começar com os fundamentos básicos.

O que é uma interface conversacional?

Neste artigo, apresento uma definição universal para interfaces conversacionais, seja chat ou voz — há outras nomeações e terminologias no mercado, mas acredito que essas três são bastante abrangentes para se comunicar na indústria.

Essencialmente, uma interface conversacional é constituída pelo meio e a conversa. Cada meio tem as suas próprias características e limitações. Algumas vezes, são limitações criadas pelo meio em que existem (chat ou voz) e outras são devido ao seu desenvolvimento.

Independente do meio, a conversa é a estrutura e o conteúdo da conversa é o guia de toda a experiência conversacional. O conteúdo em si, pode ser constituído de texto ou de outros elementos, como mídia rica (áudio, vídeo, gifs, emojis) ou até mesmo componentes da interface (botões, webviews, carrosséis).

As interfaces conversacionais também são meios que permitem às pessoas interagirem com programas de computador através de conversas, podendo ser via chat, voz ou multimodais.

De forma resumida, é o meio que permite a troca de informações, transações ou notificações de serviço, ou até mesmo interações com outros serviços que acontecem em um formato conversacional.

Em ambos os casos há diversas limitações e desafios. Portanto, cabe a nós, profissionais que atuam ou desejam atuar na área, entender a melhor forma de tirar proveito da tecnologia como um todo.

Os diferentes tipos de interfaces

Na década de 60, o filósofo canadense Marshall McLuhan publicou um estudo chamado “O meio é a mensagem”[2]. Em seu estudo, ele queria analisar e explicar os fenômenos dos meios de comunicação e a percepção das mensagens pela sociedade como um todo.

No contexto das interfaces conversacionais esse conceito tem aplicação direta: quando o meio muda, a mensagem também precisa mudar e precisa ser adaptada para o meio. Portanto, os meios também influenciam nos tipos de interfaces que encontramos no mercado.

Assim como os sites na internet ficaram conhecidos como websites e as aplicações móveis ficaram conhecidas como apps, nas interfaces conversacionais não é diferente.

Atualmente no mercado, você irá se deparar com as seguintes nomenclaturas que sugerem o meio que funcionam e a dinâmica que oferecem:

Tabela 1: Nomenclatura dos diferentes tipos de interfaces conversacionais (Chatbots, Voicebots e Multimodais).

Como cada meio apresenta as suas particularidades, profissionais que atuam nessa área também precisam se adaptar para o meio. Por isso, não é toda pessoa profissional que sabe trabalhar com chatbots, voicebots ou multimodais ao mesmo tempo. Ter experiência com uma interface dessas é ótimo, duas é excelente, já nas três é uma raridade.

Em ambos os casos, para se criar um bom design conversacional provavelmente você vai lidar com comunicação, pesquisa, validação, testes, curadoria, análise de interação, métricas e vários outros elementos que dão suporte a esse desenho. Vamos falar sobre isso mais a frente.

No livro “VUI BR: Desenho Conversacional”, o autor Sueliton Ribeiro afirma que “cabe, não só um conhecimento prévio sobre todas as teorias da comunicação, bem como um acompanhamento intenso nas primeiras semanas em que esse robô for colocado no ar”[4].

Para exemplificar essas diferenças e semelhanças, imagine que você trabalha como chef de cozinha em um grande restaurante internacional com pratos de diferentes nacionalidades. As panelas, ingredientes e equipamentos da cozinha podem até ser parecidos, mas as receitas e preparo dos pratos mudam toda a experiência gastronômica.

Spectrum conversacional

O Meta tem uma documentação muito boa para explicar o funcionamento do Messenger. Nela, afirmam “que todas as experiências no Messenger são conversacionais de certa forma”[5] e apresentam um gráfico que apresenta todos os componentes da plataforma, chamaram de “Spectrum de Componentes da Plataforma do Messenger”:

Descrição imagem: um infográfico que apresenta as variedades de componentes da plataforma do Messenger. No mesmo eixo, foram adicionados em cada ponta os critérios “conversacional” e “GUI — Interface gráfica” e entre eles, exemplos de componentes do Messenger que se adequam (texto, cards com botões, menu de ações e webviews).

Para explicar melhor essas diferenças e semelhanças das interfaces conversacionais como um todo, resolvi adaptar esse quadro para explicar outros componentes em uma representação simples.

No mesmo eixo, você encontra os principais meios: a voz e o texto, e no meio uma experiência multimodal:

Entre o chat e multimodal, temos uma grande participação de componentes gráficos como suporte da interação. Isso pode acontecer no formato de texto, botões, carrosséis, cards, e outros elementos que são representados graficamente na interface.

Tais elementos gráficos variam de acordo com o desenvolvimento e disponibilidade deles. Aplicativos como WhatsApp, Messenger, Instagram, Telegram, entre outros, estão constantemente adicionando e testando novos componentes de interface.

Por exemplo, no início o WhatsApp era uma interface que só funcionava com texto. Isso aumentava um pouco a complexidade da interação ao mesmo tempo que o esforço de se desenvolver algo. Uma vez que precisava de outros componentes para otimizar a interação, como o uso da Inteligência Artificial e outras integrações.

Alguns meses depois, o time do WhatsApp anunciou botões e foi percebido, que o uso desses aumentou em até 6x o número de interações[6]. Algumas pessoas podem argumentar que isso quebra a ilusão da conversa. Não cabe a mim, dizer se é certo ou errado em usar botões na conversa.

Prefiro pensar que estamos usando artifícios para otimizar a experiência. Se o uso de botões facilita a interação, não vejo problemas em utilizar tal artifício. Afinal, o uso de botões dá contexto a interação e indica as possíveis ações, bem como otimiza a jornada como um todo. É um ganha-ganha para quem usa e quem desenvolve.

Entre o multimodal e a voz, temos um suporte sensorial da interação, que nesse caso acontece através da fala e da escuta. As pessoas podem interagir com uma interface por voz, bem como ouvir a sua resposta também.

Essa voz pode ser sintetizada, feita por um programa de computador e edições de áudio, ou humanizada, no qual uma pessoa empresta a sua voz para a interface. Em ambos os casos, há uma certa complexidade de se trabalhar e é necessário um conjunto de habilidades específicas.

Se você, por exemplo, for trabalhar com vozes sintetizadas, é necessário que você entenda as possibilidades da plataforma que você vai utilizar e as limitações que ela tem. Algumas plataformas já oferecem um conjunto grande de vozes e também uma notação específica para se trabalhar com elas.

Essa notação é conhecida por SSML, vem do inglês Speech Synthesis Markup Language (Linguagem de Marcação da Síntese do Discurso). Essa marcação permite editar a entonação, velocidade, timbre e até sentimentos de um discurso em particular. Isso é uma arte no formato de prosódia!

O especialista Billy Garcia fala que “assim como o CSS serve de guia de estilo para o HTML de um projeto web, o SSML vai possibilitar que você edite a voz sintética do seu projeto VUI, de maneira que pareça mais natural ou, caso seja sua intenção, semelhante à voz de um zombie para um voice game”[7].

O outro lado da mesma moeda é a interpretação do áudio das conversas. Ou seja, quando você fala com uma Alexa, o áudio dessa fala é transcrito para um formato texto e magicamente a Alexa interpreta o seu desejo.

Essa transcrição é feita no momento que a Alexa escuta o seu pedido e no momento que ela fala. Para fazer isso acontecer na prática, precisamos de dois componentes tecnológicos:

  • Se a fala é ouvida para ser transcrita, é necessária uma tecnologia de Fala-para-Texto ou do inglês, Speech-to-text (STT);
  • Se a fala é transcrita para ser falada, é necessária uma tecnologia de Texto-para-fala ou do inglês, Text-to-Speech (TTS).

O SSML é um componente essencial do TTS e para o STT funcionar, é necessário um outro componente que se chama ASR, do inglês Automated Speech Recognition, ou simplesmente Reconhecimento de fala.

Em ambos os casos, são necessários exemplos de áudio e algumas configurações para se fazer funcionar na prática. A maioria das plataformas do mercado já oferecem um conjunto de funcionalidades que facilitam as coisas, mas é uma decisão técnica entender qual é a melhor para o seu caso de uso.

Um outro ponto que não falei muito, mas é importante dizer é sobre as interfaces multimodais. Essa é uma combinação tanto da parte do design conversacional, quanto do design de interfaces.

As experiências multimodais podem acontecer desde painéis de carros até os displays inteligentes que ficam parados na sua sala (Alexa Echo Show por exemplo). Para essas interfaces, é necessário não apenas desenhar a interação conversacional como também combinar com os elementos gráficos disponíveis no dispositivo em si.

Um exemplo muito simplificado disso é você pedir para comprar um café para a sua Alexa Echo Show. Caso você tenha algum dispositivo ao seu redor, experimente dizer “Alexa, quero comprar um café em grãos”. A Alexa além de falar as opções disponíveis na loja da Amazon, também vai apresentar um catálogo de opções na tela. Cabe a você escolher qual meio você prefere interagir: se é por voz ou pelo toque na tela.

Outro exemplo é o desenvolvimento de jogos conversacionais que utilizam esses displays inteligentes. Os elementos que são apresentados na tela geralmente são estruturados como se fossem uma página web e mudam de acordo com a interação conversacional. No caso dos dispositivos da família do Google, para desenvolver um jogo assim é necessário criar uma aplicação conversacional (uma Google Action) e um aplicativo web utilizando tecnologias como HTML, JavaScript e CSS.[8]

Descrição da imagem: um gif com um dispositivo Google Nest Hub abrindo uma animação de uma casa no meio da floresta.

Essa combinação de sentidos tem uma certa complexidade. Por isso, quem deseja atuar desenhando esse tipo de experiência precisa conhecer o melhor dos dois lados: conversacional e digital.

Como cada caso é um caso, é importante a gente conhecer alguns dos principais casos de uso para você conhecer algumas possibilidades e formas de se desenhar experiências conversacionais.

Resumo

  • Toda interface pode sim, ser uma conversa, mas nem toda interface é uma do tipo conversacional.
  • As interfaces conversacionais também são meios que permitem às pessoas interagirem com programas de computador através de conversas, podendo ser via chat, voz ou multimodais.
  • Os meios também influenciam nos tipos de interfaces que encontramos no mercado. Se o meio muda a mensagem também muda;
  • Para cada tipo de interface (chatbot, voicebot ou multimodal) é necessário ter um conjunto de experiências e habilidades. Ter experiência com uma interface dessas é ótimo, duas é excelente, já nas três é uma raridade.

Referências

[1] The Elements of User Experience. Jesse James Garret. Acessado em Mar 23, 2022. http://www.jjg.net/elements/

[2] The medium is the message. Wikipedia. Acessado em Mar 23, 2022. https://en.wikipedia.org/wiki/The_medium_is_the_message

[4] VUI BR: Desenho Conversacional. Sueliton Ribeiro. Versão Kindle. Acessado em Mar 23, 2022. https://www.amazon.com.br/VUI-BR-Conversacional-Sueliton-Ribeiro-ebook/dp/B087JLL5SW/

[5] General Best Practices. Meta for Developers. Meta. Acessado em Mar 23, 2022. https://developers.facebook.com/docs/messenger-platform/introduction/general-best-practices/

[6] Botões em conversas no WhatsApp aumentam em x a interação, relata Wavy. Fernando Paiva. Mobile Time. Acessado em Mar 23, 2022. https://www.mobiletime.com.br/noticias/13/05/2020/botoes-em-conversas-no-whatsapp-aumentam-em-6x-a-interacao-relata-wavy/

[7] SSML, o CSS do VUI design. Billy Garcia. Medium. Acessado em Mar 23, 2022. https://medium.com/botsbrasil/ssml-o-css-do-vui-design-dc31e5b48b93

[8] Interactive Canvas. Google Assistant. Google. Acessado em Abr 15, 2022. https://developers.google.com/assistant/interactivecanvas#how_it_works

A imagem é uma ilustração com uma pessoa interagindo com um objeto virtual que se com um histograma para voz, com um smartphone na sua mão e vários outros elementos gráficos de mensageria em sua volta virtualmente. Ilustração criada com Blush, base de ilustração de Karthik Srinivas.

--

--

Caio Calado

Conversational Experience Designer Consultant and Advocate // Community Manager @ Bots Brasil