概要
集合写真作成ツールは、座席と人物を組み合わせて集合写真を作成するツールです。
座席
背景画像と配置場所を定義
+
人物
アイコン、名前、ポーズを設定
=
集合写真
完成した画像を出力
ステップ1: 座席の作成
1-1. 座席管理タブを開く
画面上部の「座席管理」タブをクリックします。
座席管理タブのスクリーンショット
1-2. 新しい座席を追加
「新しい座席を追加」ボタンをクリックして、座席編集画面を開きます。
- 座席名: わかりやすい名前を付けます（例：前列、後列など）
- 座席画像: 背景となる画像をアップロードします（任意）
- 配置グリッド: 人物を配置できる位置を設定します
- 横・縦のグリッド数を指定（1〜10）
- グリッド上でクリックして配置可能な場所を選択
- 配置場所の画像: 各配置場所に個別の画像を設定可能
1-3. 座席のプレビューと保存
「プレビュー」ボタンで座席の見た目を確認し、「保存」ボタンで座席を登録します。
💡 ヒント: 座席画像は後から編集できます。まずは配置場所だけ決めて保存することも可能です。
ステップ2: 人物の登録
2-1. 人物管理タブを開く
画面上部の「人物管理」タブをクリックします。
2-2. 人物を追加する方法
方法1: 画像から一括追加
「画像から追加」ボタンをクリックして、複数の画像を選択します。
- ファイル名が自動的に人物名として設定されます
- 複数ファイルを一度に選択可能
方法2: 手動で追加
「手動で追加」ボタンをクリックして、個別に人物を登録します。
- 名前を自由に設定
- アイコン画像を選択
- ポーズを選択（通常、笑顔、クール、ピース、ウインク、カスタム）
2-3. 人物情報の編集
登録した人物カードの「編集」ボタンをクリックすると、名前やポーズを変更できます。
ステップ3: 配置とプレビュー
3-1. 配置・プレビュータブを開く
画面上部の「配置・プレビュー」タブをクリックします。
3-2. 座席を配置
左側の座席一覧から座席を選んで配置します：
- ドラッグ＆ドロップ: 座席をキャンバスにドラッグして配置
- クリック配置: 座席をクリックすると即座にキャンバスに配置
- 同じ座席を複数配置することも可能
3-3. 人物を配置
右側の人物一覧から人物を座席に配置します：
- 人物を座席の配置場所（点線の円）にドラッグ
- 自動的に配置場所にスナップされます
- 配置後もドラッグで位置を変更可能
💡 ヒント: 「自動配置」ボタンを使うと、未配置の人物を一括で配置できます。
3-4. レイアウトの調整
- アイコンサイズ: 20〜100pxの範囲で調整可能
- 座席拡大率: 50〜200%の範囲で座席の大きさを調整
- アイコン拡大率: 50〜200%の範囲で人物アイコンの大きさを調整
- キャンバス設定: 解像度や背景を変更
- 解像度: 400×300 〜 3000×3000px
- 一般プリセット: 800×600、1200×900、1600×1200、1920×1080
- SNSプリセット:
- IRIAMアイコン (513×513)
- IRIAMヘッダー (1125×480)
- Xヘッダー (1500×500)
- 背景: 画像または単色を設定
ステップ4: 画像の出力
4-1. プレビューの確認
キャンバスで最終的な配置を確認します。必要に応じて微調整を行います。
4-2. 画像として出力
「画像として出力」ボタンをクリックすると、高解像度（2倍サイズ）のPNG画像がダウンロードされます。
📝 注意: 出力時は配置ガイド（点線の円）は表示されません。
便利な機能とTips
💾 自動保存機能
座席、人物、配置データは自動的にブラウザに保存されます。ページを更新しても作業内容は保持されます。
🗑️ 選択的クリア
「クリア」ボタンのドロップダウンメニューから：
- 人物のみクリア
- 座席のみクリア
- すべてクリア
を選択できます。
🎨 座席の活用例
- 教室風: 机と椅子の画像を使用
- 野外: 風景画像を背景に
- ステージ: 段差のある配置に
- フリースタイル: 背景なしで自由配置
⌨️ ショートカット
- 座席・人物の選択: クリック
- 移動: ドラッグ
- 配置の微調整: 配置後にドラッグ