こんにちは。自キ温泉ガイドのサリチル酸です。
今回はRemapという、国内で開発され2021年2月16日にオープンβテストが始まったWebソフトを使ったキーマップの変更方法を紹介したいと思います。
2022/4/6 内容の最新化を行いました。
2023/2/16 Remapの最新のQMKへの対応状況について書きました。
- はじめに
- Remapとは
- Remapへのアクセス方法
- キーボード設定画面を開く
- キーボードを接続する
- Remapでできること
- キー配列を変更する
- レイアウトを変更する
- キーボードをテストする
- キーマップを変更する
- マクロを作成する
- 変更したキーマップを書き込む
- LEDライティングを変更する
- キーボードを切り替える
- チートシートを出力する
- キーマップをセーブ/ロード/シェアする
- キーボードカタログを見る
- ファームウェアを書き込む
- Tips:基本知識とか、設定方法とか
- Remapの最新のQMKへの対応状況
- Remapに貢献する
- おわりに
はじめに
以前VIAというキーマップ書き換えソフトの解説をしていますが、VIAは今までエディタでソースコードに向き合う必要があったキーマップ変更作業をグラフィカルに簡単に行えるもので、初心者だけでなく経験者にもいい体験を提供してくれるものでした。
今回解説するRemapというツールはVIAで必要だった端末へソフトのインストールが不要になり、Chromeブラウザから直接キーマップの変更を行えるようになったツールです。
Remapとは
国内の自作キーボード開発者である@yoichiro氏と@adamrocker氏が共同で開発されたオープンソースソフトウェアです。
@yoichiro氏のアドベントカレンダーの記事を読んで期待していた方も多いと思います。
アドベントカレンダーの時はWebVIAという名前で開発を進めていましたが、Remapに改称した後にオープンβ版として公開されました。
RemapはQMKファームウェア(自作キーボードによく使われるオープンソースファームウェア)を書き込まれたキーボードのキーマップを、パソコン上のChromeの画面から直接操作・反映できるWebソフトウェアです。
この直接操作・反映できるというところがポイントで、従来のConfiguratorでHexファイル(キーマップのファイル)を生成してToolboxで書き込むという方法では手間と時間がどうしても発生してしまいます。
それをこのRemapではパソコン上にソフトをインストールしなくても実施できます。
つまり、他のパソコンでもChromeさえ入っていたらすぐにキーマップを変更が可能という、キーマップの試行錯誤という自作キーボードの醍醐味を更にダイレクトに楽しめるのです。
Remapへのアクセス方法
Chromeブラウザで以下のリンクを開き、Remapへアクセスします。
キーボード設定画面を開く
キーボードを接続する
Remapにキーマップがマージされている場合
そのままキーマップ編集画面が表示されます。
この時、画面にはキーボードに書き込まれているキーマップが自動反映されています。
Remapにキーマップがマージされていない場合
※このキーマップの読み込みは毎回、ソフトの起動毎に読み込みをする必要があります。
Tips.VIAにマージされているが、RemapにマージされていないキーマップJSONの場所について
以下のURLにJSONファイルが格納されております。
この中から使用したいキーボードのJSONファイルをダウンロードします。
例えば「DZ60 RGB v2」はこちら、「DZ60 Rev3.0」はこちらです。
ちなみにRemapの運用ポリシーとして@yoichiroさんのブログではこう書かれています。
ただし、キーボード定義JSONファイルは、その作者が権利を持っているという前提に立ち、勝手にRemapに取り込むことはしていません。あくまで権利をお持ちの方々にRemapへキーボード定義JSONファイルを登録していただく、という方針です。
なので、良かれと思っても他の方が設計したキーボードを登録しようとしてはいけません。
キーボード選択画面にキーボードが表示されない場合
VIA用のファームウェアが書き込まれていない可能性があります。
VIA用のファームウェアをQMK Toolboxで書き込んでください。
salicylic-acid3.hatenablog.com
VIA用のファームウェアは通常のファームウェアと違い、専用に用意する必要があります。
VIA用のファームウェアはそれぞれの作者の指定する場所か、Remapのカタログ機能に登録があるので、それぞれ見つけて書き込んでください。
Remapのファームウェアの書き込み・ダウンロード機能については後述します。
Remapでできること
Remap(2022/04/06時点)で出来ることは以下の通りです。
- キー配列(英語配列/日本語配列等)を変更する
- レイアウトを変更する
- キーボードをテストする
- キーマップを変更する
- マクロを作成する
- 変更したキーマップを書き込む
- ライティングを変更する
- キーボードを切り替える
- チートシートを出力する
- キーマップをセーブ/ロード/シェアする
- キーボードカタログを見る
- ファームウェアを書き込む
キー配列を変更する
最初に自分が使うキー配列に変更しておきましょう。
キー配列が違うとシフトキーを押しながら数字キーを押した時に入力される記号が異なり、記号のキーコードも微妙に異なりますのでキー設定時に結構困ります。
キー配列は右上の「English(US)」と書かれているプルダウンメニューを選択します。
日本語配列についての詳しい解説は以下を参照してください。
salicylic-acid3.hatenablog.com
レイアウトを変更する
次に自分が使うレイアウトに変更しておきましょう。
左側の歯車マークをクリックし、自分が使うレイアウトに変更します。
キーボードをテストする
レイアウトが決定したらキーボードのテストです。
テキストエディタなどでテストをしても良いのですが、Remapのテストモードを使用すると確実かつ簡単です。
反応した部分が青くなります。
ロータリーエンコーダの回転を擬似的なキーとしている部分についてはテストができないので注意してください。
キーマップを変更する
アルファキー(文字キー)とモデファイアキー(シフトとかの修飾キー)を変更する
キーコードを変更するには2種類の方法があります。
- 変更したいキーを選んで変更する。
- 下のキーコードからドラッグして置換する。
そんなに難しくは無いのですが、順に説明します。
変更したいキーを選んで変更する
変更したいキーコードをドラッグして変更する
Tips.レイヤーキーの種類について解説
レイヤーを変更するキーを設定します。
自作キーボードの醍醐味のひとつなので、是非試行錯誤してみてください。
レイヤーの移動方法はいくつかのパターンがあり、使用方法に応じて設定します。
レイヤーキー | 説明 |
TO |
対象のレイヤーに切り替わります。 次々にレイヤーを切り替えていくようなときに使用します。 例) |
TG |
対象のレイヤーにトグルで切り替わります。 TGキーで切り替えた先のレイヤーには同じTGキーを配置して押すことでと元のレイヤーに戻る。 例) |
MO |
押している間対象のレイヤーに移動し、離すと戻ります。 例) |
TT |
MOと同じように押している間対象のレイヤーに移動し、離すと戻ります。 5回連続で押すとTGキーと同じように対象のレイヤーに移動したままになります。 |
OSL |
次のキーが入力されるまで指定したレイヤーに移動します。 キーがなにか押されると元のレイヤーに戻ります。 |
DF |
対象のレイヤーの設定を現在のレイヤーに上書きします。 ※USBの抜き差しで初期化されます |
以上のレイヤーキーに加えて、キーをクリックしてのHOLD/TAPで長押し/単押しでレイヤーを切り替えるように設定することができます。
私の設定の煮詰め方ノウハウについてはこちらを参照してください。
レイヤー関連のキーを設定する
各レイヤーに共通するキーを全レイヤーで書くのは大変なので、他レイヤーに関連するキーを設定します。
SYMBOLの左上にある2キーが該当します。
空白のキーは押しても何の効果も無いキーです。そのレイヤーでは押さないor押すと誤爆する場合に使用します。
▽のキーはレイヤー番号の一つ数の小さいレイヤーのキーを踏襲するキーです。
特殊キーを追加する
記号単体や様々な効果を発揮するキーを設定します。
種類が多く普通は使わなさそうなキーが多いので、ここではよく使用するマウスキーを抜粋して紹介します。
キーコード | 説明 |
Mouse↑↓←→ | マウスカーソルを動かします。 |
Mouse Btn | Btn1は左クリック、Btn2は右クリック、Btn3は中央クリック、後の2つはよくわからない。。 |
Mouse Wh↑↓←→ | マウスホイールを動かします。 |
Mouse Acc0~2 | マウスカーソルを加速します。 |
ちなみにマウス機能はVIA用のファームウェアを作る時に有効化しておかないと機能しません。
もしマウスカーソルが動かない場合はキーボード設計者に確認してください。
ライティングキーを入力する
キーボードのLEDライトを制御するキーを設定します。
国内の自作キーボードでよく採用されているRGB(フルカラー)バックライトは様々なパターンで発光させることができます。
キーコード | 説明 |
RGB Toggle | LEDのオンオフをします。 |
RGB Mode -+ | RGBのアニメーションモードを切り替える。 |
Hue -+ | LEDの色相を増減させます。 |
Sat -+ | LEDの彩度を増減させます。 |
Bright -+ | LEDの輝度を増減させます。 |
Effect Speed -+ | LEDアニメーションのスピードを増減させます。 |
RGB Mode P~G | LEDアニメーションモードを変更します。 |
BMP関連のキーを変更する
BMPを利用している場合もRemapでキーコードを変更できます。
それぞれのキーコードの説明は以下の通りです。
キーコード | 説明 |
BLE DIS | Bluetooth接続を無効化する |
BLE EN | Bluetooth接続を有効化する |
USB DIS | USB接続を無効化する |
USB EN | USB接続を有効化する |
SEL BLE | USB接続を無効化し、Bluetooth接続を有効化する |
SEL USB | Bluetooth接続を無効化し、USB接続を有効化する |
ADV IDX | X番目に登録された機器と接続する |
DEL IDX | X番目に登録された機器との接続情報を削除する |
DEL BNDS | 全ての接続情報を削除する |
ENT DFU | ブートローダを開始する |
ENT WEB | Webコンフィギュレータを起動する |
ENT SLP | スリープモードに入る |
BATT LV | バッテリーの電圧を表示する(文字列が自動で入力されます) |
SAVE EE |
EEPROMに保存する (LEDのレベルなどの情報が保存され、次にUSB接続されたときに自動でロードされる) |
DEL EE | EEPROMの情報を削除する(初期化する) |
xEISU | 英数を入力する |
xKANA | カナを入力する |
マクロを作成する
マクロ機能という、あらかじめ登録しておいた動作を自動で行う機能を使用できます。
※パスワードを登録しておくのはセキュリティの脆弱性に繋がりますので非推奨です。
マクロの作成は「Functions」タブの最下部にあるMx(xは数字)の右下の鉛筆マークから行います。
通常のキーの設定方法と同じく、下のキーコードを画面上部にドラッグして設定していきます。
シフトキーを押しながら、などのモデファイアキーとの組み合わせは、モデファイアキーコードをドラッグした後、キーコード下部の「Hold」ボタンを押した後にキーコードを挿入します。
後は通常のキーと同じく、ドラッグしてキーコードをキーに適用してい来ます。
変更したキーマップを書き込む
VIAと違ってRemapは右上の「flash」ボタンを押さない限りは変更が反映されません。
LEDライティングを変更する
右側のマークをクリックし、LEDの発光モードを変更します。
LED発光モードはキーマップと違い、この設定を変更したら即時反映されるので見た目にも面白いです。
キーボードを切り替える
対応キーボードを複数接続している場合、キーマップを変更するキーボードを切り替えることができます。
チートシートを出力する
Remapはブラウザで動作するとはいえ、慣れるまでいつも傍らで開いて確認するというのも相当手間です。
そこでチートシートを出力して印刷しておくとひと目で確認できて便利です。
これ実は設計者が自分のキーボードのキーマップを公開するのに凄く便利だと思うんですよね。
キーマップをセーブ/ロード/シェアする
VIAではローカルにキーマップファイルJSONを保存していた形式でしたが、Remapはサーバ側にユーザ情報(GithubまたはGoogleアカウント)とセットで保存する形式となっています。
このセーブ/ロード機能はPC間で行えるため、他の端末ですぐに呼び出すことが可能です。
RemapのキーマップSave/Restore機能、いろいろな使い方が考えられますが、例えば僕はLinux, Mac, Windowsを全部使う機会があって、それぞれで微妙にキーマップが異なるので、それぞれ保存しておいて簡単に切り替えられるようにしています。 #remap https://t.co/XziLwWuwJh
— Yoichiro Tanaka (@yoichiro) 2021年3月23日
使い方は簡単です。
画面右にある矢印のアイコンをクリックし、「SAVE CURRENT KEYMAP」をクリックし、Titleをつけて「SAVE」をクリックするだけです。
ロードする時は設定したTitleをクリックし、「Flash」ボタンを押すだけで反映されます。
作ったキーマップをシェアする場合はセーブするときに「Share this keymap for other users」にチェックを入れてSAVEを押すだけです。
どういうキーマップなのか分かりやすいように説明を入れておくとより親切です。
他の人がシェアをしたキーマップを適用する時は「SHARED」タブからキーマップを選択してロードできます。
他の人にオススメしたい時は「MINE」タブのキーマップの右側のクリップマークをクリックするとシェア用の画面が生成されます。
URLを貼り付けたり、ツイートボタンからツイートしてシェアしましょう。
キーボードカタログを見る
私が作ったキーボードカタログではなく、Remap上に登録されているキーボードの一覧と説明を参照できるキーボードカタログ機能が追加されました。
RemapのTop画面から「KEYBOARD CATALOG」ボタンを押すとカタログ画面が表示されます。
いろいろな検索キーがあるので、是非色々眺めてみてください!
ファームウェアを書き込む
キーボードカタログ機能から各キーボードのページに移動し、「FIRMWARE」タブからファームウェアのダウンロードとマイコンへの書き込みができます。
「FLASH」ボタンを押します。
※ProMicroならCaterina、Elite-CやKeyMicroなどのProMicro互換マイコンならDFUを選択してください。
※※WindowsパソコンでDFUブートローダの書き込みを実施する場合、ドライバを変更する必要があります。
どうしてもRemapでやりたいのでなければ、RemapからファームウェアのHEXファイルをダウンロードし、QMK Toolboxでの書き込みをオススメします。
小さい画面が出てきたらキーボードのリセットボタンを押し、USB機器が抜ける音ともう一度刺さる音がします。
そして画面上のCOMポート番号(下の図ではCOM17となっている部分)が変化したことを確認して「接続」ボタンを押します。
書き込みが自動で始まり、最後に「Writing the firmware finished successfully.」と表示されたら書き込み完了です。
Tips:基本知識とか、設定方法とか
レイヤーとは
レイヤーとは市販のコンパクトキーボードにあるファンクションキーに該当するもので、使用する状況に応じて複数設定する事ができます。
レイヤーの異動はキーマップ編集画面の左のLAYERから変更します。
ハードリセットについて
キーマップの書き換え時に不具合が発生して、最初の状態に戻したいときはハードリセット(EEPROMリセット)を試してみてください。
方法はキーボードの一番左上のキー(概ねエスケープキー)を押しながらUSBを接続すると初期状態に戻ります。
個人的経験に基づく設定の煮詰め方
以下の記事はQMK Configuratorの記事ですが、煮詰める手法については共通です。
salicylic-acid3.hatenablog.com
Remap用ファームウェア、キーマップJSONの作成方法について
VIA用の記事ではありますが、以下の記事を参考にしてください。
salicylic-acid3.hatenablog.com
RemapにキーマップJSONの登録する方法について
フォームの指示に従って残りの項目を入力します。
キーマップJSONとキーボード開発のエビデンス(他の人が勝手にキーボードを登録しないようにする証拠)に問題がなければレビューの後に承認されます。
カタログ/ファームウェアの登録について
Remapのカタログ機能とファームウェア書き込み機能はどちらも非常に便利なので、Remapに登録したら同時にやっておくと良いと思います。
登録が完了したキーボードの「DETAILS」を押します。
「CATALOG」タブをクリックし、写真のアップロードや説明を追加します。
「FIRMWARE」タブをクリックし、HEXファイルをドラッグした上で名前、説明、ソースコードのURLなどを入力し、「Flash Firmware Support」をYesを選択した上で「UPLOAD」ボタンを押します。
Remapの最新のQMKへの対応状況
本記事更新時点(2023/2/16)ではRemapは最新のQMKのバージョンである19には追従していません。
よって、最新の環境でファームウェアを作成するとRemapでは対応できないということになります。
もしRemapを使用していて、レイヤーキーなどを設定しても他のキーとして認識してしまう場合、このバージョン違いによる影響の可能性があります。
その場合は、VIAを使用してみてください。
salicylic-acid3.hatenablog.com
Remapに貢献する
ユーザからのフィードバックは非常にありがたいとのことなので、不具合報告や機能要望についてGitHub IssuesまたはRemapのDiscodeサーバへ寄せるとより良いものにできると思います。
おわりに
Remapについて出来る限り詳しく解説してみましたが、いかがでしたでしょうか。
本記事の記載内容に対して変更や更新要望等あれば遠慮なく私のDiscordまでどうぞ。
salicylic-acid3.hatenablog.com
Remap自体の不具合報告は上記のRemapのDiscodeサーバ等へお願いします。
本記事はNaked64SF v3で書きました。