itouhiroメモ

M⁺（エムプラス）フォント wikipedia:M+ FONTS を丸ゴシック化 wikipedia:丸ゴシック体 しました！

Rounded M⁺（ラウンデッド・エムプラス）という名前です。

ダウンロード

※2012-02-29　一部の文字（全角の０〜７）がおかしい問題を修正しました。

※2012-02-27　フォント名の問題（Windows7のフォントフォルダで見ると「Rounded M+」ではなく「M+」フォントにインストールされる）を修正しました。

フリーフォントです。

プロポーショナル（可変幅）

Rounded M+ 1p

http://sourceforge.jp/projects/mix-mplus-ipa/downloads/55073/rounded-mplus-1p-20120229.tar.xz/ (6.6 MB)

Rounded M+ 2p

http://sourceforge.jp/projects/mix-mplus-ipa/downloads/55073/rounded-mplus-2p-20120229.tar.xz/ (6.6 MB)

Rounded M+ 1c

http://sourceforge.jp/projects/mix-mplus-ipa/downloads/55073/rounded-mplus-1c-20120229.tar.xz/ (6.6 MB)

Rounded M+ 2c

http://sourceforge.jp/projects/mix-mplus-ipa/downloads/55073/rounded-mplus-2c-20120229.tar.xz/ (6.6 MB)

等幅（モノスペース）

Rounded M+ 1m

http://sourceforge.jp/projects/mix-mplus-ipa/downloads/55073/rounded-mplus-1m-20120229.tar.xz/ (4.4 MB)

Rounded M+ 2m

http://sourceforge.jp/projects/mix-mplus-ipa/downloads/55073/rounded-mplus-2m-20120229.tar.xz/ (4.4 MB)

Rounded M+ 1mn

http://sourceforge.jp/projects/mix-mplus-ipa/downloads/55073/rounded-mplus-1mn-20120229.tar.xz/ (4.4 MB)

xzファイルは、Windowsの場合 7-Zip http://sevenzip.sourceforge.jp/ で展開できます。

Linuxの場合、以下で展開できます。

tar Jxvf rounded-mplus-1m-20120226.tar.xz

紹介

• すべての文字に対して丸ゴシック処理をしてあります。なので、□★などの記号も角が丸いです。欧米文字もすべてラウンデッドです。
• 現在のM⁺フォントに収録されている43のttfファイルすべてを含みます。
• ライセンスはM⁺フォントと同じです。
• M⁺フォントのソースコードを 2012-02-24T02:24:00+09:00 に取得して生成しました。

制限事項

• このフォントの含む文字は M⁺ TESTFLIGHT 046＋2012-02-24朝までの追加分、つまり約3775文字です。JIS第1、第2水準の6355文字には足りないので、表示されない漢字があります。
• 縦書きは等幅フォント(1m, 2m, 1mn)のみ可能です。より正確に言うとAdobe製品ではプロポーショナルフォント(1p, 2p, 1c, 2c)が縦書き文字になりません（Illustrator CS4で確認）。Microsoft Word 2010/2000では縦書き文字になるのですが‥‥。

制作メモ

Rounded M⁺フォントの制作方法を紹介します。

制作環境

• Windows XP
• Adobe Illustrator CS5.1
• Xtream Path 1.4
• AutoHotKey_L 110602 (Unicode 32bit)
• Ubuntu Linux 10.04
• fontforge 0.0.20090923-2

どーやって丸ゴシック化したのさ？

M⁺フォントの漢字は現在 三千数百文字もあるからね。手動で修正すると何年もかかる（これを実行してるM⁺の作者さんはスゴイな！）ので、自動化を考えた。実は丸ゴシック化に役立つAdobe Illustrator向けのプラグインがあるのだ。

Xtream Path

http://www.flashbackj.com/xtreampath/

Xtream Pathが丸ゴシック化にいかに役立つのかを説明する記事

http://www.dtp-transit.jp/adobe/illustrator/post_992.html

ほう、これを使おうっていうんだね。

そう。

M⁺フォントの字形ファイルとして提供されているのはsvgファイルとaiファイル。

なにが違うかというと、どちらも同じ字形が入っているのだが、フォント作成に直接使うのはsvgファイル。aiファイルはsvgファイルを出力加工する前の原料ファイルという感じ。

じゃあ編集はaiファイルに対してするのかな？

今回は丸ゴシック化をプラグインにおまかせするのでどちらでもよかったのだが、aiファイルのほうが自動化処理と相性がよい作り（枠線の選択が容易）になっていたので、aiファイルを読み込むことにした。

自動化

肝心の自動化だが、Illustratorの「アクション／Actions」を使う。

