Here is the general meta-prompt you can run 100 times to continuously generate unique, highly conceptual art+science projects. Below it, I have autonomously executed the first run to deliver the visually stunning, interactive package you requested.
Prompt: "You are an autonomous speculative bio-artist and critical designer. Generate a novel, highly conceptual art+science piece that heavily exploits the theoretical multimodal in/out capabilities of a frontier AI (text, audio, visual, bio-data, 3D). The aesthetic and conceptual rigor should align with 'we-make-money-not-art' (speculative urbanism, bio-hacking, surveillance critique, anthropocene detritus, cybernetics).
Do not explain what you are going to do. Autonomously output the entire project as a single, self-contained, beautifully designed, brutally minimalist HTML/CSS/JS package. The package must act as a digital exhibition space containing: 1. A curatorial statement and critical breakdown of the piece. 2. A simulated visual artifact of the multimodal output (using Canvas/WebGL procedural generation). 3. A simulated audio artifact (using the Web Audio API to generate a thematic, procedural soundscape). 4. An interactive or auto-navigating UI.
Use dark mode, high-contrast neon accents, and avant-garde typography. Make it weird."
Project Title: LITHIC_CHORUS // MYCO-SILICON PARASITISM
Concept: Investigating the symbiotic interface between Pestalotiopsis microspora (plastic-eating fungi) and discarded semiconductor wafers in the Guiyu e-waste dumps. The AI model translates the chemical degradation of the microchips into generative brutalist architecture and a harsh-noise sonic topology.
Save the code block below as an .html file (e.g., exhibition_001.html) and open it in any web browser to experience the interactive package.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LITHIC_CHORUS // Flash3.7 Output</title>
<style>
:root {
--bg: #050505;
--text: #e0e0e0;
--accent1: #ccff00; /* Acid Green */
--accent2: #ff00ff; /* Magenta */
--muted: #333333;
}
body, html {
margin: 0; padding: 0;
width: 100%; height: 100%;
background-color: var(--bg);
color: var(--text);
font-family: 'Courier New', Courier, monospace;
overflow: hidden;
display: flex;
}
/* CRT Overlay Effect */
body::after {
content: " ";
display: block;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}
#sidebar {
width: 400px;
height: 100vh;
padding: 40px;
box-sizing: border-box;
border-right: 1px solid var(--muted);
display: flex;
flex-direction: column;
justify-content: space-between;
z-index: 3;
overflow-y: auto;
background: rgba(5, 5, 5, 0.9);
}
h1 {
font-size: 1.2rem;
text-transform: uppercase;
letter-spacing: 2px;
color: var(--accent1);
margin-bottom: 5px;
}
h2 {
font-size: 0.8rem;
color: var(--accent2);
font-weight: normal;
margin-top: 0;
margin-bottom: 30px;
}
p {
font-size: 0.85rem;
line-height: 1.6;
text-align: justify;
}
.data-block {
margin-top: 30px;
padding: 15px;
border: 1px solid var(--muted);
font-size: 0.75rem;
color: #888;
}
.data-block span {
display: block;
margin-bottom: 5px;
}
.highlight {
color: var(--accent1);
}
button {
background: transparent;
color: var(--accent1);
border: 1px solid var(--accent1);
padding: 15px;
font-family: inherit;
text-transform: uppercase;
cursor: pointer;
margin-top: 20px;
transition: all 0.3s;
position: relative;
z-index: 10;
}
button:hover {
background: var(--accent1);
color: var(--bg);
}
#canvas-container {
flex-grow: 1;
position: relative;
background: #000;
}
canvas {
display: block;
width: 100%;
height: 100%;
}
.overlay-text {
position: absolute;
bottom: 20px;
right: 20px;
text-align: right;
font-size: 0.7rem;
color: var(--muted);
z-index: 3;
}
</style>
</head>
<body>
<div id="sidebar">
<div>
<h1>Lithic_Chorus</h1>
<h2>Project: Myco-Silicon Parasitism</h2>
<p>
In the Guiyu e-waste sectors, <i>Pestalotiopsis microspora</i> has been documented dissolving discarded logic gates. We harvested this bio-electrical decay, piping the chemical degradation rates directly into Flash3.7's multimodal tensor network.
</p>
<p>
Flash3.7 acts as a translational membrane. <b>Input:</b> Visual electron-microscopy of fungal hyphae piercing silicon, cross-referenced with pH toxicity levels. <b>Output:</b> Real-time generation of speculative brutalist macro-structures and a sonification of the silicon death-rattle.
</p>
<div class="data-block">
<span>> MODEL: FLASH-3.7_MULTIMODAL</span>
<span>> TENSOR_STATE: <span class="highlight" id="tensor-state">FLUID</span></span>
<span>> MYCELIAL_NODE_COUNT: <span id="node-count">0</span></span>
<span>> PH_DEGRADATION: <span id="ph-level">7.01</span></span>
</div>
<button id="audio-toggle">Initialize Bio-Acoustic Sonification</button>
</div>
<div style="font-size: 0.7rem; color: #555;">
> WE_MAKE_MONEY_NOT_ART_ARCHIVE // 2026<br>
> AUTONOMOUSLY CURATED BY GEMINI
</div>
</div>
<div id="canvas-container">
<canvas id="generative-art"></canvas>
<div class="overlay-text">
LIVE MULTIMODAL RENDER <br>
<span class="highlight">FUNGAL_LOGIC_GATES // ACTIVE</span>
</div>
</div>
<script>
// --- VISUAL GENERATOR (CANVAS) ---
const canvas = document.getElementById('generative-art');
const ctx = canvas.getContext('2d');
let width, height;
function resize() {
width = canvas.width = canvas.parentElement.clientWidth;
height = canvas.height = canvas.parentElement.clientHeight;
}
window.addEventListener('resize', resize);
resize();
const agents = [];
const numAgents = 150;
for (let i = 0; i < numAgents; i++) {
agents.push({
x: width / 2,
y: height / 2,
angle: Math.random() * Math.PI * 2,
speed: Math.random() * 2 + 0.5,
color: Math.random() > 0.5 ? '#ccff00' : '#ff00ff',
life: Math.random() * 100,
thickness: Math.random() * 2 + 0.5
});
}
let nodeCount = 0;
let frame = 0;
function draw() {
// Fade background slowly to create trails
ctx.fillStyle = 'rgba(5, 5, 5, 0.04)';
ctx.fillRect(0, 0, width, height);
agents.forEach(agent => {
// Random organic wandering (simulating hyphae growth)
agent.angle += (Math.random() - 0.5) * 0.5;
// Occasional 90-degree snaps (simulating silicon architecture constraints)
if (Math.random() < 0.02) {
agent.angle = Math.round(agent.angle / (Math.PI/2)) * (Math.PI/2);
}
let prevX = agent.x;
let prevY = agent.y;
agent.x += Math.cos(agent.angle) * agent.speed;
agent.y += Math.sin(agent.angle) * agent.speed;
// Draw line
ctx.beginPath();
ctx.moveTo(prevX, prevY);
ctx.lineTo(agent.x, agent.y);
ctx.strokeStyle = agent.color;
ctx.lineWidth = agent.thickness;
ctx.stroke();
// Wrap around edges
if (agent.x < 0) agent.x = width;
if (agent.x > width) agent.x = 0;
if (agent.y < 0) agent.y = height;
if (agent.y > height) agent.y = 0;
// Occasionally branch or "die" and reset
agent.life -= 0.1;
if (agent.life <= 0) {
agent.x = width/2 + (Math.random() - 0.5) * 200;
agent.y = height/2 + (Math.random() - 0.5) * 200;
agent.life = Math.random() * 100;
nodeCount++;
}
});
// UI Updates
if(frame % 10 === 0) {
document.getElementById('node-count').innerText = nodeCount;
document.getElementById('ph-level').innerText = (4.0 + Math.random() * 1.5).toFixed(3);
document.getElementById('tensor-state').innerText = Math.random() > 0.95 ? 'RECALIBRATING' : 'FLUID';
}
frame++;
requestAnimationFrame(draw);
}
draw();
// --- AUDIO GENERATOR (WEB AUDIO API) ---
let audioCtx;
let isPlaying = false;
let masterGain;
let oscillators = [];
let lfos = [];
function initAudio() {
audioCtx = new (window.AudioContext || window.webkitAudioContext)();
masterGain = audioCtx.createGain();
masterGain.gain.value = 0.3; // Keep it ambient
// Reverb/Delay simulation via simple feedback network
const delay = audioCtx.createDelay();
delay.delayTime.value = 0.4;
const feedback = audioCtx.createGain();
feedback.gain.value = 0.6;
delay.connect(feedback);
feedback.connect(delay);
delay.connect(masterGain);
masterGain.connect(audioCtx.destination);
// Create Drone (Silicon Hum)
createOscillator(55, 'square', 0.1, delay); // Low A
createOscillator(110, 'sawtooth', 0.05, delay);
// Create Fungal "Clicks" / Micro-fluctuations
setInterval(() => {
if(!isPlaying) return;
if(Math.random() > 0.6) {
let osc = audioCtx.createOscillator();
let gain = audioCtx.createGain();
osc.type = 'sine';
osc.frequency.setValueAtTime(800 + Math.random() * 2000, audioCtx.currentTime);
// rapid decay
gain.gain.setValueAtTime(0.1, audioCtx.currentTime);
gain.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + 0.1);
osc.connect(gain);
gain.connect(masterGain);
osc.start();
osc.stop(audioCtx.currentTime + 0.1);
}
}, 150);
}
function createOscillator(freq, type, vol, dest) {
let osc = audioCtx.createOscillator();
let gain = audioCtx.createGain();
let lfo = audioCtx.createOscillator();
osc.type = type;
osc.frequency.value = freq;
// Modulate the amplitude for a breathing effect
lfo.type = 'sine';
lfo.frequency.value = 0.1 + Math.random() * 0.2; // Slow LFO
let lfoGain = audioCtx.createGain();
lfoGain.gain.value = vol;
lfo.connect(lfoGain.gain);
osc.connect(gain);
gain.connect(dest);
osc.start();
lfo.start();
oscillators.push(osc);
lfos.push(lfo);
}
document.getElementById('audio-toggle').addEventListener('click', function() {
if (!audioCtx) {
initAudio();
isPlaying = true;
this.innerText = 'System Active. Mute Audio?';
this.style.background = 'var(--accent1)';
this.style.color = 'var(--bg)';
audioCtx.resume();
} else {
if (isPlaying) {
audioCtx.suspend();
isPlaying = false;
this.innerText = 'Initialize Bio-Acoustic Sonification';
this.style.background = 'transparent';
this.style.color = 'var(--accent1)';
} else {
audioCtx.resume();
isPlaying = true;
this.innerText = 'System Active. Mute Audio?';
this.style.background = 'var(--accent1)';
this.style.color = 'var(--bg)';
}
}
});
</script>
</body>
</html>