Cake Time:

Construa uma Skill engajadora

Crie uma skill em 5 minutos

Introdução

Neste módulo, você construirá Cake Time, uma skill simples que pede ao usuário o aniversário, lembra, conta quantos dias até o próximo aniversário e deseja ao usuário Feliz Aniversário no dia certo.

  • pede ao usuário seu aniversário
  • lembra disso
  • diz a ele quantos dias até o próximo aniversário
  • deseja-lhe feliz aniversário em seu aniversário

Em "Por que desenvolver uma skill de Alexa?" você viu o que acontece quando um usuário interage com uma skill simples chamada "Hello World".

A skill é simples de usar mas um pouco complexa para ser construída. O ônus recai sobre nós, desenvolvedores, para tornar a interação simples e natural. Uma maneira de torná-la mais natural possível é imitar os padrões de conversação humana. Os humanos têm memória, então sua skill também deveria. Seria frustrante se seu melhor amigo sempre tivesse que perguntar seu nome (o que pode ser um sinal de que eles realmente não são seus melhores amigos). Enquanto você poderia construir a Cake Time em um dia, por causa de sua complexidade, você vai construir a Cake Time ao longo de quatro módulos neste curso.

Depois de concluir este curso; você terá construído uma skill que é útil, simples e encantadora. Skills úteis fornecem valor aos usuários. Para esta skill, a Cake Time é divertida e útil para os usuários, comemorando aniversários com uma contagem regressiva. A Cake Time também é um ótimo exemplo de uma skill engajadora, que retém o interesse dos usuários e os inspira a continuar voltando. A Cake Time incentiva os usuários a manterem o check-in até suas datas especiais. Vamos começar!

Sobre este módulo

Se esta é a primeira vez que você desenvolve uma skill de Alexa, recomendamos que você conclua este módulo e os próximos três, que orientam você em todas as etapas necessárias.

Não se preocupe se você ficar preso ao longo do caminho ou se o seu código quebrar. No final de cada módulo, a solução completa do código de trabalho é fornecida para você sob o cabeçalho Code (Código)

Se você já está aprendendo sobre os fundamentos da construção de skills de Alexa e quer tornar sua skill mais conversacional, por favor, dê uma olhada no Curso de Design de Conversação, disponível apenas em inglês.  

Recursos

  • Enunciados
  • Intenções
  • Variáveis
  • Gerenciamento de diálogo
  • Memória e persistência
  • Configurações de perfil de usuário

Etapa 1: Faça o Login

Para começar, faça login no Console do Portal dos Desenvolvedores de Alexa com sua conta da Amazon Developer. Se você não tiver uma conta, clique aqui para criar uma.

Etapa 2: Crie sua skill

a. Clique Create Skill no lado direito do console. Uma nova página será exibida.

create skill screenshot

b. No campo Skill name, insira Cake Time.

create skill screenshot

c. Em Default language coloque Portuguese.

d. Você está construindo uma skill personalizada (custom skill). Em Choose a model to add to your skill, selecione Custom.

create skill screenshot

As skills têm um front-end e um back-end. O front-end é onde você mapeia os enunciados (o que o usuário diz) em uma intenção (a ação desejada). Você deve decidir como lidar com a intenção do usuário no back-end. Hospede você mesmo a skill usando uma função do AWS Lambda ou um endpoint HTTPS, ou escolha Alexa para hospedar a skill para você. Existem limites para o nível gratuito da AWS, portanto, se sua skill se tornar viral, talvez você queira mudar para a opção de auto-hospedagem. Para este curso, use o Alexa-Hosted.

e. Em Choose a method to host your skill's backend resources, selecione Alexa-Hosted.

create skill screenshot

f. No topo da página, clique em Create skill.

create skill screenshot

Leva alguns momentos para que a AWS provisione recursos para sua skill. Quando esse processo for concluído, vá para a próxima seção.

Console link screenshot

Nota: Quando você sair e retornar ao Console do Portal dos Desenvolvedores de Alexa, encontre sua skill na aba Skills, na lista de skills de Alexa. Clique em Edit para continuar trabalhando na sua skill.

