JPWO2012101700A1 - ＵＩ（ＵｓｅｒＩｎｔｅｒｆａｃｅ）作成支援装置、ＵＩ作成支援方法及びプログラム - Google Patents

Abstract

ＵＩ（User Interface）画面に表示される情報の同一性を確保したまま、ディスプレイに同時に表示される情報の量を変更して、想定ユーザに適したＵＩ画面を設計するために、複数のＵＩ部品が配置される所定のサービス用のＵＩ画面を作成するための支援を行うＵＩ作成支援装置（１）であって、ＵＩ画面を使用する想定ユーザに応じて、複数のＵＩ部品の全てを含みつつディスプレイに同時に表示されるＵＩ部品の数を変更して、想定ユーザ用のＵＩ画面の構成を決定するＵＩ構成決定部（１０）を有するＵＩ作成支援装置（１）を提供する。

Description

本発明は、ＵＩ作成支援装置、ＵＩ作成支援方法及びプログラムに関する。

ＵＩ画面の設計者は、ＵＩ画面を使用するユーザ（以下、「想定ユーザ」）を把握し、当該想定ユーザに適したＵＩ画面を設計する必要があるが、想定ユーザに適したＵＩ画面を設計することは容易でない。

特許文献１には、ユーザに応じてＵＩ画面に配置する部品を取捨選択し、選択した部品のみを配置した当該ユーザ用のＵＩ画面を生成する技術が開示されている。

特許文献２には、ユーザからヘルプ情報の要求があった場合にヘルプ情報を提供する機能を有するシステムにおいて、ユーザに応じて提供するヘルプ情報を取捨選択し、選択したヘルプ情報のみを表示部に表示する技術が開示されている。

特許文献３には、キーやディスプレイを含む異なるデバイスを搭載した移動端末について、各々の移動端末に応じたＵＩ画面を作成することを目的とし、上記デバイスに対応したＧＵＩ（Graphical User Interface）部品を表示するアプリケーションが起動されると、ＧＵＩ部品を表示するときの画面上での大きさや表示位置を算出し、当該内容に従ってＧＵＩ部品を表示する情報処理端末が記載されている。

特許文献４には、広範にわたるユーザ訓練を必要とせず、直感的ＧＵＩを用いて、効率よく、簡潔に、リアルタイムで多次元データを表示し、編集し、処理するシステムにおいて、ＧＵＩで表示されるデータ構造の基本データ要素に含まれる「イベント」の編集（削除等）を、ユーザが実行できる構成が記載されている。

特開２００４−３５５４１８号公報 特開２００１−１１７６８８号公報 特開２０１０−２６７１８６号公報 特表２００５−５２５６５８号公報

本発明者らは、多量の情報がディスプレイに同時に表示されるＵＩ画面を扱いにくく感じるユーザもいれば、多量の情報がディスプレイに同時に表示されるＵＩ画面を扱いやすく感じるユーザもいることを見出した。例えば、あるユーザは、多量の情報がディスプレイに同時に表示されると、情報を理解し難くなり、処理効率や正確性などが低下する。また、他のユーザは、上述のような問題がなく、むしろ、キーボードによる直接入力のみで全ての入力を行うことが可能となる等の理由により、処理効率を高めることができる。

ここで、特許文献１及び２に記載の技術では、ユーザに応じてＵＩ画面に表示する情報を取捨選択することで、ディスプレイに同時に表示される情報（以下、「ディスプレイ表示情報」）の量を変更している。

このような特許文献１及び２に記載の技術の場合、ディスプレイ表示情報の量が異なる２つのＵＩ画面は、必ず、ＵＩ画面に表示される情報が異なってしまう。すなわち、一方のＵＩ画面に含まれる情報が他方のＵＩ画面に含まれないなどの状況が生じ得る。

上述のように、特許文献１及び２に記載の技術の場合、ＵＩ画面に表示される情報の同一性を確保したまま、ディスプレイ表示情報の量を変更することはできないという問題がある。

特許文献３に記載の技術は、ディスプレイ表示情報の量を変更するようには構成されていない。また、特許文献４に記載の技術は、ＵＩ画面に表示する情報を削除することで、ディスプレイ表示情報の量を変更できるとも考えられるが、特許文献１及び２に記載の技術と同様に、ディスプレイ表示情報の量が異なる２つのＵＩ画面は、必ず、ＵＩ画面に表示される情報が異なるという状況が生じ得る。

そこで、本発明では、ＵＩ画面に表示される情報の同一性を確保したまま、ディスプレイに同時に表示される情報の量を変更して、想定ユーザに適したＵＩ画面を設計する技術を提供することを課題とする。

本発明によれば、複数のＵＩ部品が配置される所定のサービス用のＵＩ画面を作成するための支援を行うＵＩ作成支援装置であって、前記ＵＩ画面を使用する想定ユーザに応じて、前記複数のＵＩ部品の全てを含みつつディスプレイに同時に表示される前記ＵＩ部品の数を変更して、前記想定ユーザ用の前記ＵＩ画面の構成を決定するＵＩ構成決定手段を有するＵＩ作成支援装置が提供される。

