top | item 23834153

How to Run a Live Coding Stream on Twitch Using OBS

493 points| jordanlewis | 5 years ago |jordanlewis.org

190 comments

order
[+] nickjj|5 years ago|reply
One thing that I was surprised not to see in the post was how to deal with editing files that have secrets (such as API keys or email credentials).

When I set up OBS, I overlayed a full screen image that says I'm showing something secret which had nothing but a small webcam feed in the bottom right so folks could still see me but not my desktop. It was assigned to a global hotkey toggle of course.

[+] ghj|5 years ago|reply
Watching good people's work-in-progress and debugging process helped me a lot in getting better myself.

This is especially true in competitive programming where everyone is solving the same task!

Some competitive programming streamers:

William Lin: https://www.youtube.com/channel/UCKuDLsO0Wwef53qdHPjbU2Q

Errichto: https://www.youtube.com/c/Errichto

SecondThread: https://www.youtube.com/channel/UCXbCohpE9IoVQUD2Ifg1d1g

Alex Wice: https://www.youtube.com/channel/UCQmrwIwzEu8MxplJw9EUcAg

All youtube links because I do random old contests on leetcode/codeforces and usually at least one of the people above would have a screencast recorded (though unfortunately not always with commentary). Some of them also have twitch.

[+] mrkwse|5 years ago|reply
Jordan was a little vague in terms of how to get the iPad as a source. I know that QuickTime can capture i(Pad)OS devices as an input source so it might be some built in compatibility when the device is connected via lightning/USB, but another route is NDI. [1]

NDI is doubly useful as it:

  1. is wireless over the local network
  2. allows you to use your phone/tablet's camera as a video source, which can be a reasonable webcam stand in (although latency will never be as good, so possibly better as a sort of secondary vanity camera)
  (3. definitely works on Windows)
There are apps on iOS that will share the screen content and camera content and a quick google seems to surface the same for Android.

As someone who used to work in TV too, the importance of good lighting cannot be stressed enough. It doesn't have to be expensive, but a reasonable, ideally diffuse source of light will make the biggest improvement to your stream vs an expensive camera (and some webcams may need manual adjustment via OBS to best utilise the available light).

[1]: https://obsproject.com/forum/resources/obs-ndi-newtek-ndi%E2...

[+] ogjunkyard|5 years ago|reply
I just wanted to thank Jordan Lewis for putting this article together. It gave me enough clues on how to implement the "whiteboard"/telestrator feature I've been trying to casually implement over the past 6-9 months. Even though I have 1,300+ hours streamed on Twitch, this still slipped through my grasp on how to get it implemented for some reason.

I was originally trying to implement this functionality by using NDI, but there were a few issues I ran into, namely resolution and framerate, neither of which I was happy about. Something about this article tipped me off to look up using USB to connect the iPad to the PC, which actually led me to setting up the streaming PC as an AirPlay receiver. After I made the switch over to using AirPlay, I had the whiteboard/telestrator functionality working on my OBS setup within 10 minutes.

[+] daenz|5 years ago|reply
Do a lot of programmers feel like they could be effective on a livestream? I might be in a minority, but my preferred coding style is very non-linear and sporadic, and wouldn't make for an enjoyable viewing experience.
[+] saurik|5 years ago|reply
I am way to self conscious for that... I dive deep into a problem for 10 hours and I try a bunch of stupid stuff along the way or make a bunch of mistakes and now I am broadcasting those to the world; and meanwhile either I am paying attention to the people and not working (I always want to get lost in a complete zone of concentration) or entirely ignoring them (which seems weird)... I will go for long stretches--like an hour--just staring at and reading the same data reports over and over again trying to cross reference all of the information, which would be ridiculously boring... I don't understand how people do these things other than as performance art, workshop instruction, or stunts: that people seem to do it and be productive on their own tasks indicates their brains work very different from mine ;P.
[+] twox2|5 years ago|reply
I think it comes down to your "persona". For example George Hotz does multi-hour long coding streams that are all over the place, but they have some entertainment value because he's a bit of a kooky character.
[+] unnouinceput|5 years ago|reply
I do live coding with my clients when is kind of a "brainstorming" meeting. We throw ideas around, and I code fast and ugly to have something running on screen, usually maximum 2 minutes per idea, otherwise the client gets bored. After like 10 ideas, both of us agree on one main idea that gets implemented into production.

During this time I screen-share my entire screen, so we can draw fast on Paint, switch to code see how it behaves when implemented, mainly GUI elements only.

I usually use OBS during this kind of meetings to record everything, in order to have later review material in case I forget something. Also a nice side effect is that later on, if client is not happy with something I have hard proof that he did said/agreed on something.

