【個人開発】ずっと欲しかった「ギター用 便利アプリ」を作った！【コードやスケール名を逆引き】

**ギター指板のポジション**を選択すると、その音の組み合わせのコードネームやスケールの名前が分かるアプリを作りました！

いわゆる「**逆引き検索**」ってやつです。

https://o-to.khufrudamonotes.com/o-to-reverse-lookup-fingerboard

実はこのアプリ…以前から「**あったら便利だろうな**」と思いつつ、作るのが大変そうだったので放置していました。

しかし、少し前に良さそうな処理方法を思いついて…その勢いで作ってみたら…できました！

## 使い方と機能

では、使い方と機能を紹介します。

### 選択した音のポジションが分かる！

ギター指板を模した表をクリックもしくはタップすると、そのポジションが**着色**されます。

![reverse-lookup-fingerboard_1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486558/bf6320b7-89ab-d251-5b47-21b4536ebbf9.png)

また、その音と同じ種類（ピッチクラス）の音のポジションは、**薄いグレー**になります。

これだけでも結構便利で、同じ音がギター指板のどこにあるかサクッと確認できますね。

### コードネームが分かる！

そして、ポジションを選択していくと**その音の組み合わせに対応するコード**を判定してくれます。

![reverse-lookup-fingerboard_2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486558/63d08017-bd51-5946-62d0-5d96b690ddaf.png)

コードネームだけでなく、**コードの説明**も同時に表示されます。

ちなみに、ギター指板の色付けは**ルート音が青**、**完全5度が黄色**…みたいな感じで**移動ド的**な視点で切り替わります。

つまり、同じピッチクラスの音が常に同じ色に着色されるのではなく、**同じ役割の音が同じ色に着色される**アルゴリズムになってます。

ちなみに、**転回形**もちゃんと判定されます。

![reverse-lookup-fingerboard_9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486558/e68b0fb1-3938-39fb-fab3-4fb77eed6fb6.png)

この転回形を正しく判定するアルゴリズムを思いついたのが今回「作ってみよう」と思ったきっかけだったりします。

### スケール名が分かる！

さらに、選択した音を含むスケールも表示されます。

今のところ、約70種類のスケールを登録してあるので、その中から構成音にマッチするスケールを絞り込みます。

![reverse-lookup-fingerboard_3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486558/62723cb3-d02a-8cda-2ad5-e3ab3476aa7c.png)
（↑Cメジャーコードの構成音を含むCから始まるスケール一覧）

また、「**構成音を含むすべてのスケールを表示する**」ボタンを押すと、約800以上（約70×12）のパターンの中からスケールを検索して表示してくれます。

![reverse-lookup-fingerboard_4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486558/2dd2afcb-8714-b7ef-f2a3-514317e04752.png)
（↑Cメジャーコードの構成音を含むスケール一覧）

逆に考えると、このスケールたちにとって現在選択されているコードがピボットコード（共通する和音）とも言えますね。

### その他の機能

#### 移調機能

「**-1**」と「**+1**」ボタンをタップすると、現在選択しているポジションを移調できます。

ただ、デフォルトの状態では、移調ボタンをタップしても**開放弦(0)だけは移調されません。**

たとえば、この指板の状態↓で「＋1」を押すと…

![reverse-lookup-fingerboard_6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486558/34532759-911b-2e5b-22f8-b1cab2fb5246.png)

こうなります。↓

![reverse-lookup-fingerboard_5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486558/b4964fe5-c3f8-c2a9-69e8-3107bad59812.png)

**解放弦をキープしつつ同じコードフォームをずらす発想**でコードを弾いてみたくなる…でも弾いたコードネームはパッと分からない…。

そんなシチュエーションが多いかなと思ったので、この仕様にしました。

##### 解放弦のロックを解除

もちろん、解放弦まで含めて移調させるか仕様はON/OFF可能です。

「解放弦のロックを解除する」を押すと、解放弦も「**-1**」と「**+1**」ボタンで移調されます。

![reverse-lookup-fingerboard_7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486558/6aa8a0a9-72ed-4619-0cfb-9b124e1e01cf.png)


#### その他：音名やチューニングの切り替え

その他には

- **音名の切り替え**
- **チューニングの切り替え**
- **フレット数の切り替え(１~30フレットまで)**
- **様々なチューニングに対応（ベースなどのチューニングも登録済み）**
- **右利きと左利き指板の切り替え**

なども可能です。

![reverse-lookup-fingerboard_8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486558/e0270c7a-4dd1-3759-6435-b653f17a2904.png)
（↑イタリア式音名の左利き指板）

## さいごに

### 便利～！

僕は、ギター始めた頃よく「**このコード何だろうな？**」とか「**今弾いたフレーズは何ていうスケールなんだろう？**」とか悩んでいたんですね。

まさに、今回作ったようなツールが「欲しい！」と思っていました。

そんな**かつての自分の悩み**を解決するアプリを作れたので、結構満足感があります。

皆さんもよかったら使ってみてください！(๑˃̵ᴗ˂̵)و

↓↓↓↓↓↓↓↓

https://o-to.khufrudamonotes.com/o-to-reverse-lookup-fingerboard

ちなみに、このアプリの逆バージョンの「**スケールやコードネームを指定するとポジションを可視化してくれるアプリ**」もあるので、こちらも是非。

↓↓↓↓↓↓↓↓

https://o-to.khufrudamonotes.com/o-to-fingerboard

### 余談：90対90の法則

今回これを作るのに大体3日くらいかかったんですけど…

最初の1日でメインの**逆引き検索の機能**は完成したんですね。

「やったー！もうほぼ完成じゃん！」と思いきや…

**構成音を着色する機能**をうまいこと実装するのに次の1日を費やしてしまい、「**これがあの『90対90の法則』か…**」と感じました。笑

https://ja.wikipedia.org/wiki/90%E5%AF%BE90%E3%81%AE%E6%B3%95%E5%89%87