また、本発明によれば、複数のＵＩ部品が配置される所定のサービス用のＵＩ画面を作成するための支援を行うＵＩ作成支援方法であって、前記ＵＩ画面を使用する想定ユーザに応じて、前記複数のＵＩ部品の全てを含みつつディスプレイに同時に表示される前記ＵＩ部品の数を変更して、前記想定ユーザ用の前記ＵＩ画面の構成を決定するＵＩ構成決定ステップを有するＵＩ作成支援方法が提供される。

また、本発明によれば、複数のＵＩ部品が配置される所定のサービス用のＵＩ画面を作成するための支援を行うためのプログラムであって、コンピュータを、前記ＵＩ画面を使用する想定ユーザに応じて、前記複数のＵＩ部品の全てを含みつつディスプレイに同時に表示される前記ＵＩ部品の数を変更して、前記想定ユーザ用の前記ＵＩ画面の構成を決定するＵＩ構成決定手段として機能させるためのプログラムが提供される。

本発明によれば、ＵＩ画面に表示される情報の同一性を確保したまま、ディスプレイに同時に表示される情報の量を変更して、想定ユーザに適したＵＩ画面を設計することが可能となる。

上述した目的、および、その他の目的、特徴および利点は、以下に述べる好適な実施の形態、および、それに付随する以下の図面によって、さらに明らかになる。
本実施形態のＵＩ作成支援装置の機能ブロック図の一例である。 本実施形態のＵＩ作成支援装置により実現されるＵＩ画面の一例である。 本実施形態のＵＩ作成支援装置により実現されるＵＩ画面の一例である。 本実施形態のＵＩ作成支援装置により実現されるＵＩ画面の一例である。 本実施形態のＵＩ部品保持部が保持するＵＩ部品の一例である。 本実施形態のＵＩ作成部による処理の流れの一例を説明するためのフローチャートである。 本実施形態のＵＩ作成支援方法の処理の流れの一例を説明するためのフローチャートである。 本実施形態のＵＩ作成支援装置により実現されるＵＩ画面の一例である。 本実施形態のＵＩ作成支援装置により実現されるＵＩ画面の一例である。 本実施形態のＵＩ作成支援装置により実現されるＵＩ画面の一例である。 本実施形態のＵＩ作成支援装置により実現されるＵＩ画面の一例である。 本実施形態のＵＩ作成支援装置により実現されるＵＩ画面の一例である。 本実施形態のＵＩ作成支援装置により実現されるＵＩ画面の一例である。 本実施形態のＵＩ作成支援装置により実現されるＵＩ画面の一例である。 本実施形態のＵＩ作成支援装置により実現されるＵＩ画面の一例である。 本実施形態のＵＩ作成支援装置により実現されるＵＩ画面の一例である。

以下、本発明の実施の形態について図面を用いて説明する。

なお、本実施形態の各部は、任意のコンピュータのＣＰＵ、メモリ、メモリにロードされたプログラム（あらかじめ機器を出荷する段階からメモリ内に格納されているプログラムのほか、ＣＤ等の記憶媒体やインターネット上のサーバ等からダウンロードされたプログラムも含む）、そのプログラムを格納するハードディスク等の記憶ユニット、ネットワーク接続用インタフェースを中心にハードウエアとソフトウエアの任意の組合せによって実現される。そして、その実現方法、機器にはいろいろな変形例があることは、当業者には理解されるところである。

また、本実施形態の説明において利用する機能ブロック図は、ハードウエア単位の構成ではなく、機能単位のブロックを示している。これらの図においては、本実施形態の各装置は１つの機器により実現されるよう記載されているが、その実現手段はこれに限定されない。すなわち、物理的に分かれた構成であっても、論理的に分かれた構成であっても構わない。

＜第１の実施形態＞
まず、本実施形態の概要を説明する。
本実施形態では、ＵＩ画面に配置するＵＩ部品を変更（取捨選択）せずに、想定ユーザに応じて、ＵＩ画面上におけるＵＩ部品の表示密度（配置密度）を変更する。また、所定のＵＩ部品全てをＵＩ画面に配置するために、ＵＩ部品の表示密度（配置密度）に応じてＵＩ画面の大きさ（面積）を変更し、必要に応じてＵＩ画面にスクロール表示手法を取り入れる。本実施形態ではこのような構成により、ＵＩ画面に表示される情報の同一性を確保したまま、ディスプレイに同時に表示される情報の量を変更することを実現する。

本実施形態によれば、ＵＩ画面の設計者が行うＵＩ画面設計の支援を行うことができるほか、ＵＩ画面を使用する想定ユーザが自分用にＵＩ画面をカスタマイズするための支援を行うこともできる。ここで例示した支援内容はあくまで一例であり、これに限定されるものではない。

図１は、本実施形態のＵＩ作成支援装置１の構成の一例を示す機能ブロック図を示す。図示するように、本実施形態のＵＩ作成支援装置１は、ＵＩ構成決定部１０を有する。本実施形態のＵＩ作成支援装置１は、その他、入力受付部２０、ＵＩ部品保持部３０、ＵＩ作成部４０及び出力部５０を有してもよい。

