// Config設定 const Config = { // キャンバス設定 frameRate: 60, backgroundColor: { r: 10, g: 10, b: 30 }, // エージェント設定 agentCount: { desktop: 50, mobile: 25 }, agentSpeed: 2, agentSize: 4, // ニューラルネットワーク設定 nodeCount: 20, connectionProbability: 0.3, // 色パレット colors: { neonBlue: [0, 150, 255], neonPink: [255, 0, 150], neonCyan: [0, 255, 255], neonGreen: [0, 255, 100] }, // エフェクト設定 glowIntensity: 0.8, glitchProbability: 0.01, trailAlpha: 20 }; // デバイス検出関数 function detectMobile() { return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test( navigator.userAgent ); } // Agentクラス class Agent { constructor(x, y) { this.position = createVector(x, y); this.velocity = p5.Vector.random2D().mult(random(1, 3)); this.acceleration = createVector(0, 0); this.color = random(Object.values(Config.colors)); this.size = Config.agentSize; this.maxSpeed = Config.agentSpeed; } // 力を適用 applyForce(force) { this.acceleration.add(force); } // 位置を更新 update() { this.velocity.add(this.acceleration); this.velocity.limit(this.maxSpeed); this.position.add(this.velocity); this.acceleration.mult(0); this.wrapEdges(); } // キャンバスの端で折り返し wrapEdges() { if (this.position.x > width) this.position.x = 0; if (this.position.x < 0) this.position.x = width; if (this.position.y > height) this.position.y = 0; if (this.position.y < 0) this.position.y = height; } // 描画 display() { push(); noStroke(); fill(...this.color, 200); circle(this.position.x, this.position.y, this.size); pop(); } } // AgentManagerクラス class AgentManager { constructor(count) { // 最大200エージェントに制限 count = min(count, 200); this.agents = []; for (let i = 0; i < count; i++) { this.agents.push(new Agent(random(width), random(height))); } } // すべてのエージェントを更新 update() { for (let agent of this.agents) { agent.update(); } } // エージェント間の相互作用 applyInteraction() { for (let i = 0; i < this.agents.length; i++) { for (let j = i + 1; j < this.agents.length; j++) { let distance = p5.Vector.dist( this.agents[i].position, this.agents[j].position ); if (distance < 50) { // 近くのエージェント間に接続線を描画 stroke(...this.agents[i].color, 50); strokeWeight(1); line( this.agents[i].position.x, this.agents[i].position.y, this.agents[j].position.x, this.agents[j].position.y ); } } } } // マウス位置に基づく引力/斥力を適用 applyMouseForce(mousePos, isAttract) { for (let agent of this.agents) { let force = p5.Vector.sub(mousePos, agent.position); let distance = force.mag(); distance = constrain(distance, 5, 100); force.normalize(); let strength = isAttract ? 0.5 : -0.5; force.mult(strength / distance); agent.applyForce(force); } } // すべてのエージェントを描画 display() { for (let agent of this.agents) { agent.display(); } } // エージェントを追加 addAgent(x, y) { // 最大数に達している場合は追加しない if (this.agents.length >= 200) { return; } this.agents.push(new Agent(x, y)); } } // NeuralNetworkクラス class NeuralNetwork { constructor(nodeCount) { this.nodes = []; this.connections = []; // ノードを生成 for (let i = 0; i < nodeCount; i++) { this.nodes.push({ x: random(width), y: random(height), size: random(3, 8), color: random(Object.values(Config.colors)) }); } // 接続を生成 for (let i = 0; i < this.nodes.length; i++) { for (let j = i + 1; j < this.nodes.length; j++) { if (random() < Config.connectionProbability) { this.connections.push({ from: i, to: j }); } } } } // ニューラルネットワークを描画 display() { // 接続線を描画 for (let conn of this.connections) { // インデックスが有効範囲内か確認 if (conn.from >= 0 && conn.from < this.nodes.length && conn.to >= 0 && conn.to < this.nodes.length) { let from = this.nodes[conn.from]; let to = this.nodes[conn.to]; stroke(...from.color, 30); strokeWeight(1); line(from.x, from.y, to.x, to.y); } } // ノードを描画 for (let node of this.nodes) { noStroke(); fill(...node.color, 150); circle(node.x, node.y, node.size); } } // ウィンドウリサイズ時に再生成 regenerate(nodeCount) { this.nodes = []; this.connections = []; for (let i = 0; i < nodeCount; i++) { this.nodes.push({ x: random(width), y: random(height), size: random(3, 8), color: random(Object.values(Config.colors)) }); } for (let i = 0; i < this.nodes.length; i++) { for (let j = i + 1; j < this.nodes.length; j++) { if (random() < Config.connectionProbability) { this.connections.push({ from: i, to: j }); } } } } } // EffectManagerクラス class EffectManager { constructor() { this.glitchActive = false; this.glitchTimer = 0; } // グローエフェクトを適用 applyGlow() { drawingContext.shadowBlur = 20; drawingContext.shadowColor = 'rgba(0, 150, 255, 0.8)'; } // グローエフェクトをリセット resetGlow() { drawingContext.shadowBlur = 0; } // トレイルエフェクト（半透明の背景） applyTrail() { fill(Config.backgroundColor.r, Config.backgroundColor.g, Config.backgroundColor.b, Config.trailAlpha); noStroke(); rect(0, 0, width, height); } // グリッチエフェクトをトリガー triggerGlitch() { if (random() < Config.glitchProbability) { this.glitchActive = true; this.glitchTimer = 5; // 5フレーム持続 } } // グリッチエフェクトを描画 displayGlitch() { if (this.glitchActive) { push(); // ランダムな位置に色付きの矩形を描画 for (let i = 0; i < 3; i++) { fill(random(255), random(255), random(255), 100); noStroke(); rect(random(width), random(height), random(50, 200), random(2, 10)); } pop(); this.glitchTimer--; if (this.glitchTimer <= 0) { this.glitchActive = false; } } } } // グローバル変数 let agentManager; let neuralNetwork; let effectManager; let isMobile; function setup() { // キャンバスを作成（レスポンシブ、最小サイズ保証） let w = max(windowWidth, 100); let h = max(windowHeight, 100); createCanvas(w, h); // フレームレートを設定 frameRate(Config.frameRate); // デバイスを検出 isMobile = detectMobile(); // エージェント数を決定 let agentCount = isMobile ? Config.agentCount.mobile : Config.agentCount.desktop; // マネージャーを初期化 agentManager = new AgentManager(agentCount); neuralNetwork = new NeuralNetwork(Config.nodeCount); effectManager = new EffectManager(); } function draw() { // トレイルエフェクトを適用（完全にクリアしない） effectManager.applyTrail(); // ニューラルネットワークを描画（背景レイヤー） neuralNetwork.display(); // グローエフェクトを適用 effectManager.applyGlow(); // エージェント間の相互作用を描画 agentManager.applyInteraction(); // エージェントを更新・描画 agentManager.update(); agentManager.display(); // グローエフェクトをリセット effectManager.resetGlow(); // グリッチエフェクトをトリガー・描画 effectManager.triggerGlitch(); effectManager.displayGlitch(); } function windowResized() { // キャンバスをリサイズ（最小サイズ保証） let w = max(windowWidth, 100); let h = max(windowHeight, 100); resizeCanvas(w, h); // ニューラルネットワークを再生成 neuralNetwork.regenerate(Config.nodeCount); } function mouseMoved() { // マウス位置に基づいてエージェントに引力を適用 let mousePos = createVector(mouseX, mouseY); agentManager.applyMouseForce(mousePos, true); } function mousePressed() { // クリック位置に新しいエージェントを追加 agentManager.addAgent(mouseX, mouseY); } function keyPressed() { // スペースキー: グリッチエフェクト強制トリガー if (key === ' ') { effectManager.glitchActive = true; effectManager.glitchTimer = 10; } // 'R'キー: エージェントリセット if (key === 'r' || key === 'R') { let agentCount = isMobile ? Config.agentCount.mobile : Config.agentCount.desktop; agentManager = new AgentManager(agentCount); } // 'N'キー: ニューラルネットワーク再生成 if (key === 'n' || key === 'N') { neuralNetwork.regenerate(Config.nodeCount); } }

With_AI_Agent