Making Fonts/ja

From Procedural Objects
Jump to navigation Jump to search
    I18n.png  言語 En flag.jpg English Fr flag.png Français Es flag.png Español De flag.jpg Deutsch Nl flag.png Nederlands Ru flag.jpg Русский Ko flag.png 한국어 Zh flag.png 简体中文 Ja flag.png 日本語 Th flag.png ภาษาไทย


Procedural Objectsのテキストのカスタマイズツールから、カスタムフォントを使用することができます。
デフォルトではArialの1種類しかありませんが、ワークショップからアセットとして色々なPO用のフォントを導入することができます。

POのフォントは、2つの要素で構成されています。

  • .pofont形式のファイル : このファイルは、フォントに関する色々な情報(フォントの名前・サポートする文字・サポートするスタイルやカラーの有無・カーニング情報など)が含まれます。
  • .png形式のファイル : 実際に表示する文字が含まれる、.pngファイルになります。(1つまたは3つのpngファイルのいずれか)

自作したフォントをワークショップで公開したい場合は、同じサブフォルダに作成・配置する必要があります。(フォントの公開・共有の項目を参照)

PNGのフォントテーブル[edit | edit source]

フォント用のフォントテーブルは、全ての文字を含んだPNG形式のファイルになります。

  • このMODでは、標準的なTTF形式のフォントやSVGやJPGは扱えません。
  • フォントがNormal、Italic、Boldの各スタイルをサポートしたい場合は、各スタイルごとに1つのpngファイルが必要になります。
  • スタイルをサポートをしない場合は、フォントテーブルは1つだけで構いません。

また、各種のフォントテーブルは手動で作成するか、PO Font Generatorのプログラムを使って自動的に作成することもできます。

手動でのPNGテーブルの作成[edit | edit source]

  • PNGファイルは背景が透明(透過設定)で、「幅が518」である必要があります。(デフォルト設定)
    • 高さに関しては、フォントが扱う文字の種類によって異なります。
  • 各1文字ごとでPNGファイル上には、50×50ピクセル四方のスペースが割り当てられます。(デフォルト設定・このサイズは変更可能)
    • 順番に10文字ごとに並んで、それぞれの各列と各行の間には2ピクセル幅でスペースが空けてあります。
    • (デフォルト設定の幅(高さ)が518の場合 : 50ピクセル x 10列(10行) + 間の9文字分のスペース x 2ピクセル = 518ピクセルが成り立ちます)
    • 補足して、高さについても同様です。

カスタム文字のサポートが未指定の場合は、フォントはデフォルトで130文字分を扱います。

  • この場合はPNGの高さが、「674」ピクセルで指定・調整する必要があります。
Arial table.png Font guidelines.jpg
Arialフォントのテーブル(Normalスタイル) フォント作成時に使用可能なガイドラインのパターン
(テスト・公開時には削除すること))

PNGテーブルの自動生成[edit | edit source]

PO Font Generatorのスクリーンショット

Procedural Objects Font Generatorプログラムは、Windowsコンピュータ上でのみ動作する.exe形式のプログラムです。
このプログラムはコンピュータ上にインストール済みで、選択されたフォントに基づいてフォントテーブルを作成します。

  • デフォルトでは、このプログラムはPOのLocal Fontsフォルダにフォントを自動的にエクスポートします。
    • フォルダのパス : C:\Users\<username>\AppData\Local\Colossal Order\Cities_Skylines\ProceduralObjects\Fonts
  • プログラムが該当するフォルダを見つけられない場合は、エクスポート先のフォルダの選択を求められます。
  • このエクスポート先のフォルダは、「ファイル」→「新しいPO Fontsディレクトリを選択」で変更できます。

機能がわかりにくい場合は、各機能の上でマウスオーバーしてみてください。いくつかの機能には、ツールチップ上での説明があります。

このプログラムは、PNGのフォントテーブル(Normalのみ・オプション選択時はItalicとBoldを含む)をエクスポートします。

  • そして、エクスポートしたフォントで.pofontファイルも一緒に生成されます。
  • 適切なフォルダ(POのLocal Fontsフォルダ)にエクスポートされていれば、エクスポート後にフォントをすぐにテスト・使用することもできます。
  • このプログラムでは、フォントのカーニングデータは自動的には作成されませんので注意してください。(下記項目を参照)