ＵＩ作成支援装置１は、所定のサービス用のＵＩ画面を作成するための支援を行う。所定のサービスの内容は特段制限されない。当該ＵＩ画面には、複数のＵＩ部品が配置される。

「ＵＩ部品」は、ＵＩ画面を構成するあらゆる部品が該当し、例えば、ユーザから何らかの入力を受付けるためのいわゆるＧＵＩ部品（ボタン、チェックボックス等）のほか、ＵＩ画面に表示される文字・図形等からなる単なる情報も含まれる。ＵＩ画面に配置されるＵＩ部品の種類及び数は特段制限されず、ＵＩ画面の使用場面、用途等に基づいて決定することができる設計的事項である。

ＵＩ構成決定部１０は、ＵＩ画面を使用する想定ユーザに応じて、ＵＩ画面に配置される複数のＵＩ部品の全てを含みつつ、当該ＵＩ画面を表示するディスプレイに同時に表示されるＵＩ部品の数を変更して、当該想定ユーザ用のＵＩ画面の構成を決定する。

「ＵＩ画面に配置される複数のＵＩ部品」とは、ＵＩ画面の設計上、ＵＩ画面に配置されると決定されているＵＩ部品（以下、「設計ＵＩ部品」）である。どのようなＵＩ部品を設計ＵＩ部品とするかは設計的事項である。「ディスプレイに同時に表示されるＵＩ部品」とは、ＵＩ画面を表示するディスプレイ内において同時に表示されるＵＩ部品（以下、「表示ＵＩ部品」）であり、すなわち、想定ユーザが同時に視認することができるＵＩ部品である。ＵＩ画面の大きさ等次第では、ＵＩ画面の全てが同時にディスプレイに表示される場合もあれば、表示されない場合もありえる。このため、表示ＵＩ部品は、設計ＵＩ部品の中の一部または全部となる概念である。

本実施形態では、ＵＩ構成決定部１０は、想定ユーザに応じて、ＵＩ画面上におけるＵＩ部品の表示密度を変更することで、ディスプレイに同時に表示されるＵＩ部品の数を変更する。具体的には、ＵＩ構成決定部１０は、想定ユーザに応じて、ＵＩ画面上におけるＵＩ部品の表示密度を小さくすることで、ディスプレイに同時に表示されるＵＩ部品の数を少なくする。また、ＵＩ構成決定部１０は、想定ユーザに応じて、ＵＩ画面上におけるＵＩ部品の表示密度を大きくすることで、ディスプレイに同時に表示されるＵＩ部品の数を多くする。

ＵＩ画面上におけるＵＩ部品の表示密度の変更は、例えば、ＵＩ画面上におけるＵＩ部品の配置ルールを変更することで実現することができる。ＵＩ構成決定部１０は、想定ユーザに応じて、ＵＩ画面上におけるＵＩ部品の配置ルールを決定することで、当該想定ユーザ用のＵＩ画面の構成を決定してもよい。

上記ＵＩ部品の配置ルールの内容は特段制限されないが、例えば、ＵＩ画面上において、同一行に配置することができるＵＩ部品の最大数を定めたルール、ＵＩ画面上におけるＵＩ部品間の行方向の間隔を定めたルール、ＵＩ部品間の列方向の間隔を定めたルール、ＵＩ部品間の行及び列方向の間隔を定めたルール、ここで列記した複数のルールの中の少なくとも２つを組み合わせたルールなどであってもよい。各ルールにおける具体的な値は設計的事項であり、例えば、ＵＩ構成決定部１０は、予め定められた複数の候補値の中から想定ユーザに応じて１つの値を選択するようにしてもよい。なお、ここで例示した配置ルールはあくまで一例であり、ＵＩ部品の表示密度を変更することができる内容であれば、その他の内容であっても構わない。

ここで、図２乃至４に、異なる配置ルールに従い複数のＵＩ部品を配置したＵＩ画面の例を示す。図２乃至４に示すＵＩ画面は、ディスプレイに表示された状態を示している。

図２に示すＵＩ画面は、受発注の内容をデータ入力するための受発注システム用ＵＩ画面である。当該ＵＩ画面においては、「受発注システム」、「基本情報」、「品名」などの情報からなるＵＩ部品のほか、所定のユーザ入力を受付ける「入力ボックス」、「ラジオボタン」などのＵＩ部品を含む設計ＵＩ部品が配置されている。図２に示すＵＩ画面は、ディスプレイに同時に設計ＵＩ部品の全てが表示されるＵＩ画面（以下、「第１のＵＩ画面」）である。

ＵＩ構成決定部１０は、想定ユーザに応じて、図２に示す第１のＵＩ画面のように、ディスプレイに同時に設計ＵＩ部品の全てが表示されるような配置ルールを決定することができる。

なお、第１のＵＩ画面の配置ルールは、設計ＵＩ部品の全てがディスプレイに同時に表示される構成を実現できるものであればよく、その詳細は特段制限されない。

