2025年7月22日（水）から3日間開催されたゲーム開発者向けカンファレンス「CEDEC 2025」。本稿では、モバイルアプリ『Pokémon Trading Card Game Pocket』（公式略称「ポケポケ」）に関する講演「Pokémon TCG Pocketにおけるデジタルカード表現とその制作手法」 から、紙のカードゲームがもつ質感をスマートフォン上で再現するためのアプローチや、制作工程を紹介する。

『ポケモンカードゲーム』の魅力とモバイル版に込めたねらい

登壇したのは、クリーチャーズ アート開発部 部長の長屋 悟氏、DeNAのヴィジュアルエンジニア／テクニカルアーティスト 半田佑馬氏、グラフィクスエンジニア 山本真史氏、テクニカルアーティスト 廣田隆哉氏の4名。

『ポケポケ』は単なる『ポケモンカードゲーム』の移植ではなく、スマートフォン上でもカードの質感や手触りを感じられるよう設計されている。さらに、モバイルならではのデジタル演出を加え、新たなカードゲーム体験を提示することを目指した。本セッションでは、そのビジュアル表現や開発手法が、現場の具体的な事例とともに明かされた。

講演の冒頭で長屋氏は、「ポケモンカードゲーム」の魅力を改めて整理した。日本初の本格的なTCGとして1996年に誕生し、2025年3月時点では日本をはじめ北米・欧州など16言語で展開。累計出荷枚数は750億枚に達し、世界的な人気を確立している。

制作コンセプトは「コレクションしても楽しく、バトルして楽しい」。この方針は、原作『ポケットモンスター』シリーズがもつ魅力とも重なる。

長屋氏が特に強調したのは、カードを集める楽しさそのものだ。「ポケモンカードゲーム」は大会など対戦のイメージが強いが、まずはコレクションの魅力を前面に打ち出している。

例えばレアカードにはUV印刷やホログラムが施され、豪華なイラストで特別感を演出する。こうしたしかけによって、プレイヤーはより希少なカードを集めたくなる。

こうした『ポケモンカードゲーム』の魅力を踏まえつつ、モバイル版『ポケポケ』の開発が進められた。目指したのはTCGとしての遊びだけでなく、紙のカードに触れているかのような感覚をスマートフォン上で再現すること。

長屋氏は「本作でどれくらいデジタル要素を採り入れるかに気を使いました」とふり返っている。

レアリティに応じたパーツ構成

『ポケポケ』のカードは、紙の特徴を踏まえつつ、デジタルならではの表現を追求している。ゲーム内でも厚みをもち、裏返したり操作したりと、現実のカードに近いインタラクションが実装されている。本講演では、このカード構造を「デジタルフォーマット」と定義して解説が進められた。

デジタルフォーマットの制作フローは明確に分担されている。まず、原作を手がけるクリーチャーズがコンセプトとデザインを策定。その内容を基に、開発を担当するDeNAと実現方法を協議する。実装とフィードバックは両社が共同で行い、最終的な確認を運営元である株式会社ポケモンが担当し、完成となる。

デジタルフォーマットの構成は、カードパックから入手できるカードのレアリティに応じて変化する。基本となるのは、出現率の高いダイヤ1やダイヤ2のレアリティ、いわゆるコモンカードだ。

構成はカード要素をレイヤーとして積み重ねるかたちで設計されている。最上段にポケモンの名前やHP、わざなどの情報をまとめたUIを置き、その下にカード枠と背景を配置。最後にポケモンのイラストを加えて完成する。

レアリティが高くなるほど、この「UI → カード枠 → 背景 → イラスト」という基本構成に、ホログラムなど追加要素が重ねられる。現実のカード同様、希少なカードほど手に取るだけで特別感が伝わるように、『ポケポケ』でもその体験が再現されているというわけだ。

例えばダイヤ3のレアリティでは、基本構成にさらに装飾が加わる。カード枠にホログラムが施され、イラストレイヤーの手前にもホログラム要素が挿入されることで、レアリティを視覚的に強調する。

長屋氏は「カードの要素は盛り気味にすることが大事」と説明する。細かな装飾を重ねること自体が、カードの価値を高める重要な要素となるからだ。

ホログラムはもともと紙のカードに用いられてきた特殊加工であり、現実ならではの質感をもつ。『ポケポケ』では、その輝きをスマートフォン上でも感じられるよう工夫が凝らされている。具体的には、位相テクスチャとグラデーションテクスチャを組み合わせ、デジタル環境で疑似的に再現しているという。

さらに高レアリティとなる☆1、☆2のカードでは、デザインが一転し、カード全面にイラストが配置される。ホログラムなどの装飾もふんだんに加わり、希少性を強調するしくみだ。

長屋氏は「☆1は柔らかいデザインで、☆2は強いデザイン」と説明する。講演スライドでは、その言葉を体現する例として、☆1にイーブイの日常を描いた穏やかなカード、☆2に伝説のポケモン・ファイヤーが暗闇を滑空する禍々しいカードが紹介された。

これらのカードでは、豪華さを演出するためにホログラムを全面にあしらったレイヤーを基本構成に組み込んでいる。ただし、そのままでは反射が強く、イラストが見えにくくなってしまうため、カードが正面を向いた際には反射を消すマスクを中央に配置し、視認性を確保した。これにより、イラストの見やすさとレアリティの演出を両立させている。

より特殊な構成が見られるのはダイヤ4のレアリティだ。ここには主にバトルで活躍する高能力のカードが揃っており、「ポケモンのもつ強さや迫力を演出する」というコンセプトでデザインされている。

迫力を強調するため、ダイヤ4のカードには多くの要素が組み込まれている。ポケモン本体は3Dモデルとして独立させ、その前後をエフェクトレイヤーで挟むことでダイナミックな印象を与えている。

背景イラストには視差シェーダを用い、奥行きを表現。カードを見る角度に応じてテクスチャUVをずらす仕様とし、背景が動いて見える演出を実現した。

ダイヤ4のデザインで特に重視されたのは、ポケモン本体がカード枠を突き破るような迫力だ。その実現には主にHoudiniを用い、原作カードのイラストから3Dモデルを生成。そこからモデルを加工し、枠を飛び出すパーツを構築していった。

☆2のフルイラストカードは、ビジュアルと装飾がさらに強化されている。カード全面にポケモンを描くだけでなく、ホログラムやアウトライン加工を加え、豪華さとレアリティを際立たせたデザインが特徴だ。

そのぶんフォーマットの構成も複雑になる。基本構成に多数のエフェクトレイヤーやホログラムレイヤーを挿入し、さらにイラスト部分にもホログラム処理を施している。特にホログラムの使用量が多いため、カードを傾けた際の視差効果を重視して制作された。

より凝った装飾が施されているのが、☆2ウルトラビーストのレアリティだ。このカテゴリは「不穏さ」や「禍々しさ」をまとったポケモンをテーマとしており、その個性を際立たせるデザインが行われている。

フォーマット構成は、先に紹介した☆2フルイラストとほぼ同様だが、決定的に異なるのは最後に加えられるマーブル背景である。ウルトラビースト特有の禍々しさを表現するため、この背景には数多くの工夫が凝らされている。

マーブル背景は『ポケポケ』ならではの要素であり、紙のカードでは困難なデジタル表現を追求したものだ。

一見すると単純に見えるが、自然に変化しているように見せるため、多くのアニメーション手法が試された。制作時には「カードを傾けるとマーブル模様が変化し続け、正面に戻すと元の見た目に戻る」という制約を設け、その条件を満たす方法を検討した。

当初はフローマップやUVスクロールといった一般的なテクスチャアニメーションを試したものの、模様が破綻するため不採用となった。そこで改めてマーブル模様の成り立ちを分析。インクが流れ込み領域が広がる、領域同士がつながったり押し合ったりするといった特性に着目し、最終的にセルラーノイズを利用したシェーダ実装へと行き着いた。

セルラーノイズとは、ランダムに配置された点との距離に基づいて生成されるノイズである。これを応用したシェーダでは、各ピクセルについて最も近いポイントとの距離を算出し、その値を基にテクスチャの色を決定するしくみを組み込んでいる。

さらに、ポイントに影響度をもたせるマーブルシェーダも導入された。これは複数のポイントとの距離と影響度を基にテクスチャの色を決定するしくみであり、先のセルラーノイズシェーダと組み合わせてテクスチャリングすることで、マーブル模様を生成している。

模様の歪みは、カードを傾けた際にセルラーノイズシェーダのポイント位置や影響度を変化させることで実現。また、バネと粘性を利用したPD制御をベースに、反応に遅延をもたせる処理を加えることで、より自然な動きを表現している。

最後に解説されたのは『ポケポケ』独自の仕様である「色ちがい1」「色ちがい2」のレアリティだ。ここで重視されたのは、ポケモンの体色のちがいが明確にわかること、そして誰が見ても印象的で理解しやすい表現に仕上げることだった。

色ちがい2はフルイラスト仕様でもあり、より作り込まれたフォーマット構成をもつ。カードを傾けると表情が変化するトレイルキラや、柔らかな光を演出するプヨキラといった装飾レイヤーが特徴的だ。背景にはプリズムレイヤーやミラーボール背景が重ねられ、豪華さを際立たせている。

• 

• 

• 

• 

効率的なデジタルカード化を実現するワークフロー

続いて紹介されたのは、カードのメッシュ制作ワークフローだ。『ポケモンカードゲーム』には膨大な種類のカードが存在し、『ポケポケ』ではそれらを再現するだけでなく、オリジナルカードも追加していく必要がある。想像を超える作業量となるのは明らかだ。

そこで開発チームは、PhotoshopとHoudiniを組み合わせた自動化ワークフローを構築し、メッシュ制作の量産体制を実現した。

まずPhotoshopでカードデータを分解し、イラスト原画、塗り、線画といった各要素をPNG画像として出力する。フルイラスト仕様の高レアリティカードでは、さらに原画を分割し、ポケモンの頭・腕・脚といったパーツごとにPNG化する。加えて、レイヤーの描画指定など付加情報はJSON形式で出力する。

続いてHoudiniでの処理に移る。先に出力したPNG画像をTrace SOPでポリゴン化し、レイヤー順に奥行きを設定。その後、JSONの情報を参照し、Photoshopレイヤーの描画指定に基づいてマテリアルを付与する。

さらに、ポケモンの一部パーツがカメラに近づきすぎて不自然に大きく表示されないよう、カードが正面を向いた際には原作イラストの見た目が忠実に再現されるよう調整。具体的には、VEXによるパース補正を組み込み、カード表示時の違和感を解消している。

さらにCOPでシェーダ用のテクスチャを生成する工程を追加し、ここまでのプロセスを全て自動化。これにより膨大な作業量を大幅に削減できた。最終的に人の手による作業は、アーティストがポケモンの各部位ごとに視差調整を行う工程にまで絞り込まれている。

デジタルカードを自然に見せる表現技術

最後に取り上げられたのは、『ポケポケ』ならではのデジタルカードの見せ方だ。これまで紹介してきたように、レアリティが高いカードほど装飾や演出が多く施されている。しかしその一方で、3D空間上でカードを動かすと、エフェクトによってイラストが見づらくなったり、ホログラムがポケモン本体を覆い隠してしまうといった課題も生じる。

開発チームは、改めてデジタルカードの見え方に関する目標を整理した。「自由にカードを動かせること」「常に意図した見た目を維持すること」「カードの姿勢に応じて自然に変化すること」。この3点を満たす手法として、オフスクリーンレンダリングの活用に着目した。

オフスクリーンレンダリングとは、カードの厚みを表現するために、専用の空間で描画したテクスチャを演出用モデルの表面に適用するしくみを指す。

オフスクリーンレンダリングにもいくつか工夫が施されている。例えば、傾いた状態のカードを撮影したテクスチャをそのまま適用すると、3Dモデルのカード枠からはみ出してしまう問題があった。そこでUVを補正しながらレンダリングする仕様とし、カードの姿勢に応じてテクスチャの見え方を調整できるようにしている。

このように、『ポケポケ』は紙のカードを再現するだけでなく、デジタルならではの表現を積極的に採り入れてきた。加えて、安定した制作を可能にする環境構築にも注力し、長期的な開発運営に耐えうる体制を整えている。今後もサービスが続く限り、プレイヤーは紙とデジタル双方の質感を備えたカードに触れられる。そう確信させる内容の講演だった。