操作ガイド

楽譜エディタ
完全マニュアル

MIDIのインポート・楽譜の作成と編集・リアルタイム再生・エクスポートまで、すべての機能をやさしく解説します。

HTML + CSS + JS Web Audio API MIDI対応 ブラウザのみ
Section 01

ソフトウェア概要

このソフトウェアは、ブラウザだけで動作する楽譜エディタです。インストール不要で、MIDIファイルの読み込みから楽譜の作成・編集・再生・書き出しまでをすべて行えます。

📥

MIDIインポート

既存の .mid / .midi ファイルを読み込み、自動的に楽譜として表示します。ドラッグ&ドロップにも対応。

✏️

楽譜編集

クリックで音符を配置、削除、移動。拍子・調号・音価・付点など細かい設定も可能です。

▶️

リアルタイム再生

Web Audio API による高品質な音源でリアルタイム再生。BPM・音量・メトロノームを調整できます。

📤

エクスポート

作成した楽譜を MIDI ファイルまたは PNG 画像として書き出し、他のソフトと連携できます。

ℹ️
動作環境について Google Chrome / Microsoft Edge / Safari / Firefox の最新版で動作します。インターネット接続不要でオフラインでも利用可能です。
Section 02

画面構成

画面は上から順に、ヘッダー・ツールバー・トランスポートバー・メイン編集エリアに分かれています。

🎵 楽譜エディタ 📄 新規 📥 MIDIインポート 📤 MIDI出力 🖼️ PNG出力 ↩️ ↪️
↖ 選択 ♩ 入力 ✕ 消去 | 𝅝 全 𝅗𝅥 2分 ♩ 4分 ♪ 8分 𝅘𝅥𝅯 16分 • 付点 | 𝄽 休符
⏹ 停止 ▶ 再生 0:00 BPM 120 🥁 メトロノーム
ピアノキーボード
𝄞
ピアノロール
▲ 閉じる

① ヘッダー

新規作成、インポート/エクスポート、元に戻す/やり直しなどのファイル操作ボタン群。

② ツールバー

入力モードの切り替え・音価・記号・拍子・調号・小節操作。編集の中心となるバーです。

③ トランスポートバー

再生・停止・シーク・BPM調整・音量・メトロノームなど、再生に関するすべての操作。

④ 楽譜キャンバス

実際の楽譜が表示される領域。クリックで音符を配置し、ドラッグで選択します。左端にはピアノキーボードが付属。

Section 03

MIDIインポート

既存の MIDI ファイルを楽譜に変換します。2 種類の方法があります。

🎹 MIDIファイル .mid / .midi
🔍 解析 自動で変換
🎼 楽譜表示 編集・再生可能
  1. 方法 A:ボタンからインポート

    ヘッダー右上の 「📥 MIDIインポート」 ボタンをクリックします。ファイル選択ダイアログが開くので、.mid または .midi ファイルを選択してください。

  2. 方法 B:ドラッグ&ドロップ

    MIDI ファイルをブラウザウィンドウ上に直接ドラッグします。赤い点線のオーバーレイが表示されたらドロップしてください。

  3. インポート結果を確認

    自動的に音符・小節・BPM が読み込まれ、楽譜として表示されます。画面下のステータスバーに「インポート完了」と音符数・小節数が表示されます。

対応フォーマット
Standard MIDI (SMF) Format 0 / 1
テンポ検出
テンポメタイベントから自動取得
音符量子化
全音符〜16分音符に自動整形
MIDI音域
A0(MIDI 21)〜 C8(MIDI 108)
⚠️
注意:複数トラックについて 現在のバージョンでは、すべてのトラックの音符を 1 つの段に統合して表示します。複雑な曲では音符が重なることがあります。
Section 04

楽譜の編集

ツールバーの入力モードを切り替えながら、音符を追加・選択・削除します。

選択モード S

音符をクリックして選択します。選択した音符は赤くハイライト表示されます。Delete キーで削除可能。

入力モード N

楽譜上をクリックすると音符を配置します。クリック位置の高さがピッチ(音高)、横位置が拍の位置になります。

消去モード E

既存の音符をクリックすると即座に削除します。細かい修正に使います。

音価(音符の長さ)の設定

ショートカット 音価 拍数 ボタン
1全音符(𝅝)4 拍ツールバー「𝅝 全」
22 分音符(𝅗𝅥)2 拍ツールバー「𝅗𝅥 2分」
44 分音符(♩)1 拍ツールバー「♩ 4分」
88 分音符(♪)½ 拍ツールバー「♪ 8分」
616 分音符(𝅘𝅥𝅯)¼ 拍ツールバー「𝅘𝅥𝅯 16分」
.付点(×1.5)ツールバー「• 付点」

