“Alexa, abre a LATAM”

Gabriel Toueg
Nov 2 · 9 min read

Darcy Vergara, UX Lead da LATAM Airlines, conta como criamos o primeiro skill da Alexa para uma companhia aérea da América do Sul


Texto original: Darcy Vergara, UX Lead, LATAM Airlines/ Tradução para o PT: Gabriel Toueg, Editor Conteúdos Digitais LATAM Airlines Brasil/ UXW Expert


Alguém me disse certa vez que “o mundo é uma interface”. Desde então, não conseguia entender a razão desse pensamento, até que assisti a este vídeo sobre como uma equipe do MIT (Massachusetts Institute of Technology) criou um produto digital em que a interface é o corpo.

Quando pensamos que qualquer coisa ao nosso redor pode virar uma interface, nossos sentidos, nossa imaginação e nossas habilidades se abrem para desenhar além do que estamos acostumados no dia a dia. Foi o que enfrentamos quando recebemos a proposta de começar a desenhar e a desenvolver o skill da LATAM Airlines para a Alexa.

Do ponto de vista de UX, os desafios eram infinitos: não se tratava simplesmente de desenhar uma interface “que não é vista”. Tivemos a oportunidade de melhorar a experiência e levá-la a um outro nível, muito além de ver ou escutar uma interface; nosso propósito não era fazer o melhor skill, mas sim fazer com que você, usuário, aproveitasse o melhor skill, que sentisse, que pudesse despertar todos os sentidos.

Quisemos fazer você rir, nos amar, deixar sua mente viajar pelos nossos destinos enquanto decidisse onde passaria suas próximas férias. Nós nos propusemos a fazer com que você se esquecesse, por um momento que fosse, do robô. Mas ao mesmo tempo quisemos ser úteis para você.

Uma interface que não é vista, mas que é ouvida

A Alexa é um assistente de voz que tem a conversação como forma de interação. Obviamente, para poder criar essa interface, definimos um usuário e desenhamos para ele. Usamos todos os dados e pesquisas que as equipes de UX na LATAM Airlines colecionaram ao longo de meses.

O primeiro desafio foi considerar que os fluxos de interação deveriam ser conversacionais. Ao pensar na forma com a qual tratamos o processo, foi muito parecido a desenhar uma partitura de interação: utilizamos a mesma metodologia para criar sinergia entre as equipes de UX, de desenvolvimento e de negócio.

Criamos quatro fluxos, que já estão em produção:

  • Status de voos. O objetivo dessa funcionalidade é permitir que você questione o skill da LATAM Airlines se o seu voo está no horário
  • Busca de destino. A ideia é inspirar os usuários para que decidam sobre sua próxima viagem
  • Quiz. Trata-se de um jogo para conhecer, de forma divertida, um pouco sobre a indústria aeronáutica
  • E o quarto fluxo … é uma surpresa, você terá de descobrir! :)

Com os fluxos criados, desenvolvemos um storytelling específico para cada um deles: uma pequena variação desse mecanismo adaptada para manter a consistência entre todos os fluxos sem perder o foco na interação.

Na imagem a seguir, mostramos como cada cor representa uma interação, a maneira como ela é executada e o diálogo, dependendo de cada caso.

Criamos uma narrativa considerando a emoção como elemento principal.

Não queríamos um skill que fosse apenas útil, queríamos que as pessoas sorrissem e se sentissem em casa. Foi uma grande surpresa perceber, em testes com usuários reais, que as pessoas agradecem o robô ou sorriem ao se despedir. Não havíamos considerado que as pessoas encerrariam dizendo “Tchau, Alexa! Obrigado!

Para o storytelling, definimos diferentes momentos de conversação, cada um deles identificado por uma emoção, positiva ou negativa. Por exemplo:

  • Momento: saudação — emoção positiva
  • Momento: hate — emoção negativa

Para cada momento, criamos diferentes respostas, dependendo da emoção. Se a Alexa não responde o que você gostaria de ouvir em um determinado momento, geramos em você uma emoção negativa, o que é neutralizado com respostas específicas.

