Hey you!

Welcome to my portfolio. I document my adventures in design, music and creations. Hope you have a nice stay!

Christina Aguilera’s Range Finder & Interactive Assignments for MasterClass

Christina Aguilera’s Range Finder & Interactive Assignments for MasterClass

One of my favorite parts of creating new classes for MasterClass was designing interactive learning tools to build on the class material. For Christina Aguilera’s class, we built something that we were surprised we couldn’t find anywhere else online—a tool to find your complete vocal range!

The Range Finder is an interactive exercise that uses the microphone & speaker capabilities of your browser to capture the highest and lowest note in your range (and all the notes betwixt—no cheating). We were so excited about creating it that we’ve offered it up for the world to sing to (aka. we put it in front of the paywall):

A note about the process: Dang! No wonder no one tried to build this before! It’s hard to convince someone to sing into their computer. How do you get someone to go from looking at a screen shine back at them to actually singing into it? After many iterations and user testing, we realized this required us to simplify the steps of the process and how each step was messaged. I focused on the immediate actions we wanted the user to complete as opposed to the traditional method I'd used for our previous assignments of starting with an overview of what will be learned. We tried several iterations of messaging before landing on the final solution. There is nothing like watching the screenshare of a bewildered user hopelessly clicking around to make you simplify your design.

Ok, it’s your turn to sing. Please engage a computer near you, open Chrome or Firefox and pump out the jams...

Wanna watch someone else ace it...here’s my husband, the singer of Scissors for Lefty, finding his vocal range. Enjoy!

The Brand & Identity of MasterClass

The Brand & Identity of MasterClass

YouTube's First Visual Refresh

YouTube's First Visual Refresh