Shader-based text animations

With shaders, it is possible to create interesting text animations.

The code

The following code lets you create a dancing script by using a vertex shader to move the y coordinate up and down over time, and use a fragment shader to create colorization effects:

import BlackAndWhiteThemes

theme "WhiteOnBlack"
base_slide "Dancing script",

    contents 0,
        // Create a shader transforming a sphere
        shader_program
            vertex_shader <>
            fragment_shader <>
        shader_set time := page_time mod 60


        text_box 0, 0, 0.6*slide_width, slide_height,
            align 0.5
            vertical_align 0.5
            color "#F4B63C"
            font "Tangerine", 120, bold
            shader_set parms := 0.8, 0.03
            paragraph "Fun text effects, 50 lines of code"
            color "white"
            font "Arial", 60
            shader_set parms := 0.3, 0.01
            paragraph "Animate text easily with Tao3D!!!"

            color "lightblue"
            font "Courier", 20
            align 1.0
            shader_set parms := 0.2, 0.7
            paragraph "http://bit.ly/1HWCGvd"

Going further

This technique is extremely powerful. By adjusting the shader, you can easily get effects such as fuzzy text, text with punched holes inside, flaming text, glowing text, and so on.

Christophe de Dinechin

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s