図３及び４に示すＵＩ画面は、ＵＩ部品の表示密度を、第１のＵＩ画面におけるＵＩ部品の表示密度よりも小さくしたＵＩ画面（以下、「第２のＵＩ画面」）である。図３及び４に示す第２のＵＩ画面の配置ルールは、図２に示す第１のＵＩ画面の配置ルールに比べて、同一行に配置可能なＵＩ部品の最大数が少なくなっている。結果、図３及び４に示す第２のＵＩ画面は、図２に示す第１のＵＩ画面と比べて、ＵＩ部品の表示密度が小さくなり、ディスプレイに同時に表示されるＵＩ部品の数が少なくなっている。なお、図４に示す第２のＵＩ画面は、図３に示す第２のＵＩ画面と比べてＵＩ部品の表示密度が小さく、ディスプレイに同時に表示されるＵＩ部品の数が少なくなっている。すなわち、図４に示す第２のＵＩ画面の配置ルールは、図３に示す第２のＵＩ画面の配置ルールに比べて、同一行に配置可能なＵＩ部品の最大数が少なくなっている。

ＵＩ構成決定部１０は、想定ユーザに応じて、図３及び４に示す第２のＵＩ画面のように、ＵＩ部品の表示密度が、第１のＵＩ画面におけるＵＩ部品の表示密度よりも小さくなるような配置ルールを決定することができる。

なお、第２のＵＩ画面の配置ルールは、ＵＩ部品の表示密度が第１のＵＩ画面におけるＵＩ部品の表示密度よりも小さくなる構成を実現できるものであればよく、図３及び４を用いて説明した配置ルールは一例である。

ここで、図３及び４に示す第２のＵＩ画面の設計ＵＩ部品と、図２に示す第１のＵＩ画面の設計ＵＩ部品とは同じである。図３及び４に示す第２のＵＩ画面は、第１のＵＩ画面よりも大きくなっており、スクロール表示手法を取り入れている。

次に、「想定ユーザに応じて」の概念について説明する。
「想定ユーザに応じて」とは、例えば「所定のサービスにおける想定ユーザの習熟度に応じて」であってもよい。かかる場合、ＵＩ構成決定部１０は、想定ユーザの当該習熟度が高い場合、ディスプレイに同時に表示されるＵＩ部品の数が多くなり、想定ユーザの当該習熟度が低い場合、ディスプレイに同時に表示されるＵＩ部品の数が少なくなるように、ＵＩ画面の構成を決定してもよい。

その他、「想定ユーザに応じて」とは、例えば「ＵＩ画面を操作するための装置（例：ＰＣ）における想定ユーザの習熟度に応じて」であってもよい。かかる場合、ＵＩ構成決定部１０は、想定ユーザの当該習熟度が高い場合、ディスプレイに同時に表示されるＵＩ部品の数が多くなり、想定ユーザの当該習熟度が低い場合、ディスプレイに同時に表示されるＵＩ部品の数が少なくなるように、ＵＩ画面の構成を決定してもよい。

その他、「想定ユーザに応じて」とは、例えば「想定ユーザが所定のサービスを実施する頻度」であってもよい。かかる場合、ＵＩ構成決定部１０は、想定ユーザの当該頻度が多い場合、ディスプレイに同時に表示されるＵＩ部品の数が多くなり、想定ユーザの当該頻度が少ない場合、ディスプレイに同時に表示されるＵＩ部品の数を少なくなるように、ＵＩ画面の構成を決定してもよい。

なお、上記例はあくまで一例であり、「想定ユーザに応じて」とはその他の概念を含んでもよい。

図１に戻り、入力受付部２０は、想定ユーザの属性を示す情報の入力をユーザから受付ける。想定ユーザの属性を示す情報は、例えば、「所定のサービスにおける想定ユーザの習熟度を示す情報」や、「ＵＩ画面を操作するための装置（例：ＰＣ）における想定ユーザの習熟度を示す情報」であってもよい。これらの情報は、例えば、想定ユーザの習熟度を点数化（例：５段階評価）した情報などであってもよい。かかる場合、入力受付部２０は、ユーザから想定ユーザの習熟度を示す点数の入力を直接受付けても良いし、または、想定ユーザの習熟度を示す点数を算出するための情報の入力を受付けてもよい。想定ユーザの習熟度を示す点数を算出するための情報は、想定ユーザの性別、年齢、サービス使用期間、職業などの想定ユーザに関する情報であってもよい。入力受付部２０は入力を受付けたこのような情報を基に、予め保持している所定の算出ルールを利用して、想定ユーザの習熟度を示す点数を算出しても良い。入力受付部２０が上述のような情報の入力を受付ける手段は特段制限されず、キーボード、マウス、タッチパネルディスプレイ等のあらゆる入力装置を利用して、実現することができる。

入力受付部２０が入力を受付けた想定ユーザの属性を示す情報は、ＵＩ構成決定部１０に渡される。そして、ＵＩ構成決定部１０は、取得した想定ユーザの属性を示す情報に基づき、想定ユーザに応じたＵＩ画面の構成を決定する。例えば、ＵＩ構成決定部１０は、想定ユーザの習熟度を示す情報（例：点数）と、ＵＩ部品の表示密度レベルを示す情報とを対応付けた情報を予め保持しておき、当該情報を利用して、想定ユーザに応じたＵＩ画面の構成を決定してもよい。

