I love football. Few things make me as happy as drinking beer and watching the Packers on Sunday. Despite living in Seattle for nine years and enjoying watching the Seahawks and Wisconsin alum Russell Wilson play over the years, the NFC Championship game was too bitter of a pill to swallow to enjoy watching the Seahawks in the Super Bowl. Still, I needed a reason to watch, and the #Deflatriots are hardly a reason to get excited.The Project
Technology to the rescue! What I decided to make was a cool light that would change to the colors of the team, every time the Patriots or Seahawks got a touchdown. This gives me something to look at besides the game and the commercials, and a reason to watch. The folks over at Spark gave me a Spark Button a few weeks ago, that is perfect for a weekend project. They also announced a Spark IFTTT (If This Then That) channel which makes it too easy to do something like this.
Build a touchdown alarm with @IFTTT and @spark_io. Too easy now, better quit and make canoes https://t.co/maZKVPS8Hf pic.twitter.com/0Hzb0wccp0 — David Washington (@dwcares) January 22, 2015Ingredients
- Spark Core or Spark Photon
- Spark Button, or LED setup
- Toy football
If you haven’t heard of Spark, it’s basically like Arduino or any other IoT platform, but they do all of the boring stuff for you, like device config, getting on WiFi and exposing REST APIs, so you can focus on doing the code and your hardware build.
The Spark Button is a shield for the Spark Core (or upcoming Photon) that wraps up a bunch of neopixels, buttons and an accelerometer on to one platform. For a developer like me, it’s a perfect hacking platform so I don’t need to worry about calculating the right resistances just to get some LEDs to turn on. But you can do the same thing with some multi-colored LEDs if you have some.
Some kind of cheap toy that you can cut up and put gadgets inside. In my case a free football we got from a bank at a parade.
The first thing I wanted to get going was to get the Spark to show the colors of the team. I’d never used the Spark Button before but it has some fancy NeoPixels on it, that I knew would let me make a cool visualization.
Protip: Put the core on the right side of the Spark Button
If you’re weird like me and got a Spark Button that didn’t come with a Spark Core installed, make sure that it’s plugged in on the side without the headers. Yeah, apparently the Button has some crazy reverse headers, which is cool for extensibility and, really good at making you stupid when it takes a Spark engineer to tell you you’re doing it wrong.
Connect the core to wifi
Follow the instructions in the Spark documentation to get it on wifi, either using the Spark Dev IDE, the command-line interface or the Spark mobile app.
Add the Spark Button library to your new app
From the web IDE, go ahead and make a new project. Our friends at Spark put together a sweet library that makes it easy to code against it. You can search for ‘Spark Button’ in the libraries browser.
Turn on some LEDs
Like other microcontrollers, the Spark has a setup function, where get everything started, and a loop, function that gets called on every clock. If you want to turn on an LED and keep it on for a while, then you need to make sure you all it from the loop.
I went ahead and made a handy helper to turn LEDs on to a specified brightness to the color of a provided string.
Then, we write a function that changes the LED’s colors whenever there’s a touchdown. In this case, we just enter touchdownMode by changing a bool.Step 2: Expose the REST API
Spark makes it super easy to expose a REST endpoint for your core. In our case, we already have a function for touchdown, so we just call the Spark.function() helper.
This is one of the best parts of the Spark for me, after you flash your core with this firmware you can go ahead and hit this API to turn the football on.Step 3: Make an IFTTT recipe
Spark just announced it’s IFTTT channel, which makes it easy to kick off device functions from IFTTT triggers. One of the most notable IFTTT triggers, is the ESPN channel which offers triggers for in game updates. Specifically, it fires when there are touchdown for the team you specify.
You could just as easily do this with code on an node.js server on Azure, but besides making this easy, ESPN doesn’t offer a public API any more for sports data.
These are disgustingly easy to create once you set up your IFTTT account.
Choose ESPN in game updates as the trigger for your team.
Choose Spark, “call a function” for the action. Then, chose your “touchdown” function and pass interesting data, like TeamName.
This will go ahead and call that touchdown API any time there’s an ESPN game update for your team. IFTTT passes the data you provide to your Spark function, so later, you can parse the string so you can change the color depending on the team, or validate that it’s a touchdown, not just an end of quarter or something.Step 4: Hack up your football
The last stage is to make it look cool. A bunch of circuits or wires doesn’t deserve to enter your football watching experience, so go ahead and cram all of those goodies into a crappy plastic football or something.
The last stage is to get polish it up and get it ready for showtime.
- Add a fade animation for the colored LEDs so it pulses like a heartbeat with each touchdown
- Change the color back white after a few cycles of the color
- IFTTT is awesome and easy, but it’s not instant which isn’t ideal for this scenario. I found there’s anywhere from a 1m to a 15m delay for when triggers fire. If I was going to build this again, I’d directly use an API without the latency
- Glue the football halves together
- Cover up my janky saw cuts with some extra glue so there’s less light leakage
Now you’re done! Enjoy those commercials and try to forget when your team got kicked out of the playoffs.Code
Human knowledge belongs to the world! Here’s my final Spark code.