TCG シャドーボックス プランナー
シャドーボックスの作り方（基本）

同じカード画像を4枚使って、4レイヤーのシャドーボックスを作る手順を説明します。

使用する画像

このガイドでは「森の守護者 キノ」のカード画像を使って手順を説明します。

「森の守護者キノ」はAIで作成したサンプルカードです。シャドーボックス作成の練習に自由にお使いください。

手元にカード画像がない場合は、このサンプル画像でお試しください。

サンプル画像をダウンロード

手順 1
 トップページを開く

アプリにアクセスします。画面上部に「画像をアップロード」エリアがあり、下部にはギャラリーが表示されています。

手順 2
 1枚目の画像をアップロードする

「画像をアップロード」と書かれた入力欄をクリックし、カード画像ファイルを選択します。ファイルを選択すると、クロップ（切り抜き）ダイアログが表示されます。

手順 3
 1枚目のレイヤーが追加された状態

「保存」をクリックすると、レイヤー編集タブにカードのサムネイルが表示されます。上部のアップロードエリアはコンパクト表示に切り替わり、レイヤー間に「間隔」スライダーが現れます。

各レイヤーの操作ボタン

ツール説明
複製このレイヤーをコピーして新しいレイヤーとして追加します。2枚目以降のレイヤーはこのボタンで複製するのが基本です
上へ移動 / 下へ移動レイヤーの順番（前後関係）を入れ替えます
削除このレイヤーを削除します

レイヤー間隔スライダー

各レイヤーの下に表示されるスライダーで、3D表示時にそのレイヤーと次のレイヤーの奥行き間隔を調整できます。

手順 4
 レイヤーを複製して2枚目を作る

2枚目以降のレイヤーは、「複製」ボタンで既存レイヤーをコピーして作成するのが基本です。1枚目のレイヤーにある複製ボタンをクリックすると、同じ画像のレイヤーが追加されます。

2枚目が追加されました：

手順 5
 3枚目・4枚目のレイヤーを複製する

手順4と同じように「複製」ボタンを繰り返し使って、3枚目・4枚目のレイヤーを作成します。

3枚目追加後：

4枚目追加後（4レイヤー完成）：

手順 6
 各レイヤーをキャンバスエディタで編集する

各レイヤーのサムネイル画像をクリックすると、キャンバスエディタが開きます。不要な部分を消去して、各レイヤーが表現する「層」を切り出しましょう。

ツールバーの機能

ツール説明
消しゴムブラシで塗った部分を透明にする
囲み選択多角形で範囲を選択して一括消去
移動画像の表示位置を調整
コメント3D表示時に表示するメモを追加
拡大/縮小キャンバスのズーム操作
元に戻す/やり直し操作の取り消し・やり直し

各レイヤーで切り出す例（4レイヤー構成）

レイヤー 1（最前面）
キャラクターのみ残す（背景を全消去）
レイヤー 2
キャラクターの手前にあるオブジェクト
レイヤー 3
中景の背景要素（木・建物など）
レイヤー 4（最背面）
遠景の背景（空・山など）をそのまま残す

手順 7
 3D表示でプレビューを確認する

上部の「3D表示」タブをクリックすると、レイヤーを重ねた立体プレビューが表示されます。

視点の回転
画面をドラッグして3Dの視点を変える
ズーム
スクロールでズームイン/アウト
奥行き調整
各レイヤー間の「間隔」スライダーで奥行きを変更
レイヤー切り替え
下部のレイヤー一覧で表示するレイヤーを選択
傾き調整
各レイヤーの傾き調整アイコンをクリックして傾き角度と起点を設定

傾き設定の使い方

3D表示タブでは、各レイヤーのボタン横にある傾き調整アイコンをクリックすると傾き設定パネルが開きます。

傾きを設定したいレイヤーのボタン横にある傾き調整アイコンをクリックする
起点ボタン（上・下・左・右）で傾く方向の固定辺を選択する
スライダーで傾き角度（0〜90°）を調整する
設定した傾きは3Dプレビューにリアルタイムで反映される

手順 8
 保存・出力する

クラウド保存
右上の保存ボタンからクラウドに保存できます。ログイン済みの場合、ギャラリーで公開したり「マイページ」から再編集できます。
PDF出力
右上のPDFボタンから各レイヤーを印刷用PDFとして出力できます。印刷して重ねることでシャドーボックスが完成します。

まとめ

ステップ操作
1トップページを開く
2「画像をアップロード」から1枚目を選択
3クロップダイアログで範囲を確認して保存
4〜5アップロードボタン(↑)から2〜4枚目を追加
6各レイヤーをキャンバスエディタで編集（背景を消去）
7「3D表示」タブで立体プレビューを確認
8クラウド保存またはPDF出力
操作ガイド一覧に戻る
さっそく作ってみる