Skill edit screenshot

Etapa 3: Cumprimente o usuário

A primeira coisa que um usuário desejará fazer com a skill é abri-la. A intenção de abrir a skill está embutida na experiência, então você não precisa definir essa intenção no seu front-end.

No entanto, você precisa responder à intenção em seu back-end. Nesta etapa, você atualizará seu código de back-end para saudar o usuário quando ele abrir a skill.

a. Abra a skill Cake Time no Console do Portal dos Desenvolvedores de Alexa. Clique na aba Code. O editor de código abre o arquivo index.js.

Você usará o módulo ASK SDK for Node.js. Para definir como sua skill responde a uma solicitação JSON, você definirá um handler para cada intenção.

code nav link screenshot

Existem duas partes no handler:

  • função canHandle()
  • função handle()

A função canHandle() é onde você define quais solicitações o handler responde. A função handle() retorna uma resposta para o usuário.

Se sua skill receber uma solicitação, a função canHandle() em cada handler determinará se esse handler pode ou não atender à solicitação.

Nesse caso, o usuário deseja iniciar a skill, que é um LaunchRequest. Portanto, a função canHandle() dentro do LaunchRequestHandler permitirá que o SDK saiba que pode atender à solicitação. Em termos práticos, o canHandle retorna TRUE para confirmar que pode fazer o trabalho.

Dica: No editor de código, procure texto pressionando CTRL+F (Command+F em um Mac). Uma janela de pesquisa é aberta. Isso é útil para pesquisar por partes do código no editor.

O que deve acontecer quando um usuário inicia a skill Cake Time? Neste caso, você quer que a skill simplesmente confirme que o usuário a abriu dizendo: "Olá! Bem-vindo a Cake Time. Veja como é fácil utilizar essa skill! Tchau!"

Dentro do objeto LaunchRequestHandler, encontre a função handle(). Essa função usa a função responseBuilder para compor e retornar a resposta ao usuário.

Dentro da função handle(), encontre a linha que inicia const speechText. Essa variável contém a sequência de palavras que a skill deve retornar ao usuário quando ela iniciar a skill. Vamos mudar o que diz para fazer sentido para essa skill.

b. Dentro do objeto LaunchRequestHandler, encontre a função handle() e a linha que inicia const speechText. Substitua essa linha pelo seguinte:

const speechText = 'Olá! Bem-vindo a Cake Time. Veja como é fácil utilizar essa skill! Tchau!';

Certifique-se de incluir o ponto-e-vírgula (;) no final da linha.

Se você não estiver familiarizado com linguagem de programação, uma sequência será encapsulada entre aspas simples ou duplas. Para alterar o texto de uma string, substitua o texto entre aspas.

Quando você substitui o texto existente ou adiciona um novo texto ao código, linhas em branco podem ser introduzidas antes ou depois do texto. Linhas em branco não afetarão o código, mas você poderá removê-las.

Você também pode perceber que suas linhas de código não são recuadas da mesma forma que os trechos de código neste curso. Isso também não afetará o código, mas você pode usar a tecla TAB para recuar o código se desejar.

Dentro do LaunchRequestHandler, , na linha sob o texto da fala que você acabou de substituir, procure por handlerInput.responseBuilder. Esta parte do SDK ajudará a criar a resposta para o usuário.

Na próxima linha, procure por .speak(speechText). Observe a variável speechText que você definiu anteriormente. Chamar a função .speak() diz ao responseBuilder para falar o valor speechText para o usuário.

Em seguida, procure a função .reprompt() no responseBuilder. (Verifique se você está procurando no LaunchRequestHandler, dentro da função handle().)

Se a skill deveria ouvir a resposta do usuário, você usaria isso. Nesse caso, você quer que a skill fale e saia. Portanto, vamos omitir esta linha de código por enquanto.

 

