jazzguitarstyle.comで公開している楽譜はどのようなソフトを使っているのでしょうか?
僕も音楽サイトを作ろうと思うのですが、楽譜を作ってサイトに乗せる方法が分かりません。具体的な手順を知りたいです。

楽譜作成にはFinaleを使っています

2018年まではFinale2003、2019年からFinale25を使って作っています。
Finale公式サイト(https://www.finalemusic.jp/)
市販されている楽譜にも使われるソフトなのでやりたいことがすべてできます。

もしお使いのOSがWindowsならライト版のPrintMusicでも楽譜作りが可能です。
https://www.finalemusic.jp/products/printmusic/

購入は最安値のサウンドハウスがおすすめです。

Finale26
Finale25
2019年発売
【動作環境】
Windows 8または8.1/ 10(64-bit 必須)
macOS 10.12 Sierra/10.13 High Sierra/10.14 Mojave/10.15 Catalina/macOS 11 Big Sur
メモリ:4GB以上が必要

Print Music
PrintMusic Windows
2017年発売
【動作環境】
Windows Vista / 7 / 8 / 10(64-bit 互換)

楽譜フォント

Finaleには3つのフォントが付いています。

出版譜風
出版社風のサンプル楽譜
手書き風
Broadway Copyistのサンプル楽譜
ジャズ風
ジャズフォントを使ったサンプル楽譜
jazzguitarstyle.comではジャズ風を採用しています。

タブ譜に白玉をつける方法

TAB譜に全音符や2分音符を記譜する場合、◯で数字を囲む必要があります。Finaleには自動機能がついていないので、発想記号から自作します。

打ち込んだままの楽譜
編集前の楽譜譜
メインツールパレットから発想記号を選び、楽譜をダブルクリック。
発想記号選択

カテゴリからその他を選び(ここは何を選んでも構いません)
発想記号カテゴリ選択

その他の発想記号の作成を選びます。
発想記号の作成

図形を選び、小節の幅に合わせて伸縮のチェックを外して作成を押します。
小節の幅に合わせてのチェックを外す

円ツールを選んで丸を描いたらOK。
円ツールで丸を描く

作成した丸を選んで配置を押します。
作成した丸を選んで配置

タブ数字の大きさに合わせて丸を調整して完成です。
タブ譜に丸が置かれる

ダブルクリックすると大きさを変更できます。
ダブルクリックした発想記号

タブ譜に丸をつけた楽譜
タブ譜の白玉完成楽譜

ハーモニクスの菱形をつける方法

五線譜のハーモニクスは符頭変更ツールを選んで変更します。
符頭変更ツール

253番の菱形を選択(ジャズフォントの場合)。
符頭変更ツールの菱形を選ぶ

五線譜の符頭に反映されます。
五線譜のハーモニクス完成

タブ譜の菱形は白玉と同様に、その他の発想記号作成で菱形を描きます。作成した菱形を配置してタブ数字の大きさに合わせて調整して完成です。
発想記号で菱形を作成

完成した楽譜
タブ譜に配置して完成

コードダイアグラム

Finaleに付いているのは海外仕様の縦型ダイアグラムのみ。

Finaleのフレットボード画像

そのためjazzguitarstyle.comではタブ譜を活用して独自にダイアグラムを作っています。

ダイアグラム作成手順

  1. 空のタブ譜のみの楽譜を作る
    空のタブ譜画像
  2. 音部記号を非表示にして小節数を増やす。ナットは複縦線に
    音部記号をなくし小節を追加したタブ譜画像
  3. 文字発想記号で度数を作る
    文字発想記号で度数を書く画像
  4. 作った度数を小節線の上に置く
    CMa7のダイアグラム画像

五線譜の上にダイアグラムを記譜する楽譜は、五線譜とダイアグラムを別々に作り画像編集ソフトで仕上げています。

サイトに楽譜を載せるまでの手順

Finaleで作った楽譜をそのファイルのままサイトに載せる方法はないので、jazzguitarstyle.comでは以下6つの手順を踏んでいます。

  1. Finaleで楽譜を作る
  2. パソコンの画面をキャプチャして画像として保存
  3. 無料画像編集ソフトGIMP(https://www.gimp.org)を使ってサイズ調整
  4. tinypng(https://tinypng.com)で画像の容量を減らす
  5. FTPでサーバーにアップロード
  6. 画像のURLをリンクして公開

Finaleで作った楽譜をキャプチャする

サイトに載せたい楽譜を開いてキャプチャします。WinならPrintScreenボタンで全画面キャプチャ。Macならcommand+shift+4で範囲を選択できます。

スクリーンショットのサンプル楽譜
このままだと余白が多く、右側に灰色の鍵マークが入っているので、GIMPを使って編集します。

GIMPを使った画像編集

まずはキャプチャした画像をドラッグドロップします。

GIMPにドラッグドロップ

灰色の鍵マークを消すために、ツールボックスから「鉛筆で描画」を選び

GIMPで鉛筆を選ぶ

色の選択をクリックし、

GIMPでカラーを選ぶ

白を選びます。

GIMPで白色を選ぶ

「鉛筆で描画」、カラーが「白」になっていることを確認して灰色の鍵マークをゴシゴシ消していきます。

GIMPで鉛筆とカラーの確認

灰色の鍵マークを消したらツールボックスから「切り抜き」を選んで余白を無くします。

GIMPで切り抜き選択

範囲を選択してenterキーを押すと切り抜かれます。

GIMPで切り抜き範囲を選択

最後に「名前をつけてエクスポート」を選びpngとして保存します。

Winなら標準ソフト「ペイント」を使って同じことができます。

tinypngで容量を減らす

キャプチャした画像は容量が大きいので、楽譜の表示速度を速めるためにも容量を減らします。
tinypngにアクセスして減らした画像をドラッグドロップ。70〜80パーセント容量を減らしてくれるすぐれものです。

スクリーンショットをtinypngにドラッグドロップ

FTPでアップロード

私はFileZila(https://filezilla-project.org)というソフトを使ってアップロードしていますが、どんなFTPソフトでも構いません。アップロード後、アップロードした画像のアドレスをHTMLで打ち込みます。

HTMLサンプル
<img src="https://www.jazzguitarstyle.com/column/qanda/screen-shot-9.png">

ブラウザでの表示
スクリーンショットのサンプル楽譜完成版

これでサイトに楽譜を公開できます。ぜひ楽しんでみてください。

コメント一覧
  1. はじめまして。Jakeと申します。いつも勉強させていただいております。ありがとうございます。

     

    そこで私も触発されて楽譜等を作成してWebにアップしようと思ったのですが、ジョーイさんが説明に使用しているCメジャースケールのような楽譜はどのように作成すればよいのでしょうか?

     

    私はfinale2008を利用しているのですが、本当の楽譜になってしまい、譜例のような小節無視の作成法がわかりません。

     

    もし、簡単に譜例のような小節無視、譜割り無視の楽譜(譜例)画像の作り方があれば教えていただけないでしょうか?

    • 小節の拍子を増やすことで作っています。

       

      スケールの場合は7音なので、全音7個入る設定にします。
      Finaleの小節を7拍子に設定

       

      このままだと拍子記号に1/7と表示されてしまうので非表示にします。
      Finaleの拍子記号を表示しない設定

       

      この状態で音符を打ち込めば全音符を使ったメジャースケールになります。
      Finaleの拍子記号を表示しない設定

*