Se a Alexa responde sempre o mesmo (por exemplo, “Sinto muito, não entendi”), em vez de diminuir a frustração do usuário, a deixa ainda maior. Por isso, tivemos que acrescentar alternativas para um mesmo momento.

Tendo como base essa mesma interação, construímos o storytelling acompanhado de diferentes expressões e dicas:

  • Expressões como “uhu”, “que delícia viajar para a praia
  • Estímulos auditivos, como o som do mar
  • Expressões visuais (imagens relacionadas à conversação)

Enquanto a narrativa ia sendo criada, um dos integrantes da equipe pensou que, pela forma com a qual estávamos construindo o storytelling, seria possível imaginar que a nossa skill deveria poder responder outras perguntas, além de estado de voo ou sobre para onde ir nas férias. Então pensamos:

E se alguém disser: “LATAM, quero ir para a Lua”?

Então… em homenagem à melhoria da experiência, elaboramos algumas respostas para nossos clientes mais criativos. Foi muito divertido e enriquecedor. Toda a equipe de UX da LATAM Airlines nos ajudou, em uma atividade que durou apenas 15 minutos.

Interfaces visuais como elementos de apoio

Para apoiar a nossa bonita narrativa, usamos interfaces visuais para o Eco Show 5. A oportunidade e as limitações do próprio dispositivo foram um desafio. Tivemos de pensar e repensar, em diferentes ocasiões, que para esse caso a interface visual não seria a experiência principal, mas apenas um suporte. Não vou entrar em detalhes sobre o manual visual que a Alexa tem, acho muito mais interessante aprofundar nas decisões que fomos tomando sobre as hierarquias, porque nesse projeto, o “mostrar ou não mostrar” foi muito drástico.

Apesar de nos cansarmos de dizer que a interface é um elemento secundário, percebemos que é muito complexo criar uma consistência e uma boa experiência entre dois tipos de interação (auditiva e visual).

Nós desenvolvemos, criamos e desfizemos a partir de um grupo de wireframes e tivemos uma importante evolução. Houve feedback em várias instâncias, dentro da equipe e ainda em testes com usuários reais.

Primeira versão do Status de voos

A primeira feature na qual trabalhamos foi “Status de voo”. No início, com as iterações e os feedbacks sobre os desenhos da interface visual em que estávamos trabalhando, fomos alertados sobre algo relevante: a informação sobre o estado do voo ficava perdida no texto principal.

O desenho dos cards sobre os voos foi feito inicialmente com as informações que considerávamos básicas:

  • Estado do voo
  • Número do voo
  • Origem e destino (com códigos IATA correspondentes)
  • Horários de saída e de chegada
  • Duração do voo
  • Terminais de saída e de chegada

Com relação ao desenho visual, começamos por aplicar nossa paleta de cores corporativa principal.

Segunda versão do Status de voos

Melhoramos a hierarquia dos estados de voo nessa versão, mas começamos a lidar com outros tipos de decisões: “O que os nossos usuários precisam ver em primeiro lugar?”

Diferentemente da primeira versão, decidimos aqui começar a simplificar as informações e o desenho visual, para levar a atenção dos nossos clientes ao dado mais importante: o estado do voo.

Tiramos então os códigos IATA.

Terceira versão do Status de voos

Parecia que estávamos conseguindo chegar a uma versão final, mas novamente, e graças ao constante feedback, nos ajudaram a perceber que estávamos dando ao usuário muita informação num espaço muito limitado.

Ainda que tenhamos jogado com as hierarquias, com a paleta de cores e com os contrastes para poder incluir todas as informações, ainda era insuficiente. A pequena interface visual continuava muito carregada de informações.

Quarta versão do Status de voos

Para chegar a esse ponto — e eu devo dizer que simplifiquei muito o relato — tivemos muito trabalho! Foram rodadas de iterações com toda a equipe de UX da LATAM Airlines, testes com usuários reais, dados sobre o uso das nossas aplicações, entre muitos outros.

