JP4727623B2 - Ｇｕｉ画面設計支援プログラム、ｇｕｉ画面設計支援方法、およびｇｕｉ画面設計支援装置 - Google Patents

Description

この発明は、ＧＵＩ画面の設計を支援するＧＵＩ画面設計支援プログラム、ＧＵＩ画面設計支援方法、およびＧＵＩ画面設計支援装置に関する。

近年、携帯電話や携帯音楽プレーヤーなど、多くの電化製品などにおいては、ユーザに動作状態を把握させることを主な目的とした表示画面が設けられている。そして、このような表示画面に表示されるＧＵＩ画面の中には、複数のＧＵＩ部品および複数のプログラムから構成されている複雑なものもあり、手間や時間をかけて、ＧＵＩ画面の設計をおこなう必要があったため、ＧＵＩ画面の設計作業の効率化が課題となっていた。そこで、近年では、ＧＵＩ画面の設計方法として、ＧＵＩ画面と、このＧＵＩ画面に関連付けられているプログラムとを、別々に設計する方法が一般的に用いられている（たとえば、下記特許文献１参照。）。このような設計方法を利用することにより、ＧＵＩ画面の設計作業の効率化を図ることができるものとされている。

特開２０００−１３７５９９号公報

しかしながら、上記特許文献１に記載の従来技術にあっては、ＧＵＩ画面に配置させる候補となるＧＵＩ部品が、ＨＤやメモリに膨大な数格納されている場合、手間や時間をかけて、ファイル名やフォルダ名などを頼りに適切なＧＵＩ部品を探し出さなければならないため、結果的に、ＧＵＩ画面の設計作業にかかる作業時間が長時間化するだけでなく、作業コストが増加するといった問題が生じていた。特に、近年では、数千〜数万のＧＵＩ部品を扱うようになり、上述したような問題が顕著に表れていた。

この発明は、上述した従来技術による問題点を解消するため、ユーザが、手間や時間をかけることなく、複数のＧＵＩ部品の中から適切なＧＵＩ部品を選択することを可能とすることで、結果的に、ＧＵＩ画面の設計作業にかかる作業時間の短時間化、および作業コストの低コスト化を図ることができるＧＵＩ画面設計支援プログラム、ＧＵＩ画面設計支援方法、およびＧＵＩ画面設計支援装置を提供することを目的とする。

上述した課題を解決し、目的を達成するため、この発明にかかるＧＵＩ画面設計支援プログラムは、表示画面上において任意の範囲の指定を受け付ける指定工程と、データベースからＧＵＩ部品を取得する取得工程と、前記取得工程によって取得されたＧＵＩ部品ごとに、前記指定工程によって指定された範囲との類似度を算出する算出工程と、前記算出工程による算出結果に基づいて、前記取得工程によって取得されたＧＵＩ部品を前記表示画面上に表示する表示工程と、をコンピュータに実行させることを特徴とする。

この発明によれば、コンピュータに、データベースに格納されている複数のＧＵＩ部品を、指定された領域との類似度に基づいて、表示させることができる。

また、この発明にかかるＧＵＩ画面設計支援プログラムは、上記に記載の発明において、前記算出工程は、前記取得工程によって取得されたＧＵＩ部品ごとに、当該ＧＵＩ部品の縦横サイズと前記指定工程によって指定された範囲の縦横サイズとの類似度を算出することを特徴とする。

この発明によれば、コンピュータに、データベースに格納されている複数のＧＵＩ部品を、当該ＧＵＩ部品の縦横サイズと指定された領域の縦横サイズとの類似度に基づいて、表示させることができる。

また、この発明にかかるＧＵＩ画面設計支援プログラムは、上記に記載の発明において、前記算出工程は、前記生成工程によって生成されたＧＵＩ部品ごとに、当該ＧＵＩ部品の縦横比と前記指定工程によって指定された範囲の縦横比との類似度を算出することを特徴とする。

この発明によれば、コンピュータに、データベースに格納されている複数のＧＵＩ部品を、当該ＧＵＩ部品の縦横比と指定された領域の縦横比との類似度に基づいて、表示させることができる。

また、この発明にかかるＧＵＩ画面設計支援プログラムは、上記に記載の発明において、前記算出工程は、前記取得工程によって取得されたＧＵＩ部品ごとに、当該ＧＵＩ部品の面積と前記指定工程によって指定された範囲の面積との類似度を算出することを特徴とする。

この発明によれば、コンピュータに、データベースに格納されている複数のＧＵＩ部品を、当該ＧＵＩ部品の面積と指定された領域の面積との類似度に基づいて、表示させることができる。

また、この発明にかかるＧＵＩ画面設計支援プログラムは、上記に記載の発明において、前記表示工程は、前記算出工程によって算出された類似度の高い順に、前記取得工程によって取得されたＧＵＩ部品を前記表示画面上に表示することを特徴とする。

この発明によれば、コンピュータに、データベースに格納されている複数のＧＵＩ部品を、指定された領域との類似度が高い順に、表示させることができる。

また、この発明にかかるＧＵＩ画面設計支援プログラムは、上記に記載の発明において、前記指定工程によって指定された範囲が文字列データを含む場合、当該文字列データに用いることが可能なフォントサイズごとに、当該フォントサイズに応じた大きさの、前記文字列データを表示するＧＵＩ部品を生成し、生成したＧＵＩ部品を所定の記録媒体に格納する生成工程をさらにコンピュータに実行させ、前記取得工程は、前記記録媒体から前記生成工程によって生成されたＧＵＩ部品を取得することを特徴とする。

この発明によれば、コンピュータに、文字列データに用いることが可能なフォントサイズごとに生成された、上記文字列データを表示する複数のＧＵＩ部品を、指定された領域との類似度に基づいて、表示させることができる。

