この記事は、Trick-taking games Advent Calendar 2023の21日目の記事です。また公開が1日遅れてしまいました。

　トリックテイキングゲームを自作するとき、UI設計・実装の重要事だと私が思うポイントを書きます。
　カードゲーム一般に適用できる技術にも触れますが、ルールによって性質が異なる場合もあるので、今回はトリックテイキングを前提にします。カードゲームのジャンルが異なる場合は適宜差分をとってください。
　視点は制作者半分、プレイヤー半分です。私はゲームデザインを趣味で考えて作る人で、同人歴は8年、作品数は確か35個前後です。グラフィックソフトはGIMP、イラレ、インデザは素人の初級レベルで触っていて、カードゲームの完全自作入稿も経験があります。ただし絵は全然うまくなく、今回も立場としては発注側に寄っています。絵の技術がある方からは不遜に見えるでしょうが、必要と感じることは自分で書くしかないので、僭越を承知で書きますことをご寛恕ください。

その前に言い訳

　元々この記事を書くにあたっては、実例を多く挙げながら良い点や改善のポイントを見ていこうと思っていました。
　が、自論の足しにするために他の作品をあれこれ論うのは、書きながらさすがに抵抗を強く感じました。それをするには個々の実作についてある程度深く検討しなくては公正性を欠きます。プロの作品ならばまだ批評の対象となりますが、特に国内同人をとりあげる場合、アマチュアの趣味の作品について瑕疵ばかりを言うのは適当でありません。今回は丁寧に作品分析をする時間もないため、若干の言及はしますが全体としては一般論にとどめることにしました。

　（それと、とにかくトピックに比して時間が足りず、記述が不十分です。見通しが甘かったです。参考画像や例をあとで追記するかもしれません）

　以下に項目を書き連ねていきますが、これを全部守れるかというと実際は難しいです。作品によってルールやテーマ、ほか様々な制約があるからです。相反する項目もあります。実作ではこの中から優先順位をつけて拾ったり捨てたりしていきます。ただ、ある事項を「捨てる」場合でも、なぜ捨てるのか、なぜ優先順位が低いのか、それを説明できることは必要だと私は考えます。理由のないことはしない、逆に言うとすることにはすべからく必然性や理由があるべきです。以下はすべて私の個人的な意見です。

ランクとスート

　トリックテイキングは、カードをテーブル上にプレイして全員が確認するゲームです。したがってランクとスート、特にカード四隅のインデックスが遠くからでも見やすいことがまず必須です。ランクの数字・文字やスート記号が十分に大きいこと、スートが色であれば十分な面積があること、ランクやスートが互いに区別しやすいこと、まずはこれを担保します。

　ランク表記は、サンセリフ系である程度幅のあるものを選ぶのが無難です。もちろんセリフ系でも視認性がよければ使えます。ただし、一部のセリフ系フォントは線が細く、読み取りに苦慮するケースがあります（これは一度拙作でも失敗して批判を頂戴しました）。加えて背景色とのコントラストをつける、そのために文字に縁取りをしたり周りに枠を設けたりする、といった工夫も必要です。ディスプレイ上での印象と印刷したカードでの見た目とは異なります。プレイされる部屋の照明も明るいとは限りませんから、極力印刷したものを照明に当てての確認もするほうがよいと個人的には考えます。

　サンセリフ系で注意したいのは、文字の曲線を巻き込んで閉じたフォントが中にはあること、線が太すぎる場合があることです。
　前者については、小林章・田代眞理『英文サインのデザイン』のpp. 125-134に参考となる内容があります。それによると、19世紀から20世紀前半のサンセリフ体は、例えばCやSの曲線を閉じているのが一般的で、20世紀後半から「ヒューマニスト・サンセリフ体」と呼ばれる、曲線を巻き込みすぎず開いたフォントが出てきます。前者の代表としてはHelvetica、後者の代表としてはFrutiger（またはNeue Frutiger）が挙げられており、FrutigerはHelveticaに比べて文字の空間が開いており、より視認性が高まっています。近年は空港などの看板でFrutigerがよく使われるそうです。この本ではアルファベットが主な例になっていますが、数字も同様です。
　文字は空間を広くとるほうが視認しやすいです。これは後者の「線が太すぎる」にも通じることで、線が太いと文字の中の空間が狭まってしまうため、どうしても視認性が下がるのです。例として、私はiPhoneを使っており、TwitterでRTやいいねの数字はiPhoneのデフォルトフォントで表示されます。この数字はフォントサイズが小さく線が細いにもかかわらず、読みを間違えたり迷ったりすることはまずありません。「7」の形などは極めてシンプルで、「2」「3」も広めに開いているのがわかります。線は細すぎてもテーブル上で判読できないのは上に書いた通りですが、それでもこうしたフォントの使い方は参考になると思います。
　細すぎると見えない、太すぎるとどの数字かわからない。悩ましいです。私も試行錯誤しています。

