Creating Super Effective iOS Shortcuts with Glitch
I’ve played Pokémon since 1998, but there are still some types of Pokémon I’m never quite sure how to battle. If I’m battling a fire 🔥 Pokémon it’s pretty obvious– use water 💧! But what about a dark type?
I wish I could ask Siri for all my Pokémon battle on-the-go type matchup needs. Sadly, if you ask her, she directs you to a web search. And who has time for that?
But now I can create my own Siri commands with Glitch and the new iOS Shortcuts app. Well, new-ish; the Shortcuts app is really just a new version of Workflow, an automation app created in 2014. Apple bought it in 2017. With the rename, it also gets something Workflow didn’t have: Siri integration.
Each Shortcut is almost like a little spell 🧙🏼♀️ you can cast to do a task. You build Shortcuts from “Actions” such as:
- Creating an image 🌠
- Rearranging text 📝
- Tweeting 📢🐦
- Add an event to your calendar 📆
- And recording video (which can come in handy for serious stuff, like getting pulled over by the police!) It’s a little like programming because you can use stuff from one Action and pass it to another. For example, taking the title of a calendar event and tweeting it. Or taking two images and making one image out of them.
Where Glitch comes in is as a handy tool for:
- Advanced processing of data grabbed by a Shortcut Action.
- Capturing data from somewhere else to use in your shortcut. Together, iOS Shortcuts and Glitch are a powerful duo. We’ll show you some examples of what people have already created using Shortcuts and Glitch. Then I’ll walk you through, step-by-step, an example Glitch-powered Shortcut that you can remix to create your own.
We got inspired by these two nifty Glitch projects:
If you uninstall the News App on your iOS device, every time you visit an apple.news link it will be broken 😭
Luckily you can open it with the Chapel Pews shortcut by Ashur. It passes the URL to Glitch, then Glitch tries to find the link to the HTML article. If it finds it, it will redirect you to the article. If it doesn’t, it will show a nifty error page that will tell you how to reinstall news.
When is “Game of Thrones” on next? This Shortcut by WilsonSmith asks you what show you want to know about, then passes it Glitch. Then the Glitch application grabs some data from Nextair.tv to tell you when it’s on next! Nice!
But how does it all work? Well, the secret is that you can pass text from Shortcuts to Glitch by adding it to the end of the Glitch app URL.
For example
super-effective.glitch.me/DATA
For my shortcut, I want it to take a Pokémon type and pass it to the Glitch app, so it would be
super-effective.glitch.me/TYPE-OF-POKEMON
I get the Pokémon type by adding the Action “dictate text.” This means Siri asks me what type I want to know about, then Shortcuts can use whatever I say in Shortcuts Actions.
Now let’s tell it to use the results and put them at the end of the URL of my Glitch app. To do that let’s use the “URL” Action.
And guess what’s an option to put at the end of the URL? The text we just collected from our “dictate text” Action.
And finally, grab the contents of our fancy ✨ new URL with the “Get Contents of URL” Action.
This is how we pass it to Glitch. How? Well, my app was created from “New Project” → Node Express. So it’s built off of Express.
Express is a “web framework.” What’s important to us is it can serve our website and do our things based on the “route” at the end of the URL.
For example
super-effective.glitch.me/dark
Passes “dark” to our Glitch application. ” What is it going to do with it? It’s going to query the PokéAPI. Yes, there’s an API for Pokémon! It started as a simple weekend project, but now it has almost everything you could ever want to know about Pokémon. Not just Pokémon, but berries, items, and of course what we need: type matchup info. Check out the results for “dark” to see the type of data we’ll be working with.
I called the API using “pokedex-promise-v2”, a nice little tool that allows me to query the PokéAPI with just a few lines of code.
Once it gets back the data, I use plain Javascript to take the data and turn it into a sentence that Siri can say.
Now, back to our Shortcut. Let’s add the “Speak Text” Action and “add to Siri” which means when we say “Super Effective” to Siri, it will trigger our new shortcut.
It will then ask me what ‘type’ I need to know about. Once I tell it, the Glitch app does its thing. Finally, Siri tells me what types of Pokémon are super effective against Dark!
Of course you can use the PokéAPI in Shortcuts without Glitch if you want, but that requires building a much more complicated Shortcut. I also like that I can use my Glitch app as a plain old-fashioned website or tool for other devices like Alexa.
Want to create your own Glitch-powered iOS Shortcuts? Well, our Super Effective app is remixable 🎤🎶! Just click “remix” and start coding. Here are some ideas:
- Want to know what types of Pokémon are effective against a specific Pokémon like Snorlax? Use Shortcuts to get a Pokémon name and then use the PokéAPI in Glitch to find out what type are effective against it.
- Use Shortcuts to pass a food name to Glitch. Then Query an API like Nutritionix or the USDA to get information about it on the go.
- Want to go super fancy? Create your own API in Glitch to use with Shortcuts! We can’t wait to see what you create!