調号・拍子・小節の操作

  1. 拍子の変更

    ツールバー「拍子」のプルダウンから 4/4・3/4・2/4・6/8・12/8 を選択します。変更は即座に反映されます。

  2. 調号の変更

    「調」のプルダウンからハ長調・ト長調(♯1)など 8 種類の調を選択します。楽譜に調号記号が表示されます。

  3. 小節の追加・削除

    ツールバー右端の「+ 追加」で末尾に小節を追加、「− 削除」で最後の小節を削除します。

  4. 変化記号(シャープ・フラット)の追加

    ツールバーの「♯」「♭」「♮」ボタンをクリックして有効化した後、音符を配置すると変化記号付きで入力されます。もう一度クリックで解除。

💡
ピアノキーボードでも入力できます 画面左のピアノキーボードをクリックすると、選択中の音価で音符を追加します(入力モード時)。選択・消去モード時はプレビュー音を鳴らします。
Section 05

再生・トランスポート

トランスポートバーから再生を制御します。再生中は楽譜上に赤いプレイヘッドが流れます。

操作説明
⏹ 停止 / Esc 再生を停止し、プレイヘッドを先頭(0:00)に戻します。
▶ 再生 / Space 先頭または一時停止位置から再生を開始します。再生中にもう一度押すと一時停止。
プログレスバー クリックした位置にシーク(移動)できます。
BPM(数値入力) テンポを 20〜300 の範囲で直接入力します。
BPM スライダー スライダーを左右に動かしてテンポを変更します。数値入力と連動。
音量スライダー 音符の再生音量を調整します(0 〜 最大)。
🥁 メトロノーム クリックで ON/OFF。拍の頭に高音、2拍目以降に低音のクリック音が鳴ります。
ℹ️
ブラウザの音声ポリシーについて 初回の再生ボタンクリック時に、ブラウザが音声の許可を求める場合があります。その場合はページを一度クリックしてから再生してください。
Section 06

エクスポート

作成した楽譜は 2 種類の形式で書き出せます。

📤 MIDIエクスポート
Standard MIDI Format 0 で書き出します。DAW(Logic、Cubase、GarageBand等)や他の楽譜ソフトで読み込んで編集できます。テンポ情報・拍子情報も含まれます。
🖼️ PNG出力
楽譜キャンバスをそのまま PNG 画像として保存します。ブログや楽譜集の挿絵など、画像として使いたい場合に便利です。
🎼 楽譜編集 作成・編集
🖱️ ボタン押下 ヘッダーから
💾 自動ダウンロード .mid または .png
💡
ショートカット:Ctrl + S このキーを押すと MIDI エクスポートが即座に実行されます。頻繁に保存したい場合に便利です。
Section 07

キーボードショートカット一覧

よく使う操作はキーボードで素早く実行できます。テキスト入力欄にフォーカスがない状態で有効です。

キー 操作
Space再生 / 一時停止
Esc停止して先頭へ / 選択解除
N音符入力モードへ切り替え
S選択モードへ切り替え
E消去モードへ切り替え
1全音符を選択
22 分音符を選択
44 分音符を選択
88 分音符を選択
616 分音符を選択
.付点 ON / OFF
Delete / Backspace選択中の音符を削除
Ctrl + Z元に戻す(Undo)
Ctrl + Yやり直す(Redo)
Ctrl + SMIDI エクスポート
Section 08

使い方のヒント

より快適に使うためのポイントをまとめました。

🔄

Undo を積極的に使う

音符を間違えたら Ctrl+Z ですぐ戻せます。何回でも戻せるので、大胆に入力してください。

🎹

ピアノロールで全体確認

下部のピアノロールで音符の配置を俯瞰できます。「▲ 閉じる」ボタンで表示を切り替えられます。

🎧

MIDIをインポートして編集

既存の MIDI ファイルを読み込んで、不要な音符を削除したり、拍子・テンポを調整するだけで楽譜を完成させられます。

📐

小節数を事前に決める

最初に「+ 追加」で必要な小節数を準備してから入力を始めると、テンポよく作業できます。

🎵

メトロノームを活用

再生時にメトロノームを ON にすると、テンポ感を確認しながら聴けます。速度の微調整に便利です。

💾

こまめにエクスポート

ページを閉じるとデータは消えます。作業の区切りごとに Ctrl+S で MIDI として保存してください。

⚠️
データの保存について 楽譜データはブラウザのメモリ上にのみ存在します。ページを更新・閉じると消えます。必ず MIDI エクスポートで保存してください。