← AsiáticoObjeto 3Dfogon/biombo
Biombo
Arrastrá para girarlo// «Biombo» · gpt-6-sol (medium)
// A Japanese folding screen standing in a zigzag: four tall panels with dark lacquered wooden frames, painted with a gold background, a pink cherry branch and a white crane across the panels.
// Four hinged panels form a shallow zigzag.
const jointsX = [3, 14, 24, 34, 45];
const jointsY = [20, 27, 19, 27, 20];
const dark = "#291d1c";
const lacquer = "#49302b";
const red = "#783631";
const gold = ["#d9a941", "#e8bc59", "#f1cb71", "#c99438"];
function screenY(x) {
for (let i = 0; i < 4; i++) {
if (x <= jointsX[i + 1]) {
const t = (x - jointsX[i]) / (jointsX[i + 1] - jointsX[i]);
return Math.round(jointsY[i] * (1 - t) + jointsY[i + 1] * t);
}
}
return 20;
}
// A painted block sits just in front of its panel.
function paint(x, z, color, relief = 4) {
x = Math.round(x);
z = Math.round(z);
if (x >= 4 && x <= 44 && z >= 4 && z <= 36) {
set(x, screenY(x) - relief, z, color);
}
}
function stroke(x0, z0, x1, z1, radius, color) {
const n = Math.max(Math.abs(x1 - x0), Math.abs(z1 - z0)) * 3;
for (let i = 0; i <= n; i++) {
const x = x0 + (x1 - x0) * i / n;
const z = z0 + (z1 - z0) * i / n;
for (let dx = -radius; dx <= radius; dx++)
for (let dz = -radius; dz <= radius; dz++)
if (dx * dx + dz * dz <= radius * radius + 0.2)
paint(x + dx, z + dz, color);
}
}
function oval(cx, cz, rx, rz, color) {
for (let x = Math.ceil(cx - rx); x <= cx + rx; x++)
for (let z = Math.ceil(cz - rz); z <= cz + rz; z++)
if (((x - cx) / rx) ** 2 + ((z - cz) / rz) ** 2 <= 1)
paint(x, z, color);
}
// Solid, thin gold-leaf panels with lacquered edges.
for (let x = 3; x <= 45; x++) {
const y = screenY(x);
for (let z = 2; z <= 38; z++) {
for (let d = -1; d <= 1; d++)
set(x, y + d, z, d === 1 ? lacquer : gold[0]);
set(x, y - 2, z, gold[Math.floor(rand() * gold.length)]);
}
}
// Quiet brocade specks and distant gold clouds.
for (let i = 0; i < 180; i++) {
const x = 5 + Math.floor(rand() * 39);
const z = 5 + Math.floor(rand() * 31);
if (rand() < 0.55) paint(x, z, "#f6d681", 3);
}
const cloud = "#bd8837";
for (const [x, z] of [[7, 30], [17, 10], [29, 33], [40, 11]]) {
stroke(x, z, x + 4, z, 0, cloud);
stroke(x + 1, z + 1, x + 3, z + 1, 0, cloud);
paint(x + 4, z - 1, cloud);
}
// Cherry tree: a dark sweeping trunk and finer forked twigs.
stroke(4, 11, 9, 16, 1, "#54332c");
stroke(9, 16, 14, 21, 1, "#54332c");
stroke(14, 21, 20, 26, 1, "#59352e");
stroke(20, 26, 26, 30, 0, "#604035");
stroke(10, 17, 8, 25, 0, "#604035");
stroke(14, 21, 14, 30, 0, "#604035");
stroke(17, 23, 21, 33, 0, "#604035");
stroke(19, 25, 25, 23, 0, "#604035");
stroke(7, 14, 5, 21, 0, "#604035");
stroke(12, 20, 19, 18, 0, "#604035");
const blossoms = [
[5, 21], [7, 25], [9, 24], [8, 19], [11, 19], [13, 28],
[15, 30], [17, 27], [19, 32], [21, 33], [23, 29], [26, 31],
[24, 24], [20, 20], [17, 18], [12, 23], [15, 25], [6, 16]
];
for (const [x, z] of blossoms) {
paint(x, z, "#b94769");
paint(x - 1, z, "#f39bb1");
paint(x + 1, z, "#f7b4c3");
paint(x, z + 1, "#ffe0d9");
paint(x, z - 1, "#e77998");
if (x < 43) paint(x + 1, z + 1, "#ffd1d3");
paint(x, z, "#bb7249", 5);
}
for (const [x, z] of [[10, 12], [16, 15], [22, 16], [26, 21], [29, 26]])
paint(x, z, "#f5afbe");
// Crane's slender dark legs, beneath its feathered body.
stroke(32, 16, 32, 9, 0, "#44423b");
stroke(36, 16, 35, 8, 0, "#44423b");
stroke(32, 9, 29, 8, 0, "#44423b");
stroke(35, 8, 39, 8, 0, "#44423b");
// Outspread wing and individually readable dark flight feathers.
stroke(32, 21, 26, 29, 3, "#e4e5da");
stroke(31, 23, 26, 30, 2, "#fff8e9");
for (const [x, z] of [[25, 30], [26, 28], [27, 27], [28, 26], [29, 25]]) {
stroke(x, z, x - 1, z + 2, 0, "#394244");
paint(x, z + 1, "#f5f3e9");
}
oval(33, 18, 5, 3, "#e0e2da");
oval(34, 19, 4, 2, "#fff9ed");
stroke(29, 17, 26, 19, 1, "#e7e9e2");
paint(26, 20, "#354044");
paint(27, 20, "#354044");
paint(28, 19, "#424747");
// Curved white neck, crowned head and pointed beak.
stroke(36, 19, 37, 23, 1, "#f7f5eb");
stroke(37, 23, 36, 26, 1, "#fff9ed");
stroke(36, 26, 39, 29, 1, "#f7f6ed");
oval(39, 29, 2, 2, "#fff9ee");
paint(40, 30, "#24292c", 5);
paint(39, 32, "#ba403b");
paint(40, 32, "#dd584d");
stroke(41, 28, 44, 27, 0, "#3b3b35");
// Jade reeds and small flowers anchor the scene.
for (const x of [7, 11, 18, 22, 27, 39, 42]) {
stroke(x, 4, x - 1, 8, 0, "#617054");
stroke(x, 4, x + 2, 7, 0, "#75815a");
paint(x + 1, 5, "#a8a66a");
}
for (const [x, z] of [[6, 7], [20, 7], [42, 6]]) {
paint(x, z, "#f8c8c4");
paint(x + 1, z, "#e985a2");
}
// Continuous top and bottom rails, gilded inside edges, and dark hinges.
for (let x = 3; x <= 45; x++) {
const y = screenY(x);
for (let z = 1; z <= 3; z++)
box(x, y - 3, z, x, y + 2, z, z === 3 ? red : dark);
for (let z = 37; z <= 39; z++)
box(x, y - 3, z, x, y + 2, z, z === 37 ? red : dark);
set(x, y - 4, 4, "#d6a347");
set(x, y - 4, 36, "#d6a347");
set(x, y - 4, 38, "#a36538");
}
for (const x of jointsX) {
const y = screenY(x);
box(x, y - 4, 1, x, y + 2, 39, dark);
box(x, y - 5, 4, x, y - 5, 36, red);
for (const z of [8, 19, 30])
set(x, y - 6, z, "#d4a34e");
box(x - 1, y - 2, 0, x + 1, y + 2, 1, lacquer);
box(x, y - 3, 0, x, y + 3, 0, dark);
}import { draw } from "./assets/voxel";
import { biombo } from "./assets/biombo";
// En cada cuadro: parado sobre (x, y), el centro de su base.
draw(ctx, biombo, x, y, { size: 64, angle: 0, t: performance.now() / 1000 });
// size: lo que mide en px su lado más largo
// angle: giro sobre el piso, en radianes
// t: segundos; si se mueve, se anima solo con eso# En una terminal, en la carpeta del juego
fogon assets add biombo
# Con las herramientas de Fogón (conector)
add_assets({ slug: "<tu-juego>", ids: ["biombo"] })
# Queda en client/assets/biombo.ts
# https://fogon.page/object/biombo