Recently I shared with you guys how we’re getting scrappy with Remote Usability Testing on Mobile Devices. We’ve also been hanging out in coffee shops with our users and testing our mobile prowess in person.

We needed a way to record these sessions, and I got inspired by these guys. But I wanted to come up with a way to record in person mobile tests in a mac environment.

First, get yourself a fancy HueHD webcam. Then strap the webcam to a regular ol’ kitchen clip that you can find at Bed Bath and Beyond with a fat strong rubber band (I used the one from my Field Notes shipment).

Plug the webcam into your mac using a USB extension chord and clip the rig to the top of your mobile device, and position the webcam so you’re capturing the whole mobile screen, including the home buttons.

Open Photobooth on your mac and it will display what the rig sees. (Tip: if it shows your face instead, unplug the webcam and plug it back in.) This will act as a video monitor, so the user can see if their device has migrated off camera.

Open Screenflow and set it to “Record Video from: Built-in iSight” and to “Record Audio from: Built-in Microphone.” This won’t show what Screenflow is recording, so the user won’t be distracted by their own facial expressions on camera. Screenflow will be recording the full screen view of your monitor, so you’ll be capturing the feed from the webcam through Photobooth, and the user’s facial expressions as well as audio conversations through Screenflow. (Tip: have a blank background and pile all your desktop icons out of the way, or create a snazzy non-distracting background for your tests.)

Once you’ve got Photobooth and Screenflow running perfectly, you’re ready to record. This setup isn’t very heavy, so it’s easy to encourage your tester to use their device however they usually do, including switching to landscape—whatever’s normal for them.

After recording, you’re going to have two layers of footage: one for Photobooth and one for Screenflow. Go ahead and shrink the wee box with your user’s pretty face in it and move it kind of out of the way, but not off screen.

You’ve probably noticed that the video from the phone is upside down and backwards, but it’s an easy flip in Screenflow. Just select the Photobooth layer and change the Y and Z axes to 180. Then you can expand this layer larger than life so that the mobile phone is the center of attention in your recording.

Once everything looks good, you’re ready to export your recording from Screenflow. Exporting at 75% is going to be plenty high enough for a good quality video that you can share with others.

Again, it’s our scrappy little DIY method, but it’s been working out great for us. Let me know if you have any questions about our setup, or any ideas you’ve had!