ＵＩ部品保持部３０は、ＵＩ画面の設計上、ＵＩ画面に配置されると決定されているＵＩ部品（設計ＵＩ部品）を保持する。図５に、ＵＩ部品保持部３０が保持するＵＩ部品の一例を示す。図５に示す例においては、「内容」の欄に、ユーザから入力を受付けるためのＧＵＩ部品が列記されている。そして、「分類１」及び「項目名」の欄に、ＵＩ画面上において、各ＧＵＩ部品に対応付けて表示される情報が記載されている。例えば、「内容」の欄の一番上に記載されているテキストボックスは、ＵＩ画面上において「基本情報」及び「品名」の情報と対応付けて表示される。

ＵＩ作成部４０は、ＵＩ部品保持部３０が保持する設計ＵＩ部品を利用し、ＵＩ構成決定部１０が決定したＵＩ画面の構成（例：配置ルール）に従い、設計ＵＩ部品を配置してＵＩ画面を作成する。結果、図２乃至４に示すようなＵＩ画面が得られる。

ここで、図６のフローチャートを用いて、ＵＩ作成部４０がＵＩ画面を作成する処理の流れの一例を説明する。

前提として、ＵＩ作成部４０は、ＵＩ部品保持部３０から取得した図５に示す設計ＵＩ部品を、ＵＩ画面上に配置していくものとする。また、ＵＩ作成部４０は、図５に示す「項目名」の１つ、及び、当該「項目名」に対応付けられた「内容」をセット（以下、「使用情報」）とし、複数の使用情報を、左から右、上から下に向かってＵＩ画面上に配置していくものとする。さらに、ＵＩ作成部４０は、対応付けられている「分類１」の情報が異なる使用情報は同一行に配置しないものとする。そして、ＵＩ作成部４０は、ＵＩ構成決定部１０から、同一行に配置可能な使用情報の最大数を規定した配置ルールを取得するものとする。

なお、上記前提はあくまで一例であり、本実施形態はその他の構成とすることができることは言うまでもない。例えば、使用情報を配置していく順は、右から左、下から上とすることもできる。また、配置ルールはその他の内容とすることもできる。

以下、ＵＩ作成部４０が使用情報を配置していく処理の流れを説明する。
まず、ＵＩ作成部４０は、ＵＩ画面上に使用情報を配置する位置（以下、「オフセット位置」）を初期位置に設定する（Ｓ２０１）。ここでの初期位置は、ページタイトル、ログイン名、ヘルプ・ガイダンス情報などを表示した領域（ヘッダ領域）の下に位置する領域の左端とするが（図２乃至４参照）、これに限られるものではない。

次に、ＵＩ作成部４０は、図５に示す設計ＵＩ部品の中から、所定の順（設計的事項）に、使用情報を１セットずつ取り出し、取り出した使用情報をＵＩ画面上に配置していく（Ｓ２０２）。

具体的には、ＵＩ作成部４０は、取り出した使用情報をオフセット位置に配置する（Ｓ２０３）。ここでは、「項目名」及び「内容」で特定されるＧＵＩ部品を、この順に左から並べて配置する。次に、ＵＩ作成部４０は、今配置した使用情報が、対応付けられている分類１に対応付けられた使用情報の中で、最後に配置された使用情報か否かを判定する（Ｓ２０４）。

Ｓ２０４における判定の結果、Ｙｅｓである場合、ＵＩ作成部４０は、オフセット位置を次の行の初めに移動する（Ｓ２０７）。すなわち、オフセット位置のx座標を左端の値にし、y座標を一行分増加させる。一方、判定の結果、Ｎｏである場合、Ｓ２０５に進む。

Ｓ２０５では、ＵＩ作成部４０は、Ｓ２０３における使用情報の配置後の状態において、当該使用情報を配置した行に配置された使用情報の数が、所定の数より小さいか判定する。所定の数は、ＵＩ作成部４０がＵＩ構成決定部１０から取得した配置ルールで特定される、同一行に配置可能な使用情報の最大数である。

Ｓ２０５における判定の結果、Ｎｏである場合、ＵＩ作成部４０は、オフセット位置を次の行の初めに移動する（Ｓ２０７）。すなわち、オフセット位置のx座標を左端の値にし、y座標を一行分増加させる。一方、判定の結果、Ｙｅｓである場合、ＵＩ作成部４０は、オフセット位置を今配置した使用情報の隣（同一行）へ移動する（Ｓ２０６）。

その後、ＵＩ作成部４０は、ＵＩ部品保持部３０が保持するすべての使用情報を配置するまでＳ２０３からＳ２０７を繰り返すことで、ＵＩ画面上への設計ＵＩ部品すべての配置を完了する。

なお、上記は、使用情報を配置する処理を中心に説明したが、所定のタイミングで、分類１の情報を配置するステップを有してもよい。

図１に戻り、出力部５０は、ＵＩ作成部４０が作成したＵＩ画面を、例えばディスプレイ等の出力装置を介して出力する。結果、ユーザは、図２乃至４に示すようなＵＩ画面を確認することが可能となる。

次に、本実施形態のＵＩ作成支援方法の処理の流れの一例を、図７のフローチャートを用いて説明する。