c. Dentro do LaunchRequestHandler, na função handle(), encontre a linha que começa com .reprompt(). Adicione uma barra dupla (//) no início da linha. Isso transforma a linha em um comentário, o que significa que a linha é ignorada quando o código é executado.

 

d. Em seguida, procure a função .getResponse() logo abaixo da linha que você comentou no LaunchRequestHandler. Isso converte o trabalho do responseBuilder na resposta que a skill retornará. Lembre-se da linha que começou com o retorno? Pense nisso como se estivesse apertando o botão Enviar - envia a resposta.

Depois de fazer todas essas alterações, seu código na função handle() dentro do LaunchRequestHandler deve se parecer com o seguinte:

You have built the code that will handle a LaunchRequest for this skill. Before doing anything else, save your changes and deploy the code.

    canHandle(handlerInput) {

        return Alexa.getRequestType(handlerInput.requestEnvelope) === 'LaunchRequest';

    },

    handle(handlerInput) {

        const speakOutput = 'Hello! Welcome to cake time. That was a piece of cake! Bye!';

        return handlerInput.responseBuilder

            .speak(speakOutput)

            //.reprompt(speakOutput)

            .getResponse();

    }

Você construiu o código que processará um LaunchRequest para essa skill. Antes de fazer qualquer outra coisa, salve suas alterações e implemente o código.

Nota: O texto "Hello! Welcome to Cake Time. That was a piece of cake! Bye! foi substituido anteriormente por: "Olá! Bem-vindo a Cake Time. Veja como é fácil utilizar essa skill! Tchau."

e. Clique em Save (Salvar).

save button

f. Clique em Deploy (Implementar).

deploy button

Step 4: Teste sua skill

Agora é hora de testar a skill. Comece ativando o simulador de teste.

a. Clique na aba Test (Teste). O simulador de teste é aberto.

test nav link screenshot

Um alerta pode aparecer solicitando o uso do microfone do seu computador. Clique em Allow (Permitir) para habilitar o teste da skill com sua voz, como se estivesse falando com um dispositivo habilitado para Alexa.

alert window screenshot

b. No menu suspenso no canto superior esquerdo da página, selecione Development (Desenvolvimento).

menu development screenshot

Testando dentro do Console do Portal dos Desenvolvedores

Existem duas maneiras de testar sua skill no console. Com o primeiro método, digite o que o usuário diria na caixa na parte superior esquerda. Seja preciso - soletrando assuntos! Alternativamente, fale com a skill clicando e segurando o ícone do microfone e falando.

Até agora, a skill tem uma intenção: LaunchRequest. Essa função responde ao usuário quando ele solicita ao Alexa para abrir ou iniciar a skill. O usuário dirá: "Alexa, abra o Cake Time". Cake Time é o nome da sua skill e foi automaticamente definido como o nome da invocação para a skill. Você pode alterar o nome de invocação, mas vamos deixar como está para este exercício.

c. Teste a skill. Digite Abra Cake Time (sem distinção entre maiúsculas e minúsculas) na caixa no canto superior esquerdo e pressione ENTER ou clique e segure o ícone do microfone e diga "Abra Cake Time". Não esquecer de selecionar o idioma português.

skill test screenshot

Ao testar sua skill no Console do Portal dos Desenvolvedores de Alexa, você não precisa fornecer a wake word (geralmente "Alexa"). Digitar ou dizer, "Abra Cake Time" está bem. Ao testar em um dispositivo habilitado para Alexa, você precisa da palavra de ativação: "Alexa, abra o Cake Time".

Resumo

Quando você abre a skill ela diz: “Olá! Bem-vindo ao Cake Time. Veja como é fácil utilizar essa skill! Tchau!"? Se sim, parabéns! Você preparou o terreno para sua skill. Você estará construindo novas skills com convincentes experiências de voz conversacionais muito em breve.

Ainda há muito a aprender! Na próxima seção, você expandirá a skill para torná-la mais útil.

Código

Se sua skill não estiver funcionando ou se você estiver recebendo algum tipo de erro de sintaxe, faça o download da amostra de código de trabalho a seguir. Vá para a aba Code no console e copie e cole o código no arquivo index.js. Certifique-se de salvar e implantar o código antes de testá-lo.