アクション 'glyph rounded' の内容:

1. [File - Scripts - AiCS5-SelectGroupItem.jsx] を実行して、文字の周りにある枠線を選択する。
2. [Edit - cut] で選択した枠線をカット。これで枠線を一時的に画面から消せる。
3. [Edit - Select All] で全選択。これで文字をすべて選択。
4. [Object - Blend - Expand（拡張）] でブレンド機能の補間された文字パーツを、実オブジェクト化する。
5. [PathFinder - Unite（合体）] で字形を合体させる。これしないとつながってる線が一部途切れたりする
6. [Object - Filters - XtreamPath - スマートラウンド] 字形を丸ゴシック化する。
7. [Paste in Place] で先ほど消した枠線を、元の位置に戻す。
8. [File - Script - AiCS5-SaveAsSvgToOtherDir.jsx] を実行して、SVGとして保存。
9. [File - Close] でファイルを閉じる

1. 枠線を選択

どうして「枠線」を選択する必要があるの？

M+フォントの生成にはsvgファイルの中に<rect ..>タグの形で「文字の枠線」が入っている必要がある。しかし枠線残したまま丸ゴシック化すると枠線の角が丸くなって<rect ..>タグじゃなくなりM+フォント生成がうまくいかなくなる。

だから、枠線は丸ゴシック化しないように、一時的に隠す必要があるんだ。隠すためにはまず「選択」する必要があるってわけ。

なるほど

上記のアクションを作るには、Actionsパネルの「録画」ボタンを押して動作を記録していくんだ。しかしここで問題が起きた。最初の「文字枠を選択する」という行為が記録されないのだ。これをアクションで実行するにはどうするか。Adobe ExtendScript Toolkit を使う。

Adobe ExtendScript Toolkit？

これについては以前書いた。 http://d.hatena.ne.jp/itouhiro/20090614 Illustratorを自動操作する一つの方法だね。しかしドキュメントに乏しい。C:\Program Files\Adobe\Adobe Illustrator CS5.1\Scripting\Sample Scripts\JavaScript (WindowsXPの場合) にあるサンプルスクリプトが参考になる。

結局 C:\Program Files\Adobe\Adobe Illustrator CS5.1\Presets\en_GB\Scripts (WindowsXPの場合) に AiCS5-SelectGroupItem.jsx というテキストファイルを置いた。'Program Files'フォルダ以下に置くのはためらわれたが、Illustratorのメニューに表示する方法はこれしか分からなかった。

AiCS5-SelectGroupItem.jsx:

var i;
//ブレンドされたパスのロックを解除
var blendItems = app.activeDocument.pluginItems;
for (i=0; i<blendItems.length; i++){
    if (blendItems[i].locked == true){
        blendItems[i].locked = false;
    }
}
var groupItems = app.activeDocument.groupItems;
var mosttop = -1; //Illustrator CS5は実アプリとスクリプトで座標値が異なり、スクリプトのmaxは実アプリのminなのでこんな変数名に
var mostindex = -1;
for (i=0; i<groupItems.length; i++){
    //グループ化されたパスのロックを解除
    if (groupItems[i].locked == true){
        groupItems[i].locked = false;
    }
    //Y座標が一番上にあるグループを探す
    if (mosttop < groupItems[i].top){
        mosttop = groupItems[i].top;
        mostindex = i;
    }
}
//Y座標が一番上にあるグループ（ここでは枠線）を選択
groupItems[mostindex].selected = true;

このスクリプトはいくつかの処理をやっている。

• 枠線を自動で選択する
• 枠線を選択できない理由のひとつ、グループ化された枠線がロックされている（hiragana2/244F.ai, 2464.ai 等）なら自動でロック解除する
• プラグインXtreamPathが効かない理由のひとつ、ブレンドされた字形パーツがロックされている（kanji/k1/k1-15.ai 等）なら自動でロック解除する

用意したスクリプトは [File - Scripts - AiCS5-SelectGroupItem.jsx] で実行できるが、そのまま実行しても記録されないので、Actionsタブ右上の▼で [Insert Menu Item]を選択。

参考にしたページ：

http://vector.tutsplus.com/tutorials/scripting/scripting-illustrator-part-2-how-to-meld-a-gradient-into-a-flat-process-color/

4. Blendの拡張

M+ FONTSは7つもウェイト（太さ）があるんだけど、実はブレンド機能を使っていくつかのウェイトは自動的に生成しているんだ。aiファイルはそのブレンド機能が残っているので、それを解除しておかないと丸ゴシック化がうまくいかない。[Object - Blend - Expand（拡張）] で解除して、個別のパスオブジェクトにできる。