また、この発明にかかるＧＵＩ画面設計支援プログラムは、上記に記載の発明において、前記表示画面上に表示されたＧＵＩ部品の中から、任意のＧＵＩ部品の選択を受け付ける選択工程と、前記選択工程によって選択されたＧＵＩ部品と、前記指定工程によって指定された範囲とを関連付けて所定の記録媒体に格納する格納工程と、をさらにコンピュータに実行させることを特徴とする。

この発明によれば、コンピュータに、指定された範囲と、選択されたＧＵＩ部品とを関連付けさせることができる。

また、この発明にかかるＧＵＩ画面設計支援方法は、表示画面上において任意の範囲の指定を受け付ける指定工程と、データベースからＧＵＩ部品を取得する取得工程と、前記取得工程によって取得されたＧＵＩ部品ごとに、前記指定工程によって指定された範囲との類似度を算出する算出工程と、前記算出工程による算出結果に基づいて、前記取得工程によって取得されたＧＵＩ部品を前記表示画面上に表示する表示工程と、を含んだことを特徴とする。

この発明によれば、コンピュータが、データベースに格納されている複数のＧＵＩ部品を、指定された領域との類似度に基づいて、表示することができる。

また、この発明にかかるＧＵＩ画面設計支援装置は、表示画面上において任意の範囲の指定を受け付ける指定手段と、データベースからＧＵＩ部品を取得する取得手段と、前記取得手段によって取得されたＧＵＩ部品ごとに、前記指定手段によって指定された範囲との類似度を算出する算出手段と、前記算出手段による算出結果に基づいて、前記取得手段によって取得されたＧＵＩ部品を前記表示画面上に表示する表示制御手段と、を備えたことを特徴とする。

この発明によれば、データベースに格納されている複数のＧＵＩ部品を、指定された領域との類似度に基づいて、表示することができる。

本発明にかかるＧＵＩ画面設計支援プログラム、ＧＵＩ画面設計支援方法、およびＧＵＩ画面設計支援装置によれば、ユーザが、手間や時間をかけることなく、複数のＧＵＩ部品の中からの適切なＧＵＩ部品を選択することができるようになるため、結果的に、ＧＵＩ画面の設計作業にかかる作業時間の短時間化、および作業コストの低コスト化を図ることができるという効果を奏する。

以下に添付図面を参照して、この発明にかかるＧＵＩ画面設計支援プログラム、ＧＵＩ画面設計支援方法、およびＧＵＩ画面設計支援装置の好適な実施の形態を詳細に説明する。なお、本実施の形態では、携帯音楽プレーヤーのＧＵＩ画面設計例について説明する。

（実施の形態）
（ＧＵＩ画面設計支援装置のハードウェア構成）
まず、この発明の実施の形態にかかるＧＵＩ画面設計支援装置のハードウェア構成について説明する。図１は、この発明の実施の形態にかかるＧＵＩ画面設計支援装置のハードウェア構成を示すブロック図である。

図１において、ＧＵＩ画面設計支援装置１００は、ＣＰＵ１０１と、ＲＯＭ１０２と、ＲＡＭ１０３と、ＨＤＤ（ハードディスクドライブ）１０４と、ＨＤ（ハードディスク）１０５と、Ｒ／Ｗ（リーダ／ライタ）１０６と、着脱可能な記録媒体の一例としてのＤＶＤ（Ｄｉｇｉｔａｌ Ｖｅｒｓａｔｉｌｅ Ｄｉｓｃ）１０７と、ディスプレイ１０８と、Ｉ／Ｆ（インターフェース）１０９と、キーボード１１０と、マウス１１１と、スキャナ１１２と、プリンタ１１３と、を備えており、各構成部はバス１２０などによってそれぞれ接続されている。

ＣＰＵ１０１は、ＧＵＩ画面設計支援装置１００の全体の制御を司る。ＲＯＭ１０２は、ブートプログラムなどのプログラムを記憶している。ＲＡＭ１０３は、ＣＰＵ１０１のワークエリアとして使用される。ＨＤＤ１０４は、ＣＰＵ１０１の制御にしたがってＨＤ１０５に対するデータのリード／ライトを制御する。ＨＤ１０５は、ＨＤＤ１０４の制御で書き込まれたデータを記憶する。

Ｒ／Ｗ１０６は、ＣＰＵ１０１の制御にしたがってＤＶＤ１０７に対するデータのリード／ライトを制御する。ＤＶＤ１０７は、Ｒ／Ｗ１０６の制御で書き込まれたデータを記憶したり、ＤＶＤ１０７に記憶されたデータを読み取らせたりする。

また、着脱可能な記録媒体として、ＤＶＤ１０７のほか、ＣＤ−ＲＯＭ（ＣＤ−Ｒ、ＣＤ−ＲＷ）、ＭＯ、メモリカード、ＦＤ（Ｆｌｅｘｉｂｌｅ Ｄｉｓｋ）などであってもよい。ディスプレイ１０８は、カーソル、アイコンあるいはツールボックスをはじめ、文章、画像、機能情報などのデータを表示する。このディスプレイ１０８は、たとえば、ＣＲＴ、ＴＦＴ液晶ディスプレイ、プラズマディスプレイなどを採用することができる。

Ｉ／Ｆ１０９は、通信回線を通じてインターネットなどのネットワークに接続され、このネットワークを介してユーザ端末装置などの外部装置に接続される。Ｉ／Ｆ１０９には、たとえばモデム、ＬＡＮカードなどを採用することができる。

