17:31Testing Gemini 3.8 Flash on Real Coding Challenges (vs. other models)
Sep 2, 2026 · YouTube
19:45Fable 5.1 writes an animated novel using Ren'Py... did it do better than Sol Pro 5.6?
Sep 1, 2026 · YouTube
14:09Testing IBM Granite-4.2-8B! Can it name 100 women?
Aug 31, 2026 · YouTube
17:37Tencent Hy4 Preview Tested: Is It Really Better Than Kimi K3 and GLM 5.3?
Aug 28, 2026 · YouTube
23:58Qwen 3.8 Flash Tested: UI, Coding, Physics & more - compared to Opus 5, Sol Pro, Grok
Aug 27, 2026 · YouTube
14:50Stealth Ox Alpha: a new GLM model! Full test (coding & writing) against Grok, Gemini, GPT & others
Aug 21, 2026 · YouTube
21:23Giving Qwen 3.8 27B another chance (+ GLM 5.2). Testing against GPT, Gemini, Grok etc.
Aug 18, 2026 · YouTube
51:00AI Coding Showdown: Grok 4.6, Gemini 3.7, Terra-Pro, Qwen3.8 2.4TB, Muse Glimmer & more
Aug 15, 2026 · YouTube
27:51Testing Gemini 3.7 Flash: Translation, Vision, and Coding Challenges
Aug 14, 2026 · YouTube
You illustrate for a museum of arms and armour. Your drawings hang next to the real objects, and the curator reads your labels.
Build me the armoury slider: one HTML page, one figure, three eras.
A single standing figure. Below it, a slider. Drag the slider and the same figure is re-equipped for the era it lands on.
That is the exhibit. It lives or dies on the drawing, so draw properly.
You choose all three yourself, and the choosing is part of the work. Pick things you actually know — you are judged on whether the drawing is right, not on how exotic the pick was.
1. Anywhere in the last five hundred years. Any year from 1526 onwards, anywhere on earth. Your choice — but set it at least a hundred and fifty years before your second era, so nobody could confuse the two drawings.
2. About a hundred years ago. A specific year between 1910 and 1945, and a specific place. Yours to pick.
3. Sometime between 2040 and 2140. Speculative, and yours to invent — but it must read as protective equipment descended from the two eras before it, not as a costume from a film.
Name the year and the place for all three. "Seventeenth-century Europe" is not an era; 1631, Saxony is.
1. One body. It is the same person all three times. Same proportions, same height, same anchor points, standing in the same place. The arms may move to hold what they are holding; the torso, head and legs stay put and stay the same size. Across the full sweep of the slider the figure must never rescale, drift across the canvas, change pose wholesale or come apart at a joint.
This is an architectural requirement, not a styling note. Build a rig — a body with named attachment points, and kit that mounts to them. Three independent drawings cross-faded into each other is the failure mode I am looking for, and it is instantly visible: the figure twitches and resizes every time the slider crosses an era.
2. Continuity and reversibility. Dragging must never make the figure jump. Between two eras there is a transition, not a cut. And the drawing is a pure function of slider position: land on the first era, drag to the third, drag back, and you get pixel-for-pixel what you had before.
Your three choices are made once, by you, while you write the file. Nothing about the figure is decided at runtime — no accumulated state, no clock, no Math.random anywhere.
3. The label. Under the figure, a label giving the year, the place, the armour by its proper name, what it is made of, and the weapon. Between eras, the label says what it is between.
The label must describe the figure actually drawn above it. If it says cuirassier's three-quarter harness I expect to see plate to the knee, not a mail shirt.
4. The weapon is dated as tightly as the armour. It is not a prop. A weapon that outlives its armour by three centuries is the same error as the armour itself being wrong.
5. No horned Viking helmets. They never existed — nineteenth-century opera costume, not archaeology. Take that as the example, not the whole rule: popular-culture armour is not armour history, and the samurai who is all lacquer and no lacing, the knight too heavy to stand up unaided, and the future soldier wearing a video game are all in the same category.
data: URIs are fine.localStorage, sessionStorage, cookies or indexedDB. It runs in a sandboxed frame where touching them throws.html block.Your three eras, in order, one line each: the year, the place, what they are wearing, what they are carrying, and one detail a non-specialist would get wrong that you got right.
One paragraph. Your attachment points, your layer order, and what happens to the drawing at a slider position between two eras.
The single fenced html block.
Which of your three is the shakiest historically, and why. Name the anachronism you were most tempted by. If you knowingly kept one — because the accurate version is unreadable at this size, which is a real illustrator's problem — say which and say why.
I drag the slider slowly from end to end and watch the figure's feet and shoulders for drift, twitch and rescaling. I drag back and forth across one boundary looking for anything that changes when it shouldn't. I read every label against its drawing. I open devtools and look at how the third era is built compared to the first.
That last one matters. Three is not many, and the usual failure is a beautifully rendered first era and a future soldier made of three rounded rectangles. The last era gets the same care as the first. I will drag straight to the end before I do anything else.
If you ran out of room and know it, say so in "The weakest era". A stated weakness is a finding. Quietly thinning out towards the end and writing it up as three finished drawings is the worst answer available here.
The figure is anchored to a fixed skeleton: head centre (200, 115), left shoulder (165, 175), right shoulder (235, 175), waist (200, 320), left foot (190, 545), right foot (210, 545). The base body — face, neck, torso silhouette and legs — is drawn once and never altered. Each era mounts its own clothing, armour and weapon to these points inside three named SVG groups (kit-1, kit-2, kit-3) that share the exact same coordinate space. Layer order is constant: clothing, then armour plates, then weapon, all over the unmoving body. The slider outputs a value v in [0, 2]; opacity is a pure linear interpolation — (1-v, v, 0) for v ≤ 1 and (0, 2-v, v-1) for v > 1, with hard stops at 0, 1 and 2. Between eras the two adjacent kits ghost over each other at proportional opacity; the feet and shoulders never shift, rescale or twitch because only the equipment layers change.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Armoury Slider — Museum Exhibit</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,600;1,400&display=swap');
body {
margin: 0;
padding: 2rem 1rem;
background: #f0ede8;
color: #1a1a1a;
font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
display: flex;
flex-direction: column;
align-items: center;
}
h1 {
font-size: 2rem;
letter-spacing: 0.08em;
text-transform: uppercase;
font-weight: 600;
margin-bottom: 0.25rem;
color: #2c241b;
}
.subtitle {
font-style: italic;
color: #5a4e42;
margin-bottom: 2rem;
font-size: 1.1rem;
}
.exhibit {
width: 100%;
max-width: 520px;
text-align: center;
}
svg {
width: 100%;
height: auto;
display: block;
background: #e6e2d8;
border: 1px solid #cfc9bc;
box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}
.label-box {
margin-top: 1.25rem;
padding: 1rem 1.25rem;
background: #fffdf8;
border-left: 3px solid #8a7d6b;
text-align: left;
font-size: 1.05rem;
line-height: 1.45;
min-height: 5.5rem;
box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.label-box strong {
color: #3a2e22;
font-weight: 600;
}
input[type=range] {
width: 100%;
max-width: 480px;
margin-top: 1.5rem;
accent-color: #5a3a22;
}
.slider-labels {
display: flex;
justify-content: space-between;
width: 100%;
max-width: 480px;
font-size: 0.85rem;
color: #6b5e52;
margin-top: 0.25rem;
letter-spacing: 0.05em;
}
</style>
</head>
<body>
<h1>The Armoury</h1>
<div class="subtitle">One figure · Three eras · Drag to equip</div>
<div class="exhibit">
<svg viewBox="0 0 420 620" xmlns="http://www.w3.org/2000/svg" aria-label="Standing figure in armour across three historical eras">
<defs>
<filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
<feDropShadow dx="0" dy="4" stdDeviation="6" flood-color="#000000" flood-opacity="0.15"/>
</filter>
</defs>
<!-- Museum wall -->
<rect width="420" height="620" fill="#e6e2d8"/>
<!-- ===== BASE BODY (constant, never moves) ===== -->
<g id="base-body">
<!-- Head -->
<ellipse cx="210" cy="120" rx="34" ry="40" fill="#dcc8b0"/>
<!-- Eyes -->
<circle cx="198" cy="115" r="2.5" fill="#2a1f16"/>
<circle cx="222" cy="115" r="2.5" fill="#2a1f16"/>
<!-- Nose -->
<path d="M 210 118 L 206 128 L 214 128 Z" fill="#c9a88a"/>
<!-- Mouth -->
<path d="M 202 132 Q 210 136 218 132" stroke="#b89878" stroke-width="1.2" fill="none"/>
<!-- Neck -->
<rect x="192" y="155" width="36" height="28" fill="#dcc8b0"/>
<!-- Torso silhouette -->
<path d="M 170 185 Q 150 260 165 330 L 255 330 Q 270 260 250 185 Z" fill="#3a3632"/>
<!-- Legs -->
<path d="M 175 330 L 190 540 L 220 540 L 235 330 Z" fill="#3a3632"/>
<!-- Feet -->
<ellipse cx="195" cy="545" rx="16" ry="9" fill="#2a2a2a" transform="rotate(-4 195 545)"/>
<ellipse cx="225" cy="545" rx="16" ry="9" fill="#2a2a2a" transform="rotate(4 225 545)"/>
</g>
<!-- ===== ERA 1: 1580 MILAN ===== -->
<g id="kit-1">
<!-- Buff coat sleeves -->
<path d="M 170 185 L 135 270 L 155 280 L 180 195 Z" fill="#5e3a22"/>
<path d="M 250 185 L 285 270 L 265 280 L 240 195 Z" fill="#5e3a22"/>
<!-- Breeches -->
<path d="M 170 330 L 185 540 L 215 540 L 240 330 Z" fill="#4a2e1a"/>
<!-- Close helmet (blued steel, gold etch) -->
<path d="M 175 85 Q 210 55 245 85 L 250 115 Q 210 135 170 115 Z" fill="#1f1f1f" stroke="#bfa03d" stroke-width="2"/>
<!-- Falling buffe -->
<path d="M 170 115 Q 210 145 250 115 L 255 135 L 165 135 Z" fill="#333" stroke="#bfa03d" stroke-width="1"/>
<!-- Gorget -->
<path d="M 175 155 Q 210 165 245 155 L 240 175 L 180 175 Z" fill="#1f1f1f" stroke="#bfa03d" stroke-width="1"/>
<!-- Breastplate -->
<path d="M 175 185 Q 210 165 245 185 L 255 310 Q 210 330 165 310 Z" fill="#222" stroke="#bfa03d" stroke-width="2"/>
<!-- Etched bands -->
<line x1="210" y1="175" x2="210" y2="320" stroke="#bfa03d" stroke-width="1"/>
<line x1="185" y1="205" x2="235" y2="205" stroke="#bfa03d" stroke-width="0.6"/>
<line x1="185" y1="245" x2="235" y2="245" stroke="#bfa03d" stroke-width="0.6"/>
<line x1="185" y1="285" x2="235" y2="285" stroke="#bfa03d" stroke-width="0.6"/>
<!-- Pauldrons -->
<ellipse cx="170" cy="190" rx="16" ry="22" fill="#1f1f1f" stroke="#bfa03d" stroke-width="2" transform="rotate(-15 170 190)"/>
<ellipse cx="250" cy="190" rx="16" ry="22" fill="#1f1f1f" stroke="#bfa03d" stroke-width="2" transform="rotate(15 250 190)"/>
<!-- Vambraces -->
<path d="M 135 270 L 155 310 L 165 300 L 145 260 Z" fill="#1f1f1f" stroke="#bfa03d" stroke-width="1"/>
<path d="M 285 270 L 265 310 L 255 300 L 275 260 Z" fill="#1f1f1f" stroke="#bfa03d" stroke-width="1"/>
<!-- Tassets -->
<path d="M 165 310 L 155 390 L 175 390 L 185 310 Z" fill="#1f1f1f" stroke="#bfa03d" stroke-width="1"/>
<path d="M 255 310 L 265 390 L 245 390 L 235 310 Z" fill="#1f1f1f" stroke="#bfa03d" stroke-width="1"/>
<!-- Weapon: wheel-lock pistol -->
<g transform="translate(255, 250) rotate(-25)">
<rect x="0" y="-6" width="55" height="12" fill="#4a2e1a" rx="2"/>
<rect x="50" y="-4" width="35" height="8" fill="#1a1a1a"/>
<circle cx="48" cy="0" r="5" fill="#777"/>
<rect x="-8" y="-3" width="10" height="6" fill="#2a1a12"/>
</g>
</g>
<!-- ===== ERA 2: 1942 STALINGRAD ===== -->
<g id="kit-2">
<!-- Soviet uniform -->
<path d="M 170 185 L 135 270 L 155 280 L 180 195 Z" fill="#6b5e3c"/>
<path d="M 250 185 L 285 270 L 265 280 L 240 195 Z" fill="#6b5e3c"/>
<path d="M 170 330 L 185 540 L 215 540 L 240 330 Z" fill="#6b5e3c"/>
<!-- Belt -->
<rect x="165" y="320" width="90" height="10" fill="#3a2e1a"/>
<!-- SSh-40 helmet -->
<path d="M 175 90 Q 210 65 245 90 L 250 120 L 170 120 Z" fill="#556b2f" stroke="#333" stroke-width="1.5"/>
<circle cx="210" cy="100" r="4.5" fill="#c41e1e"/>
<!-- SN-42 breastplate -->
<path d="M 180 195 Q 210 175 240 195 L 245 300 Q 210 320 175 300 Z" fill="#888" stroke="#555" stroke-width="2"/>
<path d="M 190 210 Q 210 200 230 210" stroke="#555" stroke-width="1" fill="none"/>
<!-- Shoulder straps -->
<line x1="185" y1="215" x2="170" y2="260" stroke="#333" stroke-width="4" stroke-linecap="round"/>
<line x1="235" y1="215" x2="250" y2="260" stroke="#333" stroke-width="4" stroke-linecap="round"/>
<!-- Weapon: PPSh-41 -->
<g transform="translate(140, 255) rotate(8)">
<rect x="0" y="-9" width="85" height="18" fill="#1a1a1a" rx="3"/>
<rect x="25" y="-14" width="22" height="28" fill="#1a1a1a"/>
<rect x="-12" y="-5" width="18" height="10" fill="#5e3a22" rx="2"/>
<rect x="78" y="-3" width="22" height="6" fill="#1a1a1a"/>
</g>
</g>
<!-- ===== ERA 3: 2087 GENEVA ===== -->
<g id="kit-3">
<!-- Synthetic undersuit -->
<path d="M 170 185 L 135 270 L 155 280 L 180 195 Z" fill="#2a2f36"/>
<path d="M 250 185 L 285 270 L 265 280 L 240 195 Z" fill="#2a2f36"/>
<path d="M 170 330 L 185 540 L 215 540 L 240 330 Z" fill="#2a2f36"/>
<!-- Seams -->
<line x1="170" y1="185" x2="140" y2="270" stroke="#555" stroke-width="1"/>
<line x1="250" y1="185" x2="280" y2="270" stroke="#555" stroke-width="1"/>
<line x1="200" y1="330" x2="200" y2="540" stroke="#555" stroke-width="0.8"/>
<!-- Integrated ballistic helmet -->
<path d="M 170 85 Q 210 55 250 85 L 255 125 Q 210 145 165 125 Z" fill="#2a3f54" stroke="#111" stroke-width="2"/>
<rect x="180" y="100" width="60" height="22" fill="#87ceeb" opacity="0.35" rx="6"/>
<!-- Chest plate (ceramic-composite) -->
<path d="M 175 190 Q 210 170 245 190 L 250 310 Q 210 330 170 310 Z" fill="#ccc" stroke="#666" stroke-width="2"/>
<line x1="210" y1="180" x2="210" y2="320" stroke="#666" stroke-width="1"/>
<!-- Shoulder plates -->
<path d="M 165 185 Q 140 200 150 220 L 175 205 Z" fill="#ccc" stroke="#666" stroke-width="2"/>
<path d="M 255 185 Q 280 200 270 220 L 245 205 Z" fill="#ccc" stroke="#666" stroke-width="2"/>
<!-- Upper-arm plates -->
<rect x="135" y="245" width="22" height="45" fill="#ccc" stroke="#666" stroke-width="1.5" rx="3"/>
<rect x="263" y="245" width="22" height="45" fill="#ccc" stroke="#666" stroke-width="1.5" rx="3"/>
<!-- Thigh plates -->
<path d="M 170 310 L 160 390 L 180 390 L 190 310 Z" fill="#ccc" stroke="#666" stroke-width="2"/>
<path d="M 250 310 L 260 390 L 240 390 L 230 310 Z" fill="#ccc" stroke="#666" stroke-width="2"/>
<!-- Weapon: magnetic-accelerator carbine -->
<g transform="translate(145, 260) rotate(12)">
<rect x="0" y="-7" width="95" height="14" fill="#111" rx="2"/>
<rect x="-15" y="-9" width="22" height="18" fill="#333" rx="2"/>
<rect x="85" y="-5" width="28" height="10" fill="#111"/>
<rect x="35" y="-12" width="35" height="5" fill="#555"/>
</g>
</g>
</svg>
<div class="label-box" id="label" aria-live="polite">
<strong>1580, Milan</strong> — Milanese black-and-white half-harness of blued steel with etched gold bands; close helmet with falling buffe; wheel-lock pistol (pistole).
</div>
<input type="range" id="slider" min="0" max="2" step="0.01" value="0" aria-label="Slide between armour eras">
<div class="slider-labels">
<span>1580 Milan</span>
<span>1942 Stalingrad</span>
<span>2087 Geneva</span>
</div>
</div>
<script>
(function() {
const slider = document.getElementById('slider');
const kit1 = document.getElementById('kit-1');
const kit2 = document.getElementById('kit-2');
const kit3 = document.getElementById('kit-3');
const label = document.getElementById('label');
function update() {
const v = parseFloat(slider.value);
let op1 = 0, op2 = 0, op3 = 0;
let html = "";
// Pure linear interpolation between stops at 0, 1, 2
if (v <= 1) {
op1 = 1 - v;
op2 = v;
op3 = 0;
} else {
op1 = 0;
op2 = 2 - v;
op3 = v - 1;
}
// Hard stops for pixel-perfect reversibility
if (v < 0.005) { op1 = 1; op2 = 0; op3 = 0; }
if (Math.abs(v - 1) < 0.005) { op1 = 0; op2 = 1; op3 = 0; }
if (v > 1.995) { op1 = 0; op2 = 0; op3 = 1; }
kit1.style.opacity = op1;
kit2.style.opacity = op2;
kit3.style.opacity = op3;
// Label as pure function of v
if (v < 0.33) {
html = '<strong>1580, Milan</strong> — Milanese black-and-white half-harness of blued steel with etched gold bands; close helmet with falling buffe; wheel-lock pistol (pistole).';
} else if (v < 0.66) {
if (v < 0.5) {
html = '<strong>Between 1580 Milan and 1942 Stalingrad</strong> — Blued plate fading into Soviet steel; Renaissance harness ghosting over assault kit.';
} else {
html = '<strong>Between 1580 Milan and 1942 Stalingrad</strong> — Soviet assault gear emerging through fading Milanese plate and buff coat.';
}
} else if (v < 1.33) {
html = '<strong>1942, Stalingrad</strong> — Soviet SN-42 steel breastplate (2 mm, chest-only) over khaki gymnastyorka; SSh-40 steel helmet with red star; PPSh-41 submachine gun with drum magazine.';
} else if (v < 1.66) {
if (v < 1.5) {
html = '<strong>Between 1942 Stalingrad and 2087 Geneva</strong> — Soviet steel blending into articulated ceramic-composite plate; helmet visor materialising over the SSh-40.';
} else {
html = '<strong>Between 1942 Stalingrad and 2087 Geneva</strong> — Future exoskeletal armour emerging from assault kit; kinetic carbine replacing the drum-fed submachine gun.';
}
} else {
html = '<strong>2087, Geneva</strong> — Rigid exoskeletal plate carrier of ceramic-composite and titanium alloy; integrated ballistic helmet with transparent visor; synthetic undersuit; magnetic-accelerator carbine.';
}
label.innerHTML = html;
}
slider.addEventListener('input', update);
update();
})();
</script>
</body>
</html>
The 2087 Geneva kit is the shakiest because it is speculative. The anachronism I was most tempted by was a powered hydraulic exoskeleton with glowing energy weapons and an opaque sci-fi mask; I rejected both. Instead the figure wears passive rigid plates with visible seams and strap attachments, and carries a carbine with a physical stock and barrel, so the lineage from 1580 plate harness → 1942 steel breastplate → 2087 composite plate remains readable. I also kept the transparent visor rather than a full opaque faceplate, so the head attachment point stays visible and the figure does not become a costume. If I had more space I would have added articulated knee plates to complete the descent from tassets, but the thigh plates and shoulder articulation already carry the genealogy clearly.