Writing | George Francis

May 13, 2022

Balanced Color Palettes — Generative Snacks!

A small but powerful technique perfect for crafting balanced color palettes in generative pieces.
- Generative
- Design
- Tutorial
- JavaScript
April 15, 2022

A viewBox Implementation For Paint API Worklets

Simplify the development of CSS Paint API worklets with an SVG style viewBox definition!
March 15, 2022

Texture — Generative Snacks!

Bring your generative work to life with three simple textures inspired by the natural world.
- Generative
- Design
- Tutorial
- JavaScript
January 6, 2022

Color Modulation — Generative Snacks!

Introduce a touch of beautiful, organic color variance to your generative compositions with just a few lines of code.
- Generative
- Design
- Tutorial
- JavaScript
September 1, 2021

Crafting Organic Patterns With Voronoi Tessellations

Learn to create beautiful, versatile, and organic generative patterns inspired by the natural world.
- Tutorial
- Design
- Generative
- JavaScript
June 23, 2021

Building Generative Grid Layouts With Quadtrees

Learn to create harmonious generative grids based on random numbers, source images, user input, and more!
- Tutorial
- Design
- Generative
- JavaScript
May 24, 2021

Create a Liquid Hover Effect with GSAP & SVG

Add a vector-based, fluid hover effect to any simple SVG path. Perfect for buttons, image masks, wobbly jelly characters, etc...
- Tutorial
- Animation
- SVG
- JavaScript
March 11, 2021

A Generative SVG Starter Kit

A wonderful collection of libraries, utility functions, and techniques. Everything you need to create your own generative SVG art/design!
February 25, 2021

A Beginner’s Guide to Applying Color in UI Design

Your virtual guide up the mountain of color. By the time we reach the top, you will have all the skills you need to create beautiful interfaces.
- Tutorial
- CSS
- Design
- Beginners
February 8, 2021

Create a Generative Landing Page & WebGL Powered Background

Pick up some handy generative design tips by building a super clean generative landing page and Dribbble friendly background animation.
January 25, 2021

Create Your Own Generative SVG Social Images

Stand out in the social media crowd by learning to make your own generative social sharing images.
January 15, 2021

Build a Smooth, Animated Blob Using SVG + JavaScript

Learn verstaile generative animation techniques whilst building the smoothest, blobbiest blob you could possibly imagine.
- Tutorial
- SVG
- Animation
- JavaScript
January 11, 2021

Generative SVG Blob Characters!

Completely new to generative art? This one's for you! Learn the basics by creating some super cute, googley eyed SVG characters.
- Tutorial
- Generative
- SVG
- Beginners