Interspace Geometry

About Project:

This project explores the relationship between positive and negative spaces in design. Inspired by Principles of Form and Design by Wucius Wong, it demonstrates how simple variations can create complex visual compositions.

The program generates a dynamic grid where each cell contains two shapes—an outer shape and an inner shape. These forms evolve through smooth transitions, controlled by parameters such as shape size, segment count, base radii, distortion, and rotation offsets. Users can adjust these values in real time using sliders and key presses, affecting the layout, the shapes within each cell, and the overall composition.

The aim is to explore how balancing form and void—through geometry and variation—can produce surprising and engaging visual outcomes.

Share:
X 
Facebook
LinkedIn

User Guide:

Desktop Controls:

• W / S: Rotate the inner shape (up/down)

• A / D: Rotate outer segments (left/right)

• Q / E: Adjust distortion

• Arrow Keys:

  • Up/Down: Increase/Decrease shape size

  • Left/Right: Decrease/Increase outer radius

• U / J: Increase/Decrease inner points

• O / P: Increase/Decrease inner base radius

• 1–9: Change grid size (number of tiles on both axes)

• T: Morph outer shape mode

• I: Morph inner shape mode

• R: Toggle rotation on/off

Adjusting Parameters:

• Total Segments: Number of segments in the outer shape.

• Outer Shape Mode: Choose different outer shape styles.

• Inner Shape Mode: Select inner shape variations.

• Inner Points: Number of points forming the inner shape.

• Shape Size: Overall size of shapes inside each tile.

• Outer Base Radius: Radius of the outer shape’s base circle.

• Inner Base Radius: Radius of the inner shape.

• Distortion: Adds noise for organic, imperfect forms.

• Global Zoom: Scales the entire canvas view.

• Segment Rotation Offset: Rotates outer segments around their center.

• Inner Rotation Offset: Rotates the inner shape.

• Tile Rotation Factor: Adds rotation variation across tiles based on distance from the center.

Play/Pause Controls:

• Play: Click the green “ROTATION: ON” button to animate rotation

• Pause: Click the red “ROTATION: OFF” button to freeze the rotation

This work is licensed under CC BY-NC-SA 4.0