[+] peoplenotbots|5 years ago|reply
I think a key to streaming is balance of audio and visual "stimulation." If you're not "doing" (as captured by OBS) something stimulating then you need to be saying something engaging. Some in theory if you're coding in python you might need say something to engage your; teaching, explaining your methodology or talking about current events around technology. If you're confident your audio stimulation will not be as strong you need to visualize something engaging. Sometime I did once via youtube was streaming myself writing a research paper creating maps in arcgis.
[+] k__|5 years ago|reply
I did it for an university course this semester and it works surpringly well.

Especially if you have one specific topic and if viewers ask questions.

But yeah, it's a bit hard if streamers don't follow a red line and if they talk in a language that they don't command well.

YouTube is full of awesome content from Chinese and Indian people who talk very bad English, so they probably would have been done better with text.

[+] drewmate|5 years ago|reply
I've never done it, but I've toyed with the idea for one primary reason: accountability. I might just ignore the viewers, or maybe I'd interact and gain some insight about the problem at hand. Either way, just knowing that someone is watching and expecting me to do something (preferably on a schedule) would be a good motivator to actually do it.
[+] blitmap|5 years ago|reply
I don't believe I would be productive on a livestream. That said, I think it would be like exercising a muscle I neglect - similar to the physical exercise I don't do :) I'd probably grow as a programmer if I were more comfortable searching for solutions in front of others.
[+] ffk|5 years ago|reply
I've seen a few streams of people who are like this, and they seem to do ok. One of the pidgin devs migrated their mercurial repos from bitbucket to their own self-hosted environment, live, on stream.

I think the personality of the person has a lot more to do about whether they keep the attention of their viewers. The ones who seem to get things done seem to speak out their internal dialog.

[+] whatrocks|5 years ago|reply
Watching someone "explore" is still entertaining, I think. You don't need to be a comedian, although that's fun, too. But what I like about livestreaming is that it's a pure, real form of seeing someone's brain in real-time.
[+] TACIXAT|5 years ago|reply
One way is to show something you already know how to do. The other is "Twitch plays programming" where you involve the audience.
[+] Swizec|5 years ago|reply
It's really really fun. I do it a lot, am not very popular doing it, but get good engagement. Especially when the topic is something visually interesting.

I'm now at a point where it feels weird coding without saying my thoughts out loud or writing them down on paper. Like I don't know how to think unless there's some output.

And when watchers highlight a bug or tell me techniques to try that I haven't thought of, amazing.

I need to make better use of scenes and staging screens like OP is doing. My streams are significantly under produced right now.

link if you're curious: https://www.twitch.tv/swizec

[+] veeenu|5 years ago|reply
I do stream live coding on twitch from time to time -- albeit I started out as a speedrun streamer. You have a point: if I were to write code in the same style I'm used to, it would probably be not that good. But, probably due to the very fact that I know I'm being watched, I noticed I employ a different style than usual: very neat, organized, logical, working on exactly one feature at a time and not allowing myself to wander too much. It definitely feels good and productive.
[+] xboxnolifes|5 years ago|reply
What's important for most streams is how you audibly communicate with your audience, much less so what you are actually doing on screen.

Not that I think I would be an effective livestreamer.

[+] fsociety|5 years ago|reply
I think it’s what makes it fun. Your channel will likely never grow to be large, but then you get to interact with a healthier community at a slower pace. Jayne (Overwatch Coach) has been streaming on FB Gaming and has been enjoying the luxury of a smaller view count.

I would imagine most big streamers (let’s say 10K+) would enjoy a smaller community more than a larger one - if they could make the same amount of $$$.

[+] badtuple|5 years ago|reply
It really depends on what I'm doing. If it's something I fundamentally don't know how to do and it requires all my concentration, I don't really do it on stream. But there's plenty that I know how to do but others don't. For example writing a parser/lexer can be interesting, but I generally only have to solve fairly local problems and not large structural ones.

Really hard things I _could_ do on stream...but I start to feel like it's too much of me staring really hard silently. I have to wonder how much of that is true and how much of that is personal anxiety. I do enjoy streaming though and should do it more.

[+] neilwilson|5 years ago|reply
It can help you be effective if you take the time to watch back the recordings and see what you are doing.

You may have developed some unproductive tics, mannerisms or habits that you’re not aware of.

Be warned. It’s a tough watch sometimes.

[+] TrueDuality|5 years ago|reply
I feel like I could fairly easily as long as I planned ahead exactly the work I need to do. As long as I get to the point where I'm translating a concrete plan of action into code I don't need to pay that much attention.

This would be an odd change to do on longer time scales. I do this kind of now, but I'll think for a few minutes and have maybe five to ten minutes of action planned out. Not precisely code just needing translating, more of a rough sketch to flesh out.

