BlackBerry用テーマの作り方
BlackBerry 用テーマを作るときの手順について解説します。
目次
- テーマ作成に必要な環境を整える
- テーマファイルを新規作成する
- 動作を確認するためのシミュレーターを設定する
- 背景画像を変更する
- フォントを変更する
- ホームスクリーン (Homescreen) にカレンダーや新着メールを表示する
- ホームスクリーンにアイコンを追加・配置する
- ホームスクリーンのアイコンの背景を変更する
- ホームスクリーンのアイコンアニメーションを設定する
- バナー （画面上部のエリア） をカスタマイズする
- アプリケーションリスト (Application List) のアイコンの背景を変更する
- コントロール（ダイアログ、ボタン、メニュー、リストなど）をカスタマイズする
- 発着信リスト、発着信画面をカスタマイズする
- ロック中画面（Lockscreen）をカスタマイズする
- Grobal Items (その他諸々、テーマ全体にかかわる項目) のカスタマイズ
- 作成したテーマファイルをエクスポートする
- 完成したテーマの無料配布
テーマ作成に必要な環境を整える
- Windows環境を用意します。
BlackBerry Theme Studio は、現在のところWindows環境のみで動作しますので、Windowsは必須になります。弊社では現在 VirtualBox を利用して Windows7 にて使用しています。 - BlackBerry Theme Studio を公式サイトからダウンロードします。
Theme Studio は、テーマを作成するためのアプリケーションです。ダウンロードページ : http://na.blackberry.com/eng/developers/themes/devtools.jsp
残念ながら日本語はサポートされていません。ダウンロードの手順は以下の通りです。
- ダウンロードページから、「Download the BlackBerry Theme Studio v5.0」をクリック
- 必須項目を入力します。名前や住所はローマ字、会社名や職名は英語で入力します。
- 利用規約ページが表示されますので、「Agree」(同意する)にチェックをします。
- ダウンロードページが表示されます。「Download」ボタンをクリックするとダウンロードが開始します。
以上です。
- ダウンロードページから、「Download the BlackBerry Theme Studio v5.0」をクリック
- BlackBerry Smartphone Simulators からシミュレーターをダウンロードします。
シミュレーターは、自作したテーマの動作確認を行うために使用します。ダウンロードページ : http://na.blackberry.com/eng/developers/resources/simulators.jsp
シミュレーターは機種ごとに用意されていますので、必要なものだけをダウンロードします。
現在日本で発売されているのは、BlackBerry Bold 9000 なので Select your smartphone から選択し、Choose your carrier から DoCoMo を選択すればダウンロードリンクが表示されます。
ダウンロードリンクをクリックすると、 BlackBerry Theme Studio と同様に個人情報の入力画面になります。
（Theme Studio をダウンロードする際に、入力画面にて remember me をチェックしておけば、既に項目が埋まった状態で表示されています）
後の手順は先ほどと同様ですので、ここでは割愛します。 - BlackBerry Theme Studio と BlackBerry Smartphone Simulators をインストールします。
これで、テーマを作成するための環境は整いました。
テーマファイルを新規作成する
- Theme Studio を起動します。
はじめにテーマの名前と、BlackBerry の種類、レイアウトのタイプを選択する画面が表示されます。（ここで入力した名前はファイル名になります）- zen : ホームスクリーンにアイコンが５個表示されているタイプです。
- Today : カレンダーや新着メールがホームスクリーン上に表示されるタイプです。
- custom : ホームスクリーンを自由にカスタマイズできるタイプです。
- Create New Theme から新規テーマファイルを作成する。
今回は、弊社でよく使用している custom を使用してテーマの作成を説明していきたいと思います。「Create New Theme」 のダイアログにテーマの名前を入力し、BlackBrerry Bold 9000 を選択、レイアウトタイプは custom を選んで Create ボタンをクリックします。
- 新しいテーマを作成する画面が表示されました。
左側の画面イメージを見ながらカスタマイズしてきます。
また、右側の Inspector ウィンドウで様々な設定を行っていくことになります。
動作を確認するためのシミュレーターを設定する
インストールしたシミュレーターでテーマの動作確認を行うことができます。
どのシミュレーターで動作確認を行うのか、あらかじめ指定しておきます。
- メニューバーにある 「 Edit 」 → 「 Preferences… 」 を選択します。
- どのシミュレーターを使用するかのポップアップが表示されますので、「Reflesh」ボタンをクリックします。
- さきほどインストールしたシミュレーターの種類を選択します。
Resolution (解像度) : 480×320 を選択します。
Model : 9000 を選択します。
OS Version : 4.6 を選択します。
選択したら、 OK ボタンをクリックします。
（画面にはインストールしたシミュレーターが表示されます。上画像で複数の選択肢が表示されているのは、弊社が複数のシミュレーターをインストールしているためです）
シミュレーターは、テーマ作成時にツールバーに表示されている 
ボタンをクリックすると、起動します。
また、テーマファイルを変更・更新するたびに ボタンを押すと、シミュレーターが表示しているテーマ内容を更新することができます。
ボタンやホイールは実際にクリックして操作することができます。
シミュレーターは動作をほぼ忠実に再現してくれますが、設定した画像の表示が粗いこともあります。設定した画像に問題がなければ、シミュレーター上の粗さは特に気にする必要はありません。
背景画像を変更する
下準備として、あらかじめ画面解像度にあったサイズの画像(gif, png, jpg)を用意しておきます。（※BlackBerry Blod 9000 の画面解像度は 480×320 です。）
※ Active Call （通話中） の背景画像の高さに注意※
Active Call （通話中）の画面が表示されているときは、自動的に Application Banner (電波状態や電池残量などを表示している箇所) は画面下に配置されます。
そのとき、 Application Banner の高さ（標準で48px）を差し引いた背景画像をセットしていないと、背景画像が 48px 分つぶれた状態で表示されてしまいます。これを防ぐため、Active Call （通話中） の背景画像はあらかじめ 48px を高さから差し引いて作成しています。（デザインの内容によっては、この措置が必要ないこともあります）
ただし、 Application Banner の背景画像を 透明 にした場合は、48px 差し引く必要はありません。
ホームスクリーンの背景画像を変更する
- Inspector ウィンドウの ２行目にある Home Screen ボタンをクリックして設定画面を表示します。
- Backgroud のサムネイル画像をクリックすると背景画像のファイルを参照するダイアログが表示されますので、用意していた背景画像のファイルを指定します。
- 設定が完了すると、以下のように背景画像が変更されます。
アプリケーションリストの背景画像を変更する
- Inspector ウィンドウの 3行目にある Application List Screen ボタンをクリックして設定画面を表示します。
- ホームスクリーンと同様に、Backgroud のサムネイル画像をクリックして、変更したい画像を指定します。
- 設定が完了すると、ホームスクリーン同様に変更内容が反映されます。
Active Call (通話中) の背景画像を変更する
- Inspector ウィンドウの 6行目にある Phone Screen ボタンをクリックして設定画面を表示します。
- Inspector ウィンドウの上部にある Active Call ボタンをクリックします。
- Backgroud のサムネイル画像をクリックして、変更したい画像を指定します。
- 設定が完了すると、変更内容が反映されます。
Incoming Call (着信中) の背景画像を変更する
- Inspector ウィンドウの 6行目にある Phone Screen ボタンをクリックして設定画面を表示します。
- Inspector ウィンドウの上部にある Incoming Call ボタンをクリックします。
- Backgroud のサムネイル画像をクリックして、変更したい画像を指定します。
- 設定が完了すると、変更内容が反映されます。
Lock Screen (ロック中) の背景画像を変更する
ホームスクリーンの背景を変更すると、自動的に同じ画像が Lock Screen にも指定されてしまいますが、個別に背景画像を指定することもできます。
- Inspector ウィンドウの 7行目にある Lock Screen ボタンをクリックして設定画面を表示します。
- Backgroud のサムネイル画像をクリックして、変更したい画像を指定します。
- 設定が完了すると、変更内容が反映されます。
どんなテーマでも、ホームスクリーンは任意の背景画像に変更することができます。このとき、キーロック画面の背景画像が指定されていないテーマの場合、同時にキーロック画面も任意の画像に切り替わります。
背景画像の変更は以上の5点を変更することができます。
フォントを変更する
Homescreen Banner にデフォルト設定されているフォントを適切なフォントに変更します。
変更前は、Date, Network, Carrier のフォントが BBMillbankTall に設定されています。
Date には BannerEons9000, Network には BannerCoverage9000, Carrier には BannerCoverage9000 のフォントが適切と考えられるフォントですので、変更します。
Application Banner も同様に変更します。
○○○9000 という名前のフォントがセットされていない （ BBMillbankTall がセットされている ）ところには、お好みのフォントをセットします。
※注意※
フォントの種類やサイズを変更した場合、BlackBerry の設定画面からフォントの変更が行えなくなる場合があります。
そのため、頻繁に文字サイズを変更される方や、フォントの種類にこだわりがない方はデフォルトのままの設定にしておくことをおすすめいたします。
(フォントに関する詳細は、また後日あらためて追記する予定です)
ホームスクリーンにカレンダーや新着メールを表示する
ホームスクリーンにカレンダーに入力している予定や、新着メッセージ（未読）を表示するには、 Today Item を追加する必要があります。
ホームスクリーンにカレンダーを表示するエリアを追加する
HomeScreen 設定画面にある Applications から Today Item を追加します。
追加した段階では、カレンダーではないアプリケーションが表示されていることがほとんどですので、追加したアプリケーションをカレンダーに変更します。
設定画面の Today Properties に表示されている Application 横の 「Change Application」ボタンをクリックすると、アプリケーションの選択画面が表示されますので、リストから 「カレンダー(calendar)」を選んでOKボタンをクリックします。
変更が完了すると、カレンダー用のスペースが表示されます。
詳細設定は、以下の通りです。（弊社で使用したことのない部分については未記載）
- Font : アプリケーションタイトルのフォント設定
- Subentry : アプリケーションの項目のフォント設定
- Caret : フォーカスしたときに表示される背景画像
- Subentries : 項目の表示件数
- Show Underline : フォーカスしたときに表示される下線
- Show Underlay : フォーカスしたときに項目全体に表示される背景画像
好みに合わせて、詳細設定を変更します。
上記では、 Caret をオリジナルの画像に差し替え、 Font と Subentry を 「BBAlpha Sans」 へ変更しました。
また、Show Underline と Show Underlay はそれぞれチェックを外しています。
Subentries は 2件です。
新着メッセージを表示するエリアを追加する
カレンダーの追加と同様に Today Item を追加し、Messages に変更します。
新着メッセージは、表示エリアが少ないので 1件のみの表示としました。
アプリケーションネームが表示されたときにテキストが被らないように調整をしています。
また、上記の図のようにカレンダーや新着メッセージなどの各表示エリアが重なっていても、テキストなどが被っていなければ問題ありません。
また、Caret は通常 480×28 のサイズになっていますが、Caret の高さ （28px） を変更することによって行間が縮まります。
テスト用の上記デザインでは、 Caret を 480×24 にしています。
ホームスクリーンにアイコンを追加・配置する
custom でテーマを新規作成した場合、ホームスクリーンにはなにも配置されていませんので、ホームスクリーンの設定画面からアイコンを追加し、好みに合わせて配置します。
ホームスクリーンにアイコンを追加する
HomeScreen 設定画面にある Applications からアイコンを追加します。
アイコン追加ボタンをクリックすると、押した分だけアイコンが追加されます。
左上から順にアイコンが追加されました。
追加したときのアイコンの右横にはアイコン名を表すテキストが表示されています。
テキストが表示されるときの動作や、表示位置、フォントの種類の変更などは Show Text で行います。
なお、テキストが必要ない場合は Show Text のチェックを外します。
アイコンを好みの位置に配置する。
「Reposition Home Screen Items」 ボタンをクリックすると、左側の画面に追加されたアイコンをマウスでドラッグしながら移動できるようになります。
アイコンは好きな位置に配置してもかまいませんが、左画面の Applications に表示されている順に並べていくことをおすすめいたします。
Applications に表示されている順番を無視して不規則に並べてしまうと、ナビゲーション（カーソル移動）の設定に苦労してしまうからです。
今回はアイコンを左から順番に並べ、 Zen Style のような配置にしました。
アイコンの設定で Show Text （アプリケーション名の表示） を非表示にしているので、代わりに Status Text （アイコンがフォーカスされたときに、アプリケーション名を表示するための枠） のチェックを入れました。
テーマファイルウィンドウの一番右端にあるのは、 Alignment ウィンドウです。
ここで、アイコンを均一にそろえたりすることができます。
（Alignment ウィンドウが表示されていない場合は、メニューの Window → Alignment を選択すると表示されます）
アイコンのナビゲーションを設定する
アイコンを配置したら、次はアイコンのナビゲーションを設定します。
Navigation 設定用ウィンドウの一番下にある Show Navigational Paths on the Preview にチェックを入れます。
左側の画面イメージの各アイコンに、赤いパスが表示されます。（現在はこのパスの配置に従ってカーソル移動します）
右側の Navigation に十字形になってアイコンが配置されています。
真ん中に表示されているアイコンを起点として上下左右のいずれかにカーソル移動を行ったとき、次にフォーカスされるアイコンを設定します。
アイコン、または空白の箇所をクリックすると、アイコン設定用のポップアップウィンドウが表示されます。
今回は、上（着信音の設定）と左右（各アプリケーションアイコン）にカーソル移動するように設定しました。
なお、アイコンの右端と左端はそれぞれ行き来できるように設定しています。
Show Navigational Paths on the Preview によって引かれている Navigation の線を見るとカーソル移動のイメージがつかめると思います。
カレンダーと新着メールを表示する場合は、上記のようにナビゲーションを設定します。
アイコンを固定する （Today Itemがあるホームスクリーンにアイコンを追加したときのみ）
Today Itemがあるホームスクリーンにアイコンを追加した場合は、必ず以下の手順も行ってください。
※アイコンを固定にする理由※
Today Item に 表示しているアプリケーションと、アイコンに配置しているアプリケーションが重複している場合、テーマファイルを保存して再び開くと Today Item のアプリケーションが勝手に別のアプリケーションに変更されてしまうという現象が起こります。
こうなると、テーマを再編集する際に再び Today Item を設定することになってしまいます。
この現象を回避するためにアイコンを固定表示に変更します。
配置したアイコンを全選択して、Properties にある 「 Use Devise Application Order 」 のチェックを外します。
「 Use Devise Application Order 」 のチェックを外すと、 Today Item と重複していた「メッセージ」と「カレンダー」のアイコンが自動的に別のアプリケーションに変更されました。
この状態でテーマファイルを保存しておけば、次に編集するときも同じ状態から作業を始めることができますので、Today Item をホームスクリーンに表示したときはアプリケーションが重複されないように確認をしてください。
※作成したテーマを実際に使用するとき、ホームスクリーンのアイコンを固定表示にしたくない場合は、テーマファイルを書き出す前に 「 Use Devise Application Order 」 のチェックを戻しておくことを忘れないようにしてください。
ホームスクリーンのアイコンの背景を変更する
アイコンは、通常時とフォーカス時のそれぞれに背景画像が設定されています。
80×80 のサイズで作成すれば、オリジナルの背景画像を再設定することが可能です。
なお、アイコン設定を行う際は、必ず対象とするアプリケーションアイコンを選択してから行ってください。
すべてのアイコンに同じ設定を行いたい場合は、アプリケーションアイコンを全選択してから設定を行うと一括変更されます。
通常時のアイコン背景を変更する
「 Tab 」 と表示されているのが、アイコンの背景画像になります。（フォーカス以外）
※デザイン確認用の左画面では「 Tab Focus 」の画像しか確認できません。
overlay にチェックすると背景画像がアイコンより上に表示されます。
デフォルトは underlay （アイコンの下） になっています。
今回は Tab の画像をなしにします。
まず、対象となるアイコンを全選択してから Tab の左横にあるチェックマークを外します。
左のデザインイメージの見た目はさほど変わりませんが、これで通常時のアイコン背景画像は非表示になりました。
Tab の画像にオリジナルの画像を設定したい場合は、アイコン背景画像のサムネイルをクリックします。するとファイル参照用のウィンドウがポップアップしますので、あらかじめ作成しておいた 80×80 の背景画像を選択します。
フォーカス時のアイコン背景を変更する
「 Tab Focus 」 と表示されているのが、フォーカス時のアイコンの背景画像になります。
Tab Focus の背景画像のサムネイルをクリックして、あらかじめ作成しておいたフォーカス用のアイコン背景画像をセットします。
上記は左端のアイコン背景画像のみを変更したときのイメージです。
このように、ホームスクリーンでは1つ１つのアイコン背景画像をセットすることができます。
なお、デザイン上の理由などでフォーカス時のアイコン背景画像をなし（透明）にしたい場合は、透明の画像を設定すればOKです。
今回は、フォーカスのみアイコン背景画像を設定し、アイコンの背景画像は Overlay （アイコンより上に表示） としました。
ホームスクリーンのアイコンアニメーションを設定する
Icon Animation から、アイコンをフォーカスしたときのアニメーションを設定することができます。
- None : アニメーションなし
- Bounce : アイコンが上下にバウンドする。
- Fall : 右から左に向かってバウンドしながら移動する。
- Spring From Left : 画面左から移動してくる。（定位置に収まったとき、少しバウンドする）
- Spring From Right : 画面右から移動してくる。（定位置に収まったとき、少しバウンドする）
- Spring From Top : 画面上から移動してくる。（定位置に収まったとき、少しバウンドする）
- Spring From Bottom : 画面下から移動してくる。（定位置に収まったとき、少しバウンドする）
- Flash : Flash の サムネイルに設定した透過画像をアイコンに重ねて、一瞬だけ点滅したように見せる。
- Glow : Flash の サムネイルに設定した透過画像をアイコンに重ねて、常に点滅しているように見せる。
言葉ではなかなか動作のイメージが伝わりにくいかと思いますので、実際にシミュレーターで動作をお確かめください。
バナー （画面上部のエリア） をカスタマイズする
バナー (Banner) とは、日付や電波状態などを表示しているエリアのことを指します。
キーロックやホームスクリーン画面の時に表示される Homescreen Banner と、アプリケーション使用中の画面の時に表示される Application Banner の2種類があります。
バナーの背景画像を変更する
「Application Banner」、「Homescreen Banner」 それぞれの Background サムネイルをクリックすると、ファイル参照ウィンドウがポップアップされますので、あらかじめ用意していた背景画像を設定します。
今回はデフォルトの高さのまま、透明の画像をセットしました。
Application Banner
Homescreen Banner
※ Banner の高さ (height) の設定について※
「height」 は、10〜120px の範囲であれば任意の高さに設定することが可能になっていますが、Banner の高さから各項目（日付や時刻など）がはみだしてしまうと、プレビュー時やテーマ書き出しの際にエラーの原因となりますので、注意が必要です。
「プロファイル」 アイコンの背景画像を変更する
Homescreen Banner に表示されているプロファイルアイコンは、フォーカス時のアイコン背景画像をオリジナルのものに変更することができます。
「Focus Icon」 のアイコンサムネイルをクリックすると、ファイル参照ウィンドウがポップアップしますので、あらかじめ 60×60 のサイズで作成したフォーカス用のアイコン背景画像を選択します。
プロファイルのフォーカス用アイコン背景画像は、デフォルトでは 60×60 ですが、余白部分を省くと 45×45 くらいの画像になります。
オリジナルのアイコン背景画像を作成するときは、60×60 のカンバスサイズにして 45×45 の画像を描くようにします。
各表示項目を好きな位置に移動させる
Banner に表示されている各項目は 「height」 の範囲内であれば任意の場所に移動・配置することが可能です。
- Application Banner の場合
「Reposition Banner Items」ボタンをクリックすると、Banner に配置されている各項目が移動可能になります。
ホームスクリーンでアイコンを並べたときのように、ドラッグ&ドロップしながら項目を再配置していきます。
- Homescreen Banner の場合
「Reposition Banner Items」ボタンをクリックすると、Banner に配置されている各項目が移動可能になります。
「Full Screen Banner」にチェックを入れると、「height」 を無視して項目を配置することができるようになります。
ただし、Homescreen にめいっぱい Today Item （カレンダーや新着メッセージ） を表示しているときは Full Screen Banner で配置することはおすすめいたしません。
各項目を移動させたときは、プレビューで確認することをおすすめいたします。
「Reposition Banner Items」 は奥が深いですので、テーマ作成に慣れていないときはデフォルトのままで良いと思います。
※元の位置に戻したい！場合※
「Reposition Banner Items」 でいろいろ項目を移動させたけど失敗したのでもう一度、元の状態からやり直したい！という場合は、「Position ▼」をクリックして 「Reset to Default」 を選択します。
アプリケーションリスト (Application List) のアイコンの背景を変更する
ホームスクリーンと同様に、アプリケーションリスト画面に表示されるアイコンの背景画像も変更することができます。
通常時（Tab）のアイコン背景画像を変更する
通常のアイコン背景である 「Tab」 を変更するには、画像のサムネイムをクリックしてファイル参照ウィンドウから任意のアイコン背景画像を選択します。
Application List では、 「Tab」 を非表示にするチェックボックスはありませんので、Tab になにも設定したくない場合は、透明画像を用意してセットします。
フォーカス用のアイコン背景画像を変更する
こちらも Tab 同様に画像のサムネイムをクリックしてファイル参照ウィンドウから任意のアイコン背景画像を選択します。
ホームスクリーンと同じ画像を設定し、配置は Overlay (アイコンより上) にしました。
アイコン移動時のアイコン背景画像を変更する
Move Icon は、アイコンを任意の場所に移動させるときに表示される背景画像です。
他のアイコンと同様にオリジナルアイコンをセットし、配置は Overlay (アイコンより上) にしました。
New Items を変更する
新着メールがあったときなどに表示される New のマークもオリジナル画像に変更することができます。
アイコン を変更する
ここでは、アプリケーションアイコンを変更することができます。「Icon」リストに表示されているアイコンが変更の対象になっています。
アイコンのサムネイルをクリックすると、ファイル選択のダイアログが表示されます。
なお、Bold 9000 で使用されているアイコンは、以下の場所にありますのでこちらをコピーして参考にされると良いと思います。
コンピューター > ローカルディスク > Program Files > Research In Motion > BlackBerry Theme Studio 5.0 > samples > Themes > Images > Precision480x320 > icons (この中にあるアイコンを参考に…)
そして、アイコンのカスタマイズについては（奥が深いので）またの機会に…。
コントロール（ダイアログ、ボタン、メニュー、リストなど）をカスタマイズする
※初っ端から注意事項なのですが…。
コントロール部分をカスタマイズしたとき、フォントをデフォルト（ BBMillbankTall ）のままにしていると「 BBMillbankTall 」に固定されるという 「特徴」 があるようです。（仕様なのかどうかはわかりませんが…）
ですから、コントロール部分をカスタマイズされる方は、フォント種類とサイズもカスタマイズ対象になっていることを念頭においてください。
注意事項がやたらと長いですが、フォントのサイズが容易に変更できないのは目の悪い人には厄介だったりしますので、頻繁にフォントのサイズを変更されるかたはご注意ください。ということです。
※この部分は割と難所ですので、加筆訂正が繰り返される可能性が高いですが…ご了承くださいませ。
ダイアログ（Dialog）をカスタマイズ
- フォントを変更する
日本語表示になれば自動的に明朝体のフォントが選択されますので、フォント種類を変更することは日本語表示の方にはあまり意味のないことなのですが BBMillbankTall は今回のテーマのイメージではないので、今回は BBAlpha Sans に変更します。
フォントの色もテーマのイメージに合わせて変更します。
（個人的には、メニューなど英語表示のほうが賢い人っぽくていいと思います） - 背景画像を変更する
ダイアログの背景画像は 40 x 40 の画像を使って可変の枠になるように設定されています。
まずは、以下のように適当にダイアログの背景を準備しておきます。
次に、ダイアログの背景画像のサムネイルをクリックして、参照ファイルから作成した画像を読み込みます。
はじめは、
ちいさなウィンドウに背景画像の設定が表示されています。
背景画像を設定した直後は、 Left, Right, Top, Bottom に数値が入っていません。
このままでは、読み込んだ背景画像が単に繰り返し表示されるだけになりますので、背景画像をもとに枠を設定していきます。
上記のように Left：16, Right：23, Top：16, Bottom：23 と指定すると、グリッド（線）が現れます。
線の外側（Left なら線より左側）が枠の部分、線の内側が繰り返し表示される（背景）部分となります。
Preview にイメージがリアルタイムで確認できますので、自分の思ったとおりのイメージになるように指定してください。問題なければ、「OK」ボタンをクリックして確定します。
変更イメージ側にも、ダイアログの更新が反映されました。 - アイコンをカスタマイズする
ダイアログが表示されるとき、「削除しますか？」などの文言の左に表示されるアイコンもカスタマイズ可能です。
こちらのアイコンのサイズは 60×60 ですので、同じ大きさのものを用意しておきます。アイコンのサムネイルをクリックして、画像を差し替えます。
ダイアログのカスタマイズをすると、プロファイル（着信音設定）のダイアログも変更されています。（フォントの色も同様に変更されています）
（プレビュー画面より）
ボタン（Button）をカスタマイズ
- フォントを変更する
ボタンの背景を変更すると、フォントが固定（何も変更しなければ BBMillbankTall ）になりますので、こちらもイメージに合わせて BBAlpha Sans に変更します。
- ボタン画像を変更する
ボタンは 60×72 のサイズで作成します。こちらもダイアログの背景画像と同様に、1つの画像から外枠の部分と背景部分を設定することでボタンを表現します。※ボタン背景をカスタムできない場所があります。
お使いの端末の OS が 4.6 の場合は、以下のボタンはカスタマイズすることはできません。
– Disabled
– Active
– Disabled Highlight
なお、これらのボタンのカスタマイズが有効なのは OS 4.7 からです。今回は、BlackBerry Bold 9000 （OS 4.6） を想定していますので、 Normal と Highlight のみボタンイメージを用意して変更しました。
ボタンもグリッドの数値を指定して、枠と背景を設定します。フォーカスされているボタンを明るめ、フォーカスされていないボタンを暗くしています。
メニュー（Menu）をカスタマイズ
※はじめに注意※
お使いの端末の OS が 4.6 の場合は、カーソルにグラデーションを使用することができません。
しかし、デフォルトの設定ではグラデーションが使用されています。
メニューの設定をすべてデフォルトのままにしておけば、なにも影響はありませんが、メニューのいずれかの設定を変更すると、グラデーションの設定が固定されてしまいます。
そうなると、プレビューや書き出しの際にエラーが表示されてしまいますので、メニューの設定を変更された際は必ずカーソルの色を単色に変更します。
お手持ちの端末が OS 5.0 の場合は、グラデーション設定できます。
- フォントを変更する
他のフォント同様に、メニューのフォントを BBAlpha Sans へ変更しました。
サイズは端末から変更できなくなってしまうので、デフォルトのサイズのままにしました。 - 背景画像を設定する
ダイアログで使用した画像を設定しました。
グリッドの設定もすべて同じですが、メニューでは左端と下がフレームアウトします。 - カーソルの色を変更する
はじめの注意事項としても載せていますが、デフォルトの状態ではカーソルにはグラデーションが設定されています。
端末の OS が 4.6 の場合は、エラーの原因になりますので、単色に設定します。
タイトルバー（Titlebar）をカスタマイズ
タイトルバーは、アドレス帳を開いたときに表示される「検索（Find）」に使用される箇所です。
- タイトルバーのフォントと、カーソルの色を変更する
- タイトルバーの背景画像を変更する
479×35 のサイズの画像を用意して差し替えます。
また、今回はグリッドの指定はなし（すべて0のまま）です。
リスト（List）をカスタマイズする
「リスト（List）」は、メール一覧や発着信履歴など、リスト表示されるときの画面の設定です。
ここの設定については、バグなのか仕様なのか不明な箇所が多いため、今回はデフォルトのままにしたいと思います。
ここもカスタマイズします。
今回、Listではフォント種類・カラーは変更しません。
Listのフォント設定を変更すると、Profiles で使用されているフォントカラーが変更されるからです。
例えば、Listのフォント種類を変更すると、同時にProfilesのフォントカラーも黒に固定されてしまいます。すると、Profilesの背景色が黒に近い色のため見にくくなってしまいます。
通常、Profilesの背景は「黒」で、Listの背景は「白」です。そのため、Listのフォント設定を変更・固定してしまうことにより、どちらかのフォントが見にくくなってしまいがちです。
ここは、デザインに左右されるところではありますが、今回のデザインでは比較的デフォルトに近い(Profilesの背景は「黒」っぽく、Listの背景は「白」っぽい)ので、Listの設定はあえてそのままにしておきます。
ここでは、カーソルの色のみを変更します。
現在フォーカス中のカーソルのカラーと、複数選択したときの範囲を示す際に使用されるカラーを選択します。
サーチフィールド（SearchField）について
「サーチフィールド（SearchField）」は OS 4.6 にはありません（Titlebar と同じ扱いになっているようです）ので、ここは何も設定する必要はありません。
メッセージリスト（Message List）について
Message Listは、Listのカーソルのカラーを変更すると、デフォルトの設定(種類・カラー・サイズ)が固定されます。
そのため、こちらも変更したい場合はフォント設定をカスタマイズします。
Priority の色も変更可能です。
ここでは、デフォルトのままにしました。
発着信リスト、発着信画面をカスタマイズする
発着信リスト (Phone Hotlist) をカスタマイズする
ここでは、フォントカラーを変更することが可能です。
Calling Number は、発信する際に入力（表示）する電話番号のフォントカラーです。
My Number は、発信番号の上に表示されている自分の電話番号のフォントカラーです。
デフォルトでは黒になっていますので、こちらを好みの色に変更することができます。
なお、フォントの種類はここでは選べません。
発着信リストのフォントは、リストのフォント設定に依存していると思われますが、今回はリストのフォントはカスタマイズしていません（デフォルトの状態です）ので、BlackBerry の本体の「設定」から変更することが可能です。
発信中、通話中画面 (Active Call)、着信画面 (Incoming Call) をカスタマイズする
こちらも同様にフォントカラーを変更することが可能です。
また、フォント種類も選べません。
Incoming Callでは、Answer(応答) と Ignore(無視) も同じ色に変更されます。（個別変更はできません）
ロック中画面（Lockscreen）をカスタマイズする
ロック中の画面には、所有者情報とロックスクリーンアイコンが表示されます。
「所有者」(Owner) をカスタマイズする
BlackBerry の設定に「所有者」というメニューがあります。
「所有者」には、所有者の名前やちょっとした情報を入力することができます。（任意入力です）
入力した「所有者」の情報は、ロック時に表示される情報になります。
Lockscreen では、所有者情報のフォント種類やカラーを変更することが可能です。
今回は、デフォルトのままにしました。
なお、ここでの設定変更は、特に他のフォントに影響することはありません。
ロックスクリーンアイコンをカスタマイズする
ロックスクリーンアイコンも自分の作成したアイコンに差し替えることができます。
こちらのアイコンのサイズは 80×80 です。
所有者情報や、ロックスクリーンアイコンの配置を変更する
前述で変更した所有者情報と、ロックスクリーンアイコンの配置を変更することができます。
Position の 「Reposition Lock Screen Items」 ボタンをクリックすると、それぞれのアイテムが移動できるようになります。
デザインに合わせて好きな場所に移動させてください。
Grobal Items (その他諸々、テーマ全体にかかわる項目) のカスタマイズ
ざっくりとした言い方をしましたが、Grobal Items はテーマの随所に関わる項目のことです。
ダウンロードの進行を表すバーの色（Bar Color ）などがそれにあたります。
Transmission 〜 Hourglass までの設定について
これらの各アイコンはオリジナルアイコンに変更可能ですが、今回は（時間がかかると思いますので…）デフォルトのままにします。
Progress
こちらは、ダウンロードの進行などを表すためのゲージです。
完了(Complete)・未完了(Incomplete)の色・テキストの色をそれぞれ変更することが可能です。
Application
ここでは、全体の背景カラーとフォントカラーを変更することができます。
アプリケーションに使用されるフォントの色を変更できますが、すべてのフォントカラーが変わるわけではないようです。(例えば、メール本文入力中のフォントは黒です)
List でフォントカラーを変更することができなかったので、ここでカラーを変更しました。
Screen Transitions
「Screen Transitions」はBold 9000 (OS 4.6)では設定することができません。
作成したテーマファイルをエクスポートする
ようやくテーマの作成が完了しました（という前提で…）。
作成したテーマファイルをインストール用のファイルに変換するためにエクスポートします。
テーマファイルの情報を明記しておく
設定画面で、テーマファイルの概要等を書いておきます。
（配布することは滅多にないかもしれませんが、同じテーマファイルに変更を加えたときなどはバージョンを書いておくと分かりやすいです）
メニューバーの「 Edit 」 から 「Preferences…」 を選択します。
Theme Info タブで、テーマの作者やコピーライト、バージョン番号などを入力します。
テーマファイルをエクスポート&インストールする
※注意事項※
BlackBerry 端末に直接テーマをインストールする方法(Install to BlackBerry)は、USB 接続された BlackBerry 端末に直接テーマをインストールすることができて、とっても簡単なのですが、この方法でテーマをインストールするとテーマを簡単に削除することができなくなる恐れがあります。
そのため、この方法についてはおすすめいたしません。
また、Web上にデータをアップしてインストールする方法(Publish for Web)については、単純にエクスポートしたファイルをWebサーバーにあげてインストールすればよいというものではありませんので、こちらの方法についても割愛します。
Desktop Manager でインストールできるようにエクスポートする方法
エクスポート用ウィンドウから、「 Publish for Desktop Manager 」にチェックを入れます。
Theme Name を入力し、出力先のフォルダを指定します。
出力する機種の種類（9000）、OS（4.6.0）が正しいかを確認してから「 OK 」ボタンをクリックします。
出力した際、フォルダには以下のような2ファイルが作成されています。
次に、Desktop Manager からインストールします。
Desktop Manager の Application Loader で、さきほどエクスポートで作成されたファイルの中にある alxファイルを BlackBerry に転送するとテーマとして使用できます。
Desktop Manager ダウンロードページ : http://ap.blackberry.com/jpn/software/desktop/
完成したテーマの無料配布
ここまでご覧いただきありがとうございました。
解説中に作成したBlackBerry Boldのテーマを無料配布いたします。
解説と合わせてテーマを眺めていただけたら幸いです。
また解説版とは別に、オリジナルアイコンを組み込み、さらに特製のアイコンスクロールSVGとも組み合わせたプレミアム版 Orange Cat テーマも作成してみました。こちらも無料で配布いたしますので、是非ダウンロードしてみてください。
気に入っていただけたら他の 製品版のテーマ も是非ご利用くださーい。(さりげなく宣伝…)
いかがでしょうか。
これでおおまかなテーマ作成の流れが完了しました。
カスタマイズについてはまだまだ説明不足の箇所もありますが、上記をヒントにオリジナルのテーマを作っていただけたらと思います。