Sometimes user research happens in-the-wild, like in users' own homes or offices. And sometimes designers and researchers aren't there while the user research is happening, as we saw with all research work going remote during lockdowns.

For the Astronauts' Gadgets project, I needed to hear what co-designers were saying about their design ideas and design process even though I wasn't there. Because my co-designers were young children, I couldn't ask them to write down their ideas or even draw them for me in detail. So I needed a way to record everything they said without interruption. And I needed to do everything I could to ensure that that audio would make it back to me. Without it, I would have no data to design from.

So before starting user research, I went on this design journey to make this robust audio recording website for in-the-wild user research. For this, I had to design the front-end appearance, the back-end architecture, and how users were instructed all together to meet these goals of easy use and protecting from data loss.

Starting with the first design question...

First I considered what was already available. Maybe I didn't need to make something brand new at all! I needed something that anyone could use (because parents would be starting and stopping the recording for me, and possibly needing to send or upload it to me too). It also needed to handle pretty large files, maybe 30 to 60 minutes of audio in a single file, so I wanted to make sure a file transfer wouldn't time out or be too large for email.

A pocket audio recorder is sturdy and stores everything internally (so no risk of losing it while transferring). But they're pretty unfamiliar, so I couldn't be sure that parents would correctly start the recording. If they thought it was going, but then found out afterwards it wasn't, it would be too late.

Providing a phone for them to use just for that has similar issues, and it could get expensive if they got broken and needed to be replaced a few times.

I thought about asking parents to use their own phones. But what would they record with? Using a 3rd party tool wasn't possible because I needed to make sure the audio didn't go to anyone except the family and me (for confidentiality and privacy protection). And using a voice note would likely time out either during the recording or during sending. If the internet cut out for a moment during sending I could lose the whole file.

So it seems like there's no pre-made tool for this. Let's look into making my own custom tool, especially considering that problem of data loss. Time for the next design question...

Off the bat, I ruled out making a new app. If I wanted any parent to be able to use it on their phone, I would need it to work on any version of any operating system. So how about a simple recording website? Hosting it myself removes the need for 3rd party tools. HTML5 and the MediaStream Recording API makes recording audio easy. So I started made a simple proof-of-concept audio recorder.

Transferring a large audio file all at once still has the same risk of loss as using any of the other options I'd already considered. But now I have full control of how the audio records and saves to my own server. So what if I made sure I only transferred small files?

I designed a system for buffering and sending audio in overlapping chunks. So each file is 5 minutes long, but it starts recording a new file every 4.5 minutes. In a previous project I had seen how lag between recordings can also lead to data loss. So overlapping files protects against that. And if the connection cuts out and one file doesn't get through to the server, I won't lose more than 4 minutes.

{figure of that system}

I now had a working proof-of-concept using this overlapping recording design. But as soon as I started testing it myself, I found a new issue. Since I was using a website in the phone's browser, the phone fell asleep once I left it alone and recording for a few minutes. And that cut the website's access to the phone's microphone.

Some quick research confirmed that apps can keep recording with the screen off, but not a website. So I guess I need to keep the screen on. I can do that within the website, but now I have new problem.

The phone using this recorder is going to be sitting between a parent and a child during their co-design activity. It has to be nearby so the microphone will capture everything. But if the screen is on the whole time, that's going to be distracting and tempting to play with the buttons on the recording screen. We're back to the data loss problem (what if a kid touches the stop button without noticing it?) and keeping young designers on task.

Alright, new design question...

There's two pieces to keeping the screen on. First, keeping the protection from data loss intact and second, making it as un-distracting as possible.

Now all the technical pieces are there, I needed to stress test it. I wanted to know that I could be running research with multiple different users at once and still collect distinct data from each family. So, I recruited beta testers and had them record for around 30 minutes in the background of what they were doing. I made sure some of them were talking, so I would see what the audio quality would be like. And I got testers from different time zones, since this research was happening through two different universities on opposite sides of Canada.

With the working product done, I had one last piece, one last design question...

I had put so much work into designing it to not look like a recorder with obvious buttons. So the last piece was to add in instructions to the activity book that came with the user research package with a QR code to their unique link. I also had each parent meet with me on zoom to test the recording site on the same device they were planning to use, just in case.

So was the whole design journey worth it?

Yes! The recorder worked for every user that helped me co-design. Twice users did have connection issues, but I lost less than one minute of audio each time, thanks to the overlapping recording I designed.

The non-distracting design didn't just stop young users from playing with the recorder. Some kids were actually more engaged with the activities because they could see the other team of astronauts as a reminder of what to do.

So final verdict, I have a working customizable audio recording tool for in-the-wild data collection. I'm excited to see what other projects can adapt how it looks to blend in with their user research!