キーボード１１０は、文字、数字、各種指示などの入力のためのキーを備え、データの入力をおこなう。また、タッチパネル式の入力パッドやテンキーなどであってもよい。マウス１１１は、カーソルの移動や範囲選択、あるいはウィンドウの移動やサイズの変更などをおこなう。ポインティングデバイスとして同様に機能を備えるものであれば、トラックボールやジョイスティックなどであってもよい。

スキャナ１１２は、画像を光学的に読み取り、ＧＵＩ画面設計支援装置１００内に画像データを取り込む。なお、スキャナ１１２は、ＯＣＲ機能を持たせてもよい。また、プリンタ１１３は、画像データや文章データを印刷する。プリンタ１１３には、たとえば、レーザプリンタやインクジェットプリンタを採用することができる。

（ＧＵＩ画面設計支援装置１００の機能的構成）
つぎに、この発明の実施の形態にかかるＧＵＩ画面設計支援装置１００の機能的構成について説明する。図２は、この発明の実施の形態にかかるＧＵＩ画面設計支援装置１００の機能的構成を示すブロック図である。

図２において、ＧＵＩ画面設計支援装置１００は、記憶部２００と、指定部２０１と、取得部２０２と、生成部２０３と、算出部２０４と、表示制御部２０５と、選択部２０６とから構成されている。

記憶部２００は、複数のＧＵＩ部品を格納するデータベースである。記憶部２００に格納されるＧＵＩ部品としては、たとえば、ＢＭＰやＪＰＥＧなどの画像データが挙げられる。ここで、記憶部２００に格納されるＧＵＩ部品は、少なくとも当該ＧＵＩ部品の縦横サイズを特定するためのサイズ情報を有する。

指定部２０１は、ディスプレイ１０８に表示されているＧＵＩ画面の設計画面上において任意の形状および大きさを有する範囲の指定を受け付ける。指定部２０１によって受け付けられる任意の形状および大きさを有する範囲（以下、「指定範囲」という）は、たとえば、ユーザがキーボード１１０やマウス１１１（図１参照）を用いておこなった操作に基づいて指定される。また、指定部２０１によって受け付けられる指定範囲の形状としては、矩形が実用的ではあるが、これに限らず、その他の多角形や円などであってもよい。

取得部２０２は、指定部２０１によって指定された指定範囲が文字列データを含まない場合、記憶部２００からＧＵＩ部品を取得する。

生成部２０３は、指定部２０１によって指定された指定範囲が文字列データを含む場合、当該文字列データに用いることが可能なフォントサイズごとに、当該フォントサイズに応じた大きさの、前記文字列データを表示するＧＵＩ部品を生成する。

算出部２０４は、取得部２０２によって取得されたＧＵＩ部品または生成部２０３によって生成されたＧＵＩ部品ごとに、縦横サイズ、縦横比、面積について、指定部２０１によって指定された指定範囲との類似度を算出する。なお、算出部２０４による類似度の算出処理の具体的な手順については、図４を用いて後述する。

表示制御部２０５は、ディスプレイ１０８に表示されているＧＵＩ画面の設計画面上に、算出部２０４によって算出された類似度の高い順に、取得部２０２によって取得されたＧＵＩ部品を表示する。ここで、表示制御部２０５は、取得部２０２によって取得されたＧＵＩ部品のうち、類似度が所定の閾値よりも高いものだけを表示したり、類似度が高いものを所定数だけ表示するようにしてもよい。

選択部２０６は、表示制御部２０５によって表示されたＧＵＩ部品の中から、指定部２０１によって指定された指定範囲に表示させるための、任意のＧＵＩ部品の選択を受け付ける。選択部２０６によって受け付けられる任意のＧＵＩ部品は、たとえば、ユーザがキーボード１１０やマウス１１１（図１参照）を用いておこなった操作に基づいて選択される。

なお、選択部２０６によって選択された任意のＧＵＩ部品に関する情報は、たとえば、指定部２０１によって指定された指定範囲に関する情報とともに、設計対象とされたＧＵＩ画面の識別情報などと関連付けられて、ＲＡＭ１０３やＨＤ１０５（図１参照）などの記憶媒体に格納される。

また、上述した各機能構成部は、具体的には、たとえば図１に示したＲＯＭ１０２、ＲＡＭ１０３、ＨＤ１０５、ＤＶＤ１０７に記憶されたプログラムをＣＰＵ１０１が実行することによってその機能を実現する。

（ＧＵＩ画面設計支援処理の手順）
つぎに、この発明の実施の形態にかかるＧＵＩ画面設計支援装置１００によるＧＵＩ画面設計支援処理の手順について説明する。図３は、この発明の実施の形態にかかるＧＵＩ画面設計支援装置１００によるＧＵＩ画面設計支援処理の手順の一例を示すフローチャートである。

ＧＵＩ画面設計支援装置１００は、まず、指定部２０１によって、ディスプレイ１０８に表示されているＧＵＩ画面の設計画面上において任意の形状および大きさを有する範囲の指定を受け付ける（ステップＳ３０１）。

つぎに、ステップＳ３０１で指定された指定範囲が文字列データを含むか否かを判断する（ステップＳ３０２）。ステップＳ３０２において、文字列データを含まないと判断した場合は（ステップＳ３０２：Ｎｏ）、取得部２０２によって、記憶部２００からＧＵＩ部品を取得して（ステップＳ３０３）、ステップＳ３０５へ進む。

一方、ステップＳ３０２において、文字列データを含むと判断した場合は（ステップＳ３０２：Ｙｅｓ）、生成部２０３によって、ステップＳ３０１で指定された範囲に含まれた文字列データに用いることが可能なフォントサイズごとに、当該文字列データを表示するＧＵＩ部品を生成して（ステップＳ３０４）、ステップＳ３０５へ進む。

