ブラウザで使える楽器用チューナーを公開しました

※一部の画像やリンクにはプロモーションが含まれます。
ブラウザで使える楽器用チューナーを公開しました ギターアクセサリー編

先日ふと思い立って、WEBブラウザで使えるオンラインチューナーをつくってみました。

チューナーが手元にないときに、楽器店スタッフ視点で「とりあえず十分使える」レベルのものになるよう意識しています。

広義ではチューナーアプリなのですが、ブラウザで開ける仕様なのでダウンロードやインストール不要で使える無料ツールです。

「パソコンでもスマホでもおすすめ」「エレキギターでもアコースティックギターでもベースでもウクレレでも使える」設計にしてありますので、以下で簡単に説明させてください。

チューナーアプリのホーム画面

チューナーが手元にない時に「とりあえず十分に」使えるツール

「これまでに一度もチューナーを買ったことがない人」は少ないかもしれませんが、「出先で忘れていることに気づいた」「電池が切れて交換できない」「急に壊れて動かなくなった」という状況は珍しくないですよね。

すき間時間の自宅練習で、ケースから小物を出すのが面倒だという日もあるはず。

以前、チューナー選びの記事を書いたときに無料アプリの紹介もしたのですが、ひさしぶりに使ってみると会員登録やログインが必須になっていたり、いつのまにか大幅に仕様が変わっていて不安になることがあります。

あとは私自身がやみくもにスマホアプリをダウンロードしたくないタイプですし、(仕方ないんですが)さすがに画面中が広告だらけになっていると普段使いを躊躇してしまいます。

そこで「とりあえず使える楽器用チューナー」としておすすめの選択肢に挙がるのが、ブラウザで表示できるオンラインチューナー(Webチューナー)です。

オンラインチューナー自体は国内外問わず色々と検索にヒットしますし、Google自身もオリジナルのチューナーを表示してくれるのですが、どれも簡易的なUIのものが中心で、あまりピンとくる使い勝手のものは見当たらず…。

「こうなったらオンラインチューナーの無料アプリ・無料サイトをDIYでつくってしまおう」と本ツールを制作するに至りました。

オンラインチューナーの使い方|対応している楽器の種類

チューナーの使い方については、初見で直感的に使えるシンプルなデザインにしたつもりです。

最初に「マイクをオンにして開始」ボタンを押してマイク入力だけ許可してください。

音声入力はユーザー端末のブラウザ内でのみ処理され、外部に送信されないようになっています。

チューナー起動直後のマイクをオンにして開始ボタン表示

あとはそのまま1本ずつ開放弦を鳴らしてチューニングを開始していきましょう。

チューニング対象以外の弦が共鳴しないように、弾かない弦は余った指でミュートしておこう。

チューニングが終わったらページ右上のボタンでマイクをオフにできるのと、「ページを閉じる」「しばらく使わない状態が続く」でもマイク入力はオフに切り替わります。

チューニング精度に関しては画面内に±25セントと±50セントの目盛りを付けてあります。

「±5セント未満で緑色表示」「±5セント~±20セントでオレンジ色表示」「±20セント以上で赤色表示」になるので緑色で安定するようにペグを回して調整してください。

レギュラーチューニング以外のプリセットについては設定ボタンから選択可能で、そこで基準ピッチも変更が可能です。

チューニング種別のプリセット選択画面

みなさんスマホでエレキギター/アコースティックギターのチューニングをする用途が多いと思うので、デフォルトのプリセットは基準ピッチA440Hzのレギュラー6弦(EADGBE)にしました。

以下のプリセットを用意しており、一度切り替えると、通常は次回起動時にも選択項目が引き継がれているはずです。

対応しているチューニングの種類

■ギター
レギュラー6弦:EADGBE
レギュラー7弦:BEADGBE
レギュラー8弦:F#BEADGBE
ドロップD:DADGBE
半音下げ:D#G#C#F#A#D#
DADGAD:DADGAD
オープンD:DADF#AD
オープンE:EBEG#BE
オープンG:DGDGBD
オープンC:CGCGCE

■ベース
レギュラー4弦:EADG
レギュラー5弦:BEADG

■ウクレレ
レギュラー:GCEA
Low-G:GCEA

■クロマチック

■基準ピッチ変更
438Hz、439Hz、440Hz、441Hz、442Hz、443Hz、444Hz、445Hz

一点補足しておくと、プリセットに設定している場合でも、やはりOSやブラウザごとの仕様、パソコン/スマホ端末の特性、マイクや楽器との相性があります。

環境によっては「使い物にならない」「誤反応で全く精度が出ない」というケースも出てくるかと思います。

そうなってしまうと心苦しいのですが、定期的にロジックの見直し等のアップデートを行っていきますので、気長に見守っていただけると嬉しいです。

スマホのホーム画面に追加する方法とカラーバリエーション

チューニング種別の変更と同様に、歯車アイコンを開くとチューナーをスマホのホーム画面に追加するためのボタンがあります。

プログレッシブウェブアプリ (Progressive web apps, PWA) という仕様になっており、このボタンが効かない環境の場合は、ブラウザメニューからインストール可能です。

チューナーUIに選択可能なカラーバリエーション

カラーバリエーションもいくつか選べるようにしてあるので、ぜひお好みに合わせてチューナーの見た目も変更してみてください。

直近でギターコード表やスケール練習ツールもラインナップに追加しましたので機会があればご活用くださいませ。

※本ツールの利用は自己責任とし、いかなる責任も負いかねます。無断複製・二次配布禁止、リンクやSNSでのシェアは歓迎です。

タイトルとURLをコピーしました