Oscillating Kinetic Typography

🔗 Code Example: Oscillating Kinetic Typography

🔗 Timestamps:

  • 0:10 Using external libraries: opentype.js and g.js

  • 0:50 Step 1: Loading font

  • 3:13 Step 2: Using opentype.js to get path data

  • 4:36 Step 3: Using g.js to resample path

  • 6:06 Step 4: Converting from 1D to 2D array

  • 9:22 Working with array of points

  • 12:24 Creating wavy text

🔗 References:

Previous

Lava Lamp (Metaballs / Marching Squares)

Next

3-Dimensional Kinetic Typography