feat: version campaigns and document original puzzle design

Restore v0.1 and v0.2 archives with separate progress, publish the curved v0.3 campaign, and document the original 24-level design with reproducible evidence. Refine board presentation and movement, and keep video lab tooling within its own directory.
This commit is contained in:
cabinw
2026-09-09 13:17:30 +08:00
parent 70b021d4cc
commit e92cccba82
52 changed files with 76449 additions and 15076 deletions
+3 -3
View File
@@ -1,15 +1,15 @@
<!doctype html>
<html lang="zh-CN">
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>HEX TRAILS · 色彩与离场设计</title><link rel="stylesheet" href="design/showcase.css"></head>
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>HEX TRAILS · 色彩与离场设计</title><link rel="stylesheet" href="design/showcase.css"><link rel="stylesheet" href="design/notifications.css"></head>
<body>
<header class="masthead"><a href="index.html">HEX TRAILS<span>转转六角</span></a><span>ART DIRECTION / 02</span><a class="game-link" id="game-link" href="index.html">进入游戏 ↗</a></header>
<main>
<section class="intro"><div><div class="eyebrow">COLORFUL WORLDS. FOCUSED PLAY.</div><h1>每一关,<br>都有自己的颜色。</h1><p>12 种棋子色彩,5 套关卡氛围。<br>同一棋盘,对照 4、7、9、12 色。</p></div><div class="intro-note"><span>01 / COLOR SYSTEM</span><p>选择下方主题,比较同一棋盘的不同配色。</p><div class="theme-tabs" id="theme-tabs" aria-label="关卡主题"></div></div></section>
<section class="density-section"><div class="section-heading"><div><div class="eyebrow">COLOR DENSITY STUDY</div><h2>七色,会不会更好玩?</h2></div><p>点击任一棋盘,在下方体验对应色数;布局保持一致。</p></div><div class="density-grid" id="density-grid"></div></section>
<div class="board-size-control"><label>棋盘规模 <select id="board-size"><option value="regular">常规对照</option><option value="5" selected>边长 6 · 91 格 · 42 枚棋子</option><option value="6">边长 7 · 127 格 · 60 枚棋子</option></select></label><span>双指缩放 · 放大后拖动 · 电脑可用 Ctrl/Command + 滚轮</span></div>
<div class="board-size-control"><label>棋盘规模 <select id="board-size"><option value="regular">弯曲小盘 · 12 枚棋子</option><option value="5" selected>边长 6 · 91 格 · 24 枚棋子</option><option value="6">边长 7 · 127 格 · 32 枚棋子</option></select></label><span>双指缩放 · 放大后拖动 · 电脑可用 Ctrl/Command + 滚轮</span></div>
<section class="studio" aria-label="主题和动效互动展示">
<div class="theme-story"><div class="eyebrow" id="scene-label"></div><h2 id="scene-name"></h2><p id="scene-description"></p><div class="color-spec"><span>环境色</span><b id="background-value"></b><i id="background-chip"></i></div><div class="palette-title">本关棋子 <span id="palette-count"></span></div><div class="local-palette" id="local-palette"></div><p class="small-note">颜色只表达个性,不改变路线或碰撞规则。<br>难度同时保留文字标识。</p><a id="play-theme" href="index.html">用这套主题玩一关 ↗</a></div>
<div class="phone" id="phone"><div class="phone-top"><button class="icon-button" id="reset" aria-label="选择关卡" data-icon="grid"></button><div><strong>LEVEL 01</strong><span id="phone-label"></span></div><button class="icon-button" id="next-theme" aria-label="设置" data-icon="gear"></button></div><div class="moves"><span>剩余步数</span><strong id="moves">11</strong></div><canvas id="preview" aria-label="可点击棋子的真实规则演示棋盘"></canvas><div class="phone-status" id="phone-status" aria-live="polite">点击棋子,沿轨道出发</div><div class="rotations"><button id="left"><span data-icon="left"></span><b>左转</b></button><button id="right"><span data-icon="right"></span><b>右转</b></button></div><div class="phone-tools"><button id="undo"><span data-icon="undo"></span><b>撤销</b></button><button id="restart"><span data-icon="restart"></span><b>重来</b></button><button id="hint"><span data-icon="bulb"></span><b>提示</b></button></div></div>
<div class="phone" id="phone"><div class="phone-top"><button class="icon-button" id="reset" aria-label="选择关卡" data-icon="grid"></button><div><strong>LEVEL 01</strong><span id="phone-label"></span></div><button class="icon-button" id="next-theme" aria-label="设置" data-icon="gear"></button></div><div class="moves"><span>剩余步数</span><strong id="moves">11</strong></div><div class="notice-slot"><div class="game-notice visible" id="phone-status" role="status" aria-live="polite" aria-atomic="true">点击棋子,沿轨道出发</div></div><canvas id="preview" aria-label="可点击棋子的真实规则演示棋盘"></canvas><div class="rotations"><button id="left"><span data-icon="left"></span><b>左转</b></button><button id="right"><span data-icon="right"></span><b>右转</b></button></div><div class="phone-tools"><button id="undo"><span data-icon="undo"></span><b>撤销</b></button><button id="restart"><span data-icon="restart"></span><b>重来</b></button><button id="hint"><span data-icon="bulb"></span><b>提示</b></button></div></div>
<div class="motion-story"><div class="eyebrow">02 / EXIT CHOREOGRAPHY</div><h2>离开,也有回响。</h2><p>沿轨道出发,冲出边缘。<br>短尾迹跟随,同色六角碎片轻轻散开。</p><ol><li><b>01</b><div><strong>沿轨道滑行</strong><span>保留完整路线,读得懂运动。</span></div></li><li><b>02</b><div><strong>出口收束</strong><span>在棋盘边缘缩小,留下短尾迹。</span></div></li><li><b>03</b><div><strong>六角余韵</strong><span>6 枚同色碎片,向外展开后消失。</span></div></li></ol><button class="demo-button" id="demo">播放离场效果 <span>↗</span></button><label class="slow"><input type="checkbox" id="slow"> 慢速观察 ×0.4</label><p class="motion-status" id="motion-status" aria-live="polite">可反复播放,也可直接操作棋盘。</p><p class="small-note">系统开启减少动态效果时,关闭尾迹和碎片。</p></div>
</section>
<section class="theme-collection"><div class="section-heading"><div><div class="eyebrow">03 / ONE JOURNEY, FIVE MOODS</div><h2>从浅湾,到午夜。</h2></div><p>主线按难度自动匹配 · 每周挑战拥有独立主题</p></div><div class="theme-grid" id="theme-grid"></div><p class="collection-note">每周挑战展示为美术主题预览;这里的棋盘使用现有主线关卡。</p></section>