図７のフローチャートに示すように、本実施形態のＵＩ作成支援方法は、入力受付ステップＳ１０と、ＵＩ構成決定ステップＳ２０と、ＵＩ作成ステップＳ３０と、出力ステップＳ４０とを有する。

入力受付ステップＳ１０では、入力受付部２０が、想定ユーザの属性を示す情報の入力をユーザから受付ける。例えば、入力受付部２０は、「所定のサービスにおける想定ユーザの習熟度を示す情報」（例：５段階評価）の入力を受付ける。

ＵＩ構成決定ステップＳ２０では、ＵＩ構成決定部１０が、Ｓ１０で入力受付部２０が取得した情報に基づき、設計ＵＩ部品の全てを含みつつ、ディスプレイに同時に表示されるＵＩ部品の数を変更して、当該想定ユーザのＵＩ画面の構成を決定する。例えば、ＵＩ構成決定部１０は、「所定のサービスにおける想定ユーザの習熟度を示す情報」（例：５段階評価）に基づき、当該想定ユーザ用のＵＩ画面における設計ＵＩ部品の配置ルールを決定する。

ＵＩ作成ステップＳ３０では、ＵＩ作成部４０が、Ｓ２０でＵＩ構成決定部１０が決定したＵＩ画面の構成に従い、ＵＩ画面を作成する。例えば、ＵＩ作成部４０は、ＵＩ部品保持部３０が保持する設計ＵＩ部品を利用し、ＵＩ構成決定部１０が決定したＵＩ画面の構成（例：配置ルール）に従い、設計ＵＩ部品を配置してＵＩ画面を作成する。結果、例えば、図２乃至４に示すようなＵＩ画面が得られる。

出力ステップＳ４０では、出力部５０が、Ｓ３０でＵＩ作成部４０が作成したＵＩ画面を、例えばディスプレイを介して出力する。

その後、例えば、ユーザからＳ４０で出力したＵＩ画面の構成を保存する入力を受付け、当該入力に従い、当該ＵＩ画面の構成を示す情報を保存してもよい。当該ＵＩ画面の構成を示す情報は、設計ＵＩ部品を配置したＵＩ画面のデータそのものであってもよいし、Ｓ２０でＵＩ構成決定部１０が決定した配置ルールであってもよい。

なお、本実施形態のＵＩ作成支援装置１は、例えば、以下のプログラムをコンピュータにインストールすることで、実現することができる。
複数のＵＩ部品が配置される所定のサービス用のＵＩ画面を作成するための支援を行うためのプログラムであって、コンピュータを、
前記ＵＩ画面を使用する想定ユーザに応じて、前記複数のＵＩ部品の全てを含みつつディスプレイに同時に表示される前記ＵＩ部品の数を変更して、前記想定ユーザ用の前記ＵＩ画面の構成を決定するＵＩ構成決定手段として機能させるためのプログラム。

本実施形態によれば、ＵＩ画面に表示される情報の同一性を確保したまま、ディスプレイに同時に表示される情報の量を変更して、想定ユーザに適したＵＩ画面を設計することが可能となる。

＜第２の実施形態＞
まず、本実施形態の概要を説明する。
本実施形態では、ＵＩ画面に配置するＵＩ部品を変更（取捨選択）せずに、想定ユーザに応じて、ＵＩ画面を複数のページに分割し、ＵＩ部品を複数のページに分けて表示する。本実施形態ではこのような構成により、ＵＩ画面に表示される情報の同一性を確保したまま、ディスプレイに同時に表示される情報の量を変更することを実現する。

本実施形態によれば、ＵＩ画面の設計者が行うＵＩ画面設計の支援を行うことができるほか、ＵＩ画面を使用する想定ユーザが自分用にＵＩ画面をカスタマイズするための支援を行うこともできる。ここで例示した支援内容はあくまで一例であり、これに限定されるものではない。

本実施形態のＵＩ作成支援装置１の構成の一例を示す機能ブロック図は第１の実施形態と同様である。すなわち、図１に示すように、本実施形態のＵＩ作成支援装置１は、ＵＩ構成決定部１０を有する。また、本実施形態のＵＩ作成支援装置１は、その他、入力受付部２０、ＵＩ部品保持部３０、ＵＩ作成部４０及び出力部５０を有してもよい。

以下、ＵＩ構成決定部１０及びＵＩ作成部４０の構成について説明する。なお、入力受付部２０、ＵＩ部品保持部３０及び出力部５０の構成については、第１の実施形態と同様であるので、ここでの説明は省略する。

ＵＩ構成決定部１０は、第１の実施形態と同様、想定ユーザに応じて、図２に示すようなディスプレイに同時に設計ＵＩ部品の全てが表示されるＵＩ画面（第１のＵＩ画面）の構成を、当該想定ユーザ用のＵＩ画面の構成として決定することができる。

また、ＵＩ構成決定部１０は、第１の実施形態と同様、想定ユーザに応じて、第１のＵＩ画面よりもディスプレイに同時に表示されるＵＩ部品の数が少ない第２のＵＩ画面の構成を、当該想定ユーザ用のＵＩ画面の構成として決定することができる。しかし、本実施形態のＵＩ構成決定部１０が決定する第２のＵＩ画面の構成は、第１の実施形態のＵＩ構成決定部１０が決定する第２のＵＩ画面の構成と異なる。以下、説明する。

