판타지 던전 마스터 with p5js 애니메이션

Let us begin. --- **Chapter I: The Ashen Threshold** You awaken on a cold, obsidian platform floating in a void of violet mist. Before you, a colossal spiral staircase of cracked marble descends into an abyss where faint, blue runes pulse. A voice, neither male nor female, whispers in the static of your mind: *"Two paths unfold. Choose the beacon of memory, or the blade of change."* --- **Choice 1: Descend to the *Rune of Echoes* (left) – unearth a lost relic.** **Choice 2: Follow the *Luminous Blade* (right) – carve a new path.** --- Here is your first scene. Paste this into a p5.js editor (e.g., editor.p5js.org) and hit run. It will render the threshold in 3D, with a floating crown above each path. ```javascript let angle = 0; let runeColor = [150, 200, 255]; let bladeColor = [255, 180, 100]; let mistscroll = 0; function setup() { createCanvas(800, 600, WEBGL); angleMode(RADIANS); } function draw() { background(10, 5, 25); noStroke(); // Ambient mist mistscroll += 0.01; push(); fill(80, 60, 140, 8); translate(0, 0, -200); box(1000, 1000, 1000); pop(); // The void floor push(); fill(20, 20, 40); translate(0, 150, 0); box(800, 5, 800); pop(); // Spiral staircase of light push(); rotateY(angle); for (let i = 0; i < 20; i++) { let a = i * 0.3; let r = 150 - i * 5; let x = r * cos(a); let z = r * sin(a); let y = i * 5 - 50; push(); translate(x, y, z); rotateX(HALF_PI + 0.3); fill(100, 80, 200, 60 + i * 3); box(6, 6, 16); pop(); } pop(); // Floating crown of choice (center visual) push(); translate(0, -80 + sin(angle * 0.8) * 20, 0); rotateY(angle); noStroke(); emissive(200, 160, 255); crownGeometry(); pop(); // Left Rune of Echoes push(); translate(-250, -20, 0); rotateY(angle * 0.3); stroke(runeColor[0], runeColor[1], runeColor[2], 180); strokeWeight(4); noFill(); torus(60, 8, 16, 16); pop(); // Right Blade of Light push(); translate(250, -20, 0); rotateX(angle * 0.5); stroke(bladeColor[0], bladeColor[1], bladeColor[2]); strokeWeight(3); fill(0, 0, 0, 0); package_sword(); pop(); // Rotating orbs of energy push(); translate(0, 40, 0); for (let i = 0; i < 6; i++) { let a = i * TWO_PI / 6 + angle; let x = 80 * cos(a); let z = 80 * sin(a); translate(x, 0, z); fill(200, 200, 255, 100); sphere(4); translate(-x, 0, -z); } pop(); angle += 0.01; } function crownGeometry() { // Simplified crown: cone top, ring base push(); rotateX(HALF_PI * 0.5); fill(255, 200, 100); cone(18, 40, 12); translate(0, -10, 0); fill(220, 150, 50); torus(28, 6, 16, 16); pop(); } function package_sword() { // Blade push(); translate(0, -30, 0); fill(255, 220, 100); stroke(255, 255, 0); box(8, 100, 3); // Tip translate(0, -50, 0); cone(8, 20, 4); pop(); // Hilt push(); translate(0, 30, 0); fill(100, 60, 20); box(6, 12, 6); stroke(180, 120, 60); line(0, 0, 0, 0, 24, 0); pop(); } function glow(alpha) { // Simple glow effect - set stroke/fill with alpha stroke(255, 255, 255, alpha); strokeWeight(1); fill(255, 255, 255, alpha * 0.3); } ``` --- Choose your path. Type **LEFT** to descend to the Rune of Echoes, or **RIGHT** to take the Blade of Light.