天元のそばに一手を打ち、相手がこの活三（かつさん）にどう応じるか見ようとします。ところが石はいったん大きくなって縮み、交点へ跳ね、盤面全体もかすかに揺れます。画面が落ち着くころには、今打った場所を探し直し、次が誰の手番か確かめなくてはなりません。この動きをなくしたら、着手をどう伝えればよいでしょうか。
着手と、そのアニメーションを分けて考える
空いている交点をタップした後、画面が扱うべきなのは着手による状態の変化です。手が有効であることを確定し、選んだ場所に石を表示して、次の手番へ進めます。石の拡大・縮小や着地時の跳ね返り、盤面の移動は、その変化を見せるための方法です。動きを抑えたフィードバックを考えるなら、まず両者を書き分け、残すべき動きを検討できます。
横に並んだ石の端へ一手を加える場面を想像してください。動きを抑えた表示では、新しい石をその交点に直接出し、周囲の格子は動かさずにおけます。着手が確定すれば石はそこに残り、並びの両端を確認できます。無効な手なら盤面を元のまま保ち、石が跳ね戻るアニメーションで不成立を説明する必要はありません。タップの後に、確かめられる結果を残すことが大切です。
動きが起きるタイミングにも注意が必要です。指を盤面から離す前の仮表示は、交点を狙う助けになります。一方、確定後には正式な石の位置が明確でなくてはなりません。拡大や跳ね返りをなくす際に、石の表示まで消したり、手番を前のままにしたりしてはいけません。変えるのは移り変わりの見せ方であり、対局は確定した手に従って進みます。
WCAG 2.3.3 が対象とする動き
WCAG 2.3.3「インタラクションによるアニメーション」は、レベル AAA の達成基準です。操作によって始まる動きのアニメーションは、機能や伝える情報に不可欠な場合を除き、無効にできる必要があります。着手後に石が拡大して戻る演出や盤面の揺れも、この観点から検討できます。ただし、これは特定のレベルの達成基準であり、すべての製品に同一の動きを抑えるモードを求めるものではありません。
その解説では、動きのアニメーションを、状態と状態の間に段階を加えて、移動や滑らかな変化を感じさせるものと説明しています。要素が現れる際に大きさや位置を変えるのはその例ですが、直接現れるだけなら該当しません。五目並べでは、打った交点に新しい石が現れること自体は情報の表示です。石が別の場所から飛んできたり、盤面全体が動いたりする過程は、別途検討すべき演出です。
「不可欠かどうか」も、慣れだけで決めるべきではありません。動きを取り除いても、着手位置や石の並び、手番を静止した表示で伝えられるなら、その動きを無効にする余地があります。ただし、動きを抑えることは盤面を前の手番で止めることではありません。相手が打てば新しい石を表示し、現在の局面を見られるようにする必要があります。ここで述べる盤面への当てはめは設計提案であり、達成基準が定めた五目並べの規則ではありません。
最後の一手を、後から確かめられる形で残す
アニメーションには、どこが変わったかを知らせる役割もあります。着手時の拡大をなくす代わりに、最後の一手へ小さく安定した円環の印を付ける方法が考えられます。印は石のそばにとどまり、盤面を動き回ったり、数秒後に突然消えたりしません。相手の守りの位置から自分の活三へ視線を戻しても、直前の一手を見つけられます。隣の交点を隠さないよう、印は控えめにします。
最後の一手の印が答えるのは「直前にどこへ打ったか」だけです。現在の手番は手番表示で明確に更新し、双方が打った石は盤面に残します。3 種類の情報をそれぞれの場所で示せば、検証するときも別々に確かめられます。次の一手で円環が新しい石のそばへ移っても、前の石は元の交点に残ります。変わるのは最後の一手を指す印であり、着手が取り消されるわけではありません。
石は交点に残り、手番は先へ進みます。
少し時間を置いてから盤面を見直す場面も考えておきたいところです。短い着手演出は終わっていても、石の配置と手番の文字は引き続き確認できます。小さな円環は一案にすぎません。盤面が込み合うなら、盤の近くに動かない「最後の一手」の表示を置く方法もあります。どちらを選ぶにせよ、実際の対局で石が密集する位置を使い、見たい交点を隠さないか確かめる必要があります。
システムの設定には画面側の対応が必要です
システムの「視差効果を減らす」などの設定は、動きを抑えたいという意思を示します。ただし、有効にするだけで、すべてのウェブサイトやアプリのアニメーションが自動的に消えるわけではありません。画面側が設定を読み取り、応じて初めて、着手の表示に選択が反映されます。ウェブの CSS による動きについて、W3C のC39 の技術解説は prefers-reduced-motion を使って動きを抑える例を示しています。C39 は参考となる技術資料であり、達成基準を満たす方法の一つです。唯一必須の実装ではありません。
この方法をデジタルの盤面に当てはめるなら、まず対象を明確にできます。動きを抑える設定が有効なときは、石を拡大・縮小させず、跳ねさせず、着手に合わせて盤面をずらしたり揺らしたりしません。一方、石の表示、最後の一手の位置、手番の更新は通常どおり残します。画面独自の動きに関する設定を設けるなら、追加の演出を制御する設定だと分かる名前にします。システム設定との関係も、その画面で説明し、検証する必要があります。
C39 は検証の考え方も示しています。操作によって動く要素を一つずつ探し、システムで動きを抑える設定を有効にしたうえで、その動きが本当に必要か、あるいは抑えられているかを確かめます。盤面では、新しい石だけを見て終わりにしてはいけません。着手地点の選択、相手の着手、手番の交代、対局の見直しにも、見落とした盤面の移動が現れるかもしれません。一度の見栄えのよい着手だけでなく、操作を順に試すほうが問題を見つけやすくなります。
それぞれの動きが何を伝えるか確かめる
設計案では、1 回の着手にいくつもの動きが重なりがちです。石が指先から交点へ滑り、到着時に大きくなって跳ね返り、盤面がわずかに拡大し、手番表示も滑り込むかもしれません。「アニメーションがあると反応が分かりやすい」とひとまとめにするより、それぞれが何の情報を伝えるかを問うほうが役立ちます。着手地点は石が最終的に置かれた交点で、次の手番は更新された文字で示せます。動きを残すなら、静止した表示では同じ役割を果たせない理由を確かめます。
動きが続いたときの影響も見てください。石が少し拡大するだけなら負担に気づきにくくても、数手続けて盤面が動けば、そのたびに元の格子を探し直すことになります。動きを抑えた表示を確かめる際は、何手か続けて打ち、三三の近くで立ち止まって盤面を見直す方法があります。盤面の座標が安定しているか、石が確定した交点に残っているか、手番が順に進むか。動きの洗練度よりも、こうした点のほうが具体的に検証できます。
次の一手でフィードバックを試す
一局を使って小さく試せます。まずシステムで動きを抑える設定を有効にし、試す盤面が実際にその設定へ応じていることを確かめます。覚えやすい空の交点を選んで石を置きましょう。石が選んだ位置に直接残るか、盤面が安定しているか、最後の一手を確認できるかを見てから、手番表示が相手に切り替わったか確かめます。画面独自の動きの設定があれば、それも別に試し、実際に無効になった演出を記録します。
続いて相手の着手を見てから、自分の前の一手を確認し、次はどちらの端を守るか考えます。最後に石の位置と現在の手番を照合してください。2 つの石はそれぞれ確定した交点にあり、手番は進んだ手数と一致しているはずです。石を見つけるのに跳ねた方向を思い出す必要がある、あるいはアニメーションを切ると手番表示が更新されないなら、動きを抑えたフィードバックには修正が必要です。