警告: カーニングデータの注意点

  • 自動カーニングデータについては、下記にある専用セクションを確認してください。
  • 文字数の大量(例えば250文字以上)のフォントを作成したい場合は、自動カーニングデータを全ての文字に対して使用しないでください。
  • エクスポートされたデータセットは、文字数に応じて指数関数的に増加してデータが肥大化していきます。
  • その結果、OSが不安定になったり・メモリを大量に消費してクラッシュする場合があります。

POFONTの情報ファイル[edit | edit source]

.pofontファイルは、MODがPNGファイルをフォントとして認識するための設定ファイルです。
ファイル名は余り重要ではありません。このファイルは、メモ帳やNotepad++などで簡単に編集できます。
ファイルには以下の情報が含まれています。(1行に1つの項目・設定、以下の例を参照)

  • フォントの名前の識別子 : name
    • フォントの名前は非常に重要であり、アップデートで変更することはできません。
    • 変更すると別物扱いになり、フォントが無いことになってエラーの原因になります。
    • これはMOD内で、テキストフィールドで使用するフォントを決定するために使用されます。
    • また、インターフェイス上に表示されるフォント名にもなります。
  • Normalスタイルで使う、PNGのフォントテーブルの名前の識別子 : normal
    • フォントのNormalスタイルに対応する、PNGファイルの名前を指定します。
    • 拡張子部分の「.png」は記述しないでください。
  • Italicスタイルで使う、PNGのフォントテーブルの名前の識別子 : italic
    • フォントのItalicスタイルに対応する、PNGファイルの名前を指定します。
    • 拡張子部分の「.png」は記述しないでください。
    • BoldとNormalの両方が存在する場合のみ機能します。
  • Boldスタイルで使う、PNGのフォントテーブルの名前の識別子 : bold
    • フォントのBoldスタイルに対応する、PNGファイルの名前を指定します。
    • 拡張子部分の「.png」は記述しないでください。
    • ItalicとNormalの両方が存在する場合のみ機能します。
  • 文字間のデフォルトスペースの識別子 : defaultSpacing
    • 文字と文字の間に適用される、デフォルトのスペースをピクセル単位で指定します。
    • プレイヤーも変更することが出来て、フォントの選択・指定時に入力された値が適用されます。
    • 設定されていない場合は、デフォルトでは2ピクセルになります。
  • スペースの幅の識別子 : spaceWidth
    • スペースバーを押したときのスペースの幅を、ピクセル単位で指定します。デフォルトは21ピクセルです。
  • PNGファイルに含まれる文字の識別子 : characters
    • この値が設定されていると、テーブルに含まれる文字がどのような順番かをMODに伝えることができます。
    • デフォルト : ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyzàáäåâãìíïîòóöøôõœèéëêùúü-ûð&ÿ'ñßç,!.?:0123456789+=%µ#§€$£;<>"°@(){}/\_*[]¤^²|~
    • この値はセミコロンで区切られた、Unicode UTF-16コードで連続した記述が必要です。
    • これは、unicode converterを使用しNotepad++から、「\u」をセミコロンに置換することで可能です。
  • PNGテーブルに割り当てる1文字ごとのサイズの識別子 : charSize(オプション)
    • PNGファイルの1文字ごとに、割り当てる幅と高さを設定します。
    • 変更時した場合は、フォントの編集時にPNGテーブルの幅と高さを各自で計算・調整してください。(上記の項目を参照)
    • デフォルトは50ピクセルです。
  • フォントが色変更に対応の有無の識別子 : disableColorOverwriting (オプション)
    • 色付きのシンボルを含むフォントを作成するときに便利です。
    • 例えばプレイヤーが色を白に設定してしまい、pngテーブル側にある色の上書きを防ぐ場合に利用します。
    • 色の上書きを防ぎたい場合は、disableColorOverwriting = trueに設定します。
  • フォントが3つのPNGテーブルを持つ場合、スタイル名の「'N'」・「'B'」・「'I'」を他に変更可能の識別子 : stylesNames(オプション)
    • デフォルトにある、各「N」・「B」・「I」を別の文字に置き換えることができます。
    • 記述方法 : stylesNames = N,B,I
  • カーニングのデータ
    • これは必須ではありませんが、フォントの見栄えを良くすることができます。
    • カーニングのラインは、必要とされる数だけいくらでも追加できます。
    • カーニングのラインは2つの文字が連続して入力・配置されたときに、どれだけのスペース(ピクセル)を除去するかMODに伝えます。
    • カーニングのデータラインは次のように記述されます。
      • krng[styles](first character, second character) = pixels
      • [styles]は、Normal, Bold, Italic, NormalItalic, NormalBold, NormalItalicBoldで設定します。
      • first characterは、設定した1文字目の0から始まるインデックス番号になります。上図のデフォルト順序だと、Aは0・Bは1・Vだと21で増分しながら続きます。
      • second characterは、設定した2文字目の0から始まるインデックス番号になります。
      • pixelsは、first charactersecond characterが連続して入力されたときに除去するピクセル数です。
    • 例: 全てのスタイルでAとVを続けて入力された場合は、AとVの間の4ピクセルを削除 : krngNormalItalicBold(0,21) = 4
    • カーニングのデータは、MODで自動的に作成することも可能です。(下記の専用セクションを参照)