本実施形態のＵＩ構成決定部１０は、第２のＵＩ画面の構成として、ＵＩ画面を複数のページに分割し、複数のページを順次ディスプレイに表示する表示手法を備えたＵＩ画面の構成を決定する。すなわち、設計ＵＩ部品を複数のページに分けて配置し、設計ＵＩ部品が所定数ずつ順次ディスプレイに配置されるようにする。

ここで、図８（ａ）乃至（ｃ）及び９（ａ）乃至（ｆ）に、本実施形態のＵＩ構成決定部１０が決定した第２のＵＩ画面の構成の例を示す。図８（ａ）乃至（ｃ）に示す３つのページにより、図２に示す第１のＵＩ画面に相当するＵＩ画面が構成されている。また、図９（ａ）乃至（ｆ）に示す６つのページにより、図２に示す第１のＵＩ画面に相当するＵＩ画面が構成されている。

図８（ａ）乃至（ｃ）に示すＵＩ画面は、図２に示す第１のＵＩ画面を「基本情報」、「要求者情報」、「納入先担当者情報」という分類１（図５参照）の情報単位で分割し、各々を１つのページに表示している。これら複数のページは、各ページに設けられた「次へ」、「前へ」のボタンの入力に応じて、所定の順にディスプレイに表示される。なお、図８（ａ）乃至（ｃ）に示すＵＩ画面におけるＵＩ部品の配置の仕方、すなわち一行に配置されるＵＩ部品の数やＵＩ部品間の間隔等については、図２に示す第１のＵＩ画面と同じ構成になっている。

図９（ａ）乃至（ｆ）に示すＵＩ画面は、図８（ａ）乃至（ｃ）に示すＵＩ画面の各ページをさらに２つのページに分割している。これら複数のページも同様に、各ページに設けられた「次へ」、「前へ」のボタンの入力に応じて、所定の順にディスプレイに表示される。なお、図９（ａ）乃至（ｆ）に示すＵＩ画面におけるＵＩ部品の配置の仕方、すなわち一行に配置されるＵＩ部品の数やＵＩ部品間の間隔等については、図２に示す第１のＵＩ画面と同じ構成になっている。

第１のＵＩ画面をいくつのページに分割するか、また、設計ＵＩ部品をどのように各ページに振り分けるかは設計的事項である。

「想定ユーザに応じて」の概念については第１の実施形態と同様である。

ＵＩ作成部４０は、ＵＩ部品保持部３０が保持する設計ＵＩ部品を利用し、ＵＩ構成決定部１０が決定したＵＩ画面の構成に従い、設計ＵＩ部品を配置してＵＩ画面を作成する。結果、図２、８（ａ）乃至（ｃ）及び９（ａ）乃至（ｆ）に示すようなＵＩ画面が得られる。

本実施形態のＵＩ作成支援方法の処理の流れは、第１の実施形態に準じて実現することができる。よって、ここでの説明は省略する。

本実施形態によれば、第１の実施形態と同様の作用効果を実現することができる。

また、本実施形態の第２のＵＩ画面は、図８（ａ）乃至（ｃ）及び９（ａ）乃至（ｆ）に示すように、第１のＵＩ画面（図２参照）におけるＵＩ部品の配置の仕方と同じ配置の仕方とすることができる点で、第１の実施形態と異なる。

ＵＩ画面の設計においては、設計ＵＩ部品の配置の仕方が固定されている場合があり得る。例えば、紙媒体でやり取りされる伝票等に記載された情報の配置の仕方と、当該紙媒体に記載された情報に相当する設計ＵＩ部品のＵＩ画面における配置の仕方とを一致させることで、情報の入力効率の向上を図る場合等があり得る。

本実施形態によれば、上述のように、設計ＵＩ部品の配置の仕方が固定されている場合であっても、ＵＩ画面に表示される情報の同一性を確保したまま、ディスプレイに同時に表示される情報の量を変更して、想定ユーザに適したＵＩ画面を設計することが可能となる。

＜第３の実施形態＞
本実施形態のＵＩ作成支援装置１の構成の一例を示す機能ブロック図は第１の実施形態と同様である。すなわち、図１に示すように、本実施形態のＵＩ作成支援装置１は、ＵＩ構成決定部１０を有する。また、本実施形態のＵＩ作成支援装置１は、その他、入力受付部２０、ＵＩ部品保持部３０、ＵＩ作成部４０及び出力部５０を有してもよい。

以下、ＵＩ構成決定部１０の構成について説明する。なお、入力受付部２０、ＵＩ部品保持部３０、ＵＩ作成部４０及び出力部５０の構成については、第１の実施形態と同様であるので、ここでの説明は省略する。

本実施形態では、ＵＩ構成決定部１０は、第１及び第２の実施形態と同様、想定ユーザに応じて、図２に示すような、ディスプレイに同時に設計ＵＩ部品の全てが表示されるＵＩ画面（第１のＵＩ画面）の構成を決定することができる。

