你在天元旁落下一子,正准备看对手能否接住这条活三。棋子先放大、缩小,再弹到交点;整张棋盘跟着轻轻一晃。等画面停稳,你得重新找刚才落下的位置,也得确认现在轮到谁。若关闭这些动作,落子该怎样被看见?
先把落子和落子的动画分开
点下一个空交点后,界面要处理的是一次落子状态变化:确认这一手有效,在选定位置显示棋子,并更新下一回合。棋子从大到小的缩放、到位后的弹跳、棋盘随之移动,都是呈现这次变化的方法。设计减动反馈时,可以先把这两层分别写出来,再决定哪些画面动作值得保留。
设想你在一条横向棋形的末端补上一子。减动模式下,新棋子可以直接出现在那个交点,周围网格保持原位;落子一经确认,它就留在那里,供你沿线检查两端。若这一手无效,界面也应保持原有棋局,不用一次弹回原处的动画来解释未落子。这样,每次触碰之后都有可核对的结果。
这也提醒设计者留意动作发生的时刻。手指尚未离开棋盘时,交点上的临时预览可以帮助瞄准;确认之后,正式棋子的位置必须清楚。关闭缩放和弹跳,不能顺手删去正式落子的显示,更不能让回合停在上一手。减动改变的是过渡过程,棋局仍按已确认的着手继续。
WCAG 2.3.3 说的是哪一类运动
WCAG 2.3.3「交互引发的动画」是一项 Level AAA 成功准则:由交互触发的运动动画应能关闭,除非该动画对功能或所传达的信息不可或缺。落子后棋子放大再缩回、棋盘晃动,都适合按这一条件审视。这里说的是一项特定级别的准则,不能据此宣称所有产品都必须采用同一种减动模式。
该解释文件把运动动画描述为在不同状态之间加入步骤,造成移动或平滑过渡的感觉;元素出现时改变大小或移动位置,属于例子,直接出现则不属于这种动画。对五子棋来说,新棋子出现在已落子的交点,是信息本身的呈现;让它从别处飞入,或让整张棋盘为它让位,才是需要另外评估的过渡。
「不可或缺」也不宜凭习惯判定。如果去掉某段运动,落点、棋形和回合仍能通过静止状态表达,就有理由尝试关闭它。反过来,减动并不要求把棋盘定格在上一回合:对手落子后,棋盘上仍要出现对手的新棋子,你才有当前局面可看。应用到棋盘的这些取舍,是本文的设计提案,并非准则列出的五子棋规则。
让最后一手留下可查的痕迹
动画有时承担一个实际任务:告诉你刚才改变了哪里。取消落子时的缩放后,可以让最后一手保留一个细小、稳定的圆环标记;它贴着棋子,不沿棋盘游走,也不在数秒后突然消失。你从对手的防守点把视线移回自己的活三时,仍能定位刚才那一手。标记应保持克制,避免盖住相邻交点。
最后一手的标记只回答「刚才落在何处」。当前轮到谁,应在回合区域明确更新;双方已经下出的棋子,则持续留在棋盘上。三种信息各有位置,测试时也能分别检查。假如圆环因下一手到来而移到新棋子旁,旧棋子仍留在原交点;变化的是最后一手的指向,棋局没有被撤销。
棋子停在交点,回合继续向前。
还要考虑你隔了片刻才回来看棋盘的情形。短促的落子效果早已结束,持续的棋面和回合文字却仍可供核对。小圆环只是这个方案中的一种做法:如果布局过密,它可以改用靠近棋盘、保持静止的末手提示。选择哪一种,都应拿真实棋局的拥挤位置试读,确认它没有遮住你要看的交点。
系统偏好需要界面主动响应
系统里的「减少动态效果」是一项偏好信号,打开它不会自动替每个网站或应用删掉动画。界面需要主动读取并响应,使用者的选择才会反映到落子反馈中。对网页的 CSS 运动,W3C 的C39 技术说明给出了利用 prefers-reduced-motion 查询抑制运动的例子;C39 是说明性技术,属于满足准则的可行方法之一,并非规范要求的唯一实现。
把这一方法用于数字棋盘,可以先从明确的一组效果入手:减动偏好开启时,落子不缩放、不弹跳,棋盘不因落子平移或摇晃。静止的棋子、末手位置与回合更新照常呈现。若界面还提供自己的运动选项,选项名称也要让人看出它控制的是附加动效;具体如何与系统偏好配合,应在该界面中说明并验证。
C39 还给出一种检查思路:找出每个由交互触发运动的元素,开启系统减动设置,再确认运动是否确属必要,或已被抑制。对棋盘,检查范围不应只到新棋子为止。点击落点、对手着手、回合交接以及重新查看棋局,都可能露出遗漏的棋盘位移;逐项操作比只盯着一次漂亮的落子更容易发现问题。
逐个问清动画承担了什么工作
设计稿里的一次落子,可能叠着几段动作:棋子从指尖附近滑向交点,抵达时放大回弹,棋盘轻微缩放,回合提示再滑入。逐段询问它提供了哪项信息,会比笼统地说「动画很有反馈」更有用。落点可以由棋子最终所在的交点说明;下一手属于谁,可以由更新后的回合文字说明。若仍想保留某段运动,就需要解释静止状态为何无法完成同一件事。
也要看这些动作连在一起的效果。单看一颗棋子的轻微缩放,可能很难察觉负担;连续几手都伴随棋盘位移,视线便要反复找回原来的网格。为减动模式做检查时,可以连续走几手,再停在一处双三附近回看。棋盘坐标是否稳定、每颗棋子是否留在已确认的交点、回合是否按顺序变化,都比动作看起来是否精致更具体。
用下一手检验这套反馈
可以拿一局进行小测试。先开启系统减少动态效果,并确认所测试的棋盘界面确实响应该偏好;选择一个你能记住的空交点,放下一颗棋子。观察棋子是否直接留在所选位置,棋盘是否保持稳定,末手提示是否可查,再看回合显示有没有交给对方。若界面另有运动选项,也分别试一次,记录实际被关闭的效果。
随后看对方落子,再回头检查自己的上一手,想好接下来要守住哪一端。最后核对棋盘上的最终位置和当前回合:两手棋应各在确认过的交点,轮次应与已走的步数相符。若某颗棋子只能靠回忆弹跳方向才能找到,或关闭动画后回合提示没有更新,这套减动反馈还需要修改。