An interactive website for encoding text in typographic flowers.
Final project for Interactive Design and the Internet: Software for People with Will Denton.
Interactive Website
Garden of Words is an interactive, collaborative website that converts users’ words into typographic flowers. A p5.js script renders words to form legible, flower-like shapes with a stem and a bud.
Depending on the length of the user’s input, the flower bud’s shape adjusts for legibility.
Inputs longer than 30 characters form a five-petaled flower
“This is a very long sentence that will become a flower with five distinct petals”Inputs between 10 and 30 characters form a circular bud
“This is a moderate sentence”
Inputs shorter than 10 characters form a vertical stalk
“Short!”
Demo: Submitting a long sentence
“When I type a message into this field, that message turns into its own unique typographic flower!”
Demo: Submitting a short sentence
“Tiny!”
Users can choose whether to generate a bouquet, where flowers all originate from the same point, or a garden, where flowers grow from random points throughout the viewport.
Demo: Selecting “Bouquet” grows your flowers from a single point
Demo: Selecting “Garden” grows your flowers throughout the canvas
If dissatisfied or feeling experimental, users can regenerate the bouquet for another random array, or reset the canvas entirely.
Demo: Selecting “Regenerate” gives you another random arrangement
Demo: Selecting “Reset” blows your flowers away like a dandelion
Users can alter the background color and flower color, and then export their typographic botanical for personal use.
Poster for Yale’s Visiting Artist Lecture Series with Loose Joints Publishers
Made using Garden of Words
Poster for Yale’s Visiting Artist Lecture Series with David Campany Made using Garden of Words
Poster for Yale’s Visiting Artist Lecture Series with Katherine Bradford Made using Garden of Words
Sample Garden featuring quotes from The Catcher in the Rye
This project was inspired by my previous calligraphic work, to which I owe much of my interest in graphic design. While learning calligraphy, I learned to make calligrams, or works where words come together to form shapes and images.