XIV Frameの使い方：SSの追加から保存までの完全ガイド

XIV Frameは、ブラウザ上でスクリーンショットを配置し、完成したキャンバスを保存するツールです。画像1枚なら自動で分割されず、1枚のキャンバスで始まるため、すぐに署名を追加して保存できます。複数画像をまとめるときだけレイアウトを選びます。

まず知っておきたいこと

• 1つのキャンバスに使える画像は最大16枚です。3×3・4×4グリッドはそれぞれ9枚・16枚を使います。
• 1枚の画像ファイルは50MB以下です。大きな元画像はアップロード後、ブラウザ内で自動最適化されます。
• 画像はブラウザ内で処理され、元画像がサーバーへアップロードされることはありません。
• プレビューのズームは画面上の見え方だけを変えます。保存される画像のサイズは変わりません。

1. スクリーンショットを追加する

1. PCでは右側の画像ソースを開き、スマートフォンでは下部メニューの写真をタップします。
2. 空いている画像1のカードをクリックしてファイルを選びます。
3. 画像1枚ならここで止め、署名を追加して保存できます。複数画像をまとめる場合は追加のカードにも同じ操作で画像を入れ、アップロードした順番を基本の配置順にします。
4. 差し替える場合はカードの変更、削除する場合はカード右上のXボタンを使います。
5. 順序を入れ替えで最初の2枚を交換できます。カード上の左右ボタンで1枚ずつ移動することもできます。

2. 合成画像を追加する

1. PCでは上部の写真タブを開き、右側の画像ソースパネルで合成を選びます。キャラクターだけでなく、光、エフェクト、装飾、その他のPNG要素にも使えます。
2. 合成画像を追加をクリックしてPNG、JPG、WebPを選びます。透明PNGはそのまま使え、背景がある画像は次の手順で背景を削除できます。
3. 元画像と背景削除結果のプレビューを確認し、背景を削除をクリックします。初回はブラウザでモデルを準備するため、時間がかかる場合があります。
4. 不要な部分が残った場合は輪郭を補正を開き、消すを選んでプレビューをドラッグします。必要な部分まで消えたときは戻すで復元できます。
5. キャンバス配置で画像を直接ドラッグし、画像サイズ、不透明度、左右反転、自然な影を調整します。PCでは合成画像をクリックして矢印キーを押すと1pxずつ移動し、Shift+矢印キーで10pxずつ移動できます。
6. スマートフォンでは位置の微調整パッドを使います。中央ボタンで1px/10pxを切り替え、矢印ボタンを長押しすると連続して移動します。
7. 合成画像を外したいときは合成を削除をクリックします。写真ソースと署名の設定はそのまま残ります。

3. レイアウトを選ぶ

1. 複数画像を使う場合は、PCでは右側のレイアウトタブ、スマートフォンでは下部のレイアウトメニューを開きます。画像1枚ならこの手順を飛ばせます。
2. 横分割は画像を左右に並べます。
3. 縦分割は画像を上から下へ積みます。
4. グリッド配置は4枠の2×2構成で、3～4枚の画像に向いています。3枚の場合は1枠が空きます。9枚・16枚なら3×3・4×4グリッドを選びます。
5. 3～4枚では上段を強調、下段を強調、左側を強調、右側を強調、3列・3行均等も選べます。4枚では4列・4行均等も使えます。

4. キャンバス比率を設定する

1. PCではプレビュー上部の比率、スマートフォンでは保存内の比率設定を開きます。
2. 初期設定の元の比率は、現在のレイアウトの自然な構図を保ちます。
3. 16:9の横長キャンバスが必要ならXタイムラインを選びます。
4. 2:1は複数の画像を横長のバナーのように見せたいときに使います。
5. 画像1枚で2:1を選ぶと、1枚画像の形から標準・円・ハート・星を選べます。キャンバスとPNG保存結果の両方に適用されます。

5. 画像ごとに位置と拡大率を調整する

1. カードをクリックして調整したい画像を選びます。選択中のカードには枠が表示されます。
2. 選択中の画像のサイズスライダー、または数値入力で50～300%の範囲を設定します。
3. キャンバス上の画像をドラッグして位置を動かします。スマートフォンでは1本指でドラッグします。
4. 選択中の画像の上でマウスホイールを動かすと、すばやく拡大・縮小できます。
5. PCでShiftキーを押しながらドラッグすると、横または縦の一方向に動きをそろえられます。
6. リセットを押すと、選択中の画像だけが初期のサイズと位置に戻ります。
7. 調整が終わったら画像位置をロックをオンにすると、キャンバス上で誤って動かすことを防げます。

6. 余白とつなぎ方を整える

1. レイアウトのトランジションで、なしまたはソフトブレンドを選びます。
2. なしでは画像の間隔を0～100pxで調整します。
3. ソフトブレンドでは自然な境界の幅を調整し、隣り合う画像の重なり方を決めます。
4. 枠線の太さでキャンバス外周の余白を0～50pxの範囲で加えられます。

7. 背景と質感を決める

1. 仕上げで背景をホワイト、ブラック、ライトグレー、透明、カスタムから選びます。
2. 画像の外側を透明なままPNGにしたい場合は透明を選択します。
3. フィルムノイズは0%から始め、画像全体に控えめな質感を加えたいときだけ少しずつ上げます。

8. 署名を追加する

1. PCでは右側の署名、スマートフォンでは下部の署名を開きます。
2. テキストタブで上部テキストにキャラクター名、下部テキストにサーバー名などを入力します。
3. 各行の太字・斜体・文字間隔を個別に調整します。
4. 位置、整列、フォント、サイズ、色、不透明度をプレビューを見ながら決めます。
5. 顔や装備の重要な部分に重ならない位置へ移動します。
6. 署名設定の下にある著作権オーバーレイで、アプリに用意された著作権表記の表示・非表示を切り替えます。この表記は自由入力のテキストではありません。
7. 表示をオンにしたら、著作権の位置で左・中央・右を選び、著作権の色で黒・白・グレーを選択します。プレビュー上で読みやすさを確認してください。

9. 結果を保存する

1. PCでは右上の保存 PNGをクリックします。
2. スマートフォンでは保存を開き、比率を確認して保存するをタップします。
3. PNGを優先しますが、5MBを超える不透明な結果は高画質JPEGとして保存されます。透明PNGを5MB以下にできない場合は保存せず、案内を表示します。
4. 別の作品を作る場合は、PC上部のリセットまたはスマートフォンの初期化を使います。残したい作品は先に保存してください。

設定の保存について

XIV Frameの設定はブラウザのローカルストレージに保存されます。同じブラウザで再び開くと設定が残っている場合がありますが、完成画像はダウンロードしたPNGまたはJPEGを別に保管してください。