let robotSize = 30; // Increased pixel size for bigger robot let robotWidth = 7; let robotHeight = 10; let cnv; let scanlineStrength = 5; // Controls the vertical offset for the glitch effect let currentBodyColor; let currentAccentColor; let currentEyeColor; let glitchState = 0; // 0: normal, 1: major glitch let glitchTimer = 0; function setup() { cnv = createCanvas(windowWidth, windowHeight); // Full window canvas imageMode(CENTER); // detect touch-capable devices once window.isMobile = (('ontouchstart' in window) || navigator.maxTouchPoints > 0) && width < 767; noSmooth(); cnv.elt.style.touchAction = 'none'; cnv.elt.addEventListener('touchmove', e => { e.preventDefault(); }, { passive: false }); // Initialize colors randomly currentBodyColor = randomColor(150, 255); currentAccentColor = randomColor(150, 255); currentEyeColor = color(255, 255, 0); // Keep eyes yellow for now } function setGlow(blur, glowColor) { if (drawingContext) { drawingContext.shadowBlur = blur; drawingContext.shadowColor = glowColor; } } // Helper function to generate a random color function randomColor(minVal, maxVal) { return color(random(minVal, maxVal), random(minVal, maxVal), random(minVal, maxVal)); } function generateRobot() { // Center the robot on screen let offsetX = (width - robotWidth * robotSize) / 2; let offsetY = (height - robotHeight * robotSize) / 2; // Randomly change body/accent color every 100 frames if (frameCount % 100 === 0) { currentBodyColor = randomColor(150, 255); } if (frameCount % 150 === 0) { currentAccentColor = randomColor(150, 255); } // --- GLITCH STATE LOGIC --- if (glitchState === 0) { if (random() < 0.01) { // 1% chance per frame to enter a major glitch glitchState = 1; glitchTimer = 30; // Glitch duration in frames } } else if (glitchState === 1) { glitchTimer--; if (glitchTimer <= 0) { glitchState = 0; } } // Base offset: smooth noise + occasional big jump let baseOffset = sin(frameCount * 0.1) * scanlineStrength * noise(frameCount * 0.05); if (glitchState === 1) { baseOffset += random(-30, 30); // Major vertical jump during a glitch } noStroke(); push(); translate(0, baseOffset); // Apply a randomized horizontal shift for a deep glitch effect let horizontalShift = glitchState === 1 ? random(-10, 10) : 0; translate(horizontalShift, 0); // Draw body and head fill(currentBodyColor); setGlow(15, color(255, 255, 200, 150)); // Moderate glow for (let x = 0; x < robotWidth; x++) { for (let y = 0; y < robotHeight; y++) { // Skip the eye area of the head if (y < 2 && (x === 2 || x === 4)) continue; // Randomly skip drawing certain pixels for a fragmented look if (random() < 0.02 && glitchState === 1) continue; // Randomly change panel color if (y >= 2 && (x * y * frameCount * 0.01) % 10 < 2 || (glitchState === 1 && random() < 0.1)) { setGlow(0, color(0)); fill(randomColor(0, 100)); // Completely random dark panel rect(offsetX + x * robotSize, offsetY + y * robotSize, robotSize, robotSize); setGlow(15, color(255, 255, 200, 150)); fill(currentBodyColor); } else { rect(offsetX + x * robotSize, offsetY + y * robotSize, robotSize, robotSize); } } } // Draw eyes (Make them glow brighter!) setGlow(30, currentEyeColor); // Stronger glow for the eyes fill(currentEyeColor); let eyeY = 0.8 * robotSize; let eyeSize = robotSize; // Eye Glitch: randomly move the eyes during a glitch state if (glitchState === 1) { eyeY += random(-robotSize/2, robotSize/2); eyeSize += random(-robotSize/4, robotSize/4); } rect(offsetX + 2 * robotSize, offsetY + eyeY, eyeSize, eyeSize); rect(offsetX + 4 * robotSize, offsetY + eyeY, eyeSize, eyeSize); // Decorative details: bolts, panels, etc. (Back to moderate glow) setGlow(15, color(255, 255, 200, 150)); fill(currentAccentColor); // Randomly draw chest detail if (random() < 0.9 || glitchState === 1) { rect(offsetX + 3 * robotSize, offsetY + 2.5 * robotSize, robotSize, robotSize); // chest detail } // Arms and legs are now drawn with random length variation (more random!) fill(currentBodyColor); let armLength = 3 + floor(noise(frameCount * 0.1) * 3); // Random arm length // Draw arms let armYStart = 4; for (let y = armYStart; y < armYStart + armLength; y++) { rect(offsetX - robotSize, offsetY + y * robotSize, robotSize, robotSize); // left arm rect(offsetX + robotWidth * robotSize, offsetY + y * robotSize, robotSize, robotSize); // right arm } // Draw legs let legLength = 2 + floor(noise(frameCount * 0.2) * 2); // Random leg length for (let x = 1; x < 3; x++) { for (let y = 7; y < 7 + legLength; y++) { rect(offsetX + x * robotSize, offsetY + y * robotSize, robotSize, robotSize); // left leg } } for (let x = 4; x < 6; x++) { for (let y = 7; y < 7 + legLength; y++) { rect(offsetX + x * robotSize, offsetY + y * robotSize, robotSize, robotSize); // right leg } } // Antenna fill(currentAccentColor); rect(offsetX + 3 * robotSize, offsetY - robotSize, robotSize, robotSize); pop(); // End translation for glitch effect // Turn off the glow after drawing the robot to keep background/future elements clean setGlow(0, color(0)); } // Function to add a subtle scanline/glitch overlay function applyScanlineOverlay() { loadPixels(); let d = pixelDensity(); let density = d * d; for (let y = 0; y < height; y++) { // Determine the color shift and intensity based on the vertical position // Use random for more erratic shifts during a glitch state let shift = sin(y * 0.1 + frameCount * 0.3) * 10; if (glitchState === 1) { shift += random(-50, 50); // Major shift during glitch } let intensity = map(sin(y * 0.05 + frameCount * 0.1), -1, 1, 0.9, 1.1); if (glitchState === 1) { intensity = random(0.5, 1.5); // Wild intensity during glitch } // Apply a static "darkening" for scanlines let scanlineFactor = (y % 4 === 0) ? 0.95 : 1.0; for (let x = 0; x < width; x++) { for (let i = 0; i < density; i++) { let index = (x + y * width) * 4 * density + i * 4; // Apply scanline darkening pixels[index] *= scanlineFactor; pixels[index + 1] *= scanlineFactor; pixels[index + 2] *= scanlineFactor; // Glitch effect: shift red and blue channels slightly let r_index = index + floor(shift); let b_index = index - floor(shift); // Ensure indices are within bounds r_index = constrain(r_index, 0, pixels.length - 4); b_index = constrain(b_index, 0, pixels.length - 4); // Apply chromatic aberration/glitch let r = pixels[r_index]; let g = pixels[index + 1]; let b = pixels[b_index + 2]; // Apply overall intensity flicker pixels[index] = r * intensity; pixels[index + 1] = g * intensity; pixels[index + 2] = b * intensity; } } } updatePixels(); } function draw() { background(20, 20, 40); // Darker, moodier background for better glow contrast generateRobot(); applyScanlineOverlay(); } function windowResized() { resizeCanvas(windowWidth, windowHeight); }

t3h

Feelings #1

Feelings #1