5. 字形の合体

たとえば ○ の形の円だけど、[PathFinder - Unite（合体）] で字形を合体せずに丸ゴシック化すると、円の下の部分が ⊃⊂ のようにつなぎ目が見える感じになってしまう。それはまずいので合体するよ。

6. Xtream Pathプラグインを実行

[Object - Filters - XtreamPath - スマートラウンド] はActionsに記録できるのだが、アクション実行したときダイアログが出てきたまま、[OK]が押されずに停まったままになるのだ。これでは自動作業が先に進まない。どうにかして[OK]を押さねば‥‥

どうするの？

このプラグインにも、Illustratorにも[OK]を自動で押す機能はないようだ。となると何か別のものを使い[OK]を押す必要がある。そこでWindows専用だが AutoHotKey というソフトを使った。

ウィンドウを監視して、特定のウインドウがでるたびにボタンを押しまくるのはhttp://sites.google.com/site/autohotkeyjp/reference/Examples#TOC-13 の「定期実行」で可能だ。

こんなスクリプトになった。WindowClassの #32770というのはAutoHotKey付属のspyというプログラムで調べたぞ。

#Persistent                         ;ホットキーなどを使用せず、スクリプトを常駐
SetTimer,OnTimer,1000               ;指定サブルーチンを1秒ごとに実行
return                              ;スクリプト起動時の実行部分終了
OnTimer:                            ;タイマーに割り当てられるサブルーチンラベル
IfWinActive, ahk_class #32770
{
  SetControlDelay -1                ;動作安定度を上げるおまじない http://www.autohotkey.com/docs/commands/ControlClick.htm
  ControlClick,OK,ahk_class #32770,,,, NA
}
return                              ;タイマーサブルーチンの終了

ちなみに「#Persistent」の入ったスクリプト書いてるときは、一度実行すると「Reload Script」しても書きなおす前のスクリプトが実行終了してないので、いったんAutoHotKeyをExitしてから再実行する必要があった。

しかしこのAutoHotKeyスクリプト、XtreamPathのダイアログだけじゃなくて、IllustratorのBatchダイアログなんかも勝手に[OK]押してしまう。ほんとはもっとよい作りにできると思うが、今回は困ってないのでこれを使う。

AutoHotKey_Lは調子わるくなることがある。（ログ見るとControlSend送っているようなのだが押せてない）Win再起動すればよい。どうもCPU100%状態になると調子わるくなるみたい。

ところで丸ゴシック化には、すべての文字に同じ設定を使ってるの？

そうだよ。丸ゴシック化はXtreamPathまかせなんだ。以下の設定で一括処理した。

7. 枠線を元の位置に戻す

なぜか [Edit - Paste in Front](Ctrl+F)を実行すると「塗り」が黒になってしまうことが半分くらいのファイルで起きる。読み込むaiファイルごとに起きるか起きないかは再現性があるが理由がつかめない。これは[Edit - Paste in Front]の代わりに [Edit - Paste in Place](Shift+Ctrl+V)を使うようにしたら直った。

8. SVGとして保存

「アクション／Actions」の「別名で保存／Save As..」だと保存フォルダを絶対パスで記録してしまう。つまりいろんなフォルダから読み込んだaiファイルを「単一の」フォルダに保存してしまうのだ。これは困る。

M⁺フォントのsvgファイルは五十数個のフォルダに分けられているので、それと同じフォルダ構成で保存してほしい。そこで、保存に関しても別のIllustratorスクリプトを作った。

AiCS5-SaveAsSvgToOtherDir.jsx

//フォルダ名「/mplus」の部分だけ「/rounded」にして、あとのフォルダ構造は同じにする
var currentDoc = app.activeDocument;
var newFileName = currentDoc.name.substring(0, currentDoc.name.lastIndexOf('.')) + '.svg';
var newDirName = currentDoc.path.toString().replace('/mplus', '/rounded');

//出力フォルダがなければ作る
var newDir = new Folder(newDirName);
if(! newDir.exists){ newDir.create();}

var newFile= new File(newDirName + '/' + newFileName);
//ファイル保存できるかチェック
if (newFile.open('w')){
    newFile.close();
}else{
    throw new Error('Access is denied');
}

// SVGをExportするのは、SaveAsでSVG選ぶのと同じ扱い。つまり保存したあと実アプリで開いてるファイル名もsvgになる
// SVG1_0, UTF-8, PRESENTATIONATTRIBUTES は指定しないとM+のスクリプトがうまく動作しない。
var options = new ExportOptionsSVG();
options.DTD = SVGDTDVersion.SVG1_0;
options.documentEncoding = SVGDocumentEncoding.UTF8;
options.cssProperties = SVGCSSPropertyLocation.PRESENTATIONATTRIBUTES;
options.embedRasterImages = false;
options.includeFileInfo = false;
currentDoc.exportFile(newFile, ExportType.SVG, options);

