Touchscreen interface for SONOS speaker (for my 3-year-old)

My 3-year-old loves her music, but our SONOS speakers require a device (phone, computer, etc) to control them. She always has to rely on us to start her music for her.

Last week, I had an unprecedented day off; it was glorious time to let my mind create whatever it wanted. And apparently, messing around with an API was what it wanted.

Here’s the final product:

Features

  • Touching a thumbnail will play that album or playlist from Spotify on the SONOS speaker in my daughter’s room.
  • We can add a new playable item from our phones by saving something as a favorite in SONOS, and naming that playlist with the first part being my daughter’s name, e.g. “[Name] – Frozen 2”

Nitty Gritty

Interface

The touchscreen is an old Lenovo Yoga 13 I pulled out of the basement. It is pretty beat up and slow, but I gave it new life by loading Ubuntu onto it.

However, since I’m just loading this on a web page, you could do this on anything that is able to run node.js.

SONOS http API

The first step is getting something set up to interface with the SONOS API. If you’re not familiar with SONOS, the speakers in your house set up their own little wifi network, with one of the speakers acting as the master, that you can interface with.

In this case, I chose to use this API, since I knew I could whip up a webpage quickly to leverage it: https://github.com/jishi/node-sonos-http-api

This API allows you to control individual SONOS speakers on your network through simple http calls. Nice!

You first have to install node on your computer, then start the API running. It has to be running continuously for the interface to work.

Webpage

This is super hacky – don’t judge 😉 (I did it in one sitting on the couch)