Using Marked 2 as a teleprompter

[Tweet]

I’ve been messing around with creating a decent teleprompter for a long time. I’ll probably publish one on the App Store eventually. In the meantime, here’s a trick that I’ve been using to turn Markdown scripts into a very passable teleprompter for screencasting and voice recordings.

This requires Marked 2 and its auto-scrolling feature. All you have to do is add a Custom Style. Grab the CSS and add it to Marked in the Style preferences. Now, just open a Markdown file and choose the Teleprompter style. Type “s” and it will start scrolling. You can adjust the speed with Shift-left/right arrows.

You can run it full screen on a laptop or secondary screen, or have it in a window to the side of your screen while you record. Adjusting the width of the screen below 900px will change the amount of text visible, so you’ll want to play with the speed settings to get the right pace.

If you know a bit of CSS, you can customize it with different font styles, colors, border widths, etc.. If you want to remove the highlight in the middle (I like it, everybody else might not), just remove the block of code between lines 23 and 31:

body:before {
  content: ' ';
  display: block;
  position: fixed;
  left: 0;
  right: 0;
  top: 45%;
  height: 80px;
  background: rgba(219, 212, 105, .25);
}

Here’s a quick video of it in action, just in case you haven’t picked up Marked and can’t try it out yet1

YouTube Video

Now, wait until you see the version I’ve been working on for a separate app using Canvas and CSS3 transitions to create the smoothest scrolling Markdown preview IN THE WORLD. Don’t worry, getting Marked 2 in the App Store is my next priority. Markdown teleprompters will have to wait.

  1. You were waiting for the sale but missed it, huh? Use the coupon LATETOTHEPARTY for 20% off. Good until midnight tomorrow (the 28th).