音声波形ビジュアライザー — SNS用波形サムネイル画像作成ツール

使い方

1. 音声ファイルを選択 — MP3・WAV・OGGをドラッグ&ドロップするか、クリックしてファイルを選択します。マイクボタンからリアルタイム収録も可能です。
2. デザインをカスタマイズ — 出力サイズ（OGP用1200×630 / Instagram用1080×1080 / Twitter用1500×500）、波形スタイル（バー型・ライン型）、背景色・グラデーション色を設定します。曲名やアーティスト名のテキストオーバーレイも追加できます。
3. 波形を描画 — 「波形を描画」ボタンを押すと、Web Audio APIで音声データを解析し、Canvas上に波形を描画します。
4. PNG保存 — プレビューを確認して「PNG として保存」を押すと、透かしなしの画像がダウンロードされます。

音声波形ビジュアライザーとは

音声波形ビジュアライザーは、MP3・WAVなどの音声ファイルの振幅データをグラフィカルに描画し、SNS投稿用のサムネイル画像として書き出すツールです。 ポッドキャストの告知投稿やSpotify・Apple Podcastsへの誘導画像、音楽リリース告知のSNSカードとして広く活用されています。 本ツールはすべての処理をブラウザ内（Web Audio API + Canvas API）で完結させているため、音声データがサーバーにアップロードされることはなく、プライバシーが保護されます。 登録不要・透かしなし・完全無料でご利用いただけます。

対応フォーマットと出力サイズ

入力フォーマットはMP3・WAV・OGGに対応しています。 出力サイズはOGP/SNSシェア用の1200×630px、Instagram正方形の1080×1080px、Twitterヘッダー用の1500×500pxから選択できます。 すべてPNG形式で出力されるため、背景透過や高品質な画像品質が保たれます。 ポッドキャスターや音楽制作者がSNSマーケティングで使える波形ビジュアル素材を、専用ソフト不要でブラウザから手軽に作成できます。

なぜ音声に「絵」が必要なのか

音声は、タイムライン上では何も見えません。ポッドキャストの新エピソードを告知しても、 リンクだけの投稿は流れていくだけです。SNSのタイムラインで再生ボタンを押してもらうには、 「これは音の投稿だ」と一目で伝える視覚的な手がかりが要ります。波形はそのために使われます。

波形が選ばれるのは、音声コンテンツの記号として広く定着しているからです。 SpotifyやApple Podcastsのプレイヤー、ボイスメッセージのUI、録音アプリのいずれもが波形を表示します。 利用者は説明なしに「これは聴くもの」と理解します。写真やイラストでは代わりになりません。

こんな場面で使えます

• ポッドキャストの各回の告知 — 回ごとに波形が違うので、同じ体裁でも見分けがつきます
• 楽曲リリースやデモ音源の公開 — ジャケット写真がまだ無い段階でも投稿の見た目が整います
• ラジオ・音声配信のアーカイブ一覧 — サムネイルの体裁を揃えられます
• X（Twitter）のヘッダー画像 — 1500×500pxで音楽系アカウントの見た目を作れます
• ブログ記事に音声を埋め込む際のOGP画像 — シェア時のカードに使えます

出力サイズの選び方

3つのサイズはいずれも実際のプラットフォームの仕様に合わせたものです。 用途が決まっていれば、合うものを選ぶだけで余白や見切れを気にせず済みます。

• 1200 × 630 px — OGPの標準的な比率（約1.91:1）。XやFacebookでリンクを共有したときの大きなカードに使われます。ブログ記事の og:image に指定する場合もこのサイズです
• 1080 × 1080 px — Instagramのフィード投稿。正方形なので上下が切れにくく、他のSNSに転用しても破綻しにくいサイズです
• 1500 × 500 px — Xのヘッダー。横長なので波形の変化がよく見えますが、スマートフォンでは左右が切れて中央付近しか表示されない点に注意してください

ケーススタディ1：ポッドキャストの告知画像を毎回そろえる

週1回配信のポッドキャストで、毎回の告知画像を同じ体裁で作る場合を考えます。 音声ファイルを読み込み、出力サイズを1200×630px、波形の色と背景色を番組のテーマカラーに固定します。 タイトル欄に「第12回 〇〇について」、アーティスト名欄に番組名を入れて書き出します。

色と文字の位置を固定しておけば、回ごとに変わるのは波形の形だけです。 並べたときにシリーズとして見え、かつ一つひとつは違う、という状態を作れます。 設定は保存されないので、使う色をメモしておくと次回が楽になります。

ケーススタディ2：ジャケットが無い段階で楽曲を告知する

デモ音源や先行公開の段階では、ジャケット画像がまだできていないことがあります。 この状態で告知を打つと、テキストだけの投稿になり埋もれます。