参考: http://cssdk.host.adobe.com/sdk/1.0/docs/WebHelp/references/csawlib/com/adobe/illustrator/ExportOptionsSVG.html

アクション実行

このアクションを以下のように実行する。

1. まずM⁺フォントのソースコードを取得して、必要なファイルだけコピーする。シェルで svg.d ディレクトリの*.aiファイルのみ、フォルダ構造はそのままで、コピー。

% cd ~/mplus_outline_fonts; tar c --exclude=codemap --exclude=baseline --exclude='*s' --exclude-vcs --exclude='*.svg'  -f - svg.d | (cd ~/mplus_outline_fonts/tmp ; tar xvf -)

2. その svg.d フォルダを、mplus フォルダとリネームする。

% cd ~/mplus_outline_fonts/tmp/; mv svg.d mplus

3. Illustratorの「Actions」パネル右上から Batch を実行する。

4. 「Source: [Folder]」選び、その下の[Choose]ボタンで先ほどの mplusフォルダを指定する。'Include All SubDirectories' をチェックして実行。

5. 待つこと4時間ほどで、すべての文字について作業完了した。

これでだいたいは処理できるのだが、まだいくつか問題あるので、それは個別に処理した。

個別に処理した問題

枠線グループがうまく選択できない

以下はaiファイルの段階で枠線グループがうまく作られていないため、正常に選択できない。→Illustratorアクションが停止する。

対策: aiファイルを手動でグループ一つに修正しておく

• latin_proportional2/00B8.ai
• latin_proportional2/0050.ai
• latin_proportional1/00B8.ai
• latin_clear2/0050.ai

収録文字まちがい

以下は収録文字が少ない。アップロードされた元ファイルがまちがっている。

対策: latin_fullwidth1/uFF10.svgが正しい文字を含んでいるので、これから丸ゴシック化svgを再作成。

• latin_fullwidth1/uFF10.ai

svgファイルに<circle ..> タグが入り処理できない

丸ゴシック化すると字形パーツが正円になることがある。するとsvgファイルが <path ..>ではなく <circle ..>タグを含むため、M+フォント側のスクリプトで処理できない。→文字幅がおかしくなる https://twitter.com/#!/itouhiro/status/173321540589457408

対策: svgを開いて正円のポイントを微妙に移動して正円でなくする。具体的には、まず<circle ..>タグになってる箇所を明らかにする。svgファイルを別フォルダにコピーしてからテキストエディタで開いて<circle .. r="5.5"/> とかのrの数値を増やす。そしてIllustratorで開くと以下のようにcircleタグになっている箇所が判明する。

次に修正。svgファイルをIllustratorで開き、正円のアンカーポイントを微妙に移動する（今回は4つあるベジェポイントのうち下部の1つを選び0.01mm だけ下に移動）。上書き保存する。

以下のファイルを見つけるにはLinuxでこのコマンドを使った。

% find svg.d/ -name "*.svg" | xargs grep -Hc '<circle ' | grep -v ':0' | sort

• latin_clear1/0068.svg
• latin_clear1/0128.svg
• latin_clear1/0130.svg
• latin_clear1/01C8.svg
• latin_clear1/0268.svg
• latin_clear1/0298.svg
• latin_clear1/0450.svg
• latin_clear1/0458.svg
• latin_clear1/1EC8.svg
• latin_clear1/FB00.svg
• latin_monospace1/2020.svg
• latin_monospace1/2218.svg
• latin_proportional1/0378.svg
• latin_proportional1/0598.svg
• latin_proportional1/05B0.svg
• latin_proportional1/2020.svg
• latin_proportional1/2218.svg
• latin_proportional1/2638.svg
• latin_proportional1/26A8.svg
• miscellaneous1/u2038.svg
• miscellaneous1/u25C8.svg
• miscellaneous1/u25D8.svg

黒背景に白文字

黒背景に白文字のグリフが丸ゴシックにならない。

対策: XtreamPathの設定を逆にした。「山角部」は黒文字なら外側の線の角丸、「谷角部」が黒文字なら線の内側の角丸なのだが、白文字の場合はそれを逆にすれば丸ゴシック化できる。