Cozonaq氏による、greek PO Font Packを修正した.pofontファイルの例です。(charactersが短くなっています)
カーニングのデータは含まれていないことに注意してください。

name = (gr)TM
normal = (gr)TMW
italic = (gr)TMY
bold = (gr)TMB
defaultSpacing  = 2
characters = 0041;0042;0043;0044;0045;0046;0047;0048;0049;004a;004b;004c;004d;004e;004f;0050;0051;0052;0053;0054;0055;0056;0057;0058;0059;005a;0061;0062;0063;....
spaceWidth = 21
disableColorOverwriting = true
stylesNames = W,B,Y
name = Arial
normal = arial_fonttable
italic = arialItalic_fonttable
bold = arialBold_fonttable
spaceWidth = 21
krngNormalItalicBold(0,2) = 3
krngNormalItalicBold(2,0) = 3
krngNormalItalicBold(3,0) = 3
krngNormalItalicBold(5,0) = 4
krngNormalItalicBold(0,6) = 2
krngNormalItalicBold(6,0) = 2
krngNormalItalicBold(0,14) = 3
krngNormalItalicBold(14,0) = 3
krngNormalItalicBold(15,0) = 5
krngNormalItalicBold(0,16) = 3
krngNormalItalicBold(18,0) = 1
krngNormalItalicBold(0,19) = 6
krngNormalItalicBold(19,0) = 5
krngNormalItalicBold(0,20) = 1
krngNormalItalicBold(20,0) = 1
krngNormalItalicBold(0,21) = 9
krngNormalItalicBold(21,0) = 9
krngNormalItalicBold(0,22) = 6
krngNormalItalicBold(22,0) = 6
krngNormalItalicBold(0,24) = 7
krngNormalItalicBold(24,0) = 7
krngNormalItalicBold(0,29) = 1
krngNormalItalicBold(29,0) = 1
krngNormalItalicBold(0,30) = 1
krngNormalItalicBold(30,0) = 1
krngNormalItalicBold(43,0) = 2
krngNormalItalicBold(47,0) = 2
krngNormalItalicBold(0,47) = 2
krngNormalItalicBold(0,48) = 2
krngNormalItalicBold(81,0) = 5
krngNormalItalicBold(0,81) = 4
krngNormalItalicBold(119,0) = 4
krngNormalItalicBold(0,120) = 4
krngNormalItalicBold(0,122) = 3
krngNormalItalicBold(122,0) = 3
krngNormalItalicBold(1,6) = 2
krngNormalItalicBold(1,14) = 2
krngNormalItalicBold(1,16) = 2
krngNormalItalicBold(1,19) = 2
krngNormalItalicBold(2,6) = 3
krngNormalItalicBold(10,2) = 3
krngNormalItalicBold(2,14) = 3
krngNormalItalicBold(2,16) = 3
krngNormalItalicBold(2,21) = 2
krngNormalItalicBold(2,22) = 2
krngNormalItalicBold(2,24) = 2
krngNormalItalicBold(23,2) = 3
krngNormalItalicBold(24,2) = 3
krngNormalItalicBold(25,2) = 3
krngNormalItalicBold(2,25) = 3
krngNormalItalicBold(3,24) = 4
krngNormalItalicBold(5,9) = 4
krngNormalItalicBold(11,21) = 5
krngNormalItalicBold(11,22) = 4
krngNormalItalicBold(11,24) = 6
krngNormalItalicBold(10,14) = 4
krngNormalItalicBold(17,14) = 2
krngNormalItalicBold(14,19) = 5
krngNormalItalicBold(19,9) = 5
krngNormalItalicBold(19,14) = 5
krngNormalItalicBold(22,9) = 3
krngNormalItalicBold(14,23) = 4
krngNormalItalicBold(23,14) = 4
krngNormalItalicBold(14,24) = 4
krngNormalItalicBold(24,14) = 4
krngNormalItalicBold(14,25) = 2
krngNormalItalicBold(15,9) = 6
krngNormalItalicBold(43,26) = 3
krngNormalItalicBold(43,28) = 3
krngNormalItalicBold(43,29) = 2
krngNormalItalicBold(43,30) = 3
krngNormalItalicBold(43,31) = 2
krngNormalItalicBold(43,32) = 2
krngNormalItalicBold(43,34) = 2
krngNormalItalicBold(43,35) = 3
krngNormalItalicBold(43,40) = 3
krngNormalItalicBold(43,42) = 3
krngNormalItalicBold(43,44) = 3
krngNormalItalicBold(43,51) = 2
krngNormalItalicBold(43,52) = 3
krngNormalItalicBold(43,53) = 3
krngNormalItalicBold(43,54) = 3
krngNormalItalicBold(43,55) = 3
krngNormalItalicBold(43,56) = 3
krngNormalItalicBold(43,57) = 3
krngNormalItalicBold(43,58) = 2
krngNormalItalicBold(43,59) = 2
krngNormalItalicBold(43,60) = 2
krngNormalItalicBold(43,61) = 2
krngNormalItalicBold(43,62) = 3
krngNormalItalicBold(43,63) = 3
krngNormalItalicBold(43,64) = 3
krngNormalItalicBold(43,65) = 3
krngNormalItalicBold(43,66) = 3
krngNormalItalicBold(43,67) = 3
krngNormalItalicBold(43,68) = 3
krngNormalItalicBold(43,69) = 3
krngNormalItalicBold(43,70) = 3
krngNormalItalicBold(43,71) = 3
krngNormalItalicBold(43,72) = 3
krngNormalItalicBold(28,30) = 2
krngNormalItalicBold(30,28) = 2
krngNormalItalicBold(28,40) = 2
krngNormalItalicBold(28,42) = 2

