用拇指打即时战略

即时战略是最明显为鼠标而生的品类。框选是拖拽，攻击移动是一个键盘字母，排队下令靠 Shift，而右键几乎就是全部指令语汇：移到这里、攻击那个、进入这个。拿走鼠标，你拿走的不只是硬件，而是整套界面。

常见的应对是模拟：虚拟触控板、屏幕上的光标、悬浮的右键按钮。这类方案永远别扭，因为手指不是一只糟糕的鼠标。它是另一种设备，有另一套属性，因此值得另一套指令模型。

下面是《钢铁浪潮》采用的那一套，以及每一处为什么长成这样。

手指到底做不到什么

四条约束，所有触屏决定都由此推导而来：

没有第二个按键。 选择和下令必须共用同一个手势。
没有悬停。 鼠标靠悬停解释的一切，要么换个方式解释，要么干脆不需要解释。
没有修饰键。 Shift 排队、Ctrl 编组、拖拽框选，全都失去了触发方式。
手指会挡住它触摸的位置。 你看不见自己正按着的那一格，这会悄无声息地破坏一切「抬起即确认」的操作。

替换，而不是模拟

核心模型是：点击表示「显而易见的那件事」，而什么算显而易见，取决于当前选中了什么。

手势	结果
点自己的单位	选中它；再点一次选中屏幕上所有同类单位
已有选中时点地图	移动、攻击或交互——由目标本身决定
未选中任何东西时点敌人	查看它
长按（420 毫秒）	向该点攻击移动
单指拖动	平移镜头
双指	捏合缩放，拖动平移
小地图点击或拖动	镜头跳转到那里
小地图长按	命令当前选中的部队前往

这一套覆盖了一局里绝大部分操作，而且一个按钮都不需要。「再点一次选中同类」取代了鼠标的双击，多数时候还顺带完成了框选的活儿——这正是它值得占用一个手势的原因。

少数仍然需要按钮的东西

只能靠修饰键完成的动作，被安排到右下角的一排可锁定按钮里——而这排按钮只收留那些无处安放的功能：

⊘ 清除选择。触屏没有 Esc 键，而只要还选中着单位，每一次点地图都是一道命令。没有它，你就无法停止下令、单纯看看地图。
▣ 把拖拽从平移切换为框选。它是粘滞的，因此连续框选几次很省事。
⇧ 代替按住 Shift：排队下令、追加选择。
⚑ 选中你所有的机动单位。
✓ / ✕ 确认或取消建筑放置，只在放置时出现。

而命令本身——攻击移动、停止、原地警戒、卸载、出售、升级——刻意留在桌面端所在的指令卡里。在任何设备上，找命令都应该只有一个地方。一排什么都往里塞的按钮，等于一排没人看的按钮。

放置建筑刻意分成两步

用鼠标时，点一下地块就放好了。在手机上，你的手指正压在那一格上，抬起即确认等于盲放。

所以放置流程是：拖动或点击来瞄准虚影，再用 ✓ 确认——不想跑去按按钮的玩家，也可以再点一次已瞄准的地块来落定。这只是多了一个动作，而它决定了你是「放下一座工厂」还是「在你大概想放的位置附近放下一座工厂」。

界面是折叠，不是缩小

把桌面布局等比缩小，得到的是一个正确但无法使用的布局。手机 HUD 必须重新组织。

侧边栏保留，因为 RTS 需要一个常驻的建造菜单。当视口高度低于 640 像素时，它分成两个带标签页的页面——地图（资源、电力、小地图）和指令（目标、当前选择、建造与操作卡、活动日志）——选中东西时会自动切到指令页，因为那正是你选中它的原因。建造网格降为两列，让更宽的格子买到更大的目标，而不是更多的目标。时钟被去掉，好让菜单、暂停和速度始终共用一行。活动信息流从侧边栏搬走，变成压在地图上的带阴影文字，这样窄栏就不必为它让位。

侧边栏宽度由一个变量控制，折叠开关也挂在它上面，因此一个断点只要改一个数字就能同时改变两者。

还有两个只有在真机上才会暴露的细节：提示气泡必须完全忽略触摸指针，因为一次点击同时会触发鼠标兼容事件，而由手指唤起的气泡没有「移开」可以让它消失。另外，触摸设备上画布的后备存储最高按 CSS 像素的两倍运行，这样像素美术才不会被 3 倍屏重采样成一团糊。

装得上，而且能离线用

因为整个东西就是一个 Web 应用，添加到主屏就是安装。它会全屏启动，没有浏览器界面，画面延伸到刘海之下，而 HUD 会用安全区把自己撑回来。

Service Worker 预缓存外壳——首页、脚本、样式、图标、字体——并按指纹标记版本，因此新旧构建绝不会混在一起。精灵与音乐有几十兆，所以按使用惰性缓存，而不是在菜单出现之前先下完。任何必须由独立服务器实时回答的请求，则一律不缓存。

结果是一款货真价实的 RTS：可以从一条链接装到手机上，在飞机上离线打 AI，之后再用同一个网址在桌面端接着玩。

还缺什么

竖屏目前只有一个「请旋转」提示，而不是一套布局——RTS 需要横向空间，而竖屏 HUD 会是另一套设计，不是同一套转个方向。原生打包是另一件待办：素材应该随应用一起分发，而不是走媒体缓存，这也能顺带消除首次运行对网络的依赖。

除此之外都已经就位。用手机打开它，看看「点击加长按」这套模型能带你走多远。