続いて、算出部２０４によって、ステップＳ３０３で取得されたＧＵＩ部品ごとまたはステップＳ３０４で生成されたＧＵＩ部品ごとに、縦横サイズ、縦横比、面積について、ステップＳ３０１で指定された指定範囲との類似度を算出する（ステップＳ３０５）。

つぎに、表示制御部２０５によって、ディスプレイ１０８に表示されているＧＵＩ画面の設計画面上に、ステップＳ３０５で算出された類似度の高い順に、ステップＳ３０３で取得されたＧＵＩ部品またはステップＳ３０４で生成されたＧＵＩ部品を表示する（ステップＳ３０６）。

そして、選択部２０６によって、ステップＳ３０６で表示されたＧＵＩ部品の中から、ステップＳ３０１で指定された指定範囲に表示させるための、任意のＧＵＩ部品の選択を受け付けて（ステップＳ３０７）、一連の処理を終了する。

（類似度の算出処理の具体的な手順）
つぎに、算出部２０４による類似度の算出処理の具体的な手順について説明する。図４は、算出部２０４による類似度の算出処理の手順の一例を示すフローチャートである。

算出部２０４は、まず、指定部２０１によって指定された指定範囲の座標データなどに基づいて、当該指定範囲の縦横サイズ、縦横比、および面積を求める（ステップＳ４０１）。たとえば、指定範囲の縦横サイズが「１２（横のサイズ），１２（縦のサイズ）」の場合、求められる縦横比は「１（１２／１２）」であり、求められる面積は「１４４（１２×１２）」である。

つぎに、縦横サイズの優先度Ｐ＿Ｓｉｚｅ、縦横比の優先度Ｐ＿Ｒａｔｉｏ、および面積の優先度Ｐ＿Ａｒｅａを取得する（ステップＳ４０２〜ステップＳ４０４）。上記各優先度は、たとえば、あらかじめユーザ任意の値によって設定され、ＲＡＭ１０３やＨＤ１０５（図１参照）などの記憶媒体に格納されている。この場合、算出部２０４は、上記記録媒体から上記各優先度を読み取ることによって、上記各優先度を取得することができる。

つぎに、記憶部２００の中からＧＵＩ部品を一つ選択する（ステップＳ４０５）。そして、ステップＳ４０５で選択したＧＵＩ部品の、縦横サイズを取得し（ステップＳ４０６）、縦横比を求め（ステップＳ４０７）、さらに面積を求める（ステップＳ４０８）。たとえば、記憶部２００の中から選択したＧＵＩ部品の縦横サイズが「１０（横のサイズ），１０（縦のサイズ）」の場合、求められる縦横比は「１（１０／１０）」であり、求められる面積は「１００（１０×１０）」である。

つぎに、指定部２０１によって指定された指定範囲と、ステップＳ４０５で選択されたＧＵＩ部品との、縦横サイズの類似度Ｍ＿Ｓｉｚｅを求める（ステップＳ４０９）。ここで、この縦横サイズの類似度を求める方法は様々であるが、たとえば、指定部２０１によって指定された指定範囲の横のサイズと、ステップＳ４０５で選択されたＧＵＩ部品の横のサイズとのうち、値が小さい方をＷ１とし、値が大きい方をＷ２とする。そして、指定部２０１によって指定された指定範囲の縦のサイズと、ステップＳ４０５で選択されたＧＵＩ部品の縦のサイズとのうち、値が小さい方をＨ１とし、値が大きい方をＨ２とする。そのうえで、数式（（（Ｗ１／Ｗ２）＋（Ｈ１／Ｈ２））／２）によって求められる値を縦横サイズの類似度Ｍ＿Ｓｉｚｅとすることができる。

つぎに、指定部２０１によって指定された指定範囲と、ステップＳ４０５で選択されたＧＵＩ部品との、縦横比の類似度Ｍ＿Ｒａｔｉｏを求める（ステップＳ４１０）。ここで、この縦横比の類似度を求める方法は様々であるが、たとえば、指定部２０１によって指定された指定範囲の縦横比と、ステップＳ４０５で選択されたＧＵＩ部品の縦横比とのうち、値の小さい方をＲ１とし、値の大きい方をＲ２とする。そのうえで、数式（Ｒ１／Ｒ２）によって求められる値をＭ＿Ｒａｔｉｏとすることができる。

つぎに、指定部２０１によって指定された指定範囲と、ステップＳ４０５で選択されたＧＵＩ部品との、面積の類似度Ｍ＿Ａｒｅａを求める（ステップＳ４１１）。ここで、この面積の類似度を求める方法は様々であるが、たとえば、指定部２０１によって指定された指定範囲の面積と、ステップＳ４０５で選択されたＧＵＩ部品の面積とのうち、値の小さい方をＡ１とし、値の大きい方をＡ２とする。そのうえで、数式（Ａ１／Ａ２）によって求められる値を面積の類似度Ｍ＿Ａｒｅａとすることができる。

つぎに、縦横サイズの評価点Ｓ＿Ｓｉｚｅを求める（ステップＳ４１２）。ここで、この評価点を求める方法は様々であるが、たとえば、数式（Ｐ＿Ｓｉｚｅ×Ｍ＿Ｓｉｚｅ）によって求められる値を縦横サイズの評価点Ｓ＿Ｓｉｚｅとすることができる。

つぎに、縦横比の評価点Ｓ＿Ｒａｔｉｏを求める（ステップＳ４１３）。ここで、この評価点を求める方法は様々であるが、たとえば、数式（Ｐ＿Ｒａｔｉｏ×Ｍ＿Ｒａｔｉｏ）によって求められる値を縦横比の評価点Ｓ＿Ｒａｔｉｏとすることができる。