Finalmente, privilegiamos a informação de que nosso cliente precisa em um contexto específico; o resto do conteúdo foi então descartado. Deixamos um desenho limpo, com menos informações, mas muito concreto e específico.

Contexto de uso não apenas como parte da experiência mas como seu fator determinante

Provavelmente você conhece essa história: “Desenhe para o contexto de uso”. Parece muito óbvio, é parte do nosso trabalho diário, estamos acostumados a pensar no contexto de utilização quando desenhamos para um celular, para o computador etc.

Estamos familiarizados com a criação de interfaces em um contexto de utilização em que o nosso cliente está interagindo com uma tela.

Com a Alexa, o contexto de utilização considera aspectos como um usuário que está caminhando dentro de casa, que está cozinhando, lavando a roupa ou fazendo qualquer outra atividade em paralelo.

Tudo isso requer que a Alexa deve escutar o nosso cliente e que ele deve escutar o dispositivo, o usuário deve poder ler o que aparece na pequena tela e, como se isso fosse pouco, deve ter a opção de decidir quando tocar a tela para interagir (a tela do Echo Show é tátil).

Então, em que momento dos nossos journeys o nosso cliente interage com o nosso skill? A resposta é mais simples do que parece: ele sempre está dentro de casa, mas pode estar fazendo outras coisas em paralelo. Por isso, estamos lutando pela atenção dele com as tarefas diárias, a televisão, uma música e até mesmo o celular.

Somemos a isso outro desafio: o contexto são os testes com usuários reais e, ainda que tenhamos consciência de que é difícil testar em um contexto real de utilização, esse foi um dos aspectos mais difíceis.

Que aprendizados ficaram?

  • É sempre necessário testar com usuários reais — isso não é exceção;
  • Devemos estabelecer tarefas como nos testes com interfaces visuais. Fizemos uma tentativa de testar sem tarefas definidas e a verdade é que o resultado difere muito daquele que se espera de um teste;
  • Inventamos un novo conceito, o “teste de guerrilha do mágico de Oz”. Não façam o teste em produção para validar um fluxo, um humano pode “fingir” ser a Alexa e, por meio de um dispositivo “fake”, pode interagir com o usuário usando um computador. O cliente não tem como saber que é fake se isso for bem feito; :)
  • As provas em produção são eficazes apenas se o fluxo funciona de maneira ótima. É necessário testar antes ou você pode fazer muitas pessoas perderem seu tempo (e o delas);
  • Os testes devem ter um objetivo claro. É importante que exista um objetivo por fluxo ou por feature. Às vezes, o objetivo não é concluir o fluxo mas sim validar que os aspectos específicos de cada interação funcionam. Por exemplo: o que funciona melhor: “Quero saber o estado do meu voo” ou “Quero saber o estado de um voo”?;
  • Para validar um fluxo com telas é recomendável testar antes sem mockups. Se o fluxo é validado sem telas, só então deve-se continuar para um teste completo (voz e mockups).

Finalmente apresento a vocês… “Alexa, abre a LATAM”:

Para experimentar o fluxo completo, se você tem um dispositivo Echo da Alexa, pode baixar o skill. Importante: só vai funcionar se a sua conta na Amazon for brasileira.

Aproveite! Adoraremos receber mais feedbacks para melhorar :)

Créditos: Javier Arocha (UX Designer) e Romina Tagle (UX Writer).

UX LATAM Airlines

Taking people’s dreams further everyday. Passionate about travel and exploring new ideas. Texts and thoughts by members of LATAM Airlines’ Digital Team.

Gabriel Toueg

Written by

Jornalista. Storyteller. Ex-OrMed e Chile, atualmente SP. Coleciona cédulas. Time UX da LATAM Airlines. Faz palavras-cruzadas. TW/IG @gtoueg + gabrieltoueg.com

UX LATAM Airlines

Taking people’s dreams further everyday. Passionate about travel and exploring new ideas. Texts and thoughts by members of LATAM Airlines’ Digital Team.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade