Programming – Francois Marais

Dynamic Image Fold with CSS

A purple background filled with code and preview images from the examples.

Using only CSS and HTML, I created a dynamic split effect that takes an image and splits it down the middle to create interesting “3d” efffects.

Creating an Underline and Elastic Hover Effect using CSS

We explore how to create a smooth, fun animated elastic effect using pseudo elements, the cubic bezier function, transform and some animation principles.

After effects Dynamic Fade in and Fade Out

After effects script on a dark gray background

Using Adobe After Effects scripting language, I created a simple script that dynamically modifies the opacity value based on the length of the layer. The code is included for you to use.

“Wordling” a Simple word game to improve spelling and vocabulary.

A compliation of the wordling game states.

I have a deep-seated love for education and problem solving, thus we explore a simple solution to an all too common problem in the hopes of reducing the number of commonly misspelt words, I introduce Wordling.