cabinwandClaude Fable 5.1
e447d1f807
- 07 macaron, referenced from Meowdoku: cream worlds, a white tray with gutters, candy tokens with white arrows, two-column 关卡/待解 HUD, white elevated tool discs (macaron-only exception to the flat rule), full-screen dark result overlay, a brick ripple on board clear, an eased glide-out and dot-lattice dissolve on exit; Resource Han Rounded subset fonts (SIL OFL) in assets/fonts with the charset and regeneration note - 06 signpost: the design.md, tokens and preview directory that earlier commits left untracked - design docs, catalog, manifest, showcase and base spec updated to seven directions; the analysis and proposal live in docs/art-proposal-macaron.html - the renderer, app, geometry and CSS sources for both directions were already carried by the level commits made from this working tree Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
1 line
9.0 KiB
HTML
1 line
9.0 KiB
HTML
<!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="../../showcase.css"><link rel="stylesheet" href="../../art-directions.css"><link rel="stylesheet" href="../../game-tools.css"></head><body class="sheet-page" data-design="macaron" style="--paper:#FBF6F0;--accent:#E07416;--bg:#F5EFE7"><main class="sheet-main"><nav class="sheet-nav"><a href="../../index.html">← 设计总览</a><span>第 07 套 / 共 7 套</span><a href="../../../design-showcase.html?design=macaron">试玩与审核 ↗</a></nav><nav class="sheet-family-nav" aria-label="切换设计方案"><a href="../calm/index.html">01 · 柔和原色</a><a href="../vivid/index.html">02 · 高彩游乐场</a><a href="../toy/index.html">03 · 积木轨道屋</a><a href="../animals/index.html">04 · 动物弯弯镇</a><a href="../paper/index.html">05 · 轻线纸境</a><a href="../signpost/index.html">06 · 路标</a><a href="../macaron/index.html" aria-current="page">07 · 马卡龙</a></nav><div class="sheet-agent-links"><a href="design.md">Agent 设计规范 · design.md ↗</a><a href="tokens.json">配色数据 · JSON ↗</a></div><header class="sheet-hero"><div><span class="eyebrow">MACARON</span><h1>马卡龙</h1><p>奶油色世界上托一张白色软托盘，六角格像带白缝的软糖砖，藕紫轨道压在糖砖上。棋子是糖果色圆角六角，白色贴纸边，粗圆头白箭头。反馈用果糖色说话：路线点亮、糖砖出场、离场撒星。</p></div><canvas id="sheet-tokens" class="sheet-token-row" width="720" height="270" aria-label="马卡龙棋子造型设计"></canvas></header><section><div class="section-heading"><div><span class="eyebrow">01 / FIVE WORLDS</span><h2>同一风格，五种主题</h2></div><p>统一的弯曲轨道关卡 · 用实际渲染检查识别度</p></div><div class="sheet-themes"><article class="sheet-theme" style="--bg:#F5EFE7;--ink:#7A5560"><small>轻松</small><h3>奶油</h3><canvas data-sheet-theme="lagoon" width="480" height="520" aria-label="轻松主题的弯曲棋盘"></canvas><div class="sheet-swatches"><i style="background:#EE5398" title="#EE5398"></i><i style="background:#578BF0" title="#578BF0"></i><i style="background:#4C9E5A" title="#4C9E5A"></i><i style="background:#AB8716" title="#AB8716"></i><i style="background:#937DE4" title="#937DE4"></i><i style="background:#E5680C" title="#E5680C"></i><i style="background:#369C94" title="#369C94"></i></div><small>#F5EFE7</small></article><article class="sheet-theme" style="--bg:#FBE6DA;--ink:#7C4E52"><small>进阶</small><h3>蜜桃</h3><canvas data-sheet-theme="apricot" width="480" height="520" aria-label="进阶主题的弯曲棋盘"></canvas><div class="sheet-swatches"><i style="background:#E5680C" title="#E5680C"></i><i style="background:#4A91D4" title="#4A91D4"></i><i style="background:#EE5398" title="#EE5398"></i><i style="background:#369C94" title="#369C94"></i><i style="background:#AB8716" title="#AB8716"></i><i style="background:#8C68CC" title="#8C68CC"></i><i style="background:#4C9E5A" title="#4C9E5A"></i></div><small>#FBE6DA</small></article><article class="sheet-theme" style="--bg:#EEE8F6;--ink:#5F4E78"><small>烧脑</small><h3>香芋</h3><canvas data-sheet-theme="lavender" width="480" height="520" aria-label="烧脑主题的弯曲棋盘"></canvas><div class="sheet-swatches"><i style="background:#937DE4" title="#937DE4"></i><i style="background:#D06E93" title="#D06E93"></i><i style="background:#369C94" title="#369C94"></i><i style="background:#AB8716" title="#AB8716"></i><i style="background:#C56AC4" title="#C56AC4"></i><i style="background:#578BF0" title="#578BF0"></i><i style="background:#4C9E5A" title="#4C9E5A"></i></div><small>#EEE8F6</small></article><article class="sheet-theme" style="--bg:#F9E2E8;--ink:#7B4658"><small>挑战</small><h3>草莓牛奶</h3><canvas data-sheet-theme="rose" width="480" height="520" aria-label="挑战主题的弯曲棋盘"></canvas><div class="sheet-swatches"><i style="background:#D06E93" title="#D06E93"></i><i style="background:#4C9E5A" title="#4C9E5A"></i><i style="background:#578BF0" title="#578BF0"></i><i style="background:#AB8716" title="#AB8716"></i><i style="background:#C56AC4" title="#C56AC4"></i><i style="background:#B5806A" title="#B5806A"></i><i style="background:#E5680C" title="#E5680C"></i></div><small>#F9E2E8</small></article><article class="sheet-theme" style="--bg:#3E2E35;--ink:#FBEFE6"><small>每周挑战</small><h3>可可夜</h3><canvas data-sheet-theme="midnight" width="480" height="520" aria-label="每周挑战主题的弯曲棋盘"></canvas><div class="sheet-swatches"><i style="background:#369C94" title="#369C94"></i><i style="background:#EE5398" title="#EE5398"></i><i style="background:#AB8716" title="#AB8716"></i><i style="background:#937DE4" title="#937DE4"></i><i style="background:#E5680C" title="#E5680C"></i><i style="background:#4A91D4" title="#4A91D4"></i><i style="background:#4C9E5A" title="#4C9E5A"></i></div><small>#3E2E35</small></article></div></section><section class="sheet-components"><div class="sheet-panel"><span class="eyebrow">02 / DESIGN LANGUAGE</span><h2>造型与交互规则</h2><ul><li>白托盘加白缝，格与格靠留白分开，不画格线</li><li>十二色统一白色粗箭头，与白缝同一套白</li><li>状态用颜色和弹跳表达：路线点亮、碰撞橘红、出场从左上角一波弹开</li><li>所有棋子保留独立方向箭头，颜色和表情不改变规则。</li><li>离场与碰撞共用游戏动画，切换设计保持路线与时长一致。</li></ul><p class="sheet-caption">这是一套可与其他方案同时保留的候选设计。到审核页勾选保留、记录修改意见；不会替换你的其他选择。</p><a class="sheet-link" href="../../../design-showcase.html?design=macaron">审核与体验这套设计 ↗</a></div><div class="sheet-panel"><span class="eyebrow">03 / COMPONENT STUDY</span><h2>控件与奖励</h2><div class="component-preview"><div class="item-samples"><div class="game-tool" data-tool="undo"><span class="item-face"><span class="item-glyph art-icon" aria-hidden="true"><img src="../../../assets/ui-icons-generated.png" alt="" style="width:577.8801843317973%;height:577.8801843317973%;left:-313.3640552995392%;top:-183.41013824884794%"></span></span><b>撤销</b></div><div class="game-tool" data-tool="restart"><span class="item-face"><span class="item-glyph art-icon" aria-hidden="true"><img src="../../../assets/ui-icons-generated.png" alt="" style="width:540.5172413793103%;height:540.5172413793103%;left:-422.4137931034483%;top:-158.6206896551724%"></span></span><b>重来</b></div><div class="game-tool" data-tool="hint"><span class="item-face"><span class="item-glyph art-icon" aria-hidden="true"><img src="../../../assets/ui-icons-generated.png" alt="" style="width:533.6170212765958%;height:533.6170212765958%;left:-18.29787234042553%;top:-286.3829787234042%"></span></span><b>提示</b></div></div><p class="item-spec">道具底座 64–68px，图标 32px，标签 13px。用独立造型、大小和功能色，与顶部导航按钮区分；纯色平面，无阴影或渐变高光。</p><div class="item-future"><span class="eyebrow">FUTURE STATES / 仅设计示意</span><h3>为次数与广告留出位置</h3><div class="item-samples"><div class="game-tool" data-tool="undo"><span class="item-face"><span class="item-glyph art-icon" aria-hidden="true"><img src="../../../assets/ui-icons-generated.png" alt="" style="width:577.8801843317973%;height:577.8801843317973%;left:-313.3640552995392%;top:-183.41013824884794%"></span><span class="item-badge" aria-label="剩余 3 次，示意">3</span></span><b>撤销</b></div><div class="game-tool" data-tool="restart"><span class="item-face"><span class="item-glyph art-icon" aria-hidden="true"><img src="../../../assets/ui-icons-generated.png" alt="" style="width:540.5172413793103%;height:540.5172413793103%;left:-422.4137931034483%;top:-158.6206896551724%"></span></span><b>重来</b></div><div class="game-tool" data-tool="hint"><span class="item-face"><span class="item-glyph art-icon" aria-hidden="true"><img src="../../../assets/ui-icons-generated.png" alt="" style="width:533.6170212765958%;height:533.6170212765958%;left:-18.29787234042553%;top:-286.3829787234042%"></span><span class="item-badge ad" aria-label="观看广告获取，示意">AD</span></span><b>提示</b></div></div><p>右上角展示剩余次数，或播放符号 + AD。无角标表示普通状态；数字和获取方式均为样式示例，当前游戏不启用。</p></div><div class="sample-modal"><div class="stars" aria-label="三颗金色星星">★ ★ ★</div><h3>漂亮，全部过关！</h3><p>每一次转弯，都找到出口。</p><a class="sheet-link" href="../../../design-showcase.html?design=macaron">继续旅程 →</a></div></div><p class="sheet-caption">底部道具独立于顶部导航。棋盘在通知与旋转区之间垂直居中；可操作棋盘在设计审核页。</p></div></section></main><script type="module" src="../../../src/direction-sheet.js"></script></body></html> |