← ハシトシステム トップ English ツール ブログ
人物相関図の動画メーカー
JSONで人物・関係・シーンを書いて、カメラが動く相関図の動画を撮ります
READY
Nodes
0
Relations
0
Scenes
0
Duration
00:00
Output
1920×1080
SCENE 1 / 1 CAM 1.00×
3
00:00.000 / 00:00.000
Space: 再生/停止 ← →: シーン移動 R: 録画 J/K/L: 前・停止・再生

どんなときに使うか

登場人物が多くて口頭では関係を説明しきれないときに向いています。全体像を見せたあと、話題にしている人物へカメラを寄せ、関係線を1本ずつ伸ばしながら説明できるので、聞き手が「今どこの話か」を見失いにくくなります。事件・組織・プロジェクトの体制説明・登場人物紹介などに使えます。

図の中身は nodes(人物)と edges(関係)、動画の進行は shooting.scenes(撮影シーン)で決まります。JSONタブに最初からサンプルが入っているので、まずは名前と関係名だけを書き換えて再生してみてください。

シーンの書き方

1シーンにつき伝えることは1つにします。camera.targetNode で寄せる人物を、camera.zoom で寄り具合を決め、focusEdgestraceEdges で「今どの関係の話か」を線のアニメーションで示します。囲みたい範囲は box、補足は callout、読み上げ相当の文は comment(画面下の字幕)に書きます。

解像度比率主な用途
1920×108016:9通常の横型動画・資料の埋め込み
1080×19209:16ショート動画・縦型のSNS投稿
1080×10801:1タイムラインに正方形で載せたいとき
2560×144016:9文字を大きく見せたいとき

撮影のコツ

縦型(1080×1920)にするときは、全体を映すシーンを減らしてズーム中心の構成にしてください。人物が多いまま引きの画を続けると、名前が小さくなって読めません。撮影タブの事前チェックは、字幕が長すぎるシーンや2.5秒未満の短すぎるシーンを教えてくれます。

録画にはキャンバスの内容だけが入ります。操作パネルや右側のタブは動画に映りません。BGMやナレーションの音声ファイルを読み込むと、そのまま動画の音声トラックになります。

よくある質問(FAQ)

どんな動画が作れますか?

人物と関係を描いた相関図に対して、カメラが寄ったり引いたりする解説動画を作れます。シーンごとにズーム先・強調する人物・赤枠・吹き出し・字幕を指定でき、WebM形式で録画できます。

相関図はどうやって作りますか?

JSONタブで nodes(人物)・edges(関係)・shooting.scenes(撮影シーン)を書きます。最初からサンプルが入っているので、名前と関係を書き換えるところから始められます。シーンタブからは画面上の操作でも編集できます。

音声は入れられますか?

撮影タブでBGMやナレーションの音声ファイルを読み込めます。マイクを同時に録音することもできます。音量はBGMとマイクで別々に調整できます。

入力した内容はサーバーに送信されますか?

いいえ。JSONの解釈も、図の描画も、動画の録画も、すべてお使いのブラウザ内で完結します。外部への通信は行いません。