TRCC: Dynamic Font System

Generative Design / Typeface Design

Processing, P5js

2022

  • Introduction

    As part of my explorations in typography and creative coding, I had the opportunity to reimagine the visual system for TRCC (A creative coding community made by graphic designers). My mission was to challenge the static nature of typography and to investigate the possibilities of creating a more fluid, dynamic, and interactive typographic experience.

    Drawing inspiration from the dynamism of nature and the unique characteristics of the font "PillowLava," I designed an interactive font generation system. The system, characterized by its gravity simulation, invites users to modify the font shape and characteristics, akin to the way a breeze might sway roadside plants.

    This project is of significant interest to the TRCC community, design enthusiasts, and creative coders, as it offers a novel approach to typography and showcases the creative potential at the intersection of design and technology.

    ‍

    ‍

    Coding logic:

    All the letters are connected by 4 loops of joints, they help to maintain the legibility of the typeface but also bring in motion feature.

    *Library used: Fisica / Geomerative

    *Language: Java

Unmapped virtual exhibition website includes two parts, the front part as UI system and the back exhibition spaces. I use API to grab visitor’s data. And using this floating box as the only UI navigation system. No exit bar, no next page button, but let the audience actually “walk” in this space.

The first space discusses how environment and time change our viewing behavior. A sculpture floats on the ocean while the surroundings change based on the viewer's real-time zone. If viewers want to see it at night, they must come to this page at night, in real life.

Second Space is a painting that changes according to the viewer's actions. The more engaged the viewer is (like clicking or rotating the image with a mouse), the more dynamic the painting becomes. This exhibit is designed for the viewer and it reshapes itself when being observed.

Third space is a re-imagination of the transitional artworks in the digital realm. “The Thinker” and “Discobolus” crumble to dust when the viewer is further away and reconstruct when the viewer approaches.

This approach not only breathes life into traditionally static typography but also adds value by fostering user engagement. This organic gravitation system reinforces the potential for design and technology to intersect, creating intuitive, immersive experiences that mimic the captivating complexity of our natural world.

Through this project I hope to bring life to the creative code community and to attract and inspire other artists. :)