EJFox.com

A summer of live streamed coding

In which the skill of broadcasting yourself writing code to the entire internet is explored

For the past few months, Ian and I have been experimenting with livestreaming ourselves working on dataviz projects on Twitch and calling it Coding With Fire.

These experiments evolved from the rough shape of how Ian and I have hung out since we met nearly 10 years ago as coworkers at a dataviz startup in San Francisco. During coffee breaks and after work we would hang out and hack on projects that didn’t fit into our day jobs.

It has been interesting to take that previously private pattern of collaboration and do it in public. I think it made it easier to work through some of the other challenging aspects of livestreaming. We already had a rapport and an understanding of how to work together that allowed us to multi-thread an idea, work at it separately, and combine our individual elements later.

I think it would be much more difficult to attempt to do the same thing alone, and I am glad to have a skilled co-host to work with.

A lot of inspiration came from other livestreamers who are finding new methods of creating entertainment in a world facing drastically new paradigms due to a global pandemic. I have enjoyed watching people build keyboards, play video games, and code on Twitch.

It has also been really inspiring to see the discipline and focus of Shirley Wu as she builds a community around her data exploration and visualization livestreams.

I think that the more people who understand the skills required to visualize data, the more people who are exposing truths hidden in datasets, the better the world will be. I also hope helping people who want to get into data visualization see the process will be valuable in terms of education as well as inspiration.

The cooking show metaphor

One thing that really helped us figure out how to think about how to present ourselves was the metaphor of a cooking show. I grew up watching all sorts of excellent and varied cooking shows; Masterchef, Kitchen Nightmares, Iron Chef, Chopped, Top Chef, and more.

The thing I like about these cooking shows is the same thing I like about shows like Mythbusters ; I got to see someone make something every episode.

This also helps me think of my show preparation the same way a chef might prepare for a service. I do my mise en place and get all my ingredients sliced and diced in the right proportions. When it comes time to do the show, I am left with the entertaining parts of assembling them, talking about why, and experimenting.

Too many modern educational coding videos fall closer on the spectrum to watching a chef cut their carrots individually, and that’s not the type of TV show that I wanted to create.

The cooking shows that I love are more than someone following a certain recipe. I love when a chef lets me into their decision making process, the sort of meta-thinking and skills that allow someone not only to imitate the immediate actions of a skilled chef but also adopt reusable formulas that can be used in yet-unforeseen circumstances.

Working in the open

Another great benefit of livestreaming yourself working is that there is a flow of education back and forth between the audience and the hosts.

Feedback can range from “you missed a letter there” to “try out this new library”. It is really motivating to have people helping you along in your journey. It makes it feel like you are with a group of people solving interesting problems together (which reminds me of my favorite moments when working at start-ups).

You also get a record of the decisions you made, which I have used on more than one occasion to remind myself why I did something a certain way.

Livestream experiments

Live animation

One time, Ian and I turned ourselves into animated characters using Adobe Character Animator. I thought it turned out awesome.

For me, this is partially solving the problem of what visual to show for audio-only guests.

It also opens possibilities for other experimentation with presentation, like if our animated characters occupied a virtual space, or acted out a narrative in real time in combination with the code we were writing.

Mozilla Hubs

While I haven’t used it much yet, I am curious about hosting livestreams using Mozilla Hubs which is a cool way to spatialize guests, reference material, and outputs. I am imagining some way of putting a bunch of screenshots on a shared table, going over them together. Then, in the virtual space, we might go to our “laptops” and start live coding. Our outputs are displayed in the virtual world on enormous screens (or floating in space, if 3D), and users can join in and explore them and offer feedback.

Crowd participation through Firebase

Ian created a notebook that uses Firebase and a real-time database so that anyone can edit the colors that appear behind us live on stream. The colors are persistent, and anyone can change them, so we often start the stream with a cool new color scheme created by an anonymous person.

I love every opportunity to have this type of collaboration with the audience. I also really enjoy the parameters of collaboration we have set. A malicious troll could potentially make the colors all white, or something, but even that is interesting.

What they can’t do is edit our color palette in a way that ends up with us saying something racist, misogynist, or otherwise unwanted on our stream.

Letting the crowd control the colors has been such a rewarding and risk-free way to let the users interact with us directly and see the changes they are making in real time on the stream (when the background is showing).

Building the habit

One of the best parts about doing the livestream with Ian is that we can hold each other accountable. Skipping a stream also means letting your friend down. As a result of this, the only streams we have missed happened when Ian had to move his entire family across the country from California to Florida in the middle of a pandemic.

We do our streams on Sunday and Monday evenings every week, the repetition has been the key to figuring things out. Different technical and graphical elements emerged as we found that we needed them. We went through the occasional technical hiccup on air. We did a lot of streaming to 1 or 2 viewers and figuring out how pre-produce the shows, pace ourselves, estimate how long different tasks would take, and know when to move on when something was going more slowly than expected.

Surprisingly productive

One of the most surprising things of working in the open is that I feel like every time we stream we are surprisingly productive. There is something unique about “performing” your job to the internet. We usually stream for 3 hours and take a little 10-15 break in the middle. I rarely get that sort of consistently focused time in my private life. Because of that, I find myself waking up the morning after a livestream and looking at all the things that we created in astonishment.

“We did all that?” I ask myself, but of course we did, it’s all on video.

Want to see what else I've written?
🌞