【波形オーバーレイ】オーディビジュアライザー「ハモグラフ」の使い方

みなさんおはこんばんちは(＠ReinyaNchannel)です

配信をこよなく愛している者です。Twitchという配信サイトで活動しています。是非以下のからフォローお願いします

• https://www.twitch.tv/reinyan_channel

今回紹介するのは「Hamograph（ハモグラフ）」の使い方です

前回紹介している記事「【OBSプラグイン】BGMや音に反応するオーバーレイ「AudioVisualizer」を紹介！配信画面をオシャレに」ではOBS専用のプラグインで、OBSでしか使えません

人気

【OBSプラグイン】BGMや音に反応するオーバーレイ「AudioVisualizer」を紹介！配信画面をオシャレに

今回紹介するのは有志で開発している方から出している配信画面（オーバーレイ）に可視化し「BGM・音楽・音」に反応する「Au ...

続きを見る

 

ハモグラフではブラウザソースで使える、音に反応するオーディオビジュアライザーです

OBSのプラグインと違って、ブラウザで解決できるのがメリットです。かなり使い勝手が良いので、配信画面に音の波形を出したい人はこの記事は参考になるかと思います

 

それでは説明していきます

 

 

 

開発者紹介

まずはじめに、開発者の紹介をしていきます

紹介する上で、以下のリンクを共有します

 

 

Twitter

 

Twitterのリンクはこちら

 

 

ホームページ

 

ホームページのリンクはこちら

 

 

ハモグラフの使い方

ハモグラフはOBS推奨と書いてありますが、ブラウザソースを使える配信ソフトであれば使えるかと思います

 

ブラウザでオーディオビジュアライザーを使えるのは非常に優位性が高いので、OBSであればプラグインを使いたくない人は優位性が高いブラウザソース

それでは、ハモグラフの使い方を紹介していきます

 

その前に、ハモグラフのリンクを先に貼っておきます

hamograph

hamograph.oshiteku.app

 

 

 

オーディオビジュアライザー「ハモグラフ」を使って配信画面に出す

では、さくっと説明していきますね

 

• マイクの許可

  • マイクを許可してあげる

  

  ReinyaN

  筆者の場合はオーディオインターフェースのデバイスを指定しています

  

  許可をすると有効になります

  

  ---

• 波形や音の反応の設定をする

  

  公式からの設定が載っているので引用します

  • 色
    バーの色です。CSSの色指定が使えます。
  • マイクゲイン / デスクトップゲイン
    音声入力のゲイン設定です。0で非表示、2で2倍のゲインになります。
  • バーの数
    表示するバーの本数を指定できます。
  • 開始点 / 終了点
    表示領域の半径を1としたときの、バー描画の開始点と終了点が指定できます。開始点 > 終了点とすることで内向きに動く表示を作れます。
  • 最小高さ
    バーの最小高さです。0に設定すると、入力が無のとき表示も無になります。表示領域の半径を1としたときの値です。
  • 幅
    バーの横幅。表示領域の半径を1としたときの値です。
  • 角の半径
    バーの角を丸くしたいときに。これも表示領域の半径を1としたときの値です。

  引用：ハモグラフ公式

  色のカスタマイズをするにあたって、以下のサイトを参考にすると良い

  

  WEB色見本 原色大辞典 - HTMLカラーコード

  色の名前とカラーコードが一目でわかるWEB色見本

  www.colordic.org

  ---

• URLをブラウザソースにコピペ

  メモ

  配信ソフト側のブラウザソースにURLを貼るだけ

  • Xsplit＝「ソースの追加」→「ウェブページ」にリンクを貼る
  • OBS＝「ソースの ＋ 」→「ブラウザ」にリンクを貼る

  設定ができたらURLをブラウザソースに貼り付ける

  

  ---

• カスタムCSSを設定した人はここも見るべし

   カスタムCSS
  .bar {
  filter: drop-shadow(0 0 10px crimson);
  }
  

  ---

• 設定するとこんな感じになります

  

  ---

 

オーバーレイを使っているのは以下の記事で紹介しています。合わせて読んでみてください

210view

【オーバーレイ】春・さくらをモチーフにした配信オーバーレイを紹介

今回紹介する配信オーバーレイは、春（さくら）をモチーフにした配信素材です 今この時期といえば桜ですよね。さくらの時期じゃ ...

続きを見る

 

 

まとめ

OBSのプラグイン以外での、ブラウザで利用できるオーディオビジュアライザーのオーバーレイの紹介でした

ハモグラフを使って配信画面をオシャレに！

 

ではなにかありましたら記事をあげます