Troubleshooting my Pokémon Passport Service Skill

After finishing the first draft of my skill, I began testing the skill. During this process, I found a few issues. My skill gave the wrong answer when presented with certain edge cases.

Pokémon forms were the cause of several edge cases. For example, Deoxys has four different forms. The data set for my slot values and in the JSON file was looking for “deoxys-normal”. I just wanted the Pokémon so I manually changed all form names to the name of the Pokémon. After doing this almost all Pokémon were getting pulled correctly.

The Porygon family presented another issue. The Porygon family contains three Pokémon, Porygon, Porygon2, and Porygon-Z. These Pokémon have similar names, so Alexa had issues discerning which Pokémon the user wanted. In testing, I kept getting an error response or the wrong Pokémon. To start trying to solve this issue I looked at the slot values. I manipulated the slot value of Porygon2 and Porygon-Z, changing Porygon2 to “porygon two” and Porygon-Z to “porygon z”. I also changed these values within the JSON file. I soon discovered that Porygon2 seemed to be causing the error. The skill would get confused and take in a new slot value. I added two additional entries to the JSON with the keys of “porygon2” and “porygon 2”, these entries were clones of “porygon two” in every way except for their key. This solved my issue and the skill ran smoothly from that point.

Adding a Visual Component to the Skill

Now that my skill was working properly, I wanted to add a visual component to my Alexa Skill. I have an Echo Show at home, so I’m used to getting visual feedback from other skills. I’ve built several skills already, but I’ve never added visual features. I immediately started researching ways to include visual feedback in my skills. There are two ways to add visual information to an Alexa skill, either cards or Alexa Presentation Language. Cards givesEcho Show users additional information about the skill. Alexa Presentation Language can give more information, but also allows the end-user to interact with the visuals. I looked into both options and decided that cards were the correct choice.

I choose the Standard Card to display additional information to my users. I wanted users to receive the output in text form and a picture of the Pokémon. I found a website that had a picture of each Pokémon in a logical order. For example, this page would contain a picture of Bulbasaur. But changing the number before .png to 150, would give you a picture of Mewtwo. To utilize this website in my cards, I created two new variables in my code, DexNumber, and image_url. With these new resources available, I began implementing Standard Cards into my code.

At the top of my code, I imported Standard Card and Image from the ASK SDK with the following line.

“from ask_sdk_model.ui import StandardCard, Image”

Then, I turned my attention to the PokémonIntentHandler. I checked for Nidoran with an “if” statement. If the Pokémon was Nidoran, then the variable image_url was set equal to this image. If the Pokémon was not Nidoran, then DexNumber was set equal to the Pokémon’s national dex number as seen in the code below.

DexNumber = Pokedata[Pokémon]['pokedex_number']

The variable image_url was set equal to a picture of the Pokémon requested”https://pokeres.bastionbot.org/images/Pokémon/%s.png” %DexNumber. This meant image_url would always be a picture of the Pokémon requested. To ensure that my image would be displayed I altered the return portion of the PokémonIntentHandler. I added the line below to the resonse builder.

.set_card(ui.StandardCard(title=display_name, text=output, image=ui.Image(small_image_url=image_url, large_image_url=image_url)))

At this point, the PokémonIntentHandler looked like the code below.

 class PokemonIntentHandler(AbstractRequestHandler):
    def can_handle(self, handler_input):
        # type: (HandlerInput) -> bool
        return ask_utils.is_intent_name("FindPokemonIntent")(handler_input)

    def handle(self, handler_input):
        # type: (HandlerInput) -> Response
        Pokemon = handler_input.request_envelope.request.intent.slots["pokemon"].value
        f = open('pokemon.json',)
        Pokedata = json.load(f)
        if Pokemon == "nidoran" or Pokemon == "female nidoran" or Pokemon == "male nidoran":
            last_catchable_in = "Let's Go Pikachu and Eevee"
            last_playable_in = "Let's Go Pikachu and Eevee"
            output = "Both male and female Nidoran were last obtainable and catchable in Let's Go Pikachu and Eevee"
            display_name = "Nidoran"
            image_url = "https://www.pngitem.com/pimgs/m/54-543042_nidoran-y-nidoran-hd-png-download.png"
        else:
            last_catchable_in = Pokedata[Pokemon]["last_catchable_in"]
            last_playable_in = Pokedata[Pokemon]['last_playable_in']
            display_name=Pokedata[Pokemon]['display_name']
            output = display_name + " " + "was last obtainable in %s" %last_catchable_in + " and was last playable in %s" %last_playable_in
            DexNumber = Pokedata[Pokemon]['pokedex_number']
            image_url = "https://pokeres.bastionbot.org/images/pokemon/%s.png" %DexNumber
        url = "https://pokeapi.co/api/v2/pokemon/%s" %Pokemon
        speak_output = output
        return (
            handler_input.response_builder
                .speak(speak_output)
                .set_card(ui.StandardCard(title=display_name, text=output, image=ui.Image(small_image_url=image_url, large_image_url=image_url)))
                #.ask("Were there any other Pokemon you wanted to ask about?")
                .response
        )

Testing the Standard Card Response

I used the Alexa Simulator to test my Standard Card response. I invoked my skill and asked for information on Bulbasaur. Alexa responded with “Bulbasaur was last obtainable in Pokémon Sword and Shield and was last playable in Pokémon Sword and Shield”, but I could not see the visual response. I thought I’d made a mistake in the code, so I investigated. I couldn’t find an error, so I started Googling. A quick search informed me that the Alexa Simulator would not display cards, and I’d have to check on my phone. When checked Alexa on my phone I saw that my cards were working. My cards looked like the image below.

(Post Card Image here)

Now that my skill had both a visual and audio component it was ready for publication. I clicked Distribution and began filling out information for my Skill. This information included a description of the skill, some example phrases, and a skill icon. My skill passed the validation test, so I sent it to AWS for publication.

My skill was initially rejected by Amazon due to copyright issues. To solve this issue, I had to emphasize that the skill was unofficial and that I did not profit from using the term Pokémon. When I resubmitted the skill it was accepted.

Building this skill was a wonderful learning experience. I discovered how to use ImportHTML to scrap data from a webpage. I learned how to convert a spreadsheet into a JSON file. Additionally, I learned how to add visual information to my Alexa skills. This was a wonderful learning experience. I encourage you to try building your own Alexa skills. Please follow my blog and social media to learn more about my projects.