　スートについては、色や絵は他スートとはっきり違いを出すほうが望ましいです。テーマ上全体に暗い色調を採用したいケースも当然あるものの、そのせいでプレイ時にスートが見づらくなっては本末転倒です。暗い色調は照明の加減で特に沈みがちです。トランプもスート記号でスペードとクラブ、ハートとダイヤを区別しますからスート記号はもちろん使いますが、トランプのように黒と赤で差をはっきり出す、同色の記号は明確に異なるものにする、スート記号は補助的なものと考えて色の差をまずはしっかりつける（ラミーゲームですが『チケット・トゥ・ライド』のカードがそうで、色の差を明瞭にしています）、などはできると思います。
　さらに、スートを色に頼る場合は色覚対応もできるだけ考慮します。P型・D型・T型それぞれで混同してしまうことはないか、混同するときはスート記号が明確か、スマホアプリ等のシミュレータを使ってチェックします。ゲームによっては完全に対応できない場合もありますが、やむを得ずそうするのであって、理由なく対応しないのはよくありません。

インデックスの位置

　次に、手札を扇形に持つゲームですから、手に持ったときの情報もわかりやすくする必要があります。手札枚数はトランプ4人戦配りきりの13枚を基準に考えておけば十分でしょう。実際は10枚やそれ未満に収まることも多いので、インデックスをトランプよりも少し大きめにとることも可能だと思います。10～13枚を広げたときに、カードの肩（隅）だけ見れば情報がすべて確認できるのが理想です。

　情報が多い場合、主要な情報をカードの四隅に載せ、副次的な情報はカードの辺や中央などに載せるという対応をします。ランクとスートはもちろん、ポイントテイキングではカード点も「主要な情報」のカテゴリに入ります。カード点を見ながらプレイ方針を立てるからです。したがって、カード点は四隅に載せるべき情報として扱います。ラウタペリ版の『ボトルインプ』はカード点が上辺にありますが、あのゲームは確かにカード点よりもランクの方を気にするのと、ポイント表記が四隅だと煩くなるので、ぎりぎりやむを得ないかなと思っています。
　カードアートは、販売時や購入後にカードを広げたときには強い印象を与えますから重要ですが、プレイ時に見えるのはカードの肩だけです。中央はもちろん、左辺／右辺や上辺ですら半分以上は隠れます。カード中央や下部の情報は、特にトリックテイキングでは視認の優先度が弱くなるため、ランクやスートの情報をそこだけに頼るのは危ういことがあります。
　ボードゲーム・カードゲームは数字やスートの遊びですから、ゲーム中に意識が行くのは数字やスートの《情報》です。その情報を見やすく整理し、プレイ中に意識が散らないよう提示するのは、アートの美しさよりもゲームにとって重要なことです。アートとグラフィックは別の事柄であり、ゲームにおいてグラフィックはアートに原則優先する、私はそう考えています。

　上で「カードの四隅」と書いたのには理由があります。
　まず、トランプは左肩にだけインデックスがあるタイプが今も主流ですが、左利きの人が右手に札を持ったときにインデックスが見えなくなる欠点があります。これは悪い慣習です。オリジナルカードを作るときにトランプの慣習を踏襲する必要はなく、両肩に載せるほうがユニバーサルデザインとして良いはずです。実際に最近は4インデックスのトランプもあります。トランプやウノがインデックスを両肩につけていないことは、自作でつけない理由にはなりません。
　また、右肩にランクを小さく、スートを省略して載せるケースも散見します。これはおそらくアート的な見た目を重視しての実装だと想像するのですが、ゲームは見るものでなく遊ぶものです。多くの人がプレイしやすいことをより重視すべきであり、見た目の綺麗さをプレイアビリティよりも優先すべきではありません。左利きが右利きよりも少ないからといって、右肩のインデックスの情報を左肩のそれよりも減らす合理的な理由は、どこにもありません。私は右利きですが私の5歳の子供が左利きなので余計にこれは気になります。カードの持ち方をどうやって教えるのがいいか今から非常に悩んでおり、この悩みが早くなくなってほしいです。

