About three weeks ago, inspired by my friend Suze Hinton, I started to live stream on Twitch.  I just wanted to work on an open source project or two that would help promote features that my teams were building for ASP.NET, particularly ConfigurationBuilders.  That effort has taken off, and I’ve received a number of questions asking, “How are you setup to stream?” or “What do I need in order to get started?”  I’ll run down my configuration here…

Good Video Starts with Good Sound

I learned several years ago that video with mediocre sound is not something I want to watch or listen to.  One of the first things I invested in was a good microphone, and I ordered a Rode Podcaster for my screencast recordings. This is a good microphone that connects to my PC via USB and is easily controlled from a Mac or PC.

Next, to ensure that it’s not just sitting on my desk, I got a boom arm to mount it on so that its out of the way and I don’t have to think about holding the mic up to my face.  After all, I’m going to be typing,

coding, and thinking about plenty of other things.  Rode makes a nice boom arm that you can use with the podcaster.  More than JUST the arm, I also got the shock mount to go with it.

The shock mount is a spiderweb shaped mount with rubber bands in it that holds the mic.  Importantly, this mount prevents you from hearing the impact of my keystrokes and me putting anything down on my desk.  My entire microphone setup looks like the image to the right.

Camera

The webcam on your laptop may be nice for making calls to your family while you’re traveling, but it’s probably not hi-def or high-enough quality for recordings.  For my setup, I have a Logitech c920 hi-def camera.  This camera provides 1080p video and will pan around the room if I need it.  Very useful, simple to install with a clip on the bottom of it, and it’s sitting on top of my first external monitor.

Computing Hardware

The computer that I am using to record or broadcast has been changing over the last week, as I tinker with configurations.  I was using my trusty Lenovo Yoga 910s to do my initial broadcasts. This is a special edition of the Yoga 910 with a glass cover and was only sold at BestBuy.  I grabbed one, and it has serial number 1438 or 4000 stamped on the keyboard.  It’s a beautiful machine with an i7 processor, 16GB of RAM, and a 4k native display.  I really enjoy it, and use it at most events that you see me speaking at.

The problem with this machine is that it is an ultrabook and doesn’t have a really good video card.  The video card on board is an Intel 640, enough to push a 4k display for Visual Studio and other business computing, but not up to the task for video rendering.

I was due for a hardware refresh from work at the beginning of the month, so I requested the biggest and baddest machine my employer sold:  Surface Book 2 with a 15 inch display and performance base.  This machine has a beautiful display, but importantly has the extra 6GB NVidia Geforce 1060 video card in the base.  This extra power really helps with the video rendering and streaming.

With the Yoga, I was able to push 720p video without dropping frames, with just me on camera.  The Surface Book 2 allows me to output 1080p video without dropping frames, and feels really good when I’m coding on stream.

Extra Power…

While streaming, there is a LOT going on, and you’ll see my head constantly looking around me at other displays.  I actually have FIVE displays running to help me produce the stream.  It may be much, but I’m a little nutty about controlling the output on stream.  My apologies for no picture at this time, as my office is a mess from moving and setting up gear.  I’ll try to get a pic uploaded after the weekend when I clean up a bit. Let me run down what’s happening:

Display 1 is my Surface Book, and it has the music player, OBS software, and any other stream producing applications running on it.

Display 2 is a 27-inch external display connected to my Surface Book and sitting just above the laptop.  I actually have it on an old crate from a box of clementine oranges, because it was JUST the right height.  This display is running at 1920×1080 and is my “stage” that contains everything on screen that I output to the stream.

Display 3 is my Macbook Air, sitting directly to my left.  I have Tweetdeck and the Mixer.com console running on this screen.  I check the Mixer console to ensure that I have a quality stream being output to their service, and Tweetdeck so that I can check for any tweets during the stream.

Display 4 is a 24-inch display, turned portrait mode, just to the left of Display 2.  This is connected to the Macbook Air and is showing the Twitch stream console. Just like on the Macbook’s proper display, I’m monitoring the quality of the stream being delivered to Twitch.

Display 5 is my Lenovo Yoga that I described previously.  This one… this is what I’m experimenting with currently.  I am now using remote desktop to connect to this laptop from my SurfaceBook, and running Visual Studio on this machine.  In this way, the compilation and debugging that we’re working on during the stream is not effected by the video rendering process of the SurfaceBook.

Software

To broadcast a video stream, I use the Open Broadcaster Software or OBS as the streamers call it.  This is an open-source tool that allows you to record video, stream video, manage scenes and transition between various layouts easily.

I have several scenes configured with my c920 webcam positioned at different locations on screen and with display 2 configured to take up about 85% of the screen.  I’ll work on another post detailing my configuration of OBS, because there’s a LOT going on here.

What are those widgets on screen?

The various widgets that you see on the broadcast are from StreamLabs.com and are simply reading the state of the stream on Twitch and Mixer.  They expose this content as a series of web pages that OBS can embed with it’s BrowserSource display input.  My goal for the Rundown project is to assemble a docker image that runs an ASP.NET Core application that can replace most of these features.

The follower count at the top of the screen is an OBS text source that is created with the StreamLabels application from StreamLabs.  This application runs in the background on my machine and write out the follower count to a text file that I embed in the stream.  Easy…

The embedded chat comes from Restream.io.. more on them below, but this is a chat window exposed as another web page that is embedded as another browser source.

What’s Chroma-Key?

Last week, I wanted to try something fun… so I ordered a small muslin backdrop and a stand to hold it.  This funny green colored backdrop is used on television for the weather presenters, and now its behind me on stream.  OBS has a chroma-key filter that I can use with my webcam input to digitally remove the green so that it looks like I’m IN the stream.  Just right-click on the webcam source, choose filters, and add a chroma-key filter.  You can see my OBS configuration for this below.

Most important when setting up the green screen, is the lighting.  I have two spot lamps mounted on my desk and the arms of my chair with 1000 watt light bulbs pointed at the green screen.  You need even lighting on the green so that the software can identify it and remove it from the video output.  My chair and screen look like this:

Streaming Services

Originally, I started streaming to Twitch.  It’s the biggest streaming service, but YouTube is coming along as well.  I had also heard of Mixer and wasn’t sure about trying that service.  It turns out, that Mixer has a very low latency feature to their service that makes it great for interacting with your audience.

In order to prevent losing any of the audience I started on Twitch, I started using Restream.io as my broadcast point.  Restream will mirror your stream to any number of services that you want.  For now, I have Twitch and Mixer configured on their console.

Restream also provides the unified chat room, showing the contents of the chat from all services that I am connected to.  This is the widget that I am embedding, and it has been working great for the stream.

Summary

I hope this was beneficial in showing you how I have configured my stream.  Its been a fun experience, and I’ll share more as things change and update in my configuration.