つぎに、面積の評価点Ｓ＿Ａｒｅａを求める（ステップＳ４１４）。ここで、この評価点を求める方法は様々であるが、たとえば、数式（Ｐ＿Ａｒｅａ×Ｍ＿Ａｒｅａ）によって求められる値を面積の評価点Ｓ＿Ａｒｅａとすることができる。

つぎに、総評価点Ｓ＿Ｔｏｔａｌを求める（ステップＳ４１５）。ここで、この総評価点を求める方法は様々であるが、たとえば、数式（Ｓ＿Ｓｉｚｅ＋Ｓ＿Ｒａｔｉｏ＋Ｓ＿Ａｒｅａ）によって求められる値を総評価点Ｓ＿Ｔｏｔａｌとすることができる。

そして、記憶部２００に格納されている全てのＧＵＩ部品について総評価点が求められたか否かを判断する（ステップＳ４１６）。ステップＳ４１６において、全てのＧＵＩ部品について総評価点が求められたと判断した場合（ステップＳ４１６：Ｙｅｓ）は、一連の処理を終了する。一方、ステップＳ４１６において、全てのＧＵＩ部品について総評価点が求められていないと判断した場合（ステップＳ４１６：Ｎｏ）は、全てのＧＵＩ部品について総評価点が求められるまで、ステップＳ４０５〜Ｓ４１６を繰り返しおこなう。

（記憶部２００に格納されたＧＵＩ部品の一例）
つぎに、記憶部２００に格納されたＧＵＩ部品の一例について説明する。図５は、記憶部２００に格納されたＧＵＩ部品の一例を示す説明図である。

図５において、各ＧＵＩ部品５０１〜５１１は、ＢＭＰやＪＰＥＧなどの画像データであって、それぞれがサイズ情報を持っている。たとえば、図５において、ＧＵＩ部品５０１〜５０３は、サイズ情報として「２０（横のサイズ），１０（縦のサイズ）」を持っている。また、ＧＵＩ部品５０４〜５０８は、サイズ情報として「１０（横のサイズ），１０（縦のサイズ）」を持っている。そして、ＧＵＩ部品５０９〜５１１は、サイズ情報として「４０（横のサイズ），４０（縦のサイズ）」を持っている。なお、上記サイズ情報に加え、類似度の算出処理（図４参照）に必要となる縦横比や、面積などの情報をあらかじめ持つようにしてもよい。

（優先度の一例）
つぎに、類似度の算出処理に用いられる優先度の一例について説明する。図６は、類似度の算出処理に用いられる優先度の一例を示す説明図である。

図６において、たとえば優先度設定６００Ａは、項目「縦横サイズ」に一番大きい値が設定されており、指定された指定領域と縦横サイズが類似するＧＵＩ部品を優先的に選択候補として表示する設定である。

また、優先度設定６００Ｂは、項目「縦横比」に一番大きい値が設定されており、指定された指定領域と縦横比が類似するＧＵＩ部品を優先的に選択候補として表示する設定である。

（ＧＵＩ画面設計処理の具体例）
つぎに、この発明の実施の形態にかかるＧＵＩ画面設計支援装置１００によるＧＵＩ画面設計処理の具体例について説明する。図７〜図１２は、この発明の実施の形態にかかるＧＵＩ画面設計支援装置１００によるＧＵＩ画面設計処理の具体例を示す説明図である。

このうち、図７および図１０は、指定部２０１によって指定された指定領域の一例を示す説明図である。また、図８および図１１は、表示制御部２０５によって表示されたＧＵＩ部品の一例を示す説明図である。そして、図９および図１２は、選択部２０６によって選択されたＧＵＩ部品の一例を示す説明図である。

図７に示す画面７００は、ディスプレイ１０８に表示されたＧＵＩ画面設計画面である。そして、この画面７００上においては、ユーザによるマウス操作により、文字列データを含まない領域７０１が指定されている。ここで、この領域７０１は、縦のサイズが「１０」であり、横のサイズが「１０」であるものとする。

このとき、領域７０１の指定を受け付けたＧＵＩ画面設計支援装置１００は、領域７０１の縦横サイズに基づいて、領域７０１の縦横比「１（１０／１０）」と、領域７０１の面積「１００（１０×１０）」とを算出する。

続いて、ＧＵＩ画面設計支援装置１００は、記憶部２００に格納されているＧＵＩ部品ごとに、領域７０１との類似度を示す評価点を算出する。具体的な手順については、図４を用いて説明したとおりである。

たとえば、図５に示したＧＵＩ部品５０１〜５０３の場合、縦横サイズが「２０，１０」であることから、縦横比として「２」が求められ、面積として「２００」が求められる。これにより、領域７０１との縦横サイズの類似度Ｍ＿Ｓｉｚｅとして、数式（（（１０／２０）＋（１０／１０））／２）から、「０．７５」が求められる。また、領域７０１との縦横比の類似度Ｍ＿Ｒａｔｉｏとして、数式（１／２）から、「０．５」が求められる。そして、領域７０１との面積の類似度Ｍ＿Ａｒｅａとして、数式（１００／２００）から、「０．５」が求められる。

続いて、図６に示した優先度設定６００Ａから、縦横サイズの優先度Ｐ＿Ｓｉｚｅとして「１．１」を取得し、これを用いて、縦横サイズの評価点Ｓ＿Ｓｉｚｅとして、数式（１．１×０．７５）から、「０．８２５」が求められる。

そして、図６に示した優先度設定６００Ａから、縦横比の優先度Ｐ＿Ｒａｔｉｏとして「１．０」を取得し、これを用いて、縦横比の評価点Ｓ＿Ｒａｔｉｏとして、数式（１．０×０．５）から、「０．５」が求められる。

