10th year おかげさまで10年目。デザインを、もっと頼みやすく。

JOURNAL

ビフォーアフター比較を画像・GIF・動画で作成できる無料ツールを公開

2枚の写真を読み込み、位置合わせ、表示モード選択、保存まで行えるビフォーアフター作成ツール。制作・施工などの変化を伝えるための使い方をご紹介します。

ビフォーアフター画像・動画作成ツールの紹介画像

施工や清掃の記録、写真の補正例など、2枚の写真の違いを説明したい場面に向けた無料ツールを公開しました。写真の配置と表示方法を調整し、用途に合う比較画像・動画をブラウザで作れます。

ビフォーアフター画像・動画作成ツールを開く

使い方

  1. BEFOREとAFTERの写真を1枚ずつ読み込みます。同じ構図の写真を選ぶと、変化を比較しやすくなります。
  2. 写真の位置と拡大率を調整し、比較したい場所をそろえます。ラベルと画面比率も掲載先に合わせて設定します。
  3. スライダー、フェード、ルーペなどから表示方法を選び、プレビューで見え方を確認します。
  4. 静止画ならPNG、動きを見せるならGIFや動画を選んで保存します。動画形式はブラウザの対応状況を確認してください。
ビフォーアフター工房の操作画面

使う場面と調整のポイント

写真全体の仕上がりを並べたいときは左右・上下の比較、狭い範囲を拡大して説明したいときはルーペが便利です。自動ループなら、見る人が操作しなくても2枚の変化を追えます。SNSへの投稿前には、文字の大きさと切り替え速度を実際の表示サイズで確認してください。

外壁塗装の施工前後

保存・公開の前に確認したいこと

位置合わせは説明を読み取りやすくするために行い、比較の条件が変わるような加工は避けてください。人物写真や施工写真を公開する際は、写っている方の同意や画像の利用条件も確認しましょう。

ビフォーアフター画像・動画作成ツールを使ってみる

ASOBOADの無料ツール一覧 / AMIXで機能の概要を読む