　もうひとつ、天地両方にインデックスを付けるのも私は必須だと思っています。トリックテイキングはカードを各プレイヤーが別々の方向からプレイし、それをトリック解決後ただちに集めて裏向きに束ねます。この操作を頻繁に行う以上、カードの天地がバラバラになるのは避けられません。ジャンル上の特性として理解する必要があります。
　複数ディールを行うのが通例ですから、手札の並び替えも複数回発生します。カードが正位置しか想定しておらずインデックスが逆位置にないと、13枚を何度も正位置に並べ替える必要が出てきます。これは極めてナンセンスです。テーブルで対面の位置から出されたカードもランクが読みづらくなり、プレイング上のメリットがありません。逆位置では6と9が反転しますから、6の下に線やドットをつけて区別させるのが一般的です。あるいはゲームルール側からの対応として「9」を抜いてもよいでしょう。
　やむを得ず正位置を強制する必要があるのは、カード情報が多い場合です。ランクとスートだけでなくカード点やテキストがあり、四隅に情報を載せるとカードがごちゃごちゃするときは、正位置だけにしてカードを見やすくするしかないでしょう。あるいは、カードのリシャッフルがそれほど発生しないゲームであれば、手札の並べ替え回数も減るので問題はさほどなくなります。『ロボトリック』は後者の例で、正位置にしかランクとスートがないのですが、ダミーを毎回作ってから考える時間が長く、1ディールが重いのでそこまで気になりません。アートと視認性との妥協点をうまく探っていると感じます。
　TCGは正位置前提でデザインされるのが一般的ですが、あれは第一に情報量が多いからで、かつ自分でデッキを作り、プレイ中も捨て札をすべて正位置に置きやすいため、そもそも逆位置になりにくいからです。手札のドローや入れ替え回数が少なければ正位置を強制していいのです。トリックテイキングは、そういうジャンルではありません。

文字揃え、カードの縁や裏面

　ランクとスートの位置を中央揃え（ゲームによっては左右揃え）にするアライメントや、フォントの統一性、テーマと違和感のないフォントを選ぶこと、等はトリックテイキングに限らず大切です。（ごくたまにプロの作品なのにアライメントがずれている例も見かけて、プレイ中引っ掛かりを覚えます。絶対にレビューで指摘しましょう。）最後のテーマに応じたフォント選択というのは、例えばボードゲームで古代ギリシアやローマをテーマにするときTrajan系フォントを真っ先に候補にあげるといったことです。

　カード縁はインクが剥がれるのを防ぐため原則白にします。裏面は細かい模様のパターンにして透けや色ムラやガン付きを防ぎ、かつ正位置と逆位置とが混ざっても見分けがつかないようにします（たまに上下の向きで手札内容が割れることがあるのです）。どちらも例外はあり、カード縁を塗るケースは割とありますが、他の手段で回避できるなら回避すべきです。特にカード縁がカードによって異なると、ランクやスートなどの情報が手札の裏面から見えるリスクがあり、避けるほうがよいと私は思います。

これは誰が気にすべきか

　グラフィッカーだけの問題ではありません。どちらかというと、発注者がゲームの知識を持っておくべきです。
　グラフィッカーの方が、必ずしもボードゲームやトリックテイキングに詳しいとは限りません。ゲームのカードは遊び慣れていないと勘所がわからない特殊な分野で、遊んだ経験があっても実際作ると苦労します。ボードゲームをご自身で遊ぶグラフィッカーさんも多くいらっしゃいますが、そうした方にもそれぞれ得意不得意があります。グラフィッカーさん自身の得意分野の認識と、実際に評価されている面が必ずしも一致しないケースもあります。悪い点を指摘すべきという意味ではなく、発注するときにどの点を好きでお願いするのかを発注者が自覚すべき、という意味だとご理解ください。
　グラフィックデザインを依頼する側としては、グラフィッカーの方のほうが絵に詳しいからお任せしたくなります。私もそうです。それでも、実際のプレイや最後のプロダクトに責任を負うのは発注者であり、であればそのグラフィックのプレイ体験がどうであるかは、主体的に引き受けて考えるべき事柄です。書いていて胃が痛くなりますが、作る以上は発注者である私が自分でUIテストを行って確認するのは必須です。自分のゲームをどうプレイするかを一番知っているのは作者です。今回のゲームはどんな性質を持っているか？　手札枚数は？　シャッフル回数は？　プレイ時間は？　情報の重要性は？　テストプレイ中引っ掛かりはなかったか？　そうしたことを、ルール／メカニクスの側からまず整理し導きだす。ですからトリックテイキングというジャンルの特性を理解すること、各ゲームのプレイ体験を分解することが制作には欠かせません。

　上に挙げたのはその視点の例です。網羅的でも完全でもありません。新しいゲームを作ると毎回新しい課題が出てくるからです。あなたにとって役立つ点だけを指針の足しにしてください。