さらに、図６に示した優先度設定６００Ａから、面積の優先度Ｐ＿Ａｒｅａとして「０．９」を取得し、これを用いて、面積の評価点Ｓ＿Ａｒｅａとして、数式（０．９×０．５）から、「０．４５」が求められる。

そのうえで、総評価点Ｓ＿Ｔｏｔａｌとして、数式（０．８２５＋０．５＋０．４５）から、「１．７７５」が求められる。

同様に、図５に示したＧＵＩ部品５０４〜５０８については、総評価点Ｓ＿Ｔｏｔａｌとして、「３」が求められ、図５に示したＧＵＩ部品５０９〜５１１については、総評価点Ｓ＿Ｔｏｔａｌとして、「１．３３１２５」が求められる。

図８は、図７に示した画面７００上に、ＧＵＩ部品選択画面８００が表示されている。そして、このＧＵＩ部品選択画面８００には、記憶部２００から取得したＧＵＩ部品５０１〜５１１が選択候補として表示されている。ここで、ＧＵＩ部品選択画面８００において、ＧＵＩ部品５０１〜５１１は、図７で説明したように求められた総評価点の高い順、すなわち、領域７０１との類似度が高い順に表示されている。たとえば、ユーザは、このように表示されたＧＵＩ部品５０１〜５１１の中から、マウス１１１操作などにより、任意のＧＵＩ部品を選択することができる。このとき、選択するＧＵＩ部品は一つに限らず、複数のＧＵＩ部品を選択することができる。たとえば、携帯音楽プレーヤーの動作状態によって表示させるＧＵＩ部品が異なる場合、表示される可能性があるＧＵＩ部品を全て選択することができる。

図９に示す画面７００では、図８に示したＧＵＩ部品選択画面８００においてＧＵＩ部品５０５が選択されたことにより、選択されたＧＵＩ部品５０５が、領域７０１上に配置されている。このとき、選択されたＧＵＩ部品５０５は領域７０１との類似度が特に高いものであるため、ＧＵＩ部品５０５が領域７０１から極端にはみ出したり、ＧＵＩ部品５０５と領域７０１との間に極端な隙間が生じたりすることなく、領域７０１にＧＵＩ部品５０５を配置することができる。

一方、図１０に示す画面７００では、図９に示した画面７００の状態から、ユーザによるマウス操作により、文字列データを含む領域１００１がさらに指定されている。ここで、この領域１００１は、縦のサイズ「１０」であり、横のサイズが「７０」であり、含まれる文字列データは「Ｎｏｗ Ｐｌａｙｉｎｇ」であるものとする。

このとき、領域１００１の指定を受け付けたＧＵＩ画面設計支援装置１００は、領域１００１の縦横サイズに基づいて、領域１００１の縦横比「７（７０／１０）」と、領域１００１の面積「７００（７０×１０）」とを算出する。

続いて、ＧＵＩ画面設計支援装置１００は、文字列データ「Ｎｏｗ Ｐｌａｙｉｎｇ」に用いることが可能なフォントサイズごとに、文字列データ「Ｎｏｗ Ｐｌａｙｉｎｇ」がはみ出さずに示されたＧＵＩ部品を生成する。そして、生成されたＧＵＩ部品ごとに、領域１００１との類似度を示す評価点を算出する。具体的な手順については、図４を用いて説明したとおりである。

たとえば、文字列データ「Ｎｏｗ Ｐｌａｙｉｎｇ」に用いることが可能なフォントサイズが、「１０ｐｔ」、「１２ｐｔ」、および「１４ｐｔ」であるとする。そして、「１２ｐｔ」に対して生成されたＧＵＩ部品の縦横サイズが「７０，１０」であり、縦横比が「７」であり、面積が「７００」であるとする。また、「１０ｐｔ」に対して生成されたＧＵＩ部品の縦横サイズが「６３，９」であり、縦横比が「７」であり、面積が「５６７」であるとする。また、「１４ｐｔ」に対して生成されたＧＵＩ部品の縦横サイズが「８４，１２」であり、縦横比が「７」であり、面積が「１００８」であるとする。

この場合、「１２ｐｔ」に対して生成されたＧＵＩ部品については、総評価点Ｓ＿Ｔｏｔａｌとして、「３」が求められ、「１０ｐｔ」に対して生成されたＧＵＩ部品については、総評価点Ｓ＿Ｔｏｔａｌとして、「２．７１９」が求められ、「１４ｐｔ」に対して生成されたＧＵＩ部品については、総評価点Ｓ＿Ｔｏｔａｌとして、「２．５３６９」が求められる。

図１１は、図１０に示した画面７００上に、ＧＵＩ部品選択画面１１００が表示されている。そして、このＧＵＩ部品選択画面１１００には、フォントサイズごとに生成されたＧＵＩ部品１１０１〜１１０３が選択候補として表示されている。ここで、ＧＵＩ部品選択画面１１００において、ＧＵＩ部品１１０１〜１１０３は、図１０で説明したように求められた総評価点の高い順、すなわち、領域１００１との類似度が高い順に表示されている。たとえば、ユーザは、このように表示されたＧＵＩ部品１１０１〜１１０３の中から、マウス１１１操作などにより、任意のＧＵＩ部品を選択することができる。このとき、選択するＧＵＩ部品は一つに限らず、複数のＧＵＩ部品を選択することができる。たとえば、携帯音楽プレーヤーの動作状態によって表示させるＧＵＩ部品が異なる場合、表示される可能性があるＧＵＩ部品を全て選択することができる。