[+] tmpz22|5 years ago|reply
Depends how you define success. Streamers get viewers through consistent stream schedules and heavy viewer interaction + engaging "high-level" content where what you're doing is actually impressive (i.e. high level competitive gameplay in a video game).

By that definition no code streamer has been consistently successful on Twitch, Youtube Gaming, or any other platform. The closest to it would probably be Hikaru who is a GM chess player.

[+] stale2002|5 years ago|reply
I used to do some livecoding myself. The answer is that it depends on the specific things you are working on. Some thing lend themselves very poorly for livecoding, but others work out pretty well.

For example, if you are doing interview practice, for Google style interviews, livecoding your interview practice is actually a pretty good experience.

Coding in front of an audience isn't much different than coding in front of an interviewer, if you think about it.

[+] ladyofcode|5 years ago|reply
Non-linear coding can be enjoyable as long as the streamer is vocalising their thought processes.

I'm preparing to code on a livestream and honestly, I've thrown out any notion of being 'effective' out the window; chat engagement means distractions, and while I'm used to that I rather reserve some non-streaming quiet time for deep, focused work.

[+] zitterbewegung|5 years ago|reply
The last time I went to pyOhio I had multiple people come up to me asking basic coding questions.

Since you are interactive (you would respond to chat) and will initially do it for free I think it would be better than nothing.

Or when you livestream yourself coding people might help you either improve your technique.

[+] TheAdamAndChe|5 years ago|reply
Enjoyable is relative. You won't get on the top charts by streaming this, but you will we watched by those interested in development. Even a handful of viewers can be pretty fun if they are chatting.
[+] lcrz|5 years ago|reply
During quarantine, me and a couple of colleagues have been doing pair-programming sessions with three or more people. We were joking on doing a twitch stream. I think it could work.
[+] timClicks|5 years ago|reply
It's an easy way to do pair programming without needing to arrange for anyone. Explaining your thinking and process is quite helpful.

But yes, I've certainly found it slower.

[+] keithnz|5 years ago|reply
having watched a lot of coding streams on twitch and have done a few myself, it is really varied, some are sometimes very focused on doing something specific and is just full steam ahead in knocking it out, some are very stop start with lots of reflection and changes of direction. But it is also interactive, people chime in and you end up in meta discussions or sidetracks, or people offer help, etc. So there is no real set style.
[+] sam0x17|5 years ago|reply
imo sporadic and non-linear makes for good content. Also, I've tried live-streaming coding before and I found I got a lot more done than if it had just been normal coding time, because you can't just idly check HN.
[+] sngz|5 years ago|reply
this is why most streams you find are front end development based.
[+] steveklabnik|5 years ago|reply
... how convenient, I am considering starting a live coding stream soon. Thanks for writing this and posting it!

(I have done some speedrunning livestreams, but not coding. Well, not in a Twitch setting anyway, I've done talks with lots of live coding and really enjoyed it.)

[+] ethanwillis|5 years ago|reply
So I haven't done any live coding streams in a long time. But I recently recorded a completely unfiltered version of myself coding for a co-worker who is learning to program. I wanted him to see all of the ups and downs. All I did was turn on the recording and just went about my day like I normally do, all cussing and fiddling in my terminal like I normally do. Once you're on for 30 minutes or so you forget you're even recording.

It could be interesting to take this approach then "stream" it as well so you can provide feedback to people watching and also laugh at yourself a little bit.

[+] pengaru|5 years ago|reply
It's unlikely I'd ever share livestreams of my coding, but I do think there's value for any craftsman to watch recordings of their work.

Programmers have it especially easy in this regard since it doesn't require any cameras/lighting/tripods/line of sight whatever. Just record your desktop for a day and watch it in down time. I think you'll be surprised to see what deficiencies stand out as an observer that you've probably come to just live with due to complacency/habit. It helps prioritize areas to improve, and you can do this iteratively.

[+] Uehreka|5 years ago|reply
I’d love to do a live stream of my coding work with me explaining my process. Even if few/no people watched live, they might make for useful tutorials or at the very least a sort of video journal.

My main hitch is that I’m concerned about getting to comfortable and accidentally bringing up a config file that contains secrets, and then once those are streamed they’re out of my control.

[+] ianmcgowan|5 years ago|reply
I have a problem with diving into rabbit holes and spending more time on "being efficient" than sometimes just doing the work. Two things that have helped are

1) recording a "session" (I use snagit, but any screen recorder that lets you narrate works), where I describe what I'm working on, what the goal is etc. It seems silly, but even if the only person that's going to watch the video is me it somehow helps keep on task. And the video journal aspect is actually interesting.

