Chance

Basil.js, processing, P5.js
Fabian Morón Zirfas
The chance that something happens.

In programming, it is also called random, graphics it is a powerful tool to create endless variations of the same motiv.

Boxen

processing, repeat, chance, Law of Similarity
Fabian Morón Zirfas

Generate a box with something on its corners.

Small Multiples

processing, repeat, chance, Law of Connected Elements, Law of Similarity
Fabian Morón Zirfas

Generate multiple elements based on the same rules.

Basil.js Logo

processing, Basil.js, repeat, chance, Law of Closure
ffd8

Okay. I know totaly wired to have the Basil.js logo made in Processing. The right tool for the right job. Processing handles the creation of animations way better then Basil.js does

Splatter

P5.js, repeat, chance
Fabian Morón Zirfas

Creates circles within a range of the canvas.

Groups

processing, grid, Law of Similarity, repeat, chance
Fabian Morón Zirfas

The law of similarity on action. Elements that are similar in size or shape are seen as a group. Uses nested loops

Hidden Room

P5.js, Law of Multistable Perception, Law of Space, repeat, form, chance

Square with diagonal lines that interact with each other in one point.

Random Circles

processing, chance, repeat
Fabian Morón Zirfas

Generate random circles with one simple loop. Break at the width of the canvas.

Noise

processing, chance, repeat, noise
Fabian Morón Zirfas

Noise. Way more natural then random.

Noise Line

P5.js, chance, repeat, noise
Fabian Morón Zirfas

Generate a line from the middle of one side of the convas to another. Similar to the sketch Noise.

Praegnanz by Varying Edges

P5.js, chance, proximity, Law of Prägnanz

This creates random Prägnanzen between ellipses by varying the strength of their edges.

Similarity by Hue and Size

P5.js, chance, similarity, Law of Similarity

This creates random similarities between ellipses by varying their size and color.

Popup Circles

P5.js, chance, repeat, Law of Similarity

Random crackling circles with similar color ranges.

Random Circles

P5.js, chance, repeat, Law of Similarity
Fabian Morón Zirfas

Generate random circles with one simple loop. Break at the width of the canvas.

Proximity through distance

P5.js, chance, proximity, Law of Proximity

This creates random proximities between ellipses.

John Venn's Randomness

P5.js, chance, repeat, Law of Similarity, Law of Connected Elements, grid
Fabian Morón Zirfas

This sketch shows the visual representation of randomness by John Venn

dots

P5.js, chance, Law of Direction of Reading

Follow the dots!

Colorful circles

P5.js, chance, repeat

Creation of differently sized and colored circles that shrink with each loop

mice-nip

P5.js, chance, Law of Simplicity

Someone bite the square.

Noise vs Random

P5.js, chance, repeat
Fabian Morón Zirfas

Shows the difference between noise and random values.

Planets

P5.js, chance

Drawing a circle.

Chance Line

P5.js, chance, repeat

Casualty lines creating the effect of an infinite tunnel.

Distance

Basil.js, chance, repeat, Law of Proximity, Law of Connected Elements
Fabian Morón Zirfas

Calculate the distance between two points and draw a line if they are in reach. Also an example for the "Law of Proximity"

Connect

Basil.js, chance, repeat, Law of Proximity, Law of Connected Elements
Fabian Morón Zirfas

Calculate the distance between two points and draw a line if they are in reach. Similar to the sketch Distance. Also an example for the "Law of Proximity"

WaveformCut

P5.js, color, chance, interact, Law of Closure

Mouse higlights individual parts of elements created by gaussian noise

Dripping Wall

P5.js, chance

I imitate Pollock.

Stripes

Basil.js, color, RGB, repeat, chance
Fabian Morón Zirfas

Using Color in InDesign

Connected Nodes

processing, color, ui, interact, library, motion, chance, class, repeat, Law of Connected Elements
Fabian Morón Zirfas

Connect nodes by distance. A rather complex sketch that makes use of several techniques. Similar to Connect and Distance

Circular Scanner

processing, motion, chance, class, repeat, Law of Common Fate
Fabian Morón Zirfas

Visualizes the "Law of Common Fate". Elements with the same directional motion and/or same speed are seen as a group.

Common Fate

processing, motion, chance, class, repeat, Law of Common Fate
Fabian Morón Zirfas

Visualizes the "Law of Common Fate". Elements with the same directional motion and/or same speed are seen as a group.

Cloth

P5.js, motion, chance

Particles move in the motion of cloth in a wind breeze

conObjects

P5.js, motion, chance, interact, Law of Connected Elements, Law of Common Fate

Connected balls attracted by the mouse and a kind of gravity

Motion Dots

P5.js, chance, repeat, motion

Balls that change color and size fill the entire area of the frame.

Spiro Text

extendscript, typography, spiro-text, repeat, unicode, chance
Fabian Morón Zirfas

This example adds text to a path in InDesign. It takes random characters from an array of unicode signs and adds them to the path.

Baseline Shift

Basil.js, typography, chance
Fabian Morón Zirfas

Shifting the baseline of each character

Topolade

processing, 2D, form, Law of Similarity, repeat, chance, Law of Prägnanz, Law of Proximity

Topolade is a sketch created by Jonas Köpfer in the seminar Eingabe/Ausgabe.

Mesh3D

processing, 3d, form, repeat, chance, library

Creates a mesh and displaces its verticies in 3D space

Simple Paint

processing, interact, chance
Fabian Morón Zirfas

A even simpler paint program then paint.

Is Inside?

P5.js, repeat, interact, mouse, key, color, chance
Fabian Morón Zirfas

Check whether the mouse is inside of an element. If so, change the color.