図１２に示す画面７００では、図１１に示したＧＵＩ部品選択画面１１００においてＧＵＩ部品１１０１が選択されたことにより、選択されたＧＵＩ部品１１０１が、領域１００１上に配置されている。このとき、選択されたＧＵＩ部品１１０１は領域１００１との類似度が特に高いものであるため、ＧＵＩ部品１１０１が領域１００１から極端にはみ出したり、ＧＵＩ部品１１０１と領域１００１との間に極端な隙間が生じたりすることなく、領域１００１にＧＵＩ部品１１０１を配置することができる。

以上説明したように、この発明の実施の形態にかかるＧＵＩ画面設計支援プログラム、ＧＵＩ画面設計支援方法、およびＧＵＩ画面設計支援装置によれば、データベースに格納されているＧＵＩ部品ごと、またはフォントサイズごとに生成したＧＵＩ部品ごとに、指定された領域との類似度を求め、類似度の高い順に選択候補として表示することとした。このため、ユーザに領域を指定させるだけで、指定した領域との類似度が高いＧＵＩ部品をユーザに提示して、容易に選択させることができる。これにより、ユーザは、手間や時間をかけることなく、複数のＧＵＩ部品の中から適切なＧＵＩ部品を選択することができ、結果的に、ＧＵＩ画面の設計作業にかかる作業時間の短時間化、および作業コストの低コスト化を図ることができる。

なお、本実施の形態で説明したＧＵＩ画面設計支援方法は、あらかじめ用意されたプログラムをパーソナル・コンピュータやワークステーション、ＣＡＤ等のコンピュータで実行することにより実現することができる。このプログラムは、ハードディスク、フレキシブルディスク、ＣＤ−ＲＯＭ、ＭＯ、ＤＶＤなどのコンピュータで読み取り可能な記録媒体に記録され、コンピュータによって記録媒体から読み出されることによって実行される。またこのプログラムは、インターネットなどのネットワークを介して配布することが可能な伝送媒体であってもよい。

以上のように、本発明にかかるＧＵＩ画面設計支援プログラム、ＧＵＩ画面設計支援方法、およびＧＵＩ画面設計支援装置は、電化製品などに組み込まれるＧＵＩ画面など、あらゆるＧＵＩ画面の設計業務に有用であり、特に、膨大な数のＧＵＩ部品を扱うコンピュータを用いたＧＵＩ画面の設計業務への利用に適している。

この発明の実施の形態にかかるＧＵＩ画面設計支援装置のハードウェア構成を示すブロック図である。 この発明の実施の形態にかかるＧＵＩ画面設計支援装置の機能的構成を示すブロック図である。 この発明の実施の形態にかかるＧＵＩ画面設計支援装置によるＧＵＩ画面設計支援処理の手順の一例を示すフローチャートである。 算出部による類似度の算出処理の手順の一例を示すフローチャートである。 記憶部に格納されたＧＵＩ部品の一例を示す説明図である。 類似度の算出処理に用いられる優先度の一例を示す説明図である。 指定部によって指定された指定領域の一例を示す説明図である。 表示制御部によって表示されたＧＵＩ部品の一例を示す説明図である。 選択部によって選択されたＧＵＩ部品の一例を示す説明図である。 指定部によって指定された指定領域の一例を示す説明図である。 表示制御部によって表示されたＧＵＩ部品の一例を示す説明図である。 選択部によって選択されたＧＵＩ部品の一例を示す説明図である。

符号の説明

１００ ＧＵＩ画面設計支援装置
２００ 記憶部
２０１ 指定部
２０２ 取得部
２０３ 生成部
２０４ 算出部
２０５ 表示制御部
２０６ 選択部

Claims (11)

1. 表示画面上において任意の範囲の指定を受け付ける指定工程と、
   前記指定工程によって指定された範囲が文字列データを含む場合、当該文字列データに用いることが可能なフォントサイズごとに、当該フォントサイズに応じた大きさの、前記文字列データを表示するＧＵＩ部品を生成する生成工程と、
   前記生成工程によって生成されたＧＵＩ部品ごとに、当該ＧＵＩ部品の縦横サイズと前記指定工程によって指定された範囲の縦横サイズとの類似度を算出する算出工程と、
   前記算出工程による算出結果に基づいて、前記生成工程によって生成されたＧＵＩ部品を前記表示画面上に表示する表示工程と、
   をコンピュータに実行させることを特徴とするＧＵＩ画面設計支援プログラム。
2. 表示画面上において任意の範囲の指定を受け付ける指定工程と、
   前記指定工程によって指定された範囲が文字列データを含む場合、当該文字列データに用いることが可能なフォントサイズごとに、当該フォントサイズに応じた大きさの、前記文字列データを表示するＧＵＩ部品を生成する生成工程と、
   前記生成工程によって生成されたＧＵＩ部品ごとに、当該ＧＵＩ部品の縦横比と前記指定工程によって指定された範囲の縦横比との類似度を算出する算出工程と、
   前記算出工程による算出結果に基づいて、前記生成工程によって生成されたＧＵＩ部品を前記表示画面上に表示する表示工程と、
   をコンピュータに実行させることを特徴とするＧＵＩ画面設計支援プログラム。
3. 表示画面上において任意の範囲の指定を受け付ける指定工程と、
   前記指定工程によって指定された範囲が文字列データを含む場合、当該文字列データに用いることが可能なフォントサイズごとに、当該フォントサイズに応じた大きさの、前記文字列データを表示するＧＵＩ部品を生成する生成工程と、
   前記生成工程によって生成されたＧＵＩ部品ごとに、当該ＧＵＩ部品の面積と前記指定工程によって指定された範囲の面積との類似度を算出する算出工程と、
   前記算出工程による算出結果に基づいて、前記生成工程によって生成されたＧＵＩ部品を前記表示画面上に表示する表示工程と、
   をコンピュータに実行させることを特徴とするＧＵＩ画面設計支援プログラム。
