2015-12-25

E-Paper for Screencasting ... Sort Of

Real e-paper ;)
There are sooo beautiful things to be found in this dark, filthy, intelligence-ridden Internet, such as real paper textures at Lost&Taken. One out of the bazillions of uses for paper textures is in my screencast projects. So real paper goes «e-paper», at least sort of.



Time and again when I'm creating screencasts about certain technology topics, I need to show what the current (stale?) state of affairs is before I move into the greener pastures of upgraded technology. What better is there to throw in a visual cue? Such as paper textures of real aged and worn paper?

Worn Technology Wants Worn Paper Textures


Fortunately, Lost&Taken is a great source of textures «made freely available for use in both personal and commercial projects including web templates, designs, and other materials intended for distribution. Attribution is appreciated, but not required.»

A big «thank you!» to Caleb Kimbrough from my side. The attribution I also naturally add to all my projects where I'm using Caleb's fine textures.

For instance, take this beauty below: it fits well in whenever I need to visually hint at that a particular current technology is now slightly ... well, worn. There you have it.

Slightly worn paper for slightly worn technology.

Another use is to electronically tear off part of the paper texture (using The Gimp). This works great for the old-versus-new illustrations. For instance, the texture below shows only the left-side scrap of parchment. On the left I show how things are, while to the right I illustrate how things will be.

Torn paper for old-versus-new illustrations.

The checkerboard above is for illustration only and indicates where the texture will be «transparent». However, technically I'm using white instead of transparency as I will later in post multiply this texture with the screencast clips. Under the multiply operation, white becomes transparency, whereas transparency (alpha channel) information gets completely ignored. At least MLT (and thus Kdenlive) behaves such.

Textures in Post Production


Because I gain more freedom this way, I regularly add paper textures only in post production. As my source video footage is whiteboard-ish I do all my illustrations against a white background with a unobtrusive lightly checked pattern. In turn, I can simply blend in post my own illustrations with the worn paper: a simple multiply composition gets this job done («multiply transition» in Kdenlive).

Compositing e-paper in post.

In my example timeline screenshot above, the individual screencasting video clips are placed along the «Screencast 1» track. On top of it you'll see the «Paper» track: it contains the worn paper texture. This texture clip is a simple image clip in the desired final frame dimensions of 1920×1080 pixels (and thus 16:9 format). The paper texture clip has a multiply transition on it that multiplies it with the track immediately below.

In post, I also like to add other visual stuff such as titles and footers. In the example above, such stuff goes to the «Title Overlays« track. Please note that title and footer overlays must not be composited with the «Paper» track, but instead with the «Screencast 1» track. Otherwise, you'll get undesired results. In this particular example this would result in the white text in the footer taking on the paper texture and also the screencast texture. Not exactly what we wanted here.

The final and correct outcome looks like this below. Maybe I should also add in a coffee spill...? Just kidding.

Slightly worn technology...?


PS: the moose is the from the public domain archives of Pearson Scott Foresman, courtesy of Wikimedia Commons. The subtitles are not, I repeat: not, from The Search for the Holy Grail. In particular, no dentists were involved. Aside, the elk is a pun that I can't explain (yet). And yes, elks are not mooses, please cut me some slack.