• miscellaneous1/u24E8.ai (U+24EB-24F4, U+24FF)
• miscellaneous1/u24F0.ai (U+24EB-24F4, U+24FF)
• miscellaneous1/u2770.svg (U+2776-277F, U+278A-2793)
• miscellaneous1/u2778.svg (U+2776-277F, U+278A-2793)
• miscellaneous2/u24E8.ai (U+24EB-24F4, U+24FF)
• miscellaneous2/u2778.svg (U+2776-277F, U+278A-2793)

アクションが正常に保存されない

このアクション、Illustratorを再立ち上げすると一部欠けてしまうのだ。[Insert Menu Item..]の部分が消える。だからIllustratorを立ち上げるたびにアクションを再作成しなくてはならない。

以上の処理済みのsvgファイルを http://sourceforge.jp/projects/mix-mplus-ipa/releases/?package_id=12907 に svg-rounded-mplus-*.7z というファイル名でアップロードした。

いろいろやってるんだね

ついでにビルド方法もメモしておこう。

ビルド方法

CVSから取得したM+のソースコードを以下のようにコピーする。作ったttfファイルやスクリプト一式を残しておくためと、何度もソースを取得しないようにするため。

aiファイルはビルドに関係ないのでコピーしない。今回はsvgファイルはIllustratorで作ったものを使うのでソースからはコピーしない。

% tar c --exclude-vcs --exclude='*.ai' --exclude='*.svg' --exclude='eps.d' -f -  mplus_outline_fonts | (cd tmp/ ; tar xvf -)
% mv tmp/mplus_outline_fonts ~/m20120226

Windowsで7zにかためたsvgファイルを展開する。

% cd ~/m20120226/svg.d/
% 7z x /mnt/windows/rounded_mplus-20120226.7z

そしてビルド。

% cd ~/m20120226/
% MPLUS_FULLSET=yes make SPLIT_CONCURRENCY=2 -j2 2>&1 | tee `date +%Y%m%d-%H%M`.log

フォント名をリネーム。

  #リリースするフォントを集める
% cd ~/m20120226/release/
% make
  #フォント名をリネーム
% cd ~/m20120226/release/rounded/
% for F in ../mplus-TESTFLIGHT-046/*ttf; do fontforge -script  renamer.pe $F; done

renamer.pe

#!/usr/bin/env fontforge -script

if ($argc <= 1)
  Print("usage: fontforge -script renamer.pe foobar.ttf")
  Quit(0)
endif

# open font
Open($1)

# NameIDs
# http://partners.adobe.com/public/developer/opentype/index_name.html#enc4
copyright = GetTTFName(0x409,0)                     #0
family = 'Rounded ' + $familyname                   #1
weight = GetTTFName(0x409,2)                        #2 subfamily
uniqueID = "FontForge 2.0 : "+family+" : "+Strftime("%-d-%-m-%Y",0,'C')  #3
fullFamily = 'Rounded ' + $fullname                 #4
version = "1.046." + Strftime("%Y%m%d",0,'C')       #5
postscriptName = 'rounded-' + $fontname             #6
preferredFamily = 'Rounded ' + GetTTFName(0x409,16) #16
#preferredSubFamily                                 #17
newfilename = postscriptName

# rename
SetFontNames(postscriptName, family, fullFamily, weight, copyright, version)
SetTTFName(0x409, 3,  uniqueID)
SetTTFName(0x409, 16, preferredFamily)
SetTTFName(0x409, 11, "http://mix-mplus-ipa.sourceforge.jp")

## save font
Generate(newfilename + ".ttf", "", 0x84)
Print("Generate:" + newfilename + ".ttf")

フォントをxzアーカイブにする

  #フォルダを作成
% cd ~/m20120226/release/
% for T in 1c 1m 1mn 1p 2c 2m 2p; do D=rounded-mplus-${T}-`date +%Y%m%d`; mkdir ${D}; done
  #ttfファイルを分配
% for T in 1c 1m 1mn 1p 2c 2m 2p; do D=rounded-mplus-${T}-`date +%Y%m%d`; mv -v rounded/*${T}-*.ttf ${D}/; done
  #READMEをコピー
% for T in 1c 1m 1mn 1p 2c 2m 2p; do D=rounded-mplus-${T}-`date +%Y%m%d`; cp -vpr README_E_rounded.txt ${D}/; done
  #xz圧縮
% for T in 1c 1m 1mn 1p 2c 2m 2p; do D=rounded-mplus-${T}-`date +%Y%m%d`; tar cf - ${D}/ | xz -9e -c > ${D}.tar.xz; done

丸ゴシック、使ってみると小さいサイズでは角ゴシックとの違いがはっきりしないね。

大きいサイズで使うのがいいだろうね。プレゼン資料とかポスターとか