4. 前記指定工程によって指定された範囲が文字列データを含まない場合、データベースからＧＵＩ部品を取得する取得工程を前記コンピュータに実行させ、
   前記算出工程は、前記取得工程によって取得されたＧＵＩ部品ごとに、前記類似度を算出することを前記コンピュータに実行させることを特徴とする請求項１〜３のいずれか一つに記載のＧＵＩ画面設計支援プログラム。
5. 前記表示工程は、
   前記算出工程によって算出された類似度の高い順に、前記ＧＵＩ部品を前記表示画面上に表示することを特徴とする請求項１〜４のいずれか一つに記載のＧＵＩ画面設計支援プログラム。
6. 指定手段、生成手段、算出手段および表示手段を備えるＧＵＩ画面設計支援装置が、
   前記指定手段により、表示画面上において任意の範囲の指定を受け付ける指定工程と、
   前記指定工程によって指定された範囲が文字列データを含む場合、前記生成手段により、当該文字列データに用いることが可能なフォントサイズごとに、当該フォントサイズに応じた大きさの、前記文字列データを表示するＧＵＩ部品を生成する生成工程と、
   前記算出手段により、前記生成工程によって生成されたＧＵＩ部品ごとに、当該ＧＵＩ部品の縦横サイズと前記指定工程によって指定された範囲の縦横サイズとの類似度を算出する算出工程と、
   前記表示手段により、前記算出工程による算出結果に基づいて、前記生成工程によって生成されたＧＵＩ部品を前記表示画面上に表示する表示工程と、
   を実行することを特徴とするＧＵＩ画面設計支援方法。
7. 指定手段、生成手段、算出手段および表示手段を備えるＧＵＩ画面設計支援装置が、
   前記指定手段により、表示画面上において任意の範囲の指定を受け付ける指定工程と、
   前記指定工程によって指定された範囲が文字列データを含む場合、前記生成手段により、当該文字列データに用いることが可能なフォントサイズごとに、当該フォントサイズに応じた大きさの、前記文字列データを表示するＧＵＩ部品を生成する生成工程と、
   前記算出手段により、前記生成工程によって生成されたＧＵＩ部品ごとに、当該ＧＵＩ部品の縦横比と前記指定工程によって指定された範囲の縦横比との類似度を算出する算出工程と、
   前記表示手段により、前記算出工程による算出結果に基づいて、前記生成工程によって生成されたＧＵＩ部品を前記表示画面上に表示する表示工程と、
   を実行することを特徴とするＧＵＩ画面設計支援方法。
8. 指定手段、生成手段、算出手段および表示手段を備えるＧＵＩ画面設計支援装置が、
   前記指定手段により、表示画面上において任意の範囲の指定を受け付ける指定工程と、
   前記指定工程によって指定された範囲が文字列データを含む場合、前記生成手段により、当該文字列データに用いることが可能なフォントサイズごとに、当該フォントサイズに応じた大きさの、前記文字列データを表示するＧＵＩ部品を生成する生成工程と、
   前記算出手段により、前記生成工程によって生成されたＧＵＩ部品ごとに、当該ＧＵＩ部品の面積と前記指定工程によって指定された範囲の面積との類似度を算出する算出工程と、
   前記表示手段により、前記算出工程による算出結果に基づいて、前記生成工程によって生成されたＧＵＩ部品を前記表示画面上に表示する表示工程と、
   を実行することを特徴とするＧＵＩ画面設計支援方法。
9. 表示画面上において任意の範囲の指定を受け付ける指定手段と、
   前記指定手段によって指定された範囲が文字列データを含む場合、当該文字列データに用いることが可能なフォントサイズごとに、当該フォントサイズに応じた大きさの、前記文字列データを表示するＧＵＩ部品を生成する生成手段と、
   前記生成手段によって生成されたＧＵＩ部品ごとに、当該ＧＵＩ部品の縦横サイズと前記指定手段によって指定された範囲の縦横サイズとの類似度を算出する算出手段と、
   前記算出手段による算出結果に基づいて、前記生成手段によって生成されたＧＵＩ部品を前記表示画面上に表示する表示制御手段と、
   を備えたことを特徴とするＧＵＩ画面設計支援装置。
10. 表示画面上において任意の範囲の指定を受け付ける指定手段と、
    前記指定手段によって指定された範囲が文字列データを含む場合、当該文字列データに用いることが可能なフォントサイズごとに、当該フォントサイズに応じた大きさの、前記文字列データを表示するＧＵＩ部品を生成する生成手段と、
    前記生成手段によって生成されたＧＵＩ部品ごとに、当該ＧＵＩ部品の縦横比と前記指定手段によって指定された範囲の縦横比との類似度を算出する算出手段と、
    前記算出手段による算出結果に基づいて、前記生成手段によって生成されたＧＵＩ部品を前記表示画面上に表示する表示制御手段と、
    を備えたことを特徴とするＧＵＩ画面設計支援装置。
11. 表示画面上において任意の範囲の指定を受け付ける指定手段と、
    前記指定手段によって指定された範囲が文字列データを含む場合、当該文字列データに用いることが可能なフォントサイズごとに、当該フォントサイズに応じた大きさの、前記文字列データを表示するＧＵＩ部品を生成する生成手段と、
    前記生成手段によって生成されたＧＵＩ部品ごとに、当該ＧＵＩ部品の面積と前記指定手段によって指定された範囲の面積との類似度を算出する算出手段と、
    前記算出手段による算出結果に基づいて、前記生成手段によって生成されたＧＵＩ部品を前記表示画面上に表示する表示制御手段と、
    を備えたことを特徴とするＧＵＩ画面設計支援装置。

Images