右側の記述はArialフォント(MODのデフォルトフォント)の.pofontファイルです。
文字の組み合わせごとに、たくさんのカーニングのデータが含まれています。

POはカーニングをしなくても自動的に文字の間隔をできるだけ狭めます。
自動調整なので、どうしても文字が離れて見えることがあります。(下図を参照)

Kerning.png

カーニングデータの自動化[edit | edit source]

Procedural Objectsは、カーニングデータの作成作業を自動化することができます。
作業方法:

  • 設定パネルの「デベロッパーツールを表示する」にチェックを入れます。
  • ゲーム内でフォントをテスト(下記参照)して、作業したいフォント名をクリックして文字テーブルを開きます。([[Text Customization/ja#Text fields|テキストのカスタマイズ]を参照)
  • 文字テーブルの下までスクロールすると、カーニングデータを計算してエクスポートするオプションがあります。
    • 除外文字のインデックス番号は、計算に含めたくない0から割り当てた各文字のインデックス番号になります。
    • 例えば、アンダースコアを含める文字の下側に配置されて、意図しない配置をする場合があります。
    • エクスポートする前に、除外したい文字のインデックス番号をカンマで区切って記述します。
  • エクスポートされたデータは、フォントがインストールされているデフォルトのフォルダ内に.txtファイルで出力されます。
    • フォルダのパス : C:\Users\<username>\AppData\Local\Colossal Order\Cities_Skylines\ProceduralObjects\Fonts
  • エクスポートで出力された.txtファイルの内容を、.pofontファイルの中にコピー&ペーストしてください。

警告: 文字数の大量(例えば500文字以上)のフォントを作成したい場合は、自動カーニングデータを全ての文字に対して使用しないでください。

  • エクスポートされたデータセットは、文字数に応じて指数関数的に増加してデータが肥大化していきます。
  • その結果、OSが不安定になったり・メモリを大量に消費してクラッシュする場合があります。
  • Note: 現時点では、「除外したい文字」ボックスで文字範囲の指定が出来ません。1文字ずつの指定になります。

フォントのテスト[edit | edit source]

  • POのローカルフォントのフォルダ内に自作したフォント用のフォルダを作成します。
    • ローカルフォントのフォルダのパス : C:\Users\<username>\AppData\Local\Colossal Order\Cities_Skylines\ProceduralObjects\Fonts
  • 作成したフォルダ内に、自作したPNGファイルとPOFONTファイルをコピーします。
  • 問題がなければ、ゲームを起動します。
  • 既にゲームプレイ中の場合は、フォントの管理タブでフォントを更新することができます。


以前のPOでのフォントテストのプログラム
バージョン1.6.3以前は、ゲーム内からフォントを更新できませんでした。
  • POFontTest programを使えば、毎回ゲームを起動することなくテストができます。
  • このプログラムは、フォントテーブル内の文字の順番がデフォルト設定のみで動作します。
  • このパックをダウンロードして解凍し、「fonttable.png」ファイルを自作したフォントに置き換えて(fonttable.pngをリネーム)、プログラムを起動してください。
  • カーニングのデータを除く、フォントにある全ての要素をテストすることができます。

フォントの公開・共有[edit | edit source]

1種類のフォント・複数のフォントをまとめてなど、あらゆる種類のコンテンツと一緒に共有することができます。
(例えば、フォントとMODを同じワークショップアイテムで共有したり、フォント+Prop・フォント+LUTなど)

  • 通常の操作で、ワークショップへのアップロードを準備します。(コンテンツマネージャーでアイテムの「共有」をクリック)
  • プレビュー画像の右下にあるフォルダアイコンをクリックして、アップロードフォルダを開きます。
  • 対象となるコンテンツのフォルダに移動します。
  • ゲーム内でフォントのテスト時に作成したフォルダ(.pofontと.pngを含むフォルダ)を、このフォルダに直接コピーします。
  • ワークショップへの公開時にフォントのみにしたい場合は、コンテンツのフォルダ内から他の.crpファイルを削除してください。
    • ワークショップで見つけやすいように、プレビュー画像を作成して一緒に格納した方が良いでしょう。
  • 問題が無ければ、通常通りアップロード作業を続けてください。

ワークショップのアイテムをサブスクライブしているプレイヤーは、これらのフォントが「テキストのカスタマイズ」タブに表示されます。

  • アップロードが完了したら、ゲーム内でフォントをテストする際に作成したtest用のフォルダを削除します。
    • 残しているとワークショップに公開したフォントと内容が重複して、管理のしにくさや操作ミスの原因になります。
  • 先ほど、公開した自作したフォントのサブスクライブします。
    • フォントの設定や内容に間違いが無いか、確認してください。
  • 自作したフォントをワークショップにある公式のPO Fontsコレクションに登録・掲載してほしい場合は、制作者に連絡する必要があります。

将来的にフォントを修正・更新できるようにしたい場合は、ワークショップのアップロードに使用するアイテムは1つだけにしてください。

  • そして、後から更新のために見つけられるようにしてください。
  • 複数あるとプレイヤー側でサブスクライブ時の混乱や、アップロード時の更新ミスの原因になります。
  • 自分のSteamのお気に入りに追加したり、PO用のコレクションなどを作成して管理できるようにしましょう。