2) Focusmate.com - this worked for me for a while, but I'm a secret uber-introvert, so I dreaded the introduction part of the process. But telling someone "I want to accomplish X in the next hour" and then having them watching over my shoulder really works.

Maybe you should try the live streaming, but just leave out the streaming part? :-)

[+] wtallis|5 years ago|reply
Does anyone know of a good presentation system that does not consist of compressing raw pixels and sending that to the audience? It's a huge waste of bandwidth that I'd rather see used to provide reliable low-latency audio.

I'd love to be able to teach programming in a way that lets the students explore the live state of my working directory and follow along with file edits, but rendered locally on their machines at native resolution and with at least some degree of interactivity. Most collaborative editors I'm aware of are ill-suited for code, or don't seem to work well for more than one file at a time. Ideally, I'd like students to be able to open a read-only view of my entire IDE workspace, but exporting it over a network filesystem isn't quite live enough even with a short auto-save interval.

[+] nickysielicki|5 years ago|reply
I love live coding streams. It's my personal opinion that the best programmers are the best debuggers, and that's something that's often language/domain specific and gets significantly more difficult as the codebase grows larger. In other words, it's hard to learn how to debug if you don't already work on a large project or within a certain language.

Watching people debug on twitch has definitely changed the way that I approach bughunting.

You guys should definitely check out Jordan's stream if you like the idea of watching someone fight the good fight against the dark-side of Go's opinionation.

[+] byefruit|5 years ago|reply
Love the bokeh on his video feed. Hard to justify a $900 camera for that alone though, anyone using anything else they'd recommend?
[+] agentultra|5 years ago|reply
Nice to see more! I started doing a live coding stream as well. It's an interesting medium.

I still get a bit nervous before I start streaming. I spend time rehearsing what I'm going to say and work on and how I'm going to present it... but I'm finding that is not very sustainable and am doing it more to have a dedicated couple of hours to hack on side projects and share my discoveries and knowledge with folks.

The interactive nature of it is neat and not as difficult as I had anticipated it would be but my audience is still only a handful of folks each week.

Give a try if you're thinking about it. You don't need pro equipment to get started with live coding. I use my phone for the camera and I pulled out my old 4-track and mic to record audio but it can be done with a headset and a webcam no problem.

update: Link to my stream: https://twitch.tv/agentultra

[+] numlock86|5 years ago|reply
Well, truth is, you need to code something "mainstream" to make it even worth it. (read as: have at least like 2 people watching or even just visit your channel once, not including yourself ...) Program some "Unity game prototype", some Java or JavaScript web dev, frontend or backend, put in buzzwords like Postgres and NodeJS and what else is relevant to people right now. You know, Twitch has a specific target audience after all. No one is gonna come for some bootloader programming on a STM32F0 (no vector table offset register after all!) or integration of a secure element from NXP including some crypto basics about ECC because people simply don't care there.

There was a twitch-like platform for live coding once, but obviously it flopped.

[+] StavrosK|5 years ago|reply
I use OBS to stream my maker sessions on https://m.youtube.com/c/StavrosKorokithakis/ and it works great. I really like how I can switch between scenes with hotkeys, and it's really easy to set up scenes to look like whatever you want.

I'd very much recommend it if you want to stream something. I'd also recommend just getting started, I've been wanting to stream for a while but was always embarrassed that it'd look like crap, but better something that looks like crap than nothing.

[+] Sodman|5 years ago|reply
I love live coding streams but I don't understand why you'd stream a video of your keyboard at all times? From the screenshots it doesn't look like you'd be able to pick up on things like hotkeys when watching in real-time, but as mentioned in the article it does open the possibility for somebody to watch replays and figure out your passwords.

Keyboard cameras make sense to me if somebody is streaming eg starcraft where they're hitting 300 APM and it's impressive to watch, but I just don't see the appeal of it for coding.

[+] rubatuga|5 years ago|reply
If you’re looking to bring HDMI content into OBS easily and cheaply, check out my review on the $15 HDMI capture card that recently made the rounds here on Hacker News. Essentially this card has a native resolution of 1280x720, which is a good target if you’re trying to make text legible.

https://www.naut.ca/blog/2020/07/09/cheap-hdmi-capture-card-...

[+] AlchemistCamp|5 years ago|reply
That looks like an Ergodox keyboard! I really want to get one of those...

It's not just that they're great ergonomically (which I truly need), but they're also highly programmable. I can imagine how a large set of macros could improve screencasts quite a bit.

More related to the article, I've used OBS for nearly all of 150+ screencasts and it's been fantastic. I tend to use Streamlabs OBS for Twitch and the fully open source OBS for all my YouTube videos. The plugin ecosystem is great.