オリジナルツール / フォント一覧管理パネル「PI_FontList」完成(FW,FL,PS,AI)

※Light版を追加したので、エントリーを全体的にアップデートしてます(2010/04/14 )。
以下のエントリーのつづきです。
オリジナルツール / フォント一覧管理パネル 「PI_FontList(AI用)」を作りました。

前回はAI用だけリリースしましたが、今回は、以下のバージョンをリリースします。
機能限定、軽快動作のLight版も追加してます。
  • Fireworks CS4用
  • Flash CS4用
  • Photoshop CS4用
  • Illustrator CS4用
CS3の場合は、アプリごとに動いたり、動かなかったりして、検証が大変なので、CS4以上としています。
もうすぐ登場するであろうCS5については、当然、未検証です(たぶん、いけると思うけど)。

■ScreenShot

通常版「PI_FontList」



Light版「PI_FontList_Light」



■「PI_FontList」とは

ADOBE系ソフトの拡張パネルです。

OSにインストールされているフォントを一覧表示し、テキストオブジェクトに適用できます。
何百ものフォントから、目的のフォントを素早く探すため、グループ分けや、検索機能などを実装しています。

■機能一覧(通常版)

  • システムにインストールされているフォントを、リスト表示し、テキストオブジェクトに適応できます。
  • 独自のお気に入りフォントリストを作成できます(1から5まで)。
  • リスト表示時にフォントサムネイルを表示します(Macは非対応)
  • お気に入りフォントを強調表示できます。
  • フォントリストから、検索で絞り込めます。
  • リストの表示方法は、複数の種類があります。
    • テキスト
    • アイコン:S
    • アイコン:M
    • アイコン:L
  • リストの並び替え方法は、複数あります。
    • 昇順
    • 降順
    • ポピュラー(クリック数から算出)
    • ヒストリ
    • ランダム

■環境ごとの動作の違い

■アプリごとの動作の違い

動作速度については、以下の順番が若いほど、軽快に動作します。
  1. Fireworks用
  2. Flash用
  3. Photoshop用 (重い)
  4. Illustrator用 (重い)
FLASHで作成された拡張パネルなので、旧マクロメディア系の製品である、FireworksとFlashについては、
そこそこ軽快に動作します。
Photoshop、Illustratorについては、かなり動作が遅いので、
はじめに、タブによるグループ分けをおこなって、一画面ごとのリスト表示数をすくなくすることをオススメします。

もしくは、機能限定・軽快動作のLight版もあるので、そちらをつかってください。

■WindowsとMacでの動作の違い

基本的にはWindowsで開発しており、Win版をもとに、Mac版向け調整してます。
Mac版には、以下の動作制限があります。
  • Win版と比べると、動作が遅い
  • リスト表示時にフォントサムネイルを表示しない。
    (Macでも実装できるのですが、初期表示に、時間がかかりすぎるのではずしてます。)
検証が結構大変なので(特にMac)、不具合あったら、教えてください。
動作が遅いのは、とくに不具合ではありませんので。

■ビデオチュートリアル

実際の使用方については、こちらにて確認できます。

無編集なので、あくせくしてて、見やすくないですが、
なんとなく、機能をわかってもらえれば。

■プレビュー(通常版)

FLASHで作成したSWFファイルなので、ブラウザでも表示できます。
ってことで、貼りつけておきます。
画面にマウスオーバーすると、初期化します。

注意:Macの場合は、初期化(フォントサムネイル作成)に10秒くらいかかるので、ご注意ください。
アプリ版のほうは、フォントサムネイル作成をはずしてるので、そんなに時間はかかりません。

ATTENTION

本サイトのご利用にあたって

ご使用のブラウザ環境では、本サイトが正しく表示できない可能性があります。
以下の注意点を確認し、必要な設定を行った上で再度表示してください。

  • ブラウザの JavaScript 設定を有効化してください。
  • 最新の Adobe Flash Player をインストールしてください。

[ 別ウィンドウで見る場合はこちら ]

■ダウンロード


ZIPファイル中に、アプリケーションごとに、ファイルを配置しています。
通常版・Light版、どちらも含んでいます。
(2010/04/14にLight版を追加しました。)

■インストール・起動方法

それぞれ、以下の手順でインストールしてください。
Light版も同時にイントールされます。
Fireworks用 Fireworks/PI_FontList_4_FW.mxpを起動してください。
自動的にextention managerが開き、インストールされます。

その後、Fireworksを起動し、以下のメニューを選択してください。
メニュー [ ウィンドウ> PI_FontList ]
Flash用 Flash/PI_FontList_4_FL.mxpを起動してください。
自動的にextention managerが開き、インストールされます。

その後、Flashを起動し、以下のメニューを選択してください。
メニュー [ ウィンドウ> 他のパネル> PI_FontList ]
Photoshop用 Photoshop/PI_FontList_4_PS.mxpを起動してください。
自動的にextention managerが開き、インストールされます。

その後、Photoshopを起動し、以下のメニューを選択してください。
メニュー [ エクステンション> PI_FontList ]
Illustrator用 前回のエントリーを参考にしてください。 インストールの必要はありません。

イラストレーターを起動し、以下のメニューを選択してください。
メニュー [ ファイル> スクリプト> その他のスクリプト ]
 ↓
ファイル参照で[ Illustrator/PI_FontList.jsx ] を選択
なお、Illustrator用は、Illustrator起動毎に、メニューから選択する必要があります。

■今後のバージョンアップ予定

機能的には、十分だと思うので、CS5が出て、動かんかったら、対応したいと思います。

また、なんか、別の機能の拡張パネルでもつくります。

アドビさん、買ってくれへんかな。

■クレジット

設計・実装 : PIXEL IMAGE 田中
フォント超人イメージビジュアル: ホルグラフィックさん

■追記201102/08
インストールしているフォントの中で、「&」を含んだファイル名のフォントが入っている場合は、
起動処理で失敗していますので、そのフォントは、いったん削除してください。
後日、対応版をアップします。

エントリー一覧

ソーシャル

About This Site

HTML、CSS、Javascript、デザイン、3D、モバイルアプリ、CMSなど、ウェブ制作関連の話題を扱うブログです。Fireworksのオリジナル拡張機能の配布や、デザインリソースの配布、オリジナルツールの公開も行っています。

About Me


大阪在住フリーのウェブデザイナーの、ピクセルイメージ田中です。長年、ウェブサイト構築のお手伝いを行っており、デザインやプログラムを中心に、Flash全盛期につちかったモーショングラフィクスのセンスを生かした動画作成や、サイト構築に便利なCMSの開発も行っています。

JS CMS -- DBレス・簡単導入・無料のWebサイト構築用オープンソースCMS
ピクセルイメージ | JS CMSの導入、カスタマイズの依頼は...