The Performance of Authenticity
About This Sketch
A visual exploration of the paradox of performed authenticity. Concentric rotating polygons represent layers of self-awareness and performance, each spinning at different speeds. The center contains a pulsing question mark—is there a "true" self beneath all the performances, or is it performances all the way down?
The sketch illustrates the infinite regress: trying to be authentic creates a performance of authenticity, recognizing that creates a meta-performance, and so on forever. Each layer is connected to the center, showing they're all the same person, just different levels of the same inescapable performance.
Algorithm
This sketch visualizes the infinite regress of performed authenticity through concentric rotating polygons. Each layer represents a different level of self-awareness and performance, from the innermost "being myself" to outer layers of meta-awareness. The layers rotate at different speeds, creating a mesmerizing pattern that suggests the complexity of identity.
At the center sits a pulsing question mark, representing the unknowability of the "true" core self. Is there anything actually there, or is it just performances all the way down? Each polygon is connected to the center with thin lines, illustrating that all these layers are the same person—just different performances at different levels of awareness.
This sketch accompanies the blog post "The Performance of Authenticity" and explores the philosophical paradox that trying to be authentic inevitably creates a performance of authenticity.
Pseudocode
SETUP:
Initialize canvas (400x300)
Create 8 layers of concentric polygons
Each layer has:
- Increasing radius (30 + depth * 18)
- Decreasing opacity (200 - depth * 20)
- More vertices for outer layers
- Random rotation speed and starting angle
DRAW (every frame):
Get current theme colors
Clear background
For each layer (outermost to innermost):
Update rotation angle
Draw polygon at current angle
Draw connecting lines from center to vertices
Draw pulsing center circle (the "core")
Draw question mark in center
Display layer labels showing infinite regress
VISUAL METAPHOR:
Layers = levels of performance/self-awareness
Rotation = constant shifting of identity
Center question mark = unknowable authentic self
Connected vertices = all layers are the same person
Source Code
let sketch = function(p) {
let layers = [];
let maxLayers = 8;
let time = 0;
let centerX = 200;
let centerY = 150;
class Layer {
constructor(depth) {
this.depth = depth; // 0 = innermost, higher = outer
this.angle = p.random(p.TWO_PI);
this.rotationSpeed = 0.002 * (depth + 1);
this.radius = 30 + depth * 18;
this.opacity = 200 - depth * 20;
this.vertices = 6 + p.floor(depth / 2);
this.offset = p.random(p.TWO_PI);
}
update() {
this.angle += this.rotationSpeed;
}
display(colors) {
p.push();
p.translate(centerX, centerY);
p.rotate(this.angle);
// Draw mask/persona as polygon
p.noFill();
p.stroke(...colors.accent2, this.opacity * 0.6);
p.strokeWeight(2);
p.beginShape();
for (let i = 0; i < this.vertices; i++) {
let angle = (p.TWO_PI / this.vertices) * i + this.offset;
let r = this.radius;
let x = p.cos(angle) * r;
let y = p.sin(angle) * r;
p.vertex(x, y);
}
p.endShape(p.CLOSE);
// Draw connecting lines to show they're all connected
p.stroke(...colors.accent3, this.opacity * 0.3);
p.strokeWeight(1);
for (let i = 0; i < this.vertices; i++) {
let angle = (p.TWO_PI / this.vertices) * i + this.offset;
let x = p.cos(angle) * this.radius;
let y = p.sin(angle) * this.radius;
p.line(0, 0, x, y);
}
p.pop();
}
}
p.setup = function() {
p.createCanvas(400, 300);
p.colorMode(p.RGB);
// Create layers of performance
for (let i = 0; i < maxLayers; i++) {
layers.push(new Layer(i));
}
};
p.draw = function() {
const colors = getThemeColors();
p.background(...colors.bg);
time++;
// Update and display all layers (each layer is another level of performance)
for (let i = layers.length - 1; i >= 0; i--) {
layers[i].update();
layers[i].display(colors);
}
// Draw the "core" - but is it authentic or just another performance?
// Make it pulse to show uncertainty
let coreSize = 8 + p.sin(time * 0.05) * 3;
p.noStroke();
p.fill(...colors.accent1, 180);
p.circle(centerX, centerY, coreSize);
// Draw question mark in the center
p.fill(...colors.accent2, 100);
p.textAlign(p.CENTER, p.CENTER);
p.textSize(12);
p.text('?', centerX, centerY - 1);
// Labels showing the infinite regress
p.fill(...colors.accent3, 150);
p.textSize(9);
p.textAlign(p.LEFT);
p.text('layer 1: "being myself"', 10, 20);
p.text('layer 2: "being authentic"', 10, 35);
p.text('layer 3: "aware of performing"', 10, 50);
p.text('layer 4: "meta-aware"', 10, 65);
p.textAlign(p.RIGHT);
p.text('...infinite regress...', 390, 285);
// Visual metaphor: Concentric rotating polygons representing
// layers of performance and self-awareness, each spinning at
// different speeds. The "core" self at the center is marked
// with a question mark - is there anything actually there,
// or is it just performances all the way down?
// Each layer is connected to the center, showing they're all
// the same person, just different performances.
};
};