ShadowAshArt

learner ~ visual aesthetics ~ generative art

[Sabo Sugi / Mondragon Framer Template @sabosugi]

Endless Shallows

Demo and Source Code:
https://t.co/Eu1lVLC3rA

#threejs #webgl #shader #sea #water

[Sabo Sugi / Mondragon Framer Template @sabosugi]

Data Stream Wall

Demo and Source Code:
https://t.co/9MZNi4ZBNC

#threejs #webgl #data #stream

[Sabo Sugi / Mondragon Framer Template @sabosugi]

Abstract Plankton

Demo and Source Code:
https://t.co/dBawVXNRjz

#threejs #webl #glsl #abstract

[ShadowAshArt @ShadowAshArt]

Lovely work

[Water flowing | anbello.eth | anbello.tez @Waterflowing0]

gm · I am thinking to release on foundation

[ShadowAshArt @ShadowAshArt]

snowflake

[ShadowAshArt @ShadowAshArt]

let countSlider, complexitySlider, hueSlider, speedSlider, canvasWSlider;
let bgToggle, recordBtn;
let recorder, chunks = [];

function setup() {
let canvas = createCanvas(800, 800, P2D);
https://t.co/KxlXHPjCeh('artCanvas');
colorMode(HSB, 360, 100, 100, 1);
angleMode(DEGREES);

// UI Control Panel
let controls = createDiv().position(10, 10).style('background', 'rgba(0,0,0,0.85)').style('padding', '15px').style('border-radius', '12px').style('color', 'white').style('font-family', 'sans-serif').style('width', '240px').style('z-index', '100');

createP('🌌 Full Canvas IFS').parent(controls).style('font-weight', 'bold').style('margin-bottom', '10px').style('border-bottom', '1px solid #444');

// Background Toggle
createP('Theme').parent(controls).style('margin', '0');
bgToggle = createSelect().parent(controls).style('width', '100%');
bgToggle.option('Deep Black (Glow)');
bgToggle.option('Clean White (Ink)');
bgToggle.selected('Deep Black (Glow)');

createP('Art Zoom / Scale').parent(controls).style('margin', '10px 0 0 0');
countSlider = createSlider(50, 200, 120, 1).parent(controls).style('width', '100%');

createP('Particle Density').parent(controls).style('margin', '10px 0 0 0');
complexitySlider = createSlider(1000, 15000, 8000, 500).parent(controls).style('width', '100%');

createP('Electric Hue').parent(controls).style('margin', '10px 0 0 0');
hueSlider = createSlider(0, 360, 240).parent(controls).style('width', '100%');

createP('⚡ Speed').parent(controls).style('margin', '10px 0 0 0');
speedSlider = createSlider(0, 5, 1, 0.1).parent(controls).style('width', '100%');

recordBtn = createButton('🔴 Record 20s Reel').parent(controls).style('margin-top', '20px').style('width', '100%').style('background', '#ff4444').style('color', 'white').style('border', 'none').style('padding', '10px').style('cursor', 'pointer');
recordBtn.mousePressed(startRecording);
}

function draw() {
let isWhite = bgToggle.value() === 'Clean White (Ink)';
background(isWhite ? 255 : 0);

let baseHue = hueSlider.value();
let points = complexitySlider.value();
let zoom = countSlider.value();
let speed = speedSlider.value();

// Magical Glow setup
if (!isWhite) {
blendMode(ADD); // Glow effect for black background
} else {
blendMode(BLEND); // Solid ink effect for white background
}

// Center and Scale the art to cover the canvas
translate(width / 2, height - 50);

let x = 0, y = 0;
noStroke();

for (let i = 0; i < points; i++) {
let r = random(100);
let nx, ny;

// The "Magical" IFS Probability Matrix (Expanded Barnsley)
if (r < 85) {
nx = 0.85 * x + 0.04 * y;
ny = -0.04 * x + 0.85 * y + 1.6;
} else if (r < 92) {
nx = 0.2 * x - 0.26 * y;
ny = 0.23 * x + 0.22 * y + 1.6;
} else if (r < 99) {
nx = -0.15 * x + 0.28 * y;
ny = 0.26 * x + 0.24 * y + 0.44;
} else {
nx = 0;
ny = 0.16 * y;
}
x = nx; y = ny;

// Apply "Particles to the sides" via reflection symmetry
let sideMult = (i % 2 === 0) ? 1 : -1;

// Calculate magical shimmer
let shimmer = sin(frameCount * speed * 5 + i * 0.01);
let h = (baseHue + shimmer * 20) % 360;

// Color logic for White vs Black background
if (isWhite) {
fill(h, 90, 40, 0.6); // Darker, ink-like particles
} else {
fill(h, 80, 100, 0.5 + shimmer * 0.3); // Bright, glowing particles
}

// Draw particle
ellipse(x * sideMult * zoom, -y * zoom, 2, 2);
}

blendMode(BLEND); // Reset for UI
}

function startRecording() {
const stream = document.querySelector('#artCanvas').captureStream(30);
recorder = new MediaRecorder(stream, { mimeType: 'video/webm' });
recorder.ondataavailable = e => chunks.push(https://t.co/OOSrITIeo7);
recorder.onstop = () => {
let blob = new Blob(chunks, { type: 'video/webm' });
let a = document.createElement('a');
a.href = URL.createObjectURL(blob);
https://t.co/BXNZViBTaU = 'magical_ifs_reel.webm';
https://t.co/bdRXlcu8jJ();
chunks = [];
recordBtn.html('🔴 Record 20s Reel');
};
recorder.start();
recordBtn.html('🎥 RECORDING...');
setTimeout(() => recorder.stop(), 20000);
}

[ShadowAshArt @ShadowAshArt]

I just applied to be the Professional AI Bully for @MemvidAI.

AI forgetting context drives me insane — but after trying Memvid, I finally saw what AI memory should feel like.

Let's see if they pick me 👀

[ShadowAshArt @ShadowAshArt]

electrified #threejs

[ShadowAshArt @ShadowAshArt]

#threejs 3d

[ShadowAshArt @ShadowAshArt]

particle storm

[ShadowAshArt @ShadowAshArt]

@polycap278 @unclejoe_Crypto Fb pls

[ShadowAshArt @ShadowAshArt]

@GoddessMEsystem @Shahed6001 Fb pls

[ShadowAshArt @ShadowAshArt]

@Shahed6001 Hello

[ShadowAshArt @ShadowAshArt]

@Babylove954092 @impeculiar1b Fb pls

[ShadowAshArt @ShadowAshArt]

21

[ShadowAshArt @ShadowAshArt]

20

[ShadowAshArt @ShadowAshArt]

19