また、ＵＩ構成決定部１０は、第１及び第２の実施形態と同様、想定ユーザに応じて、第１のＵＩ画面よりもディスプレイに同時に表示されるＵＩ部品の数が少ない第２のＵＩ画面の構成を決定することができる。しかし、本実施形態のＵＩ構成決定部１０が決定する第２のＵＩ画面の構成は、第１及び第２の実施形態のＵＩ構成決定部１０が決定する第２のＵＩ画面の構成と異なる。

具体的には、本実施形態のＵＩ構成決定部１０は、第２のＵＩ画面の構成として、第２の実施形態の構成に準じてＵＩ画面を複数のページに分割し、複数のページを順次ディスプレイに表示する表示手法を備えたＵＩ画面の構成を決定する。すなわち、設計ＵＩ部品を複数のページに分けて配置し、設計ＵＩ部品が所定数ずつ順次ディスプレイに配置されるように構成する。

さらに、本実施形態のＵＩ構成決定部１０は、第２のＵＩ画面の構成として、第１の実施形態の構成に準じて、各ページに振り分けられた設計ＵＩ部品の配置の仕方を変更する。すなわち、ＵＩ構成決定部１０は、想定ユーザに応じて、ＵＩ画面上におけるＵＩ部品の表示密度を変更する。なお、各ページの設計ＵＩ部品の全てがディスプレイに同時に表示される程度の表示密度とすることが好ましい。

「想定ユーザに応じて」の概念については第１の実施形態と同様である。

本実施形態のＵＩ作成支援方法の処理の流れは、第１の実施形態に準じて実現することができる。よって、ここでの説明は省略する。

本実施形態によれば、第１の実施形態と同様の作用効果を実現することができる。

この出願は、２０１１年１月２７日に出願された日本特許出願特願２０１１−０１５２３５号を基礎とする優先権を主張し、その開示の全てをここに取り込む。

Claims (7)

1. 複数のＵＩ（User Interface）部品が配置される所定のサービス用のＵＩ画面を作成するための支援を行うＵＩ作成支援装置であって、
   前記ＵＩ画面を使用する想定ユーザに応じて、前記複数のＵＩ部品の全てを含みつつディスプレイに同時に表示される前記ＵＩ部品の数を変更して、前記想定ユーザ用の前記ＵＩ画面の構成を決定するＵＩ構成決定手段を有するＵＩ作成支援装置。
2. 請求項１に記載のＵＩ作成支援装置において、
   前記ＵＩ構成決定手段は、
   前記ディスプレイに同時に前記複数のＵＩ部品の全てを表示可能な第１の前記ＵＩ画面よりも前記ディスプレイに同時に表示される前記ＵＩ部品の数が少ない第２の前記ＵＩ画面の構成として、前記ＵＩ画面における前記ＵＩ部品の表示密度を、前記第１のＵＩ画面における前記表示密度よりも小さくした構成を決定するＵＩ作成支援装置。
3. 請求項２に記載のＵＩ作成支援装置において、
   前記ＵＩ構成決定手段は、
   前記第２のＵＩ画面の構成として、スクロール表示手法を備えた構成を決定するＵＩ作成支援装置。
4. 請求項１または２に記載のＵＩ作成支援装置において、
   前記ＵＩ構成決定手段は、
   前記ディスプレイに同時に前記複数のＵＩ部品の全てを表示可能な第１の前記ＵＩ画面よりも前記ディスプレイに同時に表示される前記ＵＩ部品の数が少ない第２の前記ＵＩ画面の構成として、前記ＵＩ画面を複数のページに分割し、複数のページを順次ディスプレイに表示する表示手法を備えた前記ＵＩ画面の構成を決定するＵＩ作成支援装置。
5. 請求項１から４のいずれか１項に記載のＵＩ作成支援装置において、
   前記ＵＩ構成決定手段は、
   前記想定ユーザの前記所定のサービスの習熟度が低い場合には、前記ディスプレイに同時に表示される前記ＵＩ部品の数を少なくし、
   前記想定ユーザの前記所定のサービスの習熟度が高い場合には、前記ディスプレイに同時に表示される前記ＵＩ部品の量を多くするＵＩ作成支援装置。
6. 複数のＵＩ部品が配置される所定のサービス用のＵＩ画面を作成するための支援を行うＵＩ作成支援方法であって、
   前記ＵＩ画面を使用する想定ユーザに応じて、前記複数のＵＩ部品の全てを含みつつディスプレイに同時に表示される前記ＵＩ部品の数を変更して、前記想定ユーザ用の前記ＵＩ画面の構成を決定するＵＩ構成決定ステップを有するＵＩ作成支援方法。
7. 複数のＵＩ部品が配置される所定のサービス用のＵＩ画面を作成するための支援を行うためのプログラムであって、
   コンピュータを、
   前記ＵＩ画面を使用する想定ユーザに応じて、前記複数のＵＩ部品の全てを含みつつディスプレイに同時に表示される前記ＵＩ部品の数を変更して、前記想定ユーザ用の前記ＵＩ画面の構成を決定するＵＩ構成決定手段として機能させるためのプログラム。

Images