Top Mozilla-Tip's >Personasのオリジナルテーマを作成してみた。
2010年03月01日

Personasのオリジナルテーマを作成してみた。

Firefox 3.6にPersonasが実装されたことにより、テーマをかなり簡単に変更することができるようになりました。

現在、Personasギャラリーには40.000点以上のテーマが投稿されており、ほとんどの方がこの中からお気に入りのテーマを見つけることができるのではないかという充実ぶりですが、やはり自分だけのテーマを使ってみたいという方もおられることでしょう。

以前からPersonasのオフィシャルページには、「Personas の作成手順」というページが用意されていて気になっていたのですが、ちょっと時間があったので実際に作ってみました。

画像を一からデザインするなどの時間を除けば、実際に作成から適用まで15分もあれば終わってしまいますので、世界で一つだけのFirefoxテーマを使いたいという方はチャレンジしてみてはいかがでしょうか。

それでは、「Personas の作成手順」に従ってやってみましょう。


1.ヘッダ画像を用意する。

これはFirefox上部のメインとなる部分のテーマ画像です。

画像はサイズが幅 3000x高さ200px、形式はJPEGまたはPNG、ファイルサイズは300k以内という制限があります。

管理者は最初に3000x200px以上の元画像を用意し、Photoshopで3000x200にて新規作成、そこに元画像をドラッグしてはめ込み、PNGで出力しました。


01_Create_Personas.JPG


2.フッタ画像を用意する。

こちらはステータスバー部を飾る画像です。

フッタ画像の制限は幅 3000x高さ100px、形式、サイズはヘッダ同様JPEG/PNG、300k以内となっています。

こちらも同様の手順で出力しておきます。


02_Create_Personas.JPG


*ヘッダ部にはツールバーボタンやロケーションバー、検索バーなどがあり、それらに合わせて画像の位置を調整する必要も出てくると思います。そのようなときは、Personas のヘッダテンプレートをダウンロードして利用すれば、作成した画像とレイヤで重ねながら位置合わせを行うことができます。


08_Create_Personas.JPG


3.画像をテストする

これだけでとりあえず自分のFirefoxにテーマを適用することが可能です。

カスタムテーマを利用するにはFirefoxに内蔵されているPersonas機能ではなく、アドオンとして「Personas Plus」をインストールしておく必要があります。

Personas Plusをインストールしたら、ステータスバーアイコンをクリックし、メニューから[設定]をクリックします。


03_Create_Personas.JPG


設定画面が表示されたら、[メニューにカスタムペルソナを表示する]にチェックを入れ、OKをクリックします。


04_Create_Personas.JPG


再度ステータスバーアイコンをクリックし、メニューから[カスタムペルソナ]→[編集]をクリックします。


05_Create_Personas.JPG


タブ内に[カスタムペルソナ]の編集画面が表示されますので、テーマの名称を入力し、ヘッダ・フッタのファイルパスを[参照]ボタンで呼び出して入力します。

最後にテキスト色、強調色を指定し、OKをクリックします。


06_Create_Personas.JPG


これでローカルから呼び出したヘッダ・フッタ画像を使ってFirefoxテーマとして適用することができます。


07_Create_Personas.JPG


この方法で複数パターンのヘッダ/フッタ画像を用意しておけば、ローカルファイルをギャラリーとしてテーマを適用することができるというわけです。

このように、思ったより簡単にテーマの作成ができてしまいます。


4.Persona を投稿する

さて、いいものができたら人にも使って欲しいと思うことがあるかもしれません。

そんなときは、ユーザー登録を行い、テーマの投稿を行いましょう。

ユーザー登録は任意のユーザー名、メールアドレスなどを記入するだけの簡単なものです。

ユーザー登録が完了したらPersonasのサイトにてログインし、[デザインを投稿]ボタンをクリックします。

利用規約が表示されますので、I agree to the Terms of Service・・・にチェックを入れて規約に同意し、[How Would You Like to Share Your Personas Design?]部で投稿したテーマを共有するかどうかを選択します。

[Yes・・・]にチェックを入れればギャラリーにて公開され、誰でもあなたのテーマを利用することができるようになります。

[I'd rather・・・]にチェックを入れれば共有はされません。


09_Create_Personas.JPG


これらを選択したら[続ける]ボタンをクリックします。

投稿画面が表示されますので、ここにテーマのタイトル、文字/強調色、アップロードするヘッダ/フッタ画像のパス、説明文などを入力し、ギャラリーのカテゴリを選択したら[投稿]ボタンをクリックします。


10_Create_Personas.JPG


以下の画面が表示されれば投稿完了です。


11_Create_Personas.JPG


投稿した画像は承認を経て問題なければ半日ほどでギャラリーに掲載されます。

掲載されると以下のようなメールが届きますので、記載されたテーマ固有のURLにアクセスして確認しておきましょう。


12_Create_Personas.JPG


テストで作って投稿したテーマ


13_Create_Personas.JPG


元画像からオリジナルで用意すると多少手間はかかるかもしれませんが、「テーマ」自体の作成がドローツールさえあれば非常に簡単に行うことができますので、ギャラリーのテーマに飽き足りない方や、人には見せられないような自分だけの密かなテーマを利用したいという方はチャレンジしてみてはいかがでしょうか。


Personas for Firefox

ダウンロード:Personas Plus(Add-ons for Firefox)


<関連記事>


■Personasのテーマを指定間隔でランダムにローテーションできるFirefoxアドオン「Personas Rotator」

■【Firefox 3.6】正式版リリース。速攻レビュー

■【Personas】をThunderbird(3.0b)でも利用する方法。


posted by moziller at 17:10 | Comment(1) | TrackBack(0) | Mozilla-Tip's



この記事をはてなブックマークに登録 follow us in feedly このエントリを del.icio.us に登録 この記事をクリップ!Yahoo!ブックマークに登録
この記事へのコメント
Personasのテーマのいい検索方法ってないですかね
できれば記事書いて欲しいです
Posted by mor at 2010年03月03日 01:29
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

※ブログオーナーが承認したコメントのみ表示されます。

この記事へのトラックバック





×

この広告は180日以上新しい記事の投稿がないブログに表示されております。