波形画像であれば音源そのものから作れます。出力を1080×1080pxにし、 波形スタイルを「ライン型」にすると、バー型より落ち着いた印象になります。 グラデーションの2色を近い色相で揃えると音楽ジャンルの雰囲気を出しやすく、 逆に補色を使うと目を引きます。ジャケットができたら差し替える前提の、つなぎの素材として使えます。

ケーススタディ3：マイクで「今しゃべっている波形」を撮る

音声ファイルを用意せず、マイク入力からその場の波形を取ることもできます。 収録中の様子を投稿したい場合や、手元に書き出し済みのファイルが無い場合に使えます。

マイクを許可して話し始めると波形が動き、「波形を描画」を押した瞬間の状態が1枚の画像になります。 録音しているわけではなく、その瞬間のスナップショットを撮っているだけです。 音声はブラウザの外に出ず、保存もされません。

このツールならではの使いこなし

タイムラインでは縮小されることを前提に色を決める。 1200×630pxで作った画像も、スマートフォンのタイムラインでは横400px程度で表示されます。 背景と波形の明度差が小さいと、その大きさではほとんど見えなくなります。 画面上で「ちょうどいい」と感じるより、もう一段はっきりした差をつけておくと失敗しません。

文字は短くする。 タイトルとアーティスト名は画像に焼き込まれるため、後から編集できません。 長い文章を入れると縮小時に読めなくなります。エピソード番号と短い主題程度に留め、 詳しい説明は投稿本文に書くほうが伝わります。

波形が平坦なときは音源を疑う。 波形がほぼ直線になる場合、音量が小さすぎるか、無音部分の多い箇所を読み込んでいます。 本ツールは振幅をそのまま描くので、録音レベルの低い音源は平坦に出ます。 音声編集ソフトでノーマライズしてから読み込むと、形のはっきりした波形になります。

陥りやすい誤解・注意点

• 波形は「音の見た目」であって、音質の指標ではありません。 振幅の大きさを表しているだけで、音がよいか悪いかとは無関係です。 波形が大きく振れていても音が割れていることはありますし、その逆もあります。
• ステレオ音源でも左チャンネルだけを描画します。 左右で大きく異なる音作りをしている音源では、実際の聴こえ方と波形の印象がずれます。 左右の違いを見せたい用途には向きません。
• 動く波形は作れません。 出力されるのは静止画のPNGです。音に合わせて波形が動く動画を作りたい場合は、 動画編集ソフトのオーディオビジュアライザー機能が必要です。
• 大きなファイルは読み込めないことがあります。 ブラウザのメモリ上でデコードするため、長時間の音源では失敗する場合があります。 その場合は必要な部分だけを切り出してから読み込んでください。
• 他人の楽曲を使う場合は権利の確認を。 波形は音源から生成されますが、生成した画像を公開することと、 その音源を利用する権利があるかは別の話です。

よくある質問

対応している音声ファイル形式は何ですか？

MP3・WAV・OGGに対応しています。ブラウザのWeb Audio API（decodeAudioData）でデコードできる形式であれば概ね動作しますが、一部のコーデックはブラウザにより非対応の場合があります。ファイルサイズの上限は設けていませんが、大きすぎるファイルはブラウザのメモリ制限により読み込みに失敗することがあります。

アップロードした音声ファイルやマイクの音声はサーバーに送信されますか？

いいえ。音声ファイルはブラウザ内のWeb Audio API（decodeAudioData）でその場でデコードし、Canvas APIで波形を描画します。マイク入力もAnalyserNodeでリアルタイム解析するのみで、いずれの音声データもサーバーへアップロードされることはありません。

マイクで取得した波形は録音として保存されますか？

いいえ。マイク入力はリアルタイムのプレビュー表示のみを行う機能で、音声そのものを録音・保存する機能はありません。「波形を描画」ボタンを押した瞬間の波形データを1枚のPNG画像としてスナップショット保存します。

ステレオ音源をアップロードした場合、波形はどう描画されますか？

現在の実装ではAudioBufferの1チャンネル目（モノラル、またはステレオの場合は左チャンネル相当）のデータのみを使用して波形を描画します。左右チャンネルを合成・比較する描画には対応していません。

参照情報・免責事項

本ツールはWeb Audio API・Canvas APIを用いてブラウザ内で処理を完結しており、音声ファイル・マイク入力がサーバーに送信されることはありません。技術仕様の詳細はMDN: Web Audio APIをご参照ください。

免責事項：生成される波形画像は音声データの振幅を簡易的に可視化したものであり、正確な音響分析・周波数解析を目的としたものではありません。ダウンロードした画像の利用に伴う音源・著作権上の責任は、ご利用者様に帰属します。