GERLAGER

Don’t be scared, it’s only a glowing hot dog. Wait! It’s actually an E Coli bacteria without it’s final texturing!

Unhappy Hipsters
Clients From Hell

Smashing Magazine
Abduzeedo

FFFFound
Dropular
But Does it Float

Grain Edit
Beast Pieces
Lovely Package

Motionographer
idents.tv
Art of the Title

the FWA
Minimal Sites
Web Creme

Core 77

If you haven’t heard of Typekit it’s definitely worth taking a moment and poking around the website. In a nutshell, they want to expand the capabilities of web typography by increasing the number of fonts web designers can choose from. I’m pretty sure they do this with the @font-face, a bit of javascript and a subscription. Either way it has some pretty awesome capabilities.

The awesome thing about Typekit and @font-face is that they work in Safari; the shitting thing about Typekit and @font-face is that they don’t work anywhere else (at least not IE, FF, Chrome or Opera).

edit: @font-face will work in IE, FF, Chome & Opera, but additional font file types are needed and it must be in a version running CSS3. OTF & TTF work in Safari, but EOT is needed for IE, and SVG is needed for Opera.

Here’s an additional resource on the subject: Mozilla Hacks @font-face

I decided to make a little web utility so that I could more easily preview the Typekit fonts without logging in and using their previewer. Since I currently have a free membership with Typekit I’m only able to use two of their fonts at a time, so I decided to add a few free typefaces that I found. If I do end up getting a membership I think it will come in handy.

Font Previewing

The goal of this series of tests was to setup and connect multiple motion tracking points and fill the resulting triangular “cells” with different video. After Effects doesn’t allow point manipulation of objects/masks, so I had to figure out a way to create the triangles that the connected tracking points formed using the motion tracking data.

To do this, I worked with each triangle individually. I created three solids (black rectangles) and set their position and rotations to match the position and slope of three lines of the triangles. I lowered the opacity of the rectangles and assigned the multiply blending mode. Using the Alpha Levels Effect I was able to make the overlapping area pure black and everything else pure white. The resulting comps worked as my track mattes for the second video.

Here are a few of the steps I went through: