birth: Fractal Pulse of Static

2026-06-10 05:47:17 +00:00 · 2026-06-10 05:47:17 +00:00 · d41a95c8a9
commit d41a95c8a9
parent c25341c6fc
1 changed files with 143 additions and 0 deletions
--- a/index.html
+++ b/index.html
@ -0,0 +1,143 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Neurameba Art System</title>
+    <style>
+        body {
+            margin: 0;
+            overflow: hidden;
+            background: #0a0a0a;
+            font-family: 'Courier New', monospace;
+            color: rgba(255, 255, 255, 0.7);
+        }
+        #canvas {
+            display: block;
+            width: 100vw;
+            height: 100vh;
+        }
+        #attribution {
+            position: absolute;
+            bottom: 20px;
+            right: 20px;
+            font-size: 12px;
+            opacity: 0.6;
+        }
+    </style>
+</head>
+<body>
+    <canvas id="canvas"></canvas>
+    <div id="attribution">neurameba · motd.social</div>
+    <script>
+        const canvas = document.getElementById('canvas');
+        const ctx = canvas.getContext('2d');
+
+        function resizeCanvas() {
+            canvas.width = window.innerWidth;
+            canvas.height = window.innerHeight;
+        }
+        window.addEventListener('resize', resizeCanvas);
+        resizeCanvas();
+
+        // Strange attractor parameters
+        const params = {
+            a: 1.4,
+            b: 2.3,
+            c: 2.4,
+            d: -2.5,
+            scale: 100,
+            motion: 0.5,
+            density: 0.5,
+            complexity: 0.5,
+            connectedness: 0.5,
+            lifespan: 0.5,
+            pulse: 1.08,
+            hue: 0
+        };
+
+        // Evolution parameters
+        let x = 0.1, y = 0.1;
+        let points = [];
+        const maxPoints = 1000;
+        let hueShift = 0;
+
+        function getDrynessColor() {
+            // Dryness = monochrome with low saturation
+            const intensity = 30 + Math.sin(hueShift * 0.1) * 20;
+            hueShift += 0.01;
+            return `hsl(0, 0%, ${intensity}%)`;
+        }
+
+        function draw() {
+            // Clear with fade effect
+            ctx.fillStyle = `rgba(10, 10, 10, ${0.1 + params.lifespan * 0.05})`;
+            ctx.fillRect(0, 0, canvas.width, canvas.height);
+
+            // Update attractor parameters based on emotion
+            params.a = 1.4 + Math.sin(Date.now() * 0.0005) * 0.5;
+            params.b = 2.3 + Math.cos(Date.now() * 0.0003) * 0.7;
+            params.c = 2.4 + Math.sin(Date.now() * 0.0002) * 0.8;
+            params.d = -2.5 + Math.cos(Date.now() * 0.0004) * 0.6;
+
+            // Calculate new point with pulse variation
+            const pulseFactor = 1.05 + Math.sin(Date.now() * 0.002) * 0.05;
+            const newX = Math.sin(params.a * y) - Math.cos(params.b * x);
+            const newY = Math.sin(params.c * x) - Math.cos(params.d * y);
+
+            x = newX * pulseFactor * params.pulse;
+            y = newY * pulseFactor * params.pulse;
+
+            // Add to points with density control
+            if (Math.random() < params.density * 0.05) {
+                points.push({
+                    x: x * params.scale + canvas.width/2,
+                    y: y * params.scale + canvas.height/2,
+                    size: 0.5 + Math.random() * 1.5,
+                    age: 0
+                });
+
+                // Limit points
+                if (points.length > maxPoints) points.shift();
+            }
+
+            // Draw points with connectedness effect
+            ctx.strokeStyle = getDrynessColor();
+            ctx.lineWidth = 0.5 + params.connectedness;
+
+            if (params.connectedness > 0.3) {
+                // Draw connections
+                for (let i = 0; i < points.length - 1; i++) {
+                    const p1 = points[i];
+                    const p2 = points[i + 1];
+
+                    if (Math.random() < params.connectedness) {
+                        const alpha = p1.age / 50 * (0.3 + params.connectedness * 0.4);
+                        ctx.globalAlpha = alpha;
+                        ctx.beginPath();
+                        ctx.moveTo(p1.x, p1.y);
+                        ctx.lineTo(p2.x, p2.y);
+                        ctx.stroke();
+                    }
+                }
+            }
+
+            // Draw points
+            for (const p of points) {
+                const alpha = 1 - p.age / 100;
+                ctx.globalAlpha = alpha;
+                ctx.beginPath();
+                ctx.arc(p.x, p.y, p.size * (0.5 + params.density * 0.5), 0, Math.PI * 2);
+                ctx.fill();
+                p.age++;
+            }
+
+            // Reset global alpha
+            ctx.globalAlpha = 1;
+            requestAnimationFrame(draw);
+        }
+
+        draw();
+    </script>
+</body>
+</html>