← Webツール一覧
画像・デザイン

LINE風チャットアニメーション制作

左右の吹き出しを並べ、会話が順に現れるチャット風アニメーションを作ります。

LINE風チャットアニメーションを作成

メッセージが順に現れる会話を作り、WebM動画として保存できます。

チャット
友だち

今日の待ち合わせ、18時で大丈夫?

あなた

大丈夫!駅の改札で待ってるね。

このツールは特定のメッセージサービスとは関係のない非公式ツールです。実在の会話の捏造や、他者を誤認させる用途には使用しないでください。

使い方・計算条件

LINE風チャットアニメーション制作を正しく使うために

左右の吹き出しへ名前と文章を入力し、会話が順番に現れるチャット風アニメーションを作成します。短い解説動画、SNS投稿、プレゼン資料の会話例などを、ブラウザだけで編集できます。

LINE風チャットアニメーション制作の使い方

  1. 01

    各メッセージの表示側、名前、文章を編集し、必要な行を追加します。

  2. 02

    再生ボタンで吹き出しが順に表示される流れを確認します。

  3. 03

    完成したらWebM動画、または再編集用のプロジェクトデータを保存します。

確認できること

チャットプレビュー
相手側と自分側の吹き出しを分け、入力順に画面へ表示します。
WebM動画
対応ブラウザでは会話の表示過程を動画ファイルとして書き出せます。
プロジェクトデータ
入力した会話をJSON形式で保存し、内容の記録や再利用に使えます。

計算・処理の仕組み

入力したメッセージをCanvasへ時間差で描画し、その描画ストリームを対応ブラウザのMediaRecorderでWebMとして記録します。音声や通知音は含みません。