All posts in Graphics Algorithms

Waterlogue

HeroIpadBestOf2014

Waterlogue is a photo app inspired by Moleskine watercolor journals, urban sketching, artist’s journals and en plain air painting.

The technology developed for Waterlogue transforms your photos into spontaneous, unique, and brilliant watercolor sketches that look like real paintings.

Waterlogue distills your environment down to its essence—just the way an artist would—and turns even an on-the-fly snapshot into something luminous and sublime.

Continue Reading →

Sun Shader

This is an experiment using SpriteKit; it is a single OpenGL shader running on one sprite.

This is not intended to be a realistic sun (with magnetic field lines, etc.) but rather, a sun with expressive flames or filaments. There are a large number of parameters that affect all sorts of elements, such as filament size, chaos amount, etc. Video captured from iPod touch 5G.

Plants by Tinybop

Forest in Summer (credit: Plants press kit by Tinybop)

Forest in Summer (credit: Plants press kit by Tinybop)

At Tinybop, I helped code Plants, an interactive kid’s app that explores the diversity of life in a collection of ever-changing biomes.
Continue Reading →

Clouds, Animated

This is an animated version of a Processing 1.0 sketch I made a few years ago: tinrocket.com/clouds/

The simple shapes of the clouds are inspired by early 20th century pen & ink illustrations of puffy cumulus clouds. The animation is a byproduct of how the clouds are created.

Percolator

Treble—introduced in version 2.0; Hero shot

Percolator combines unique visual effects processing with a beautiful, retro, coffee-themed user interface (UI) and refined user experience (UX) design. The mosaic technology used in Percolator is based on a proprietary circle packing algorithm.

Continue Reading →

Noise Reduction & Simplification

I developed a two-pass noise reduction and shape simplification algorithm for my forthcoming iOS app.

Real-time Comic Book Rendering

I developed a sophisticated comics video filter that runs on the iPhone in real-time. To give the app a test run, I shot some footage at lunch one day and edited it in iMovie on an iPhone. The Magical Apple-esque Music is courtesy of iMovie. This work is currently ongoing.

Patent Pending

Sketch: Multi-Column Layout Algorithm

This iPad app is the proof-of-concept for an algorithm I designed to present large numbers of items in a compact layout. The concept uses a variable, multi-column format to give readers a feeling of variety on long pages.

The layout code was designed to find an optimal article layout—defined generally as the column configuration that contains the least dead space—using multiple column formats. In this test app, dead space is marked with diagonal lines; in a final app, the article heights would adjust to fill the column.

Continue Reading →

Experimental iOS App: Pixel Art Meets Global Illumination Rendering

This experimental iOS Graphics app is ½ old-school 2D pixel editor and ½ 3D global illumination renderer. I developed a ray casting algorithm that uses low- resolution depth and color maps to produce a high resolution rendering with subtle lighting and shading.

From left to right: depth map (user created), color map (user created), depth + color (used for final render), global illumination rendering.

Continue Reading →

Timeline Layout Algorithm

"Flowing" timeline of the decade's events.

I decided to algorithmically lay out the elements in the AP interactive, 2000-2009: Decade in Review, because of the large amount of content—over 400 events—and very limited amount of time I had to complete the layout.

Continue Reading →

Winter Olympic Medals

For the AP, I developed this section of a historical overview of the medals won at Winter Olympic Games. The chart components are placed dynamically after the data loads.

A force-directed graph was used to avoid overlapping boxes. Instead of a bounding circle around each node in the graph, I used a bounding box and computed overlap distance between pairs of boxes when relaxing the layout. This yielded a much more efficient “packing” of the items.

Continue Reading →

Painty

Painty's node-based workflow.

Painty’s node-based workflow.

Paint·y:

  1. Of, coated with, or soiled with paint: a painty finish; painty overalls.
  2. Having a crudely or clumsily painted surface: The stage set consisted chiefly of painty scenery.

I am developing experimental, stroke-based rendering software—affectionately known as Painty. The software takes a photo, 3D rendering, or some other image as input, perceptually deconstructs it, then rebuilds a new image as a sequence of brush strokes.

Continue Reading →

Herman Miller Materials Selector Algorithm

Working with Michael McGinn Design Office (MMDO), I developed a layout algorithm for Herman Miller that organizes swatch search results by color clustering. The relative position of the swatches is maintained, regardless of the density of the results.

Continue Reading →

Sketch: Artery Graphs

Map 2

These images are early tests for an algorithm that graph flow and movement across geography. It was prompted by a story the AP was writing on the displacement of Iraqis during the Iraq war. The technique is an algorithmic variation on flowlines.

Continue Reading →

Clouds

I revisited a project written in 2001 and completely rewrote it using Processing.

Continue Reading →

Sun

Inspired by illustrated children’s science books from the 1950s and Bruno Munari’s Drawing the Sun. Written in Processing.

Continue Reading →