Video: Din-Din with Augy

September 03, 2023

Starting to learn how to do video editing, and to help focus the learning I needed to create some kind of project. I decided that Augy, a betta fish, would be my star, because of his star quality and he’s right here.

Keeping this post mostly simple and just going through the big steps from beginning to end. This was all recorded with an older digital camcorder, about 7-10 years old, so not the highest quality.

A the start the animated logo was created in Illustrator, then brought into Premiere where I’ve added a moving bubble to it. I copied and moved it on the timeline to get 3 bubbles.

The title screen, in After Effects, I added the text to look like it was being written in by hand, instructions below. For this when revealing text I tried to keep it so it would look like normal handwriting.

The text in the rest of the movie is just a fade-in and fade-out. I tried to read it slowly so people would have hopefully more than enough time to read the words without pausing.

The music is from Google’s YouTube music library, I picked one I thought would kind of fit the video.

Reveal handwriting instructions:

Mac instructions; for Windows (Command = Control; Option (Opt)= Alt)

Reveal handwritten text/font in After Effects

Create new file in After Effects (AE)

Click text tool, draw box on screen.

Type in text

Format text as needed (font, size, location, etc.) have this as you need it to look for final.

Command + Opt + HOME (this will have your center point align in center, if needed)

Make sure text layer is selected.

Click pen tool.

Draw over the text, in the order you want it to show, think how you would write it by hand.

            Try to stay in the center of the stroke as much as possible. For the dots I had to it a small line for it to pick up.

Command click off text to start a new area (like each stroke of the pen)

In Effects Presets > Generate > Stroke (drag onto text layer)

Click on All Masks

In Style select ‘Reveal Original Image’

Brush Size make this just a bit wider than the text (if you make too big or off you could reveal parts that haven’t been drawn yet.

Brush hardness if you want to soften or make it the edges harder. Soft will get you a fuzzy edge to your lines like a marker or felt tip pen.

In Text layer:

Click the drop down > Effects > Stroke > End.

Click Stopwatch; then move it to the location you want it to fully show (move this later if it’s too slow or fast in drawing)

Move play head to the beginning or hit Home then change to 0%

Highlight both points and right click > keyframe Assistant > Easy Ease

If you find other characters are getting drawn before they should go back to the pen drawing and move the points as needed.

Related Articles

Recreate hand drawn font instructions

Recreate hand drawn font instructions

Sometimes there's the need for a client to create a font based on some poster, document where the words were hand drawn and they would like to use again for a retro look. These are mostly working notes the top will have the high-level steps then below will have how I...

read more
My Town Commercial – Video Practice

My Town Commercial – Video Practice

Test file to practice in Photoshop and most After Effects; to bring motion to a photo. The aspect ratio is different than a normal video; changing it to the proper aspect ratio would have cut off some items at the bottom that I wanted to...

read more
Save Illustrator for SVG to use in HTML page

Save Illustrator for SVG to use in HTML page

When working with the AWS contact form, I had created a graphic in Illustrator. You can see the post here. With this test form I wanted to have everything in one HTML file this way it’s just one file to upload and update when needed without making sure the other files...

read more

Pin It on Pinterest

Share This