コンテンツ画面の色カスタマイズ方法
【課題】表示された画面を構成する各部をユーザが視認し易い色で表示できるようにする。
【解決手段】コンテンツ画面で物品としての操作ポタンが色カスタマイズ対象として選択されると、この操作ボタンに対するカラーセレクタ表示エリア１９とこの操作ボタンが重なって表示されるレイアウト（背景）に対するカラーセレクタ表示エリア２０とを有する色カスタマイズ操作画面１７ａが表示される。カラーセレクタ表示エリア１９では、この操作ボタンを構成する要素としての文字，背景，枠線夫々のカラーセレクタ１９ａ，１９ｂ，１９ｃが表示され、これらのカラーパレットで夫々の要素の色を選択できる。カラーセレクタ表示エリア２０でも、レイアウトを構成する要素としての文字，背景，枠線夫々のカラーセレクタ２０ａ，２０ｂ，２０ｃが表示され、これらのカラーパレットで夫々の要素の色を選択できる。
【解決手段】コンテンツ画面で物品としての操作ポタンが色カスタマイズ対象として選択されると、この操作ボタンに対するカラーセレクタ表示エリア１９とこの操作ボタンが重なって表示されるレイアウト（背景）に対するカラーセレクタ表示エリア２０とを有する色カスタマイズ操作画面１７ａが表示される。カラーセレクタ表示エリア１９では、この操作ボタンを構成する要素としての文字，背景，枠線夫々のカラーセレクタ１９ａ，１９ｂ，１９ｃが表示され、これらのカラーパレットで夫々の要素の色を選択できる。カラーセレクタ表示エリア２０でも、レイアウトを構成する要素としての文字，背景，枠線夫々のカラーセレクタ２０ａ，２０ｂ，２０ｃが表示され、これらのカラーパレットで夫々の要素の色を選択できる。
【発明の詳細な説明】
【技術分野】
【０００１】
本発明は、端末装置などの表示画面に表示されるコンテンツを構成する操作ボタンやテキスト，チェックボックスなどと、これらの背景エリアなどの物品の色をカスタマイズ（変更）可能としたコンテンツ画面の色カスタマイズ方法に関する。
【背景技術】
【０００２】
パソコンなどの表示画面で表示されるコンテンツには、操作ボタンやテキスト，チェックボックスなどが設けられ、これにより、画面操作ができるようにしており、また、その操作をし易くするために、それらを色付けして容易に判別することができるようにしている。
【０００３】
ところで、テキストなどを表示する場合、このテキストの背景の色などに応じて、このテキストが見にくくなる場合もあり、このため、背景の状況に応じてテキストの表示色を変更し、このテキストを見やすくするようにした技術が提案されている。
【０００４】
その一例として、デジタルカメラで撮影された画像にその撮影日時や撮影者名などのテキストを重畳して表示（焼き込み）する場合、この画像のテキストが重畳されるエリアを背景として、テキストが見易くなる色で背景を表示するようにした技術が提案されている（例えば、特許文献１参照）。
【０００５】
これは、予め背景に使用される色、即ち、背景色が複数文字色管理情報として設定されており、画像でのテキストの背景となるエリア（焼き込み位置）の色を背景色として取得し、この文字色管理情報の設定色を順次選択して取得した背景色とのコントラスト（輝度の差）を求め、このコントラストを予め設定されて基準値と比較し、このコントラントがこの基準値を越えたときには、このコントラストに該当する設定色を背景の色とし、コントラストがこの基準値を越える設定色がないときには、コントラストが最も大きい設定色を背景の色とするものである。
【０００６】
他の例としては、光ディスクから再生された映像に、背景に文字が表わされた字幕が重畳されている場合、この字幕での文字（テキスト）と背景との色の関係を、文字が見易くなるように、変更してから、かかる字幕が重畳された再生映像を表示するようにした技術が提案されている（例えば、特許文献２参照）。
【０００７】
この技術は、予め文字を見易くするための字幕での文字と背景との色の関係が複数（例えば、文字が黒色で背景が白色の組み合わせや文字が白色で背景が黒色の組み合わせ，文字が赤色で背景が黄色の組み合わせなど）設定された色コードテーブルが設けられており、文字が映像によって見にくくなる背景の透明度が所定の範囲内にあるばあいには、このときの文字の色に該当する色コードテーブルでの背景の色をこの字幕の背景の色とするものである。
【先行技術文献】
【特許文献】
【０００８】
【特許文献１】特開２００８−１８２５１３号公報
【特許文献２】特開２００９−２７６０５号公報
【発明の概要】
【発明が解決しようとする課題】
【０００９】
ところで、上記特許文献１，２に記載の技術は、背景に用いられる色は決められており、しかも、実際に背景に用いられる色は、テキスト（文字）の色との関連で決められるものである。これにより、背景に対して、テキストが視認し易くなる場合もあるが、ユーザによっては必ずしも、視認し易くなったとは言えない場合もあり、さらに、見易くなるような色付けもあり得るが、ユーザはそのような色付けを行なうことができない。
【００１０】
また、テキストばかりでなく、背景も見易くなるように、色付けをする必要がある場合もあるが、上記特許文献１，２に記載の技術では、上記の画像や映像に対してテキストの背景を見易くするようなことについては、配慮されていない。
【００１１】
さらに、表示されるコンテンツの画面では、操作ボタンやテキスト，チェックボックスなど（以下、これらをコンテンツの部品という）がこのコンテンツを構成するものであり、上記特許文献１，２に記載の技術での画像に付加されるテキストやその背景とは異なるものであり、かかる部品をユーザの視認し易い色で表示できるようにすることについては、配慮されているものではない。
【００１２】
本発明は、このようなことに鑑みてなされたものであって、その目的は、表示された画面を構成する各部をユーザが視認し易い色で表示できるようにしたコンテンツ画面の色カスタマイズ方法を提供することにある。
【課題を解決するための手段】
【００１３】
上記目的を達成するために、本発明は、コンテンツ画面で表示される部品の色の選択を支援するコンテンツ画面の色カスタマイズ方法であって、コンテンツ画面で色の選択の対象となる部品の指定とともに、色カスタマイズ操作画面が表示され、色カスタマイズ操作画面で、指定された部品を構成する要素毎に、色選択用のカラーパレットが表示されるとともに、指定された部品に接する他の部品を構成する要素毎に、色選択用のカラーパレットが表示され、カラーパレットで所望とする色を選択することにより、選択された部品と他の部品との要素夫々を選択された色で表示することを特徴とするものである。
【００１４】
また、本発明は、上記の部品が、その要素としての文字と背景とから構成され、さらに、必要に応じて、枠線をその要素として有することを特徴とするものである。
【００１５】
さらに、本発明は、上記の要素としての文字と背景に対するカラーパレットのいずれか一方では、文字と背景との輝度コントラスト比が第１の比率未満となる色を選択不能な色として、この色に選択することができないことを示す色であることを示すマークを付し、上記の要素としての文字以外の２つの要素夫々に対するカラーパレットのいずれか一方では、これら要素での輝度コントラスト比が第２の比率未満となる色を選択を勧めない色として、この色に選択を勧めない色であることを示すマークを付することを特徴とするものである。
【００１６】
さらに、本発明は、第１の比率が４．５：１であり、第２の比率が１．７：１であることを特徴とするものである。
【００１７】
さらに、本発明は、指定された部品が指定されたドラッグエリアに含まれる複数の部品であって、ドラッグエリア内の部品毎に、部品を構成する要素夫々の色選択用のカラーパレットが表示されることを特徴とするものである。
【００１８】
さらに、本発明は、上記の他の部品が、指定された部品が重なって表示される部品であることを特徴とするものである。
【００１９】
さらに、本発明は、上記のコンテンツ画面で指定された部品を含む選択部品エリアが、色カスタマイズ操作画面で設定されているプレビューエリアに表示されることを特徴とするものである。
【発明の効果】
【００２０】
本発明によると、コンテンツ画面での所望とする部品を色カスタマイズの対象として指定することができ、色カスタマイズ操作画面でのこの部品を構成する要素毎に、カラーセレクタの操作により、その「要素」を所望とする色に、ユーザが視認し易い状態で、カスタマイズすることが可能となる。
【図面の簡単な説明】
【００２１】
【図１】コンテンツの一具体例の一部を示す図である。
【図２】コンテンツでの部品の種類やその要素，部品が選択されたときと選択されない（非活性）ときとでの要素を示す図である。
【図３】本発明によるコンテンツ画面の色カスタマイズ方法の一実施形態の一連の処理手順を示すフローチャートである。
【図４】図３のステップＳ１００で表示されるコンテンツ画面の一具体例を示す図である。
【図５】図４に示すコンテンツ画面の「色カスタマイズ設定」ボタンが操作されたときの選択画面の一具体例を示す図である。
【図６】図５に示す「色カスタマイズ設定」ボタンで「ＯＫ」ボタンが選択されたときのコンテンツ画面の一具体例を示す図である。
【図７】図６に示すコンテンツ画面で１つの部品が選択されたときの選択部品エリアの一具体例を示す図である。
【図８】図７に示す選択部品エリアの移動後に表示される色カスタマイズ操作画面の一具体例を示す図である。
【図９】図８に示す色カスタマイズ操作画面で選択されたカラーセレクタが開いている状態の色カスタマイズ操作画面の一具体例を示すである。
【図１０】図９における「単色」タブと「グラテーション」タブとの一具体例を示す図である。
【図１１】図１０に示す「単色」タブと「グラテーション」タブとの選択できない色，選択を勧めない色を示した状態を示す図である。
【図１２】図９に示す色カスタマイズ操作画面での操作ボタンの文字の色カスタマイズ操作がなされている状態を示す図である。
【図１３】図９に示す色カスタマイズ操作画面での操作ボタンの枠線の色カスタマイズ操作がなされている状態を示す図である。
【図１４】図９に示す色カスタマイズ操作画面でのレイアウトの背景の色カスタマイズ操作がなされている状態を示す図である。
【図１５】図９に示す色カスタマイズ操作画面でのレイアウトの背景のカラーセレクタの一操作例を示す図である。
【図１６（ａ）】図９に示す色カスタマイズ操作画面でのレイアウトの背景のグラテーション操作を示す図である。
【図１６（ｂ）】図１６（ａ）に示す操作に続くグラテーション操作を示す図である。
【図１７】図９に色カスタマイズ操作画面で色カスタマイズの対象を変化させる操作を示す図である。
【図１８】図９に示す色カスタマイズ操作画面で色カスタマイズ操作が終了したときの操作の一具体例を示す図である。
【図１９】図１８に示す操作によって表示される選択画面の一具体例を示す図である。
【図２０】図６に示すコンテンツ画面で複数の「部品」を選択する操作の一具体例を示す図である。
【図２１】図２０に示す操作で表示される色カスタマイズ操作画面の一具体例を示す図である。
【発明を実施するための形態】
【００２２】
まず、本発明の概念について説明する。
【００２３】
パソコンなどの端末装置の表示画面に表示されるコンテンツは各部品から構成されるものであって、各部品はその構成要素からなるものである。
【００２４】
図１はかかるコンテンツの一具体例の一部を示すものであって、１００は操作ボタン、１０１は文字、１０２はボタン背景、１０３はボタン枠線、２００は背景である。
【００２５】
同図において、このコンテンツのこの部分は操作ボタン１００とこの操作ボタン１００以外のエリアの背景２００とからなっている。ここで、操作ボタン１００と背景２００とは部品であって、コンテンツのこの部分は操作ボタン１００と背景２００との部品によって構成されているものである。ここで、この操作ボタン１００は「部品１」であり、背景２００は「部品２」である。
【００２６】
また、部品１の操作ボタン１００は、操作ボタン１００の輪郭を表わす枠線１０３と、このボタン枠線１０３の内部エリアとなるボタン背景１０２と、テキストを形成する文字１０１とで構成され、これら文字１０１とボタン背景１０２と枠線１０３とが部品１を構成する要素となる。
【００２７】
以下に説明する実施形態は、端末装置に設けられて、このようなコンテンツの部品と夫々の部品や部品の夫々の要素について、ユーザにより、このユーザが視認し易いように、色のカスタマイズ（変更）をすることができるようにするものである。
【００２８】
ところで、部品や部品の要素が明確に判別できるためには、かかる部品や要素とこれに接した（以下、隣接したという）他の部品または他の要素との輝度コントラスト比（濃さの違い）が充分大きいことが必要である。
【００２９】
ここで、Ｗ３Ｃ（World Wide Web Consortium）のＷＣＡＧ（Web Content Accesibility Guidelines）勧告によると、輝度コントラスト比は、
（Ｌ１＋０．０５）／（Ｌ２＋０．０５） ……（１）
但し、Ｌ１：隣接した部品または要素のうちの明るい方の色の相対輝度Ｌ
Ｌ２：隣接した部品または要素のうちの暗い方の色の相対輝度Ｌ
で表わされる。
【００３０】
色の相対輝度Ｌは、ＩＥＣ（国際電気標準会議）規格のｓＲＧＢ色空間では、
Ｌ＝０．２１２６＊Ｒ＋０．７１５２＊Ｇ＋０．０７２２＊Ｂ
で表わされる。但し、かかる色の相対輝度におけるＲ（赤）成分，Ｇ（緑）成分，Ｂ（青）成分は、ｓＲＧＢ色空間でのＲ成分をＲｓＲＧＢ、同じくＧ成分をＧｓＲＧＢ、同じくＢ成分をＢｓＲＧＢとすると、
ＲｓＲＧＢ≦0.03928の場合、Ｒ＝ＲｓＲＧＢ／12.92
ＲｓＲＧＢ＞0.03928の場合、Ｒ＝（(ＲｓＲＧＢ＋0.055)／1.055)＾2.4
ＧｓＲＧＢ≦0.03928の場合、Ｇ＝ＧｓＲＧＢ／12.92
ＧｓＲＧＢ＞0.03928の場合、Ｇ＝（(ＧｓＲＧＢ＋0.055)／1.055)＾2.4
ＢｓＲＧＢ≦0.03928の場合、Ｂ＝ＢｓＲＧＢ／12.92
ＢｓＲＧＢ＞0.03928の場合、Ｂ＝（(ＢｓＲＧＢ＋0.055)／1.055)＾2.4
但し、“＾”は指数演算子
で表わされ、ＲｓＲＧＢ，ＧｓＲＧＢ，ＢｓＲＧＢは夫々
ＲｓＲＧＢ＝Ｒ８bit／255
ＧｓＲＧＢ＝Ｇ８bit／255
ＢｓＲＧＢ＝Ｂ８bit／255
である。
【００３１】
なお、Ｒ８bit，Ｇ８bit，Ｂ８bitは夫々、８ビットで表わされる値である。
【００３２】
以上のように、輝度コントラスト比は上記の式（１）で表わされるが、
（１）コンテンツ作成者は、テキストのレンダリング（数値データからの画像化：例えば、フォントのスムージングやアンチエイリアス）に関するユーザの設定を制御できないため、テキストの輝度コントラスト比は、アンチエイリアンス（表示される線などに現われるギザギザをなくす処理）をオフした状態で評価される。
（２）文字の周囲に縁取りがある場合、その縁取りがコントラストを強めることもあり、文字とその背景色におけるコントラストの計算に用いられる。但し、文字の周囲の細い縁取りは文字として扱われる。文字の周囲の太い縁取りがかさ（暈：ハローや後光）のようになって、文字の細かい字画を埋めていれば、背景色として考慮されることになる。
（３）ＷＣＡＧへの適用は、典型的な表現において隣接すると製作者が想定して、コンテンツで指定した色の組み合わせに対して評価されるべきである。製作者は、ユーザエージェントによる色の変更などのように、通常とは異なる表現を考慮する必要はない。但し、それが制作者のソースコードによって起こる場合は、除く。
【００３３】
なお、ディザリング（表示可能な色を組み合わせて、その中間の色を表現すること）が発生する場合には、元の色の値が用いられる。発生源でディザリングしている色については、用いられる色の平均値（Ｒの平均値，Ｇの平均値，Ｂの平均値）を用いるべきである。
【００３４】
以下に説明する実施形態は、以上の輝度コントラスト比を基に、コンテンツの部品やその要素の色を規制し、いずれの部品や要素の色も、ユーザに合わせてカスタマイズすることができるようにするものである。
【００３５】
ここで、この色の規制とは、文字とその背景（この文字が重なって表示される背景）とでは、その輝度コントラスト比が４．５：１未満となる色を選べなくするものであり、また、文字以外の要素とその背景またはその文字以外の要素に隣り合う要素（例えば、ボタンの背景色とこのボタンの枠線色，ボタンの枠線色とこのボタンが置かれている背景の色など）との輝度コントラスト比が１．７：１以上となる色は選択できる、とするものである。
【００３６】
なお、以下では、上記の規定される輝度コントラスト比を、上記のように、４．５：１，１．７：１として、実施形態の説明をするが、これに限るものでなく、ユーザにとって各「要素」を視認し易くする他の輝度コントラスト比を定めることができる。但し、文字とこれに接する「要素」との間で規定される輝度コントラスト比は、文字以外の「要素」間での規定のコントラスト比よりも、その比率が大きいものとする。
【００３７】
また、この実施形態では、接し合う要素（図１では、部品１の文字１０１、部品１での背景１０２、部品１の枠線１０３、部品２）は全て個別にカスタマイズを行なうものである。グラデーション（色や濃淡の連続的に変化）の場合には、最低の輝度コントラスト比（上記の４．５：１や１．７：１）は、最も厳しい色で判別する。
【００３８】
図２は部品の種類やその要素の一覧を示す図である。
【００３９】
同図において、ここでは、部品として、「ボタン」，「テキスト」，これら「ボタン」や「テキスト」が配置される背景となる「レイアウト」，文字を入力するための「テキストボックス」，２以上の項目毎に設けられていてそれらのうちのいずれかを選ぶことができるようにした「チェックボックス」，２以上の項目毎に設けられていてそれらのうちのいずれか１つだけを選ぶことができるようにした「ラジオボタン」，限られた一定のエリア内に複数種類の情報を表示するために用いる「タブパネル」を挙げており、また、これらに対する要素を挙げている。かかる要素としては、「文字／記号」と「文字／記号の縁取り」と「背景」と「枠線」と「影」などである。ここで、要素「文字／記号」，「文字／記号の縁取り」，「背景」，「枠線」の属性としては、「押下」可能な（押下操作によって機能する）状態の要素と「押下」可能な状態となり得るものの、そのときには、「押下」できない（押下操作しても機能しない）状態の「非活性」の要素とがあり、「押下」可能な状態の要素に対しては、例えば、「文字／記号」を例にすると、「文字／記号」と「非活性の文字／記号」とが存在する。また、「押下」したときに当該部品が選ばれたことを示す状態を、「選択時」とした。例えば、「文字／記号」を例にすると、押下される前で、かつ押下可能な状態を表わす「文字／記号」と、押下される前で、かつ押下不可能な状態を表わす「非活性時の文字／記号」と、押下された後の状態を表わす「選択時の文字／記号」とがある。そして、部品毎に、夫々の要素の該当する属性に○印を付している。
【００４０】
図２によると、部品「ボタン」，「レイアウト」，「テキストボックス」，「チェックボックス」，「ラジオボタン」，「タブパネル」は、「文字／記号」や「文字／記号の縁取り」，「背景」，「枠線」，「影」の要素から成るが、これらには、全て「非活性」の状態が存在する。部品「レイアウト」は、「文字／記号」や「文字／記号の縁取り」，「背景」，「枠線」，「影」の要素から成るが、押下するものではないから、これら要素は不活性の状態も、また、選択の状態も存在しない。部品「テキスト」は、「文字／記号」と「文字／記号の縁取り」の要素から成るものであるが、これら要素には、不活性の状態が存在する。また、「タブパネル」は、「文字／記号」，「文字／記号の縁取り」，「背景」，「枠線」，「影」の要素からなり、これら要素には、「非活性」の状態とともに、「選択」可能な状態も存在する。
【００４１】
以上のことを基に、以下、本発明の実施形態を図３〜図２１を用いて説明する。なお、図３は本発明によるコンテンツ画面の色カスタマイズ方法の一実施形態の一連の処理手順を示すフローチャートであって、この図３を基に、この実施形態を説明する。
【００４２】
まず、図示しない端末装置でコンテンツデータをダウンロードすると、その表示画面に図４に示すこのコンテンツデータによるコンテンツ画面が表示される（図３のステップＳ１００）。
【００４３】
なお、図４において、１は表示画面、２はコンテンツ画面、３は「色カスタマイズモード設定」ボタン、４はコンテンツデータ表示エリア、５，５1〜５4は操作ボタン、５5はその右隣に設けられている「実行」ボタンが押下されたときに実行される機能を選択するための操作部（ここでは、プルダウンメニューとしている）、５ａはボタンの文字、５ｂはボタンの背景、５ｃはボタンの枠線、６は背景、６ａ，６ｂは文字、７はタブパネル、７ａはタブパネルの文字、７ｂはタブパネルの背景、８はテキスト、９はチェックボックス、１０はテキストボックス、１１はカーソルである。
【００４４】
同図において、表示画面１に表示されるコンテンツ画面２では、ダウンロードされたコンテンツを表示するコンテンツ表示エリア４とともに、このコンテンツ表示エリア４で表示されるコンテンツを処理するための、例えば、「重要度変更」ボタン５1，「期限変更」ボタン５2，「担当者変更」ボタン５3，「ステータス変更」ボタン５4（以下、纏めて言うときや総称するときには、操作ボタン５という）や機能選択のための操作部５5，かかる操作ボタン５や操作部５5が重ねて表示されるレイアウト（背景）６，タブパネル７，タブパネル７内に表示されるテキスト８，コンテンツ表示エリア４で表示される各コンテンツデータ毎に設けられたチェックボックス９テキストボックス１０などが表示される。これらがコンテンツ画面２を構成する上記の「部品」ということになる。
【００４５】
コンテンツ表示エリア４には、ここでは、項目「重要度」，「期限」，「担当者」，「ステータス，「メモ」などからなるタスクの一覧表が表示されており、これらタスク毎に、それを処理可能とするためのチェックボックス９が設けられている。「重要度変更」ボタン５1や「期限変更」ボタン５2，「担当者変更」ボタン５3，「ステータス変更」ボタン５4，操作部５5の部品は、コンテンツ表示エリア４でのいずれのタスクも、チェックボックス９でチェックされずに処理不能な状態にあるときには、全て不活性の状態にあり、押下しても機能しないが、コンテンツ表示エリア４でタスクが１つでも、そのチェックボックス９でチェックされて、処理可能な状態となると、これら全てが「押下」可能な状態となる。
【００４６】
例えば、図示するように、タスク３，４が選択されて処理可能な状態になったとすると、これらタスク３，４に対して、「重要度変更」ボタン５1を選択することにより、その項目「重要度」の内容を変更させることができるし、「期限変更」ボタン５2を選択することにより、その項目「期限」の内容を変更させることができるし、「担当者変更」ボタン５3を選択することにより、その項目「担当者」の内容を変更させることができるし、「ステータス変更」ボタン５4を選択することにより、その項目「ステータス」の内容を変更させることができる。また、操作部５5で、図示するように、「メモ記述」の項目が選択されている状態で、「実行」ボタンが押下されると、上記タスク３，４の項目「メモ」の内容を変更させることができる。なお、この操作部５5では、その▲ボタンを押下することにより、機能の一覧が表示され、そのうちの所望の機能が押下されて「実行」ボタンが押下されると、この機能が上記のタスク３，４に対して実行される。
【００４７】
なお、以下では、色カスタマイズの対象として、操作ボタン５を代表例として説明するが、この「メモ記述」変更操作部５5やこれ以外の「部品」、即ち、タブパネル７，テキスト８，チェックボックス９，ラジオボックス１０などについても同様である。
【００４８】
部品としての操作ボタン５は、文字５ａと背景５ｂと枠線５ｃとから構成されており、これらが操作ボタン５を構成する「要素」ということになる。かかる要素としての文字は、「重要度変更」ボタン５1では「重要度変更」であり、「期限変更」ボタン５2では「期限変更」であり、「担当者変更」ボタン５3では「担当者変更」であり、「ステータス変更」ボタン５4では「ステータス変更」である。同様にして、部品としてのレイアウト６には、そのレイアウト６のタイトルを示す文字６ａ，６ｂが表示されるが、この文字６ａ，６ｂとレイアウト６の背景とがこのレイアウト６を構成する要素となる。なお、この文字６ａは、レイアウト６に重なって表示される部品としての「重要度変更」ボタン５1，「期限変更」ボタン５2，「担当者変更」ボタン５3，「ステータス変更」ボタン５4などのコマンドを指定するものであるときには、例えば、「よく使うコマンド」といった標題（テキスト）で表わされている。
【００４９】
また、タブパネル７に表示されるテキスト８は、コンテンツデータであり、部品である。これに対し、タブパネル７に表示される「個人」との文字７ａは、タブパネル７の標題を表わすものであり、タブパネル７を構成する要素ということになる。なお、タブパネル７は、要素としてのかかる文字７ａと要素としての背景７ｂとで構成されることになり、この背景８ｂに部品としてのテキスト８が重ねて表示されていることになる。なお、ここでは、標題を「グループ」とするタプパネルもあるが、これもタブパネル７と同様である。
【００５０】
さらには、コンテンツ表示エリア４では、図示するように、タクトの一覧が表示されているものとしているが、ここでは、これらタクト毎に部品としてのチェックボックス９が設けられているものとしている。
【００５１】
さらにまた、このコンテンツ画面２には、その上辺部に「色カスタマイズ」ボタン３などのモード選択ボタンが表示されおり、これらのいずれかをカーソル１１で指定してクリック操作する（以下、かかる操作を押下操作という）ことにより、これに該当するモードが設定される。「色カスタマイズ」ボタン３は、このコンテンツ画面２での部品やその要素の色をカスタマイズするモードを設定するためのものである。
【００５２】
このコンテンツ画面２が表示された状態で（図３のステップＳ１００）、カーソル１１が操作されて「色カスタマイズ」ボタン３が押下されると（図３のステップＳ１０１）、図５に示す選択画面が表示される。
【００５３】
なお、図５において、１２は選択画面、１３はテキスト、１４は「ＯＫ」ボタン、１５は「キャンセル」ボタンである。
【００５４】
同図において、ここでは、この選択画面１２はコンテンツ画面２に重なってその中央部に表示され、この場合、コンテンツ画面２は透けて見える状態のものとする。但し、選択画面１２のみを表示するようにしてもよい。
【００５５】
この選択画面１２では、例えば、「色をカスタマイズしたい部分を選択して下さい」といったようなテキスト１３が表示されるとともに、部品の色をカスタマイズさせるための「ＯＫ」ボタン１４と色のカスタマイズモードをキャンセルするための「キャンセル」ボタン１５とが表示され、この「キャンセル」ボタン１５がカーソル１１の操作で押下されると、色のカスタマイズモードがキャンセルされ、図３に示すコンテンツ画面２のみの表示状態に戻る。
【００５６】
「ＯＫ」ボタン１４が押下されると、色のカスタマイズモードが設定されて、図６に示すコンテンツ画面２の表示状態となり（但し、図６において、図４に対応する部分には同一符号をつけて重複する説明を省略する）、カーソル１１を操作して所望とする１つの部品、例えば、「期限変更」ボタン５2を押下すると、この部品が押下されたことになる（図３のステップＳ１０２，Ｓ１０３）。
【００５７】
これとともに、この場合には、押下された部品が「期限変更」ボタン５2であって、この部品の上には、他の部品が重なっていない（図３のステップＳ１０４の“Ｎｏ”）、図７に示すように（なお、図７において、１６は押下部品エリアであり、前出図面に対応する部分には同一符号をつけて重複する説明を省略する）、コンテンツ画面２でのこの部品である「期限変更」ボタン５2を完全に含み、かつこれに接する他の部品（ここでは、レイアウト６）の一部とを含み、それ以外の部品を極力排除した押下部品エリア１６が明示された状態となり、コンテンツ画面２の他のエリアは透けて見える状態となる。
【００５８】
そして、図６に示すコンテンツ画面２の全体が、例えば、左方向に移動し、これにより、かかる押下部品エリア１６が移動して、図８に示す色カスタマイズ操作画面が表示される（図３のステップＳ１０５）。
【００５９】
なお、図８において、１７は色カスタマイズ操作画面、１８はカラーセレクタ表示画面、１９は「ボタン」のカラーセレクタ表示エリア、１９ａ〜１９ｃはカラーセレクタ、２０は「レイアウト」のカラーセレクタ表示エリア、２０ａ〜２０ｃはカラーセレクタ、２１は「選択色表示」欄、２２は「選択色の候補表示」ボタン、２３は「クリア」ボタン、２４はプレビューエリア、２５はスクロール操作部、２６は「ＯＫ」ボタン、２７は「キャンセル」ボタン、２８は「全クリア」ボタンである。
【００６０】
同図において、この色カスタマイズ操作画面１７では、図４に示すコンテンツ画面２でのコンテンツデータ表示エリア４が変更されたカラーセレクタ表示画面１８と、タブパネル７の表示エリアが変更されたプレビューエリア２４とからなるものであって、上記のように、図６に示すコンテンツ画面２全体の移動が、プレビューエリア２４内に押下部品エリア１６が位置付けられるまで、行なわれ、このコンテンツ画面２のこのプレビューエリア２４に含まれる部分のみがこのプレビューエリア２４で表示されることになる。但し、このプレビューエリア２４内では、押下部品エリア１６の部分のみが明示され、その他の部分は透けて見える状態となる。これにより、図６のコンテンツ画面２で押下された部品（この場合、「期限変更」ボタン５2）が明確に示され、それを容易に確認することができる。
【００６１】
また、カラーセレクタ表示画面１８では、図６でのコンテンツ画面２で押下された部品と、この部品が重なって表示される他の部品との押下部品エリア１６で明示される部品毎にカラーセレクタ表示エリアが設定される。上記の例では、選択された「期限変更」ボタン５2のカラーセレクタ表示エリア１９と、この「期限変更」ボタン５2が重ねられているレイアウト６に対するカラーセレクタ表示エリア（レイアウト６のカラーセレクタ表示エリア）２０とが設定されることになる。そして、カラーセレクタ表示エリア１９，２０毎に、該当する部品の要素毎にその色を選択することができるようにするためのカラーセレクタが表示される。この場合の例では、カラーセレクタ表示エリア１９には、部品としての「期限変更」ボタン５2の「要素」であるボタンの文字５ａ（図４）に対してカラーセレクタ１９ａが、その背景５ｂに対してカラーセレクタ１９ｂが、その枠線５ｃに対してカラーセンタ１９ｃが夫々設定され、また、レイアウト６のカラーセレクタ表示エリア２０には、「部品」としてのレイアウト６の「要素」であるレイアウト６の文字６ａ（図４）に対してカラーセレクタ２０ａが、その背景に対してカラーセレクタ２０ｂが、その枠線に対してカラーセレクタ２０ｃが夫々設定される。
【００６２】
各カラーセレクタは、カラーセレクタ２０ｃを例にして説明すると、「選択色表示」欄２１と「選択色の候補表示」ボタン２２と「クリア」ボタン２３とからなり、「選択色表示」欄２１では、このカラーセレクタ２０ｃに該当する「要素」（この場合、レイアウト６の枠線）の現在の色が表示されており、これにより、この「要素」の現在の表示色が確認できるようにしている。また、「選択色の候補表示」ボタン２２は、後述するように、色をカスタマイズ（変更）するための手段を表示するためのものであり、「クリア」ボタン２３は、後述するように、選択した色を解除するためのものであり、色の選択に対する制限を解除するためのものでもある。
【００６３】
また、図６に示すコンテンツ画面２で選択された（図３のステップＳ１０３）１つの部品が、例えば、レイアウト６のように、その上に他の部品（例えば、操作ボタン５）が重ねられている場合でも（図３のステップＳ１０４の“Ｙｅｓ”）、図８に示すように、この選択された部品のカラーセレクタ表示エリア１９とこの部品に重ねられた他の部品のカラーセレクタ表示エリア２０とが設定された色カスタマイズ操作画面１７が表示される。但し、この押下された部品がレイアウト６である場合には、これに重なっている部品は複数個の操作ボタン５であり、この場合には、これらの操作ボタン５毎にカラーセレクタ表示エリア２０が設定されて表示されることになる（図３のステップＳ１０６）。なお、押下された部品がタブパネル７である場合には、これに重なっている部品はテキスト８であるから、この場合には、選択されたタブパネル７のカラーセレクタ表示エリア１９とこれに重ねられたテキスト８のカラーセレクタ表示エリア２０とが設定された色カスタマイズ操作画面１７が表示される（図３のステップＳ１０６）。
【００６４】
なお、この色カスタマイズ操作画面１７には、カラーセレクタ表示画面１８を上下にスクロールさせるためのスクロール操作部２５と、後述する色カスタマイズの操作結果を確定するための「ＯＫ」ボタン２６と、後述する色カスタマイズの操作をキャンセルする「キャンセル」ボタン２７と、カラーセレクタ表示画面１８で表示される全てのカラーセレクタ１８ａ〜１８ｃ，１９ａ〜１９ｃの「クリア」ボタン２３を全て同時に操作したのと同様の機能を有する「全クリア」ボタン２８とを備えている。
【００６５】
図８に示す色カスタマイズ操作画面１７で所望とする「要素」のカラーセレクタの「選択色の候補表示」ボタン２２がカーソル１１を用いて押下操作されると、図９に示すように、この「選択色の候補表示」ボタン２２が押下されることによって選択されたカラーセレクタが展開した状態となり、その「要素」の色のカスタマイズが可能な状態となる。
【００６６】
なお、図９において、１７ａはこのときの色カスタマイズ操作画面、２９は「単色」タブ、３０は「グラデーション」タブであり、図８に対応する部分には同一符号をつけて重複する説明を省略する。
【００６７】
いま、図８に示す色カスタマイズ操作画面１７での「期間変更」ボタン５2のカラーセレクタ表示エリア１９でカラーセクク１９ａ〜１９ｃの「選択色の候補表示」ボタン２２が、また、レイアウト６のカラーセレクタ表示エリア２０でカラーセレクタ２０ｂの「選択色の候補表示」ボタン２２が夫々押下されたとすると、これらカラーセレクタ１９ａ〜１９ｃ，２０ｂが選択されて展開した状態となる。即ち、ここでは、「期間変更」ボタン５2の要素「文字」５ａの文字色を設定するためのカラーセレクタ１９ａと、同じく要素「ボタンの背景」５ｂの背景色を設定するためのカラーセレクタ１９ｂと、同じく要素「ボタンの枠線」５ｂの枠線色を設定するためのカラーセレクタ１９ｃと、レイアウト６の要素「背景」の背景色を設定するためのカラーセレクタ２０ｂとが展開することになる。
【００６８】
これらカラーセレクタ１９／２０（カラーセレクタ１９ａ〜１９ｃ，２０ａ〜２０ｃの総称）は、色を決めるための「単色」タブ２９とグラデーションを決めるための「グラテーション」タブ３０とからなり、カーソル１１の操作によってこれらのいずれかが選択された状態にある。図９に示す例では、「期間変更」ボタン５2の要素「文字」５ａに対する「ボタン文字色」のカラーセレクタ１９ａと同じく要素「ボタンの枠線」５ｃに対する「ボタン枠線色」のカラーセレクタ１９ｃとレイアウト６の要素「背景」に対する「背景色」のカラーセレクタ２０ｂとで「単色」タブ２９が選択されており、「期間変更」ボタン５2の要素「ボタンの背景」５ｂに対する「ボタン背景色」のカラーセレクタ１９ｂで「グラテーション」タブ３０が選択されている状態を示している。
【００６９】
これら「単色」タブ２９や「グラテーション」タブ３０は、該当する「要素」が表わされている色（即ち、「選択色表示」欄２１）を選択した状態にある（図３のステップＳ１０７）。
【００７０】
図１０（ａ）は図９における「単色」タブ２９の一具体例を示す図であって、２１ａは設定色表示部、２９ａは不透明度指定部、２９ｂは色相表示欄、２９ｃはカラーパレット、２９ｄ1は色相指定部、２９ｄ2は濃度指定部、２９ｅ1，２９ｅ2はスライダである。
【００７１】
図１０（ａ）において、「単色」タブ２９は、「要素」（例えば、「期間変更」ボタン５2の「要素」）に現在設定されている色の不透明度を表わす不透明度指定部２９ａと、設定可能な種々の濃度での色の一覧を表わす色選択用のカラーパレット２９ｃと、このカラーパレット２９ｃに含まれる色の種類を表わす色相表示欄２９ｂとからなっている。
【００７２】
このカラーパレット２９ｃは、横軸を色彩（色の種類）座標軸として、この色彩座標軸に沿って各種の色彩の色が配列され、縦軸を濃度座標軸として、この濃度座標軸に沿って同じ色彩の色が異なる濃度で配列されている。カラーパレット２９ｃでの所望とする色をカーソル１１の操作で選択することにより、この「単色」タブ２９に該当する「要素」の色がこの選択された色に設定される。これとともに、「選択色表示」欄２１（図８）の設定色表示部２１ａで表示される色も、この選択された色に変更される。
【００７３】
カラーパレット２９ｃの上辺側には、選択する色相を代えるための色相指定部２９ｄ1が設けられており、この色相指定部２９ｄ1に色相を選択するためのスライダ２９ｅ1が設けられている。このスライダ２９ｅ1を色彩座標軸に沿う左右方向に移動させることにより、このスライダ２９ｅ1に対向する色相の色を選択できるようになる。また、カラーパレット２９ｃの左辺側には、色の濃度を変化させるための濃度指定部２９ｄ2が設けられており、この濃度指定部２９ｄ2に濃度を選択するためのスライダ２９ｅ2が設けられている。このスライダ２９ｅ2を濃度座標軸に沿う上下方向に移動させることにより、このスライダ２９ｅ2に対向する濃度の色を選択できるようになる。スライダ２９ｅ1を左右方向に移動されると、これに応じて選択される色相が変化し、これとともに、「選択色表示」欄２１の色設定表示部２１ａに表示される色が変化し、スライダ２９ｅ2を上下方向に移動されると、これに応じてスライダ２９ｅ1で選択されている色相の濃度が変化し、これとともに、「選択色表示」欄２１の色設定表示部２１ａに表示されている色の濃度が変化する。
【００７４】
これにより、スライダ２９ｅ1を希望する色相に対向する位置に設定し、スライダ２９ｅ2を希望する濃度に対向する位置に設定すると、希望する濃度で希望する色彩の色が選択されたことになり、かかる希望する濃度で希望する色彩の色が「選択色表示」欄２１の色設定表示部２１ａに表示されることになる。
【００７５】
図１０（ｂ）は図９における「グラテーション」タブ３０の一具体例を示す図であって、２１ｂは設定グラテーション表示部、３０ａは不透明度指定部、３０ｂは色相表示欄、３０ｃはカラーパレット、３０ｄ1は色相指定部、３０ｄ2は濃度指定部、３０ｅ1，３０ｅ2はスライダ３０ｆはグラデーション設定部、３０ｆ1はグラデーションバー、３０ｆ2，３０ｆ3は端部マーク、３０ｆ4は色相／濃度指示マーク、３０ｇはグラデーション方向設定欄である。
【００７６】
同図において、「グラテーション」タブ３０は、「単色」タブ２９と同様、不透明度指定部３０ａと色相表示欄３０ｂとカラーパレット３０ｃとが設けられているとともに、グラデーション設定部３０ｆ及びグラデーション方向設定欄３０ｇが設けられている。ここで、カラーパレット３０ｃは、グラデーションを設定する際の色の選択のためのものである。
【００７７】
グラデーション方向指定欄３０ｇは、グラデーションの方向（色あるいは濃さの変化の方向）を任意に切り換え設定できるようにするものであって、この方向が角度０゜のときには、横方向に色やその濃さを順次変化させるものであり、角度９０゜のときには、縦方向に色やその濃さを順次変化させるものであり、角度４５℃のときには、斜め方向に色やその濃さを順次変化させるものである。例えば、「期間変更」ボタン５2内の背景５ｂ（図４）でグラテーションの方向を設定する場合には、図９に示すように、「ボタン背景色」のカラーセレクタ１９ｂで「グラテーション」タブ３０を選択し、この「グラテーション」タブ３０（図１０（ｂ））におけるグラデーション方向設定欄３０ｇでその方向に応じた角度を設定するように操作すればよい。ここでグラデーション方向を角度０゜に指定すると、この「期間変更」ボタン５2内の背景５ｂの色やその濃さが横方向に変化して表示され、角度９０゜に指定すると、この「期間変更」ボタン５2内の背景５ｂの色やその濃さが縦方向に変化して表示され、角度４５゜に指定すると、この「期間変更」ボタン５2内の背景５ｂの色やその濃さが斜め方向に変化して表示される。
【００７８】
グラデーション設定部３０ｆは、グラデーションを表わすグラデーションバー３０ｆ1と、グラデーションバー３０ｆ1の端を表わす端部マーク３０ｆ2，３０ｆ3と、グラデーションバー３０ｆ1の端部間の色または濃度を指示するための色相／濃度指示マーク３０ｆ4とからなっている。この色相／濃度指示マーク３０ｆ4は、グラデーションバー３０ｆ1に沿うその位置を変更させることもできるし、また、削除することができるし、さらに、削除の色相／濃度指示マーク３０ｆ4を再び追加することもできる。、
グラデーションバー３０ｆ1での端部マーク３０ｆ2，３０ｆ3や色相／濃度指示マーク３０ｆ4で指示される位置では、「単色」タブ２９での色指定の方法と同様の操作方法により、色を指定することができる。即ち、一方の端部マーク３０ｆ2または３０ｆ3を指定して（カーソル１１でタッチ操作して）、カラーパレット３０ｃで所望の濃度の色相を選択操作することにより、グラデーションバー３０ｆ1のこの端部マーク３０ｆ2または３０ｆ3側の端部にこの選択された濃度の色が設定され、他方の端部マーク３０ｆ3または３０ｆ2を指定操作して、カラーパレット３０ｃで所望の濃度の色相を選択操作することにより、グラデーションバー３０ｆ1のこの端部マーク３０ｆ3または３０ｆ2側の端部にこの選択された濃度の色が設定され、これにより、グラデーションバー３０ｆ1にこの一方の端部に設定された濃度の色から他方の端部に設定された濃度の色までのグラデーションが設定されることになる。これとともに、「色」表示欄２１の設定グラデーション表示部２１ｂに、この色グラデーションが表示されることになる。
【００７９】
なお、グラデーションバー３０ｆ1で設定される色クラデーションは、ここでは、カラーパレット３０ｃ上で、グラデーションバー３０ｆ1での一方の端部（例えば、端部マーク３０ｆ2側の端部）に対して指定された色と他方の端部（例えば、端部マーク３０ｆ3側の端部）に対して指定された色とを結ぶ直線に沿う色の列からなる色グラデーションが表示される。従って、これらの指定される２つの色がカラーパレット３０ｃの濃度座標軸に平行な１つの直線上にある色のときには、グラデーションバー３０ｆ1では、同じ色の濃さが変化する色グラデーションが得られるものであり、指定される２つの色が、濃度座標軸に平行でない１つの直線上にある色であるときには、少なくとも色が変化する色グラデーションが得られることになる。
【００８０】
ここで、グラデーション方向指定欄３０ｇが角度９０°であって、レイアウト６などの「要素」でのグラデーションの方向が垂直方向（縦方向）である場合には、グラデーションバー３０ｆ1の端部マーク３０ｆ2側の端部に設定された濃度と色相の色はこの「要素」の下端での色を表わしており、グラデーションバー３０ｆ1の他方の端部マーク３０ｆ3側の端部に設定された濃度の色はこの「要素」の上端での色を表わしており、グラデーションバー３０ｆ1でこれら濃度で色彩の色間のグラデーションが表わされることになり、このグラデーションでこの「要素」が色／濃度のグラデーション表示されることになる。また、グラデーション方向指定欄３０ｇが角度０°であって、レイアウト６などの「要素」でのグラデーションの方向が水平方向（横方向）である場合には、グラデーションバー３０ｆ1の端部マーク３０ｆ2側の端部に設定された濃度，色彩の色はこの「要素」の左端の色を表わしており、グラデーションバー３０ｆ1の他方の端部マーク３０ｆ3側の端部に設定された濃度，色彩の色はこの「要素」の右端の色を表わしており、これら濃度，色彩の色間のグラデーションがグラデーションバー３０ｆ1で表わされることになり、このグラデーションでこの「要素」が色／濃度のグラデーション表示されることになる。グラデーション方向指定欄３０ｇが角度０°や角度９０゜以外の角度であって、レイアウト６などの「要素」でのグラデーションの方向が斜め方向である場合には、グラデーションバー３０ｆ1の端部マーク３０ｆ2側の端部に設定された濃度，色彩の色はこの「要素」の、例えば、左下角側の色を表わしており、グラデーションバー３０ｆ1の他方の端部マーク３０ｆ3側の端部に設定された濃度，色彩の色はこの「要素」の右上角側の色を表わしており、これら濃度，色彩の色間のグラデーションがグラデーションバー３０ｆ1で表わされることになり、このグラデーションでこの「要素」が色／濃度のグラデーション表示されることになる。
【００８１】
色相／濃度指示マーク３０ｆ4は、グラデーションバー３０ｆ1の途中に所望の濃度で色相の色を指定することができるようにするものであって、色相／濃度指示マーク３０ｆ4を指定して、カラーパレット２９ｃで所望の濃度で色相の色を選択操作することにより、グラデーションバー３０ｆ1のこの色相／濃度指示マーク３０ｆ4の位置にこの選択された濃度，色相の色が設定される。この場合には、グラデーションバー３０ｆ1の一方の端部マーク３０ｆ2側の端部と色相／濃度指示マーク３０ｆ4に対向する位置との間で、これらに設定された濃度，色彩の色間のグラデーションが設定され、さらに、色相／濃度指示マーク３０ｆ4に対向する位置と他方の端部マーク３０ｆ3側の端部との間で、これらに設定された濃度，色相の色間のグラデーションが設定される。例えば、端部マーク３０ｆ2，３０ｆ3で夫々異なる濃度Ｄ１，Ｄ２で色彩が同じ色Ｃが設定され、色相／濃度指示マーク３０ｆ4でこれらと同じ色相で濃い濃度Ｄ３（＞Ｄ１，Ｄ２）の色Ｃが設定されたとすると、グラデーションバー３０ｆ1では、左側から濃度がＤ１からＤ３に変化し、さらに、Ｄ３からＤ２に変化するグラデーションが設定されることになる。そして、このグラデーションが該当する「要素」に設定されることになる。
【００８２】
以上の図１０は、「単色」タブ２９と「グラテーション」タブ３０の構成を示すが、これら「単色」タブ２９と「グラテーション」タブ３０では、上記の輝度コントラスト比を基に、それらのカラーパレット２９ｃ，３０ｃで選択不能な色（以下では、「色」といった場合、この「色」は色相と濃度とからなるものとする）と選択を勧めない色とが設定される。
【００８３】
図１１はかかる「単色」タブ２９のカラーパレットでの表示例を示す図であって、３１ａはバツ印を示す「×（バツ）」マーク、３１ｂは斜線印を示す「／」マークであり、図１０に対応する部分には同一符号を付けて重複する説明を省略する。
【００８４】
上記のように、要素「文字／記号」とこれに接する他の要素との間では、輝度コントラスト比が４．５：１以上でなければならず、要素「文字／記号」以外の要素間では、輝度コントラスト比が１．７：１以上でなければならないという規定があり、この実施形態では、この規定を満たさない色が「単色」タブ２９や「グラテーション」タブ３０のカラーパレットで表示される。
【００８５】
図１１（ａ）は、「単色」タブ２９を例として、要素「文字／記号」とこれに接する他の要素に対するカラーパレット２９ｃの表示状態の一具体例を示す図であって、これら「要素」間で輝度コントラスト比が４．５：１未満の色に対して、「×」マーク３１ａが示され、この色を選択できないようにしている。
【００８６】
図９に示す色カスタマイズ操作画面１７ａでは、選択された「期限変更」ボタン５2（図６）でのボタンの文字５ａ（図４）のカラーセレクタ１９ａにおいて、その「単色」タブ２９のカラーパレット２９ａで「×」マーク３１ａが付された色が示されているが、これは、この「期限変更」ボタン５2において、文字５ａとこれが重なって表示される文字の背景５ｂとにおいて、この文字の背景５ｂの色に対し、輝度コントラスト比が４．５：１未満となる文字５ａの色に対して「×」マーク３１ａが付されているものである。従って、図９に示す色カスタマイズ操作画面１７ａでは、カラーパレット２９ａで「×」マーク３１ａが付された色は、選択できないものである。このカラーパレット２９ａで「×」マーク３１ａが付されていない色を選択することにより、文字５ａが、これが重なって表示される文字の背景５ｂの色に対して、このコンテンツ画面２（図４）でユーザが明確に視認できるように色付けされていることになる。
【００８７】
図１１（ｂ）は、「単色」タブ２９を例として、要素「文字／記号」以外の２つの要素に対するカラーパレット２９ｃの表示状態の一具体例を示す図であって、これら「要素」間で輝度コントラスト比が１．７：１未満の色に対して、「／」マーク３１ｂが示され、この色は選択することができるが、それが選択されると、これら「要素」間で輝度コントラスト比が１．７：１未満の色となるので、推奨しないようにしている。
【００８８】
図９に示す色カスタマイズ操作画面１７ａでは、選択された「期限変更」ボタン５2（図６）でのボタンの枠線５ｃ（図４）のカラーセレクタ１９ｃにおいて、その「単色」タブ２９のカラーパレット２９ａで「／」マーク３１ｂが付された色が示されているが、これは、この「期限変更」ボタン５2において、枠線５ｃとこれに接して表示される文字の背景５ｂとにおいて、この文字の背景５ｂの色に対し、輝度コントラスト比が１．７：１未満となる枠線５ｃの色に対して「／」マーク３１ｂが付されているものである。従って、図９に示す色カスタマイズ操作画面１７ａでは、ボタン枠線色のカラーセレクタ１９ｃのカラーパレット２９ａで「／」マーク３１ｂが付された色は、選択が推奨されないものである。このカラーパレット２９ａで「／」マーク３１ｂが付されていない色を選択することにより、ボタンの枠線５ｃが、これに接して表示される文字の背景５ｂの色に対して、このコンテンツ画面２（図４）でユーザが明確に視認できるように色付けされていることになる。
【００８９】
ここで、図９に示す色カスタマイズ操作画面１７ａでは、各カラーセレクタ１９／２０毎に「クリア」ボタン２３が設けられているが、「クリア」ボタン２３が押下されると、「クリア」ボタン２３が押下されたカラーセレクタ１９／２０において、色の選択、あるいはグラテーションの選択が解除される。即ち、どの色も、また、どのようなグラテーションも選択されていない状態となる。例えば、図１１（ａ）において、「クリア」ボタン２３が押下されると、カラーセレクタ１９ａでのこのとき選択されている色は解除され、このため、このとき表示されている「期間変更」ボタン５2のボタンの文字５ａの色は消えるとともに、「色表示」欄２１で表示されている色も消える。また、図１１（ｂ）において、「クリア」ボタン２３が押下されると、カラーセレクタ１９ｂでのこのとき設定されているグラデーションは解除され、このため、このとき表示されている「期間変更」ボタン５2のボタンの背景５ｂでのグラデーションが消えるとともに、「色表示」欄２１で表示されているグラデーションも消える。
【００９０】
また、これとともに、上記の選択している色やグラテーションが消えることから、図１１に示す「×」マーク３１ａや「／」マーク３１ｂが設定されている色が変わってくる。例えば、図９において、「期間変更」ボタン５2のボタンの背景５ｂに対するカラーセレクタ１９ｂで「クリア」ボタン２３が押下され、そのグラデーションが解除されると、「期間変更」ボタン５2のボタンの文字５ａに対するカラーセレクタ１９ａにおいて、これまでのカラーセレクタ１９ｂで設定されているグラテーションによって選択することができず、「×」マーク３１ａが設定されていた色が選択可能となる場合もあり、このような色に対しては、この「×」マーク３１ａが除かれることになる。なお、図９において、カラーセレクタ１９ａで「クリア」ボタン２３が押下され、「期間変更」ボタン５2のボタンの文字５ａでそのとき選択されている色が解除されるが、このとき、これに対するカラーセレクタ１９ａでは、「期間変更」ボタン５2のボタンの背景５ｂに対するカラーセレクタ１９ｂでグラテーションの設定をしたときに、このグラテーションに対して選択できなくなった色に対して「×」マーク３１ａが設定されたものであるときには、カラーセレクタ１９ａで「クリア」ボタン２３が押下されても、「×」マーク３１ａが削除される色もあるが、「×」マーク３１ａが設定されているままの色もある。カラーセレクタ１９ａでのかかる色は、カラーセレクタ１９ｂでいずれの色が選択されても、選択することができない色である。
【００９１】
なお、カラーセレクタ１９ａでの色選択によってカラーセレクタ１９ｂで色に「×」マーク３１ａが設定されている場合も同様であり、カラーセレクタ１９ｂで「クリア」ボタン２３が押下されても、「×」マーク３１ａが設定されている色が残る場合もある。また、「／」マーク３１ｂが設定されている色についても同様である。
【００９２】
なお、図９に示す色カスタマイズ操作画面１７ａにおいて、レイアウト６のカラーセレクタ表示エリア２０では、このレイアウト６の背景６ａ，６ｂ（図４）のカラーセレクタ２０ｂのみが展開され、その「単色」タブ２９のカラーパレット２９ｃ（図１１）で「×」マーク３１ａが設定されていることが示されているが、これは、展開されていないが、このレイアウト６の文字６ａ，６ｂのカラーセレクタ２０ａでのカラーパレットでの色に対して、輝度コントラスト比が４．５：１未満となる色に対して「×」マーク３１ａが設定されていることになる。
【００９３】
また、「期限変更」ボタン５2の枠線５ｃは、レイアウト６の背景と接することになる。このため、これら間の色では、やはり輝度コントラスト比が１．７：１以上であるように、設定される。この場合、「期限変更」ボタン５2が上記のように指定されたものであるから、この枠線５ｃに対して、レイアウト６の方で選択可能な色が制限されることになる。即ち、「期限変更」ボタン５2の枠線５ｃのカラーパレット２９ｃで「／」マーク３１ａが設定されていない色に対して、レイアウト６の背景のカラーセレクタ２０ｂでのカラーパレット２９ｃで輝度コントラスト比が１．７：１未満となる色にも、「／」マーク３１ａが設定されることになる。
【００９４】
以上のように、図８に示す色カスタマイズ操作画面１７で色のカスタマイズを必要とする「要素」のカラーセレクタが指定されると、指定された「要素」のカラーセレクタが展開した図９に示す色カスタマイズ操作画面１７ａが表示されることになる（図３のステップＳ１０８）。
【００９５】
この場合、上記のように、指定された「部品」とこれに接する（つまり、この「部品」が重なったり、この「部品」に重なったりすることによって接している）他の１以上の部品毎に、その「要素」のカラーセレクタが展開していて、そのカラーセレクタでのカラーパレットで色を選択したり、グラデーションを選択したりすることにより、該当する「要素」をその選択した色で、あるいは選択したグラデーションで表現させることができる。また、夫々のカラーパレットには、該当する「要素」をこれに接した「要素」に対して必要な輝度コントラスト比を持たせて視認し易くするために、この必要な輝度コントラスト比未満の視認し易くない色に対し、その旨を表示する「×」マーク３１ａや「／」マーク３１ｂを付加し、選択できない、あるいは選択させないようにしている。
【００９６】
コンテンツ画面２（図４）が表示されたときに、上記のようにして、「部品」を指定してこの「部品」に対し、あるいはこの「部品」に接する「部品」に対し、そのいずれかの「要素」のカラーセレクタで色カスタマイズを行なうと、夫々の「要素」のカラーセレクタのカラーパレットの状態（「×」マーク３１ａや「／」マーク３１ｂが付加された状態）がそのまま保持され、次に同じコンテンツ画面２が表示されたときも、各「要素」のカラーセレクタのカラーパレットの状態はそのまま保持される。このとき、いずれのカラーセレクタの「クリア」ボタン２３も押下操作されなければ、この各「要素」のカラーセレクタのカラーパレットの状態は、変化しない。
【００９７】
けれども、いずれかの「要素」のカラーセレクタの「クリア」ボタン２３が押下操作されると、これに応じて、他の「要素」のカラーセレクタのカラーパレットでは、上記のように、適用される輝度コントラスト比に応じて、「×」マーク３１ａが設定されて選択禁止される色や使用を「／」マーク３１ｂが設定されて選択を勧めない色が変わることもあることになる。
【００９８】
図９に示す色カスタマイズ操作画面１７ａが表示される状態で（図３のステップＳ１０８）、色カスタマイズしたい「要素」があるが（図３のステップＳ１０９の“Ｙｅｓ”）、この「要素」のカスタマイズしたい色がこの「要素」のカラーセレクタのカラーパレットで選択可能な状態（「×」マーク３１ａや「／」マーク３１ｂが付加されていない状態）にあるときには（図３のステップＳ１１０の“Ｙｅｓ”）、このカラーパレットで、上記のように、希望する色を選択操作することにより、この「要素」がこの色で表示されるようになる（図３のステップＳ１１１）。
【００９９】
これに対し、このカラーパレットで希望する色が選択不可能な状態（「×」マーク３１ａが付加されている状態）や選択を勧めない状態（「／」マーク３１ｂが付加されている状態）にあるときには（図３のステップＳ１１０の“Ｎｏ”）、まず、このカラーパレットを有するカラーセレクタに該当する「要素」に接する他の「要素」のカラーセレクタで「クリア」ボタンを押圧して、その「要素」の色を設定解除し（図３のステップＳ１１２）、かかる状態でこのパレットで希望する色が選択可能になったか否かを判定し（図３のステップＳ１１０）、それでも、この希望する色が選択不能である場合には（図３のステップＳ１１０の“Ｎｏ”）、さらに、この他の「要素」に接するさらに他の「要素」のカラーセれクタで「クリア」ボタン２３を押下する（図３のステップＳ１１２）。かかる処理が順次行なわれて上記の希望する色に対して「×」マーク３１ａが解除され、選択可能となると（図３のステップＳ１１０の“Ｙｅｓ”）、この希望する色を選択することができるようになる（図３のステップＳ１１１）。従って、これにより、この「要素」の色をこの希望する色にカスタマイズできる（図３のステップＳ１１１）。
【０１００】
ここで、いま、図９に示す色カスタマイズ操作画面１７ａで、物品「期限変更」ボタン５2（図４）の「要素」である「文字」５ａ（図４）の色をカスタマイズしたいが、この「文字」５ａに対するカラーセレクタ１９ａのカラーパレット２９ｃ（図１０（ａ））で、このカスタマイズしようとする色にカスタマイズを不可とする「×」マーク３１ａが付加されているとすると、「期限変更」ボタン５2の「文字」５ａに接するこの「期限変更」ボタン５2の「背景」５ｂのカラーセレクタ１９ｂの「クリア」ボタン２３を押下操作することにより、このカラーセレクタ１９ｂで設定されているグラデーションが解除されることになり、これにより、「期限変更」ボタン５2の「文字」５ａに対するカラーセレクタ１９ａでカスタマイズしたい色が、その「×」マーク３１ａが解除されて、選択可能となったとすると、この色を選択することができることになる。
【０１０１】
そこで、カーソル１１の操作により、このカラーパレット２９ｃから希望する色を選択することにより、コンテンツ画面２（図６）で選択された「期限変更」ボタン５2の文字５ａがこの色で表示されることになるが、このことが、プレビューエリア２４での押下部品エリア１６で表わされ、この部品エリア１６での該当する「要素」である「期限変更」ボタン５2の文字５ａがこの選択された色で表現される。
【０１０２】
ところで、このとき、例えば、「期限変更」ボタン５2の「要素」である「背景」５ｂのこれまでの色がそのカラーセレクタ１９ｂでのカラーパレット２９ｃで「×」マーク３１ａが付加されている状態となることもある。しかし、かかる状態はそのまま維持されることになり、カラーパレットでこの色に「×」マーク３１ａが付加されていることから、現在設定されている色は、「期限変更」ボタン５2の「文字」５ａに対して、相対コントラスト比を満たしていない色であることが示されることになる。
【０１０３】
なお、ある要素、例えば、「期限変更」ボタン５2の「背景」５ｂに対し、上記のように、「クリア」ボタン２３を押下した後、所望とする色を選択した結果、「期限変更」ボタン５2の「文字」５ａで現在設定されている色が、これに対して「×」マーク３１ａが付加されて選択不能な色となった場合には、上記のように処理がなされない場合には、そのままかかる状態が維持されることになる。この場合も、カラーセレクタ１９ａのカラーパレットでこの色に「×」マーク３１ａが付加されることになるので、この色が選択不能な色であることを確認できる。 なお、図９に示す色カスタマイズ操作画面１７ａで、「全クリア」ボタン２８が指定操作されると、この色カスタマイズ操作画面１７ａで表示されている全てのカラーセレクタ１９／２０（即ち、ここでは、カラーセレクタ１９ａ〜１９ｃ，２０ａ〜２０ｃの全て）で、設定されている色が解除され、これらに対する「期限変更」ボタン５2やレイアウト６の色が消去されるとともに（従って、「色表示」欄２１（図１０）で色も表示されなくなる）、それらのカラーパレットでの「×」マーク３１ａや「／」マーク３１ｂが付加されない状態となる。
【０１０４】
かかる状態で、例えば、カラーセレクタ１９ａのカラーパレット２９ｃで「ボタンの文字」の文字色を選択すると、「期限変更」ボタン５2の「文字」５ａの色が設定され、これとともに、他のカラーセレクタ１９ｂ，１９ｃ，２０ａ〜２０ｃでのカラーパレット２９ｃ，３０ｃで、上記のようにして、選択できない色に「×」マーク３１ａが、選択を勧めない色に「／」マーク３１ｂが夫々付加されることになる。これにより、夫々のカラーパレット２９ｃ，３０ｃでは、上記の色を指定することが可能となる（図３のステップＳ１１０の“Ｙｅｓ”）。
【０１０５】
ここで、部品「期間変更」ボタンの１つの要素である「ボタンの文字」５ａの色が設定されると、色カスタマイズ操作画面１７ａに表示されている全てのカラーセレクタのカラーパレットにおいて、選択できない色に「×」マーク３１ａが、選択を進めない色に「／」マーク３１ｂが夫々付加される即ち、「ボタンの文字」５ｂの色が設定されると、これに接する「ボタンの背景」５ｂについて選択できない色が計算可能となるため、対象となる色に「×」マーク３１ａが付加される。「ボタンの文字」５ｂについて選択可能な色が決まると、これに接する「ボタンの枠線」５ｃについて選択を勧めない色が計算可能となるため、対象となる色に「／」マーク３１ｂが付加される。このように、接する「要素」順に順次計算を行なうことにより、１つの色が設定されると、全てのカラーパレットにおいて、「×」マーク３１ａ及び「／」マーク３１ｂを夫々付加することが可能となる。ここで、例えば、「ボタンの背景」５ｂについて選択可能な色の中からどの色を選択するかによって、「ボタンの枠線」５ｃにおける選択を勧めない色が変わる場合がある。この実施形態では、「ボタンの背景」５ｂでどの色を選択した場合にも、「ボタンの枠線」５ｃの色として、「選択を勧めない色」に該当するものにのみ選択を勧めない「／」マーク３１ｂを付加するものとする。
【０１０６】
図１２は「単色」タブ２９を用いて「期限変更」ボタン５2の「文字」５ａの色を設定する操作を示しているが、図１３は、「単色」タブ２９が選択されたカラーセレクタ１９ｃで、「期限変更」ボタン５2の「枠線」５ｃの色を設定する操作を示すものであり、図１４は、「単色」タブ２９が選択されたカラーセレクタ２０ｂで、レイアウト６の「背景」６ａの色を設定する操作を示すものである。いずれも、上記の「期限変更」ボタン５2の「文字」５ａの色設定操作と同様、「単色」タブ２９のカラーパレット２９ｃで色選択操作をすることにより、それら「要素」の色を決めることができる。そして、このように色カスタマイズされた「要素」には、プレビューエリア２４の押下部品エリア１６において、該当する色で色付けされる。
【０１０７】
なお、図１３，図１４では、図１２に対応する部分には同一符号を付けて重複する説明を省略するが、いずれの図面においても、説明の対象となる部分にのみ符号を付している。
【０１０８】
図１５は色カスタマイズ操作画面１７ａでのグラデーション設定部の調整操作例を示す図であって、前出図面に対応する部分には同一符号を付けて重複する説明を省略する。なお、図１５では、説明に必要な部分にのみ符号を付けている。
【０１０９】
同図において、「グラデーション」タブ３０でのグラデーション設定部３０ｆにおける色相／濃度指示マーク３０ｆ4を取り除くことができる。このためには、この色相／濃度指示マーク３０ｆ4をカーソル１１で指示し、カラーセレクタのエリア外にドラッグアンドドロップをすればよく、これにより、この色相／濃度指示マーク３０ｆ4がグラデーション設定部３０ｆ外の位置に置かれることになる。この状態では、この色相／濃度指示マーク３０ｆ4はグラデーション設定部３０ｆに対して機能することができず、このときのグラデーション設定部３０ｆに対しては機能しない。従って、グラデーションバー３０ｆ1では、その端部マーク３０ｆ2側の色から端部マーク３０ｆ3側の色へのグラデーションが表示されることになる。
【０１１０】
除かれたこの色相／濃度指示マーク３０ｆ4を追加して再度使用する場合には、グラテーション設定部３０ｆのグラデーションバー３０ｆ1の近くでダブルクリックすることにより、このグラデーションバー３０ｆ1の下側で、かつクリックした地点に一番近い位置に新たに色相／濃度指示マーク３０ｆ4が追加されることになる。
【０１１１】
図１６は図１５に示す色カスタマイズ操作画面１７ａでのグラテーション操作の一具体例を示す図であって、同図（ａ）はグラデーションバー３０ｆ1の一方の端部側の色の設定操作を示し、同図（ｂ）はグラデーションバー３０ｆ1の他方の端部側の色の設定操作を示すものであり、前出図面に対応する部分には同一符号を付けて重複する説明を省略する。なお、図１５では、説明に必要な部分にのみ符号を付けている。
【０１１２】
図１６（ａ）において、「グラデーション」タブ３０でのグラデーション設定部３０ｆにおけるグラデーションバー３０ｆ1の一方の端部側の端部マーク３０ｆ3をカーソル１１でクリック操作し、次いで、カラーパレット３０ｃで所望の色を指定すると、このグラデーションバー３０ｆ1の端部マーク３０ｆ3側の端部の色が設定される。
【０１１３】
次に、図１６（ｂ）において、このグラデーション設定部３０ｆにおけるグラデーションバー３０ｆ1の他方の端部側の端部マーク３０ｆ2をカーソル１１でクリック操作し、次いで、カラーパレット３０ｃで所望の色を指定すると、このグラデーションバー３０ｆ1の端部マーク３０ｆ2側の端部の色が設定される。
【０１１４】
これにより、グラデーションバー３０ｆ1でその一方の端部で設定された色から他方の端部で設定された色までのグラデーションが設定されたことになる。これとともに、このカラーセレクタ１９ｂでの「選択色表示」欄２１の設定色表示部２１ａに、この設定されたグラデーションが表示される。
【０１１５】
なお、「単色」タブ２９や「グラテーション」タブ３０での以上の色やグラデーションの設定は、図３でのステップＳ１１１で行なわれる。
【０１１６】
ところで、図９に示す色カスタマイズ操作画面１７ａにおいて、上記のように、プレビューエリア２４に、カラーセレクタ表示画面１８の操作で色カスタマイズされる「部品」を表わす押下部品エリア１６が表示され、この押下部品エリア１６に表示される「部品」が色カスタマイズの対象部品となる。
【０１１７】
かかる図９に示す色カスタマイズ操作画面１７ａにおいて、カーソル１１をプレビューエリア２４内の押下部品エリア１６内に移動させ、図１７に示すように（なお、図１７において、図９に対応する部分には同一符号を付けて重複する説明を省略する。但し、図１７では、必要な部分にのみ符号を付けている）、図示しないマウスを用いることによってドラッグしてこのカーソル１１を所定の方向に移動させると、レビューエリア２４内に表示されるコンテンツ画面２（図４）がその方向に移動する。このときには、押下部品エリア１６は位置が固定されている。このため、コンテンツ画面２でのこの押下部品エリア１６内に表示されているエリア（コンテンツ画面２での押下部品エリア１６内でプレビューされる部分）が変化する。これにより、コンテンツ画面２での押下部品エリア１６でプレビューされるエリアを変更させることができ、色カスタマイズの対象となる「部品」以外のエリアの表示内容を閲覧することができる。
【０１１８】
なお、プレビューエリア２４の任意の位置をキーボードでフォーカスし、キーボードの十字キーを操作することにより、コンテンツ画面２を移動させることもでき、これにより、コンテンツ画面２での押下部品エリア１６内に位置するエリアを変更させることもできる。これによっても、上記と同様、コンテンツ画面２での押下部品エリア１６でプレビューされるエリアを変更させることができる。
【０１１９】
また、上記のように、コンテンツ画面２でのプレビューされるエリアを変化させるカーソル１１の機能は、このカーソル１１がプレビューエリア２４にあるときに実行されるものであり、カーソル１１がプレビューエリア２４外に移動すると、もはやドラッグ操作によっては、プレビューエリア２４でのコンタンツ画面２は移動しない。従って、このコンテンツ画面２を大きく移動させてこのコンテンツ画面２で大きく離れた他の「部品」をプレビューの対象とするためには、カーソル１１をプレビューエリア２４内で大きく移動させた後、カーソル１１を押下部品エリア１６内の元の位置に戻し、再度ドラッグして同じ方向にカーソル１１を移動させる操作を繰り返せばよい。
【０１２０】
図９に示す色カスタマイズ操作画面１７ａでの色カスタマイズを必要とする全ての「要素」の色カスタマイズ操作が終了して、色カスタマイズ操作が必要な「要素」がなくなり、プレビューエリア２４での押下部品エリア１６で押下した部品である「期限変更」ボタン５2で色カスタマイズの結果が確認されて（図３のステップＳ１０９の“Ｎｏ”）、図１８に示すように、色カスタマイズ操作画面１７ａで「ＯＫ」ボタン２６が押下されると（図３のステップＳ１１３）、元のコンテンツ画面２に重なって色カスタマイズの対象となる「部品」を選択するための選択画面が表示される。
【０１２１】
図１９はかかる選択画面の一具体例を示す図であって、３２は選択画面、３３はテキスト、３４は「はい」ボタン、３５は「いいえ」ボタンである。
【０１２２】
同図において、コンテンツ画面２は透けて見える状態で表示されており、この透けて見えるコンテンツ画面２上に重ねて選択画面３２が表示される。
【０１２３】
この選択画面３２では、例えば、「同じレイアウト部品に乗っている同じ種類の部品は全て同じ色にしますか？」ということを指示したテキスト３３が表示され、この指示に従う場合に操作する「はい」ボタン３４と、指示に従わないときに操作する「いいえ」ボタン３５が設けられている。
【０１２４】
「はい」ボタン３４が押下操作されたときには（図３のステップＳ１１４の“Ｙｅｓ”）、図６に示すコンテンツ画面２でカーソル１１によって選択された「部品」（この場合では、「期間変更」ボタン５2）やそれに接する部品（ここでは、レイアウト６）とともに、このレイアウト６に接している他の「部品」（即ち、レイアウト６）に重なっているこの選択された「部品」と同じ種類の「部品」（この場合では、「重要度変更」ボタン５1や「担当者変更」ボタン５3，「ステータス変更」ボタン５4など）の各「要素」も、指定された「部品」の「要素」と同じ色に色カスタマイズされる（図３のステップＳ１１５）。しかる後、色カスタマイズ処理が終了する。
【０１２５】
また、「いいえ」ボタン３５が押下操作されたときには（図３のステップＳ１１４の“Ｎｏ”）、図６に示すコンテンツ画面２でカーソル１１によって選択された「部品」（即ち、「期間変更」ボタン５2）とこれに接する部品（ここでは、レイアウト６）とが色カスタマイズされる（図３のステップＳ１１６）。しかる後、色カスタマイズ処理が終了する。
【０１２６】
なお、図１９に示す選択画面３２に表示されるテキスト３３としては、上記のものに限定されるものではなく、例えば、「同種類の部品は全て同じ色に変えますか？」といったテキスト３３を表示し、「はい」ボタン３４が押下操作されたときには（図３のステップＳ１１４の“Ｙｅｓ”）、図６に示すコンテンツ画面２でカーソル１１によって選択された「部品」（即ち、「期間変更」ボタン５2）及びこれと同じ種類の部品（即ち、操作ボタンの全て）を同じ色に色カスタマイズしたり、「同種類のレイアウト部品で、かつ色が同じものに置かれている同種類の部品は全て同じ色に変更しますか？」といったテキスト３３を表示し、「はい」ボタン３４が押下操作されたときには（図３のステップＳ１１４の“Ｙｅｓ”）、これを満足する部品を設定された同じ色に色カスタマイズしたりすることができ、色カスタマイズする部品を適宜決めるようにすることができる。
【０１２７】
以上のようにして、図６に示すように、色カスタマイズモードに設定して色カスタマイズを希望する「部品」を選択することにより、いずれの「部品」も、希望する色にカスタマイズすることができる。但し、レイアウト６など多くの「部品」と重なったり、接したりして複数の部品に関連する場合には、これら関連する「部品」に応じて、カスタマイズする色が制限される「部品」もある。
【０１２８】
即ち、図１９に示す選択画面３２で「いいえ」ボタン３５が押下されると、上記の指定した操作ボタン５、上記の例では、「期間変更」ボタン５2とこれが重なっているレイアウト６とが夫々指定された色にカスタマイズされるが、さらに、他の操作ボタン５、例えば、「担当者変更」ボタン５3を色カスタマイズする場合には、同様にして、この「担当者変更」ボタン５3に対して、図８に示す色カスタマイズ操作画面１７が表示されるが、この「担当者変更」ボタン５3に該当するカラーセレクタ１９ａ〜１９ｃのみを選択することにより、既に色カスタマイズされたレイアウト６の色を誤って変化させるようなことなく、「担当者変更」ボタン５3のみを色カスタマイズすることができる。但し、この場合には、この「担当者変更」ボタン５3に対してカラーセレクタ１９ａ〜１９ｃが展開された図９に示すような色カスタマイズ操作画面１７ａでは（この場合、レイアウト６のカラーセレクタ２０ａ〜２０ｃは展開されていない）、色カスタマイズされたレイアウト６に影響されて、カラーセレクタ１９ａ〜１９ｃのカラーパレットにおいて、「／」マーク３１ｂや「×」マーク３１ａが付加された色があり、使用する色に制限が加わることになる。
【０１２９】
ところで、以上では、図４に示すコンテンツ画面２で「色カスタマイズモード設定」ボタン３が押下操作されて色カスタマイズモードが設定されたとき、このコンテンツ画面２で１つの「部品」（ここでは、「期限変更」ボタン５２）が色カスタマイズする対象として選択されたものであるが、この実施形態では、複数の部品を色カスタマイズの対象として選択するようにすることもできる。以下、これについて説明する。
【０１３０】
先に説明したように、図４に示すコンテンツ画面２で「色カスタマイズモード設定」ボタン３が押下操作され、色カスタマイズモードが指定されると（図３のステップＳ１０１）、図５に示す選択画面１２が透けて見えた状態のコンテンツ画面２上に表示され、この選択画面１２で「ＯＫ」ボタン１４が押下操作されると、図６に示すコンテンツ画面２が表示される。このコンテンツ画面２でのカーソル操作により、同時に色カスタマイズ対象とする複数の部品を指定操作することが可能となる。
【０１３１】
図２０はコンテンツ画面２でのかかる複数の部品を同時に色カスタマイズ対象とするための操作を示す図であって、３６はカーソル、３７はドラッグエリアであり、前出図面に対応する部分には同一符号を付けて重複する説明を省略する。但し、図２０では、説明に必要な部分についてのみ部号を付している。
【０１３２】
図５に示す選択画面１２で「ＯＫ」ボタン１４が押下操作されることによって表示される図６に示すコンテンツ画面２で、カーソル１１を色カスタマイズしたい「部品」の近傍位置に移動させ、その位置でクリック操作すると、図２０に示すように、この手形のカーソル１１が矢印状のカーソル３６に代わり、その位置からこのカーソル３６をドラッグすると、その位置を起点として、この起点とカーソル３６の現位置とを対向する２つの角部とする矩形状のドラッグエリア３７が形成される。
【０１３３】
このドラッグエリア３７がこのコンテンツ画面２での色カスタマイズの対象としたい複数の「部品」を含むように、カーソル３７をドラッグ操作する（図３のステップＳ１０２，Ｓ１１７）。そして、ドラッグ操作を終了し、このドラッグエリア３７が決まると、色カスタマイズ操作画面が表示されるとともに、このドラックエリア３７に含まれる「部品」毎に、当該「部品」の上に他の「部品」が重ねられているか否かを判定する（図３のステップＳ１１８）。当該「部品」の上に他の「部品」が重なっている場合には（図３のステップＳ１１８の“Ｙｅｓ”）、当該「部品」の各「要素」のカラーセレクタと当該「部品」上に重なっている他の「部品」の各「要素」のカラーセレクタとをこの色カスタマイズ操作画面に表示し（図３のステップＳ１１９）、当該「部品」の上に他の「部品」が重なっていない場合には（図３のステップＳ１１８の“Ｎｏ”）、当該「部品」の各「要素」のカラーセレクタと当該「部品」の下に置かれている他の「部品」の各「要素」のカラーセレクタとをこの色カスタマイズ操作画面に表示する（図３のステップＳ１２０）。かかる処理がドラッグエリア３７内の「部品」毎に順次行なわれ（図３のステップＳ１２１の“Ｎｏ”）、かかる処理がドラッグエリア３７内の全ての「部品」について行なわれると（図３のステップＳ１２１の“Ｙｅｓ”）、図２１に示すように、ドラッグエリア３７内の全ての「部品」について、その「要素」のカラーセレクタが設けられた色カスタマイズ操作画面３８が表示される。
【０１３４】
なお、図２１において、１９1〜１９3はカラーセレクタ表示エリアであり、前出図面に対応する部分には同一符号を付けて重複する説明を省略する。但し、図２１においては、説明に必要な部分にのみ符号を付け、他の部分の符号は省略している。
【０１３５】
ここでは、図２０に示すコンテンツ画面２において、ドラッグエリア３７に含まれる「部品」としては、「重要度変更」ボタン５1と「期限変更」ボタン５2と「担当者変更」ボタン５3と、これらが重なって表示されるレイアウト６としており、これに対し、図２１に示す色カスタマイズ操作画面３８では、これら「部品」毎にカラーセレクタ表示エリア１９／２０が設けられている。
【０１３６】
カラーセレクタ表示エリア１９1には、図２０での部品「重要度変更」ボタン５1の要素「文字」の文字色に対するカラーセレクタ１９ａと、同じく要素「背景」の背景色に対するカラーセレクタ１９ｂと、同じく要素「枠線」の枠線色に対するカラーセレクタ１９ｃとが設けられ、カラーセレクタ表示エリア１９2には、図２０での部品「期限変更」ボタン５2の要素「文字」の文字色に対するカラーセレクタ１９ａと、同じく要素「背景」の背景色に対するカラーセレクタ１９ｂと、同じく要素「枠線」の枠線色に対するカラーセレクタ１９ｃとが設けられ、カラーセレクタ表示エリア１９3には、図２０での部品「担当者変更」ボタン５3の要素「文字」の文字色に対するカラーセレクタ１９ａと、同じく要素「背景」の背景色に対するカラーセレクタ１９ｂと、同じく要素「枠線」の枠線色に対するカラーセレクタ１９ｃとが設けられている。
【０１３７】
これらカラーセレクタ１９ａ〜１９ｃは、図８におけるカラーセレクタ１９ａ〜１９ｃと同じ機能を備えている。また、各セレクタ表示エリア１９では、「部品」が有していない「要素」のカラーセレクタは表示されない。例えば、部品「担当者変更」ボタン５3（図２０）には、枠線がない場合には、カラーセレクタ表示エリア１９3では、枠線色に対するカラーセレクタ１９ｃが設けられない。
【０１３８】
また、カラーセレクタ表示エリア２０には、図２０での「部品」であるレイアウト６の要素「文字」の文字色に対するカラーセレクタ２０ａと、同じく要素「背景」の背景色に対するカラーセレクタ２０ｂと、同じく要素「枠線」の枠線色に対するカラーセレクタ２０ｃとが設けられており、このカラーセレクタ２０ａ〜２０ｃは図８におけるカラーセレクタ２０ａ〜２０ｃと同じ機能を有している。このカラーセレクタ表示エリア２０でも、レイアウト６が有していない「要素」のカラーセレクタは表示されない。例えば、レイアウト３（図２０）には、文字がない場合には、カラーセレクタ表示エリア２０では、文字色に対するカラーセレクタ２０ａが設けられない。
【０１３９】
なお、図２０におけるレイアウト６は、操作ボタン５1〜５3に共通のものであるから、即ち、これら操作ボタン５1〜５3は同じレイアウト６に重ねて表示されているものであるから、図２１に示す色カスタマイズ操作画面３８では、このレイアウト６のカラーセレクタ表示エリア２０は１つであって、これら操作ボタン５1〜５3のカラーセレクタ１９ａ〜１９ｃの後に配置されて設けられている。
【０１４０】
これに対し、操作ボタン５1〜５3に対するレイアウトが異なる場合には、それらのレイアウトのカラーセレクタ表示エリア２０はこれに関係する「部品」（ここでは、操作ボタン）のすぐ後に配置される。例えば、「重要度変更」ボタン５1と「期限変更」ボタン５2とが同じレイアウト６1に重なって表示され、「担当者変更」ボタン５3が別のレイアウト６2に重なって表示されているものとすると、図２１に示す色カスタマイズ操作画面３８では、「重要度変更」ボタン５1と「期限変更」ボタン５2とのカラーセレクタ表示エリア１９1，１９2の次にレイアウト６1のカラーセレクタ表示エリア２０1が配置され、「担当者変更」ボタン５3のカラーセレクタ表示エリア１９3の次にレイアウト６2のカラーセレクタ表示エリア２０2が配置される。
【０１４１】
このように、複数の「部品」とこれが重なって表示されている他の部品とのカラーセレクタ表示エリア／１９，２０との配置関係が設定されていることにより、これら「部品」とこれが重なって表示される他の「部品」とのコンテンツ画面２での関係を色カスタマイズ操作画面３８でも確認することができ、それら「部品」のカスタマイズする色の選択が容易となる。
【０１４２】
図２１に示す色カスタマイズ操作画面３８では、カラーセレクタ表示エリア１９1〜１９3で「要素」のカラーセレクタ１９ａ〜１９ｃのいずれかやカラーセレクタ表示エリア２０で「要素」のカラーセレクタ２０ａ〜２０ｃのいずれかを選択することにより、図８に示す色カスタマイズ操作画面１７と同様、図３のステップＳ１０７〜Ｓ１１６の処理が行なわれ、各「部品」での選択した「要素」の色カスタマイズが行なわれることになる。
【０１４３】
以上のように、複数の「部品」を同時に色カスタマイズの対象として指定することができ、同じ色カスタマイズ操作画面で夫々の「部品」の「要素」を所望とする色に、ユーザが視認し易い状態で、カスタマイズすることが可能となる。
【符号の説明】
【０１４４】
１ 表示画面
２ コンテンツ画面
３ 「色カスタマイズモード設定」ボタン
４ コンテンツデータ表示エリア
５ 操作ボタン
５1 「重要度変更」ボタン
５2 「期限変更」ボタン
５3 「担当者変更」ボタン
５4 「ステータス変更」ボタン
５5 プルダウンメニュー
５ａ ボタンの文字
５ｂ ボタンの背景
５ｃ ボタンの枠線
６ レイアウト（背景）
６ａ，６ｂ 文字
７ タブパネル
７ａ タブパネルの文字
７ｂ タブパネルの背景
８ テキスト
９ チェックボックス
１０ テキスボックス
１１ カーソル
１２ 選択画面
１３ テキスト
１４ 「ＯＫ」ボタン
１５ 「キャンセル」ボタン
１６ 押下部品エリア
１７，１７ａ 色カスタマイズ操作画面
１８ カラーセレクタ表示画面
１９，１９1〜１９3 「ボタン」のカラーセレクタ表示エリア
１９ａ〜１９ｃ カラーセレクタ
２０ 「レイアウト」のカラーセレクタ表示エリア
２０ａ〜２０ｃ カラーセレクタ
２１ 「選択色表示」欄
２１ａ 設定色表示部
２１ｂ 設定グラデーション表示部
２２ 「選択色の候補表示」ボタン
２３ 「クリア」ボタン
２４ プレビューエリア
２５ スクロール操作部
２６ 「ＯＫ」ボタン
２７ 「キャンセル」ボタン
２８ 「全クリア」ボタン
２９ 「単色」タブ
２９ａ 不透明度指定部
２９ｂ 色相表示欄
２９ｃ カラーパレット
２９ｄ1 色相指定部
２９ｄ2 濃度指定部
２９ｅ1，２９ｅ2 スライダ
３０ 「グラデーション」タブ
３０ａ 不透明度表示欄
３０ｂ 色種別欄
３０ｃ カラーパレット
３０ｄ1 色相指定部
３０ｄ2 濃度指定部
３０ｅ1，３０ｅ2 スライダ
３０ｆ グラデーション設定部
３０ｆ1 グラデーションバー
３０ｆ2，３０ｆ3 端部マーク
３０ｆ4 色相／濃度指示マーク
３０ｇ グラデーション方向設定欄
３１ａ 「×」マーク
３１ｂ 「／」マーク
３２ 選択画面
３３ テキスト
３４ 「 い」ボタン
３５ 「いいえ」ボタン
３６ カーソル
３７ ドラッグエリア
３８ 色カスタマイズ操作画面
【技術分野】
【０００１】
本発明は、端末装置などの表示画面に表示されるコンテンツを構成する操作ボタンやテキスト，チェックボックスなどと、これらの背景エリアなどの物品の色をカスタマイズ（変更）可能としたコンテンツ画面の色カスタマイズ方法に関する。
【背景技術】
【０００２】
パソコンなどの表示画面で表示されるコンテンツには、操作ボタンやテキスト，チェックボックスなどが設けられ、これにより、画面操作ができるようにしており、また、その操作をし易くするために、それらを色付けして容易に判別することができるようにしている。
【０００３】
ところで、テキストなどを表示する場合、このテキストの背景の色などに応じて、このテキストが見にくくなる場合もあり、このため、背景の状況に応じてテキストの表示色を変更し、このテキストを見やすくするようにした技術が提案されている。
【０００４】
その一例として、デジタルカメラで撮影された画像にその撮影日時や撮影者名などのテキストを重畳して表示（焼き込み）する場合、この画像のテキストが重畳されるエリアを背景として、テキストが見易くなる色で背景を表示するようにした技術が提案されている（例えば、特許文献１参照）。
【０００５】
これは、予め背景に使用される色、即ち、背景色が複数文字色管理情報として設定されており、画像でのテキストの背景となるエリア（焼き込み位置）の色を背景色として取得し、この文字色管理情報の設定色を順次選択して取得した背景色とのコントラスト（輝度の差）を求め、このコントラストを予め設定されて基準値と比較し、このコントラントがこの基準値を越えたときには、このコントラストに該当する設定色を背景の色とし、コントラストがこの基準値を越える設定色がないときには、コントラストが最も大きい設定色を背景の色とするものである。
【０００６】
他の例としては、光ディスクから再生された映像に、背景に文字が表わされた字幕が重畳されている場合、この字幕での文字（テキスト）と背景との色の関係を、文字が見易くなるように、変更してから、かかる字幕が重畳された再生映像を表示するようにした技術が提案されている（例えば、特許文献２参照）。
【０００７】
この技術は、予め文字を見易くするための字幕での文字と背景との色の関係が複数（例えば、文字が黒色で背景が白色の組み合わせや文字が白色で背景が黒色の組み合わせ，文字が赤色で背景が黄色の組み合わせなど）設定された色コードテーブルが設けられており、文字が映像によって見にくくなる背景の透明度が所定の範囲内にあるばあいには、このときの文字の色に該当する色コードテーブルでの背景の色をこの字幕の背景の色とするものである。
【先行技術文献】
【特許文献】
【０００８】
【特許文献１】特開２００８−１８２５１３号公報
【特許文献２】特開２００９−２７６０５号公報
【発明の概要】
【発明が解決しようとする課題】
【０００９】
ところで、上記特許文献１，２に記載の技術は、背景に用いられる色は決められており、しかも、実際に背景に用いられる色は、テキスト（文字）の色との関連で決められるものである。これにより、背景に対して、テキストが視認し易くなる場合もあるが、ユーザによっては必ずしも、視認し易くなったとは言えない場合もあり、さらに、見易くなるような色付けもあり得るが、ユーザはそのような色付けを行なうことができない。
【００１０】
また、テキストばかりでなく、背景も見易くなるように、色付けをする必要がある場合もあるが、上記特許文献１，２に記載の技術では、上記の画像や映像に対してテキストの背景を見易くするようなことについては、配慮されていない。
【００１１】
さらに、表示されるコンテンツの画面では、操作ボタンやテキスト，チェックボックスなど（以下、これらをコンテンツの部品という）がこのコンテンツを構成するものであり、上記特許文献１，２に記載の技術での画像に付加されるテキストやその背景とは異なるものであり、かかる部品をユーザの視認し易い色で表示できるようにすることについては、配慮されているものではない。
【００１２】
本発明は、このようなことに鑑みてなされたものであって、その目的は、表示された画面を構成する各部をユーザが視認し易い色で表示できるようにしたコンテンツ画面の色カスタマイズ方法を提供することにある。
【課題を解決するための手段】
【００１３】
上記目的を達成するために、本発明は、コンテンツ画面で表示される部品の色の選択を支援するコンテンツ画面の色カスタマイズ方法であって、コンテンツ画面で色の選択の対象となる部品の指定とともに、色カスタマイズ操作画面が表示され、色カスタマイズ操作画面で、指定された部品を構成する要素毎に、色選択用のカラーパレットが表示されるとともに、指定された部品に接する他の部品を構成する要素毎に、色選択用のカラーパレットが表示され、カラーパレットで所望とする色を選択することにより、選択された部品と他の部品との要素夫々を選択された色で表示することを特徴とするものである。
【００１４】
また、本発明は、上記の部品が、その要素としての文字と背景とから構成され、さらに、必要に応じて、枠線をその要素として有することを特徴とするものである。
【００１５】
さらに、本発明は、上記の要素としての文字と背景に対するカラーパレットのいずれか一方では、文字と背景との輝度コントラスト比が第１の比率未満となる色を選択不能な色として、この色に選択することができないことを示す色であることを示すマークを付し、上記の要素としての文字以外の２つの要素夫々に対するカラーパレットのいずれか一方では、これら要素での輝度コントラスト比が第２の比率未満となる色を選択を勧めない色として、この色に選択を勧めない色であることを示すマークを付することを特徴とするものである。
【００１６】
さらに、本発明は、第１の比率が４．５：１であり、第２の比率が１．７：１であることを特徴とするものである。
【００１７】
さらに、本発明は、指定された部品が指定されたドラッグエリアに含まれる複数の部品であって、ドラッグエリア内の部品毎に、部品を構成する要素夫々の色選択用のカラーパレットが表示されることを特徴とするものである。
【００１８】
さらに、本発明は、上記の他の部品が、指定された部品が重なって表示される部品であることを特徴とするものである。
【００１９】
さらに、本発明は、上記のコンテンツ画面で指定された部品を含む選択部品エリアが、色カスタマイズ操作画面で設定されているプレビューエリアに表示されることを特徴とするものである。
【発明の効果】
【００２０】
本発明によると、コンテンツ画面での所望とする部品を色カスタマイズの対象として指定することができ、色カスタマイズ操作画面でのこの部品を構成する要素毎に、カラーセレクタの操作により、その「要素」を所望とする色に、ユーザが視認し易い状態で、カスタマイズすることが可能となる。
【図面の簡単な説明】
【００２１】
【図１】コンテンツの一具体例の一部を示す図である。
【図２】コンテンツでの部品の種類やその要素，部品が選択されたときと選択されない（非活性）ときとでの要素を示す図である。
【図３】本発明によるコンテンツ画面の色カスタマイズ方法の一実施形態の一連の処理手順を示すフローチャートである。
【図４】図３のステップＳ１００で表示されるコンテンツ画面の一具体例を示す図である。
【図５】図４に示すコンテンツ画面の「色カスタマイズ設定」ボタンが操作されたときの選択画面の一具体例を示す図である。
【図６】図５に示す「色カスタマイズ設定」ボタンで「ＯＫ」ボタンが選択されたときのコンテンツ画面の一具体例を示す図である。
【図７】図６に示すコンテンツ画面で１つの部品が選択されたときの選択部品エリアの一具体例を示す図である。
【図８】図７に示す選択部品エリアの移動後に表示される色カスタマイズ操作画面の一具体例を示す図である。
【図９】図８に示す色カスタマイズ操作画面で選択されたカラーセレクタが開いている状態の色カスタマイズ操作画面の一具体例を示すである。
【図１０】図９における「単色」タブと「グラテーション」タブとの一具体例を示す図である。
【図１１】図１０に示す「単色」タブと「グラテーション」タブとの選択できない色，選択を勧めない色を示した状態を示す図である。
【図１２】図９に示す色カスタマイズ操作画面での操作ボタンの文字の色カスタマイズ操作がなされている状態を示す図である。
【図１３】図９に示す色カスタマイズ操作画面での操作ボタンの枠線の色カスタマイズ操作がなされている状態を示す図である。
【図１４】図９に示す色カスタマイズ操作画面でのレイアウトの背景の色カスタマイズ操作がなされている状態を示す図である。
【図１５】図９に示す色カスタマイズ操作画面でのレイアウトの背景のカラーセレクタの一操作例を示す図である。
【図１６（ａ）】図９に示す色カスタマイズ操作画面でのレイアウトの背景のグラテーション操作を示す図である。
【図１６（ｂ）】図１６（ａ）に示す操作に続くグラテーション操作を示す図である。
【図１７】図９に色カスタマイズ操作画面で色カスタマイズの対象を変化させる操作を示す図である。
【図１８】図９に示す色カスタマイズ操作画面で色カスタマイズ操作が終了したときの操作の一具体例を示す図である。
【図１９】図１８に示す操作によって表示される選択画面の一具体例を示す図である。
【図２０】図６に示すコンテンツ画面で複数の「部品」を選択する操作の一具体例を示す図である。
【図２１】図２０に示す操作で表示される色カスタマイズ操作画面の一具体例を示す図である。
【発明を実施するための形態】
【００２２】
まず、本発明の概念について説明する。
【００２３】
パソコンなどの端末装置の表示画面に表示されるコンテンツは各部品から構成されるものであって、各部品はその構成要素からなるものである。
【００２４】
図１はかかるコンテンツの一具体例の一部を示すものであって、１００は操作ボタン、１０１は文字、１０２はボタン背景、１０３はボタン枠線、２００は背景である。
【００２５】
同図において、このコンテンツのこの部分は操作ボタン１００とこの操作ボタン１００以外のエリアの背景２００とからなっている。ここで、操作ボタン１００と背景２００とは部品であって、コンテンツのこの部分は操作ボタン１００と背景２００との部品によって構成されているものである。ここで、この操作ボタン１００は「部品１」であり、背景２００は「部品２」である。
【００２６】
また、部品１の操作ボタン１００は、操作ボタン１００の輪郭を表わす枠線１０３と、このボタン枠線１０３の内部エリアとなるボタン背景１０２と、テキストを形成する文字１０１とで構成され、これら文字１０１とボタン背景１０２と枠線１０３とが部品１を構成する要素となる。
【００２７】
以下に説明する実施形態は、端末装置に設けられて、このようなコンテンツの部品と夫々の部品や部品の夫々の要素について、ユーザにより、このユーザが視認し易いように、色のカスタマイズ（変更）をすることができるようにするものである。
【００２８】
ところで、部品や部品の要素が明確に判別できるためには、かかる部品や要素とこれに接した（以下、隣接したという）他の部品または他の要素との輝度コントラスト比（濃さの違い）が充分大きいことが必要である。
【００２９】
ここで、Ｗ３Ｃ（World Wide Web Consortium）のＷＣＡＧ（Web Content Accesibility Guidelines）勧告によると、輝度コントラスト比は、
（Ｌ１＋０．０５）／（Ｌ２＋０．０５） ……（１）
但し、Ｌ１：隣接した部品または要素のうちの明るい方の色の相対輝度Ｌ
Ｌ２：隣接した部品または要素のうちの暗い方の色の相対輝度Ｌ
で表わされる。
【００３０】
色の相対輝度Ｌは、ＩＥＣ（国際電気標準会議）規格のｓＲＧＢ色空間では、
Ｌ＝０．２１２６＊Ｒ＋０．７１５２＊Ｇ＋０．０７２２＊Ｂ
で表わされる。但し、かかる色の相対輝度におけるＲ（赤）成分，Ｇ（緑）成分，Ｂ（青）成分は、ｓＲＧＢ色空間でのＲ成分をＲｓＲＧＢ、同じくＧ成分をＧｓＲＧＢ、同じくＢ成分をＢｓＲＧＢとすると、
ＲｓＲＧＢ≦0.03928の場合、Ｒ＝ＲｓＲＧＢ／12.92
ＲｓＲＧＢ＞0.03928の場合、Ｒ＝（(ＲｓＲＧＢ＋0.055)／1.055)＾2.4
ＧｓＲＧＢ≦0.03928の場合、Ｇ＝ＧｓＲＧＢ／12.92
ＧｓＲＧＢ＞0.03928の場合、Ｇ＝（(ＧｓＲＧＢ＋0.055)／1.055)＾2.4
ＢｓＲＧＢ≦0.03928の場合、Ｂ＝ＢｓＲＧＢ／12.92
ＢｓＲＧＢ＞0.03928の場合、Ｂ＝（(ＢｓＲＧＢ＋0.055)／1.055)＾2.4
但し、“＾”は指数演算子
で表わされ、ＲｓＲＧＢ，ＧｓＲＧＢ，ＢｓＲＧＢは夫々
ＲｓＲＧＢ＝Ｒ８bit／255
ＧｓＲＧＢ＝Ｇ８bit／255
ＢｓＲＧＢ＝Ｂ８bit／255
である。
【００３１】
なお、Ｒ８bit，Ｇ８bit，Ｂ８bitは夫々、８ビットで表わされる値である。
【００３２】
以上のように、輝度コントラスト比は上記の式（１）で表わされるが、
（１）コンテンツ作成者は、テキストのレンダリング（数値データからの画像化：例えば、フォントのスムージングやアンチエイリアス）に関するユーザの設定を制御できないため、テキストの輝度コントラスト比は、アンチエイリアンス（表示される線などに現われるギザギザをなくす処理）をオフした状態で評価される。
（２）文字の周囲に縁取りがある場合、その縁取りがコントラストを強めることもあり、文字とその背景色におけるコントラストの計算に用いられる。但し、文字の周囲の細い縁取りは文字として扱われる。文字の周囲の太い縁取りがかさ（暈：ハローや後光）のようになって、文字の細かい字画を埋めていれば、背景色として考慮されることになる。
（３）ＷＣＡＧへの適用は、典型的な表現において隣接すると製作者が想定して、コンテンツで指定した色の組み合わせに対して評価されるべきである。製作者は、ユーザエージェントによる色の変更などのように、通常とは異なる表現を考慮する必要はない。但し、それが制作者のソースコードによって起こる場合は、除く。
【００３３】
なお、ディザリング（表示可能な色を組み合わせて、その中間の色を表現すること）が発生する場合には、元の色の値が用いられる。発生源でディザリングしている色については、用いられる色の平均値（Ｒの平均値，Ｇの平均値，Ｂの平均値）を用いるべきである。
【００３４】
以下に説明する実施形態は、以上の輝度コントラスト比を基に、コンテンツの部品やその要素の色を規制し、いずれの部品や要素の色も、ユーザに合わせてカスタマイズすることができるようにするものである。
【００３５】
ここで、この色の規制とは、文字とその背景（この文字が重なって表示される背景）とでは、その輝度コントラスト比が４．５：１未満となる色を選べなくするものであり、また、文字以外の要素とその背景またはその文字以外の要素に隣り合う要素（例えば、ボタンの背景色とこのボタンの枠線色，ボタンの枠線色とこのボタンが置かれている背景の色など）との輝度コントラスト比が１．７：１以上となる色は選択できる、とするものである。
【００３６】
なお、以下では、上記の規定される輝度コントラスト比を、上記のように、４．５：１，１．７：１として、実施形態の説明をするが、これに限るものでなく、ユーザにとって各「要素」を視認し易くする他の輝度コントラスト比を定めることができる。但し、文字とこれに接する「要素」との間で規定される輝度コントラスト比は、文字以外の「要素」間での規定のコントラスト比よりも、その比率が大きいものとする。
【００３７】
また、この実施形態では、接し合う要素（図１では、部品１の文字１０１、部品１での背景１０２、部品１の枠線１０３、部品２）は全て個別にカスタマイズを行なうものである。グラデーション（色や濃淡の連続的に変化）の場合には、最低の輝度コントラスト比（上記の４．５：１や１．７：１）は、最も厳しい色で判別する。
【００３８】
図２は部品の種類やその要素の一覧を示す図である。
【００３９】
同図において、ここでは、部品として、「ボタン」，「テキスト」，これら「ボタン」や「テキスト」が配置される背景となる「レイアウト」，文字を入力するための「テキストボックス」，２以上の項目毎に設けられていてそれらのうちのいずれかを選ぶことができるようにした「チェックボックス」，２以上の項目毎に設けられていてそれらのうちのいずれか１つだけを選ぶことができるようにした「ラジオボタン」，限られた一定のエリア内に複数種類の情報を表示するために用いる「タブパネル」を挙げており、また、これらに対する要素を挙げている。かかる要素としては、「文字／記号」と「文字／記号の縁取り」と「背景」と「枠線」と「影」などである。ここで、要素「文字／記号」，「文字／記号の縁取り」，「背景」，「枠線」の属性としては、「押下」可能な（押下操作によって機能する）状態の要素と「押下」可能な状態となり得るものの、そのときには、「押下」できない（押下操作しても機能しない）状態の「非活性」の要素とがあり、「押下」可能な状態の要素に対しては、例えば、「文字／記号」を例にすると、「文字／記号」と「非活性の文字／記号」とが存在する。また、「押下」したときに当該部品が選ばれたことを示す状態を、「選択時」とした。例えば、「文字／記号」を例にすると、押下される前で、かつ押下可能な状態を表わす「文字／記号」と、押下される前で、かつ押下不可能な状態を表わす「非活性時の文字／記号」と、押下された後の状態を表わす「選択時の文字／記号」とがある。そして、部品毎に、夫々の要素の該当する属性に○印を付している。
【００４０】
図２によると、部品「ボタン」，「レイアウト」，「テキストボックス」，「チェックボックス」，「ラジオボタン」，「タブパネル」は、「文字／記号」や「文字／記号の縁取り」，「背景」，「枠線」，「影」の要素から成るが、これらには、全て「非活性」の状態が存在する。部品「レイアウト」は、「文字／記号」や「文字／記号の縁取り」，「背景」，「枠線」，「影」の要素から成るが、押下するものではないから、これら要素は不活性の状態も、また、選択の状態も存在しない。部品「テキスト」は、「文字／記号」と「文字／記号の縁取り」の要素から成るものであるが、これら要素には、不活性の状態が存在する。また、「タブパネル」は、「文字／記号」，「文字／記号の縁取り」，「背景」，「枠線」，「影」の要素からなり、これら要素には、「非活性」の状態とともに、「選択」可能な状態も存在する。
【００４１】
以上のことを基に、以下、本発明の実施形態を図３〜図２１を用いて説明する。なお、図３は本発明によるコンテンツ画面の色カスタマイズ方法の一実施形態の一連の処理手順を示すフローチャートであって、この図３を基に、この実施形態を説明する。
【００４２】
まず、図示しない端末装置でコンテンツデータをダウンロードすると、その表示画面に図４に示すこのコンテンツデータによるコンテンツ画面が表示される（図３のステップＳ１００）。
【００４３】
なお、図４において、１は表示画面、２はコンテンツ画面、３は「色カスタマイズモード設定」ボタン、４はコンテンツデータ表示エリア、５，５1〜５4は操作ボタン、５5はその右隣に設けられている「実行」ボタンが押下されたときに実行される機能を選択するための操作部（ここでは、プルダウンメニューとしている）、５ａはボタンの文字、５ｂはボタンの背景、５ｃはボタンの枠線、６は背景、６ａ，６ｂは文字、７はタブパネル、７ａはタブパネルの文字、７ｂはタブパネルの背景、８はテキスト、９はチェックボックス、１０はテキストボックス、１１はカーソルである。
【００４４】
同図において、表示画面１に表示されるコンテンツ画面２では、ダウンロードされたコンテンツを表示するコンテンツ表示エリア４とともに、このコンテンツ表示エリア４で表示されるコンテンツを処理するための、例えば、「重要度変更」ボタン５1，「期限変更」ボタン５2，「担当者変更」ボタン５3，「ステータス変更」ボタン５4（以下、纏めて言うときや総称するときには、操作ボタン５という）や機能選択のための操作部５5，かかる操作ボタン５や操作部５5が重ねて表示されるレイアウト（背景）６，タブパネル７，タブパネル７内に表示されるテキスト８，コンテンツ表示エリア４で表示される各コンテンツデータ毎に設けられたチェックボックス９テキストボックス１０などが表示される。これらがコンテンツ画面２を構成する上記の「部品」ということになる。
【００４５】
コンテンツ表示エリア４には、ここでは、項目「重要度」，「期限」，「担当者」，「ステータス，「メモ」などからなるタスクの一覧表が表示されており、これらタスク毎に、それを処理可能とするためのチェックボックス９が設けられている。「重要度変更」ボタン５1や「期限変更」ボタン５2，「担当者変更」ボタン５3，「ステータス変更」ボタン５4，操作部５5の部品は、コンテンツ表示エリア４でのいずれのタスクも、チェックボックス９でチェックされずに処理不能な状態にあるときには、全て不活性の状態にあり、押下しても機能しないが、コンテンツ表示エリア４でタスクが１つでも、そのチェックボックス９でチェックされて、処理可能な状態となると、これら全てが「押下」可能な状態となる。
【００４６】
例えば、図示するように、タスク３，４が選択されて処理可能な状態になったとすると、これらタスク３，４に対して、「重要度変更」ボタン５1を選択することにより、その項目「重要度」の内容を変更させることができるし、「期限変更」ボタン５2を選択することにより、その項目「期限」の内容を変更させることができるし、「担当者変更」ボタン５3を選択することにより、その項目「担当者」の内容を変更させることができるし、「ステータス変更」ボタン５4を選択することにより、その項目「ステータス」の内容を変更させることができる。また、操作部５5で、図示するように、「メモ記述」の項目が選択されている状態で、「実行」ボタンが押下されると、上記タスク３，４の項目「メモ」の内容を変更させることができる。なお、この操作部５5では、その▲ボタンを押下することにより、機能の一覧が表示され、そのうちの所望の機能が押下されて「実行」ボタンが押下されると、この機能が上記のタスク３，４に対して実行される。
【００４７】
なお、以下では、色カスタマイズの対象として、操作ボタン５を代表例として説明するが、この「メモ記述」変更操作部５5やこれ以外の「部品」、即ち、タブパネル７，テキスト８，チェックボックス９，ラジオボックス１０などについても同様である。
【００４８】
部品としての操作ボタン５は、文字５ａと背景５ｂと枠線５ｃとから構成されており、これらが操作ボタン５を構成する「要素」ということになる。かかる要素としての文字は、「重要度変更」ボタン５1では「重要度変更」であり、「期限変更」ボタン５2では「期限変更」であり、「担当者変更」ボタン５3では「担当者変更」であり、「ステータス変更」ボタン５4では「ステータス変更」である。同様にして、部品としてのレイアウト６には、そのレイアウト６のタイトルを示す文字６ａ，６ｂが表示されるが、この文字６ａ，６ｂとレイアウト６の背景とがこのレイアウト６を構成する要素となる。なお、この文字６ａは、レイアウト６に重なって表示される部品としての「重要度変更」ボタン５1，「期限変更」ボタン５2，「担当者変更」ボタン５3，「ステータス変更」ボタン５4などのコマンドを指定するものであるときには、例えば、「よく使うコマンド」といった標題（テキスト）で表わされている。
【００４９】
また、タブパネル７に表示されるテキスト８は、コンテンツデータであり、部品である。これに対し、タブパネル７に表示される「個人」との文字７ａは、タブパネル７の標題を表わすものであり、タブパネル７を構成する要素ということになる。なお、タブパネル７は、要素としてのかかる文字７ａと要素としての背景７ｂとで構成されることになり、この背景８ｂに部品としてのテキスト８が重ねて表示されていることになる。なお、ここでは、標題を「グループ」とするタプパネルもあるが、これもタブパネル７と同様である。
【００５０】
さらには、コンテンツ表示エリア４では、図示するように、タクトの一覧が表示されているものとしているが、ここでは、これらタクト毎に部品としてのチェックボックス９が設けられているものとしている。
【００５１】
さらにまた、このコンテンツ画面２には、その上辺部に「色カスタマイズ」ボタン３などのモード選択ボタンが表示されおり、これらのいずれかをカーソル１１で指定してクリック操作する（以下、かかる操作を押下操作という）ことにより、これに該当するモードが設定される。「色カスタマイズ」ボタン３は、このコンテンツ画面２での部品やその要素の色をカスタマイズするモードを設定するためのものである。
【００５２】
このコンテンツ画面２が表示された状態で（図３のステップＳ１００）、カーソル１１が操作されて「色カスタマイズ」ボタン３が押下されると（図３のステップＳ１０１）、図５に示す選択画面が表示される。
【００５３】
なお、図５において、１２は選択画面、１３はテキスト、１４は「ＯＫ」ボタン、１５は「キャンセル」ボタンである。
【００５４】
同図において、ここでは、この選択画面１２はコンテンツ画面２に重なってその中央部に表示され、この場合、コンテンツ画面２は透けて見える状態のものとする。但し、選択画面１２のみを表示するようにしてもよい。
【００５５】
この選択画面１２では、例えば、「色をカスタマイズしたい部分を選択して下さい」といったようなテキスト１３が表示されるとともに、部品の色をカスタマイズさせるための「ＯＫ」ボタン１４と色のカスタマイズモードをキャンセルするための「キャンセル」ボタン１５とが表示され、この「キャンセル」ボタン１５がカーソル１１の操作で押下されると、色のカスタマイズモードがキャンセルされ、図３に示すコンテンツ画面２のみの表示状態に戻る。
【００５６】
「ＯＫ」ボタン１４が押下されると、色のカスタマイズモードが設定されて、図６に示すコンテンツ画面２の表示状態となり（但し、図６において、図４に対応する部分には同一符号をつけて重複する説明を省略する）、カーソル１１を操作して所望とする１つの部品、例えば、「期限変更」ボタン５2を押下すると、この部品が押下されたことになる（図３のステップＳ１０２，Ｓ１０３）。
【００５７】
これとともに、この場合には、押下された部品が「期限変更」ボタン５2であって、この部品の上には、他の部品が重なっていない（図３のステップＳ１０４の“Ｎｏ”）、図７に示すように（なお、図７において、１６は押下部品エリアであり、前出図面に対応する部分には同一符号をつけて重複する説明を省略する）、コンテンツ画面２でのこの部品である「期限変更」ボタン５2を完全に含み、かつこれに接する他の部品（ここでは、レイアウト６）の一部とを含み、それ以外の部品を極力排除した押下部品エリア１６が明示された状態となり、コンテンツ画面２の他のエリアは透けて見える状態となる。
【００５８】
そして、図６に示すコンテンツ画面２の全体が、例えば、左方向に移動し、これにより、かかる押下部品エリア１６が移動して、図８に示す色カスタマイズ操作画面が表示される（図３のステップＳ１０５）。
【００５９】
なお、図８において、１７は色カスタマイズ操作画面、１８はカラーセレクタ表示画面、１９は「ボタン」のカラーセレクタ表示エリア、１９ａ〜１９ｃはカラーセレクタ、２０は「レイアウト」のカラーセレクタ表示エリア、２０ａ〜２０ｃはカラーセレクタ、２１は「選択色表示」欄、２２は「選択色の候補表示」ボタン、２３は「クリア」ボタン、２４はプレビューエリア、２５はスクロール操作部、２６は「ＯＫ」ボタン、２７は「キャンセル」ボタン、２８は「全クリア」ボタンである。
【００６０】
同図において、この色カスタマイズ操作画面１７では、図４に示すコンテンツ画面２でのコンテンツデータ表示エリア４が変更されたカラーセレクタ表示画面１８と、タブパネル７の表示エリアが変更されたプレビューエリア２４とからなるものであって、上記のように、図６に示すコンテンツ画面２全体の移動が、プレビューエリア２４内に押下部品エリア１６が位置付けられるまで、行なわれ、このコンテンツ画面２のこのプレビューエリア２４に含まれる部分のみがこのプレビューエリア２４で表示されることになる。但し、このプレビューエリア２４内では、押下部品エリア１６の部分のみが明示され、その他の部分は透けて見える状態となる。これにより、図６のコンテンツ画面２で押下された部品（この場合、「期限変更」ボタン５2）が明確に示され、それを容易に確認することができる。
【００６１】
また、カラーセレクタ表示画面１８では、図６でのコンテンツ画面２で押下された部品と、この部品が重なって表示される他の部品との押下部品エリア１６で明示される部品毎にカラーセレクタ表示エリアが設定される。上記の例では、選択された「期限変更」ボタン５2のカラーセレクタ表示エリア１９と、この「期限変更」ボタン５2が重ねられているレイアウト６に対するカラーセレクタ表示エリア（レイアウト６のカラーセレクタ表示エリア）２０とが設定されることになる。そして、カラーセレクタ表示エリア１９，２０毎に、該当する部品の要素毎にその色を選択することができるようにするためのカラーセレクタが表示される。この場合の例では、カラーセレクタ表示エリア１９には、部品としての「期限変更」ボタン５2の「要素」であるボタンの文字５ａ（図４）に対してカラーセレクタ１９ａが、その背景５ｂに対してカラーセレクタ１９ｂが、その枠線５ｃに対してカラーセンタ１９ｃが夫々設定され、また、レイアウト６のカラーセレクタ表示エリア２０には、「部品」としてのレイアウト６の「要素」であるレイアウト６の文字６ａ（図４）に対してカラーセレクタ２０ａが、その背景に対してカラーセレクタ２０ｂが、その枠線に対してカラーセレクタ２０ｃが夫々設定される。
【００６２】
各カラーセレクタは、カラーセレクタ２０ｃを例にして説明すると、「選択色表示」欄２１と「選択色の候補表示」ボタン２２と「クリア」ボタン２３とからなり、「選択色表示」欄２１では、このカラーセレクタ２０ｃに該当する「要素」（この場合、レイアウト６の枠線）の現在の色が表示されており、これにより、この「要素」の現在の表示色が確認できるようにしている。また、「選択色の候補表示」ボタン２２は、後述するように、色をカスタマイズ（変更）するための手段を表示するためのものであり、「クリア」ボタン２３は、後述するように、選択した色を解除するためのものであり、色の選択に対する制限を解除するためのものでもある。
【００６３】
また、図６に示すコンテンツ画面２で選択された（図３のステップＳ１０３）１つの部品が、例えば、レイアウト６のように、その上に他の部品（例えば、操作ボタン５）が重ねられている場合でも（図３のステップＳ１０４の“Ｙｅｓ”）、図８に示すように、この選択された部品のカラーセレクタ表示エリア１９とこの部品に重ねられた他の部品のカラーセレクタ表示エリア２０とが設定された色カスタマイズ操作画面１７が表示される。但し、この押下された部品がレイアウト６である場合には、これに重なっている部品は複数個の操作ボタン５であり、この場合には、これらの操作ボタン５毎にカラーセレクタ表示エリア２０が設定されて表示されることになる（図３のステップＳ１０６）。なお、押下された部品がタブパネル７である場合には、これに重なっている部品はテキスト８であるから、この場合には、選択されたタブパネル７のカラーセレクタ表示エリア１９とこれに重ねられたテキスト８のカラーセレクタ表示エリア２０とが設定された色カスタマイズ操作画面１７が表示される（図３のステップＳ１０６）。
【００６４】
なお、この色カスタマイズ操作画面１７には、カラーセレクタ表示画面１８を上下にスクロールさせるためのスクロール操作部２５と、後述する色カスタマイズの操作結果を確定するための「ＯＫ」ボタン２６と、後述する色カスタマイズの操作をキャンセルする「キャンセル」ボタン２７と、カラーセレクタ表示画面１８で表示される全てのカラーセレクタ１８ａ〜１８ｃ，１９ａ〜１９ｃの「クリア」ボタン２３を全て同時に操作したのと同様の機能を有する「全クリア」ボタン２８とを備えている。
【００６５】
図８に示す色カスタマイズ操作画面１７で所望とする「要素」のカラーセレクタの「選択色の候補表示」ボタン２２がカーソル１１を用いて押下操作されると、図９に示すように、この「選択色の候補表示」ボタン２２が押下されることによって選択されたカラーセレクタが展開した状態となり、その「要素」の色のカスタマイズが可能な状態となる。
【００６６】
なお、図９において、１７ａはこのときの色カスタマイズ操作画面、２９は「単色」タブ、３０は「グラデーション」タブであり、図８に対応する部分には同一符号をつけて重複する説明を省略する。
【００６７】
いま、図８に示す色カスタマイズ操作画面１７での「期間変更」ボタン５2のカラーセレクタ表示エリア１９でカラーセクク１９ａ〜１９ｃの「選択色の候補表示」ボタン２２が、また、レイアウト６のカラーセレクタ表示エリア２０でカラーセレクタ２０ｂの「選択色の候補表示」ボタン２２が夫々押下されたとすると、これらカラーセレクタ１９ａ〜１９ｃ，２０ｂが選択されて展開した状態となる。即ち、ここでは、「期間変更」ボタン５2の要素「文字」５ａの文字色を設定するためのカラーセレクタ１９ａと、同じく要素「ボタンの背景」５ｂの背景色を設定するためのカラーセレクタ１９ｂと、同じく要素「ボタンの枠線」５ｂの枠線色を設定するためのカラーセレクタ１９ｃと、レイアウト６の要素「背景」の背景色を設定するためのカラーセレクタ２０ｂとが展開することになる。
【００６８】
これらカラーセレクタ１９／２０（カラーセレクタ１９ａ〜１９ｃ，２０ａ〜２０ｃの総称）は、色を決めるための「単色」タブ２９とグラデーションを決めるための「グラテーション」タブ３０とからなり、カーソル１１の操作によってこれらのいずれかが選択された状態にある。図９に示す例では、「期間変更」ボタン５2の要素「文字」５ａに対する「ボタン文字色」のカラーセレクタ１９ａと同じく要素「ボタンの枠線」５ｃに対する「ボタン枠線色」のカラーセレクタ１９ｃとレイアウト６の要素「背景」に対する「背景色」のカラーセレクタ２０ｂとで「単色」タブ２９が選択されており、「期間変更」ボタン５2の要素「ボタンの背景」５ｂに対する「ボタン背景色」のカラーセレクタ１９ｂで「グラテーション」タブ３０が選択されている状態を示している。
【００６９】
これら「単色」タブ２９や「グラテーション」タブ３０は、該当する「要素」が表わされている色（即ち、「選択色表示」欄２１）を選択した状態にある（図３のステップＳ１０７）。
【００７０】
図１０（ａ）は図９における「単色」タブ２９の一具体例を示す図であって、２１ａは設定色表示部、２９ａは不透明度指定部、２９ｂは色相表示欄、２９ｃはカラーパレット、２９ｄ1は色相指定部、２９ｄ2は濃度指定部、２９ｅ1，２９ｅ2はスライダである。
【００７１】
図１０（ａ）において、「単色」タブ２９は、「要素」（例えば、「期間変更」ボタン５2の「要素」）に現在設定されている色の不透明度を表わす不透明度指定部２９ａと、設定可能な種々の濃度での色の一覧を表わす色選択用のカラーパレット２９ｃと、このカラーパレット２９ｃに含まれる色の種類を表わす色相表示欄２９ｂとからなっている。
【００７２】
このカラーパレット２９ｃは、横軸を色彩（色の種類）座標軸として、この色彩座標軸に沿って各種の色彩の色が配列され、縦軸を濃度座標軸として、この濃度座標軸に沿って同じ色彩の色が異なる濃度で配列されている。カラーパレット２９ｃでの所望とする色をカーソル１１の操作で選択することにより、この「単色」タブ２９に該当する「要素」の色がこの選択された色に設定される。これとともに、「選択色表示」欄２１（図８）の設定色表示部２１ａで表示される色も、この選択された色に変更される。
【００７３】
カラーパレット２９ｃの上辺側には、選択する色相を代えるための色相指定部２９ｄ1が設けられており、この色相指定部２９ｄ1に色相を選択するためのスライダ２９ｅ1が設けられている。このスライダ２９ｅ1を色彩座標軸に沿う左右方向に移動させることにより、このスライダ２９ｅ1に対向する色相の色を選択できるようになる。また、カラーパレット２９ｃの左辺側には、色の濃度を変化させるための濃度指定部２９ｄ2が設けられており、この濃度指定部２９ｄ2に濃度を選択するためのスライダ２９ｅ2が設けられている。このスライダ２９ｅ2を濃度座標軸に沿う上下方向に移動させることにより、このスライダ２９ｅ2に対向する濃度の色を選択できるようになる。スライダ２９ｅ1を左右方向に移動されると、これに応じて選択される色相が変化し、これとともに、「選択色表示」欄２１の色設定表示部２１ａに表示される色が変化し、スライダ２９ｅ2を上下方向に移動されると、これに応じてスライダ２９ｅ1で選択されている色相の濃度が変化し、これとともに、「選択色表示」欄２１の色設定表示部２１ａに表示されている色の濃度が変化する。
【００７４】
これにより、スライダ２９ｅ1を希望する色相に対向する位置に設定し、スライダ２９ｅ2を希望する濃度に対向する位置に設定すると、希望する濃度で希望する色彩の色が選択されたことになり、かかる希望する濃度で希望する色彩の色が「選択色表示」欄２１の色設定表示部２１ａに表示されることになる。
【００７５】
図１０（ｂ）は図９における「グラテーション」タブ３０の一具体例を示す図であって、２１ｂは設定グラテーション表示部、３０ａは不透明度指定部、３０ｂは色相表示欄、３０ｃはカラーパレット、３０ｄ1は色相指定部、３０ｄ2は濃度指定部、３０ｅ1，３０ｅ2はスライダ３０ｆはグラデーション設定部、３０ｆ1はグラデーションバー、３０ｆ2，３０ｆ3は端部マーク、３０ｆ4は色相／濃度指示マーク、３０ｇはグラデーション方向設定欄である。
【００７６】
同図において、「グラテーション」タブ３０は、「単色」タブ２９と同様、不透明度指定部３０ａと色相表示欄３０ｂとカラーパレット３０ｃとが設けられているとともに、グラデーション設定部３０ｆ及びグラデーション方向設定欄３０ｇが設けられている。ここで、カラーパレット３０ｃは、グラデーションを設定する際の色の選択のためのものである。
【００７７】
グラデーション方向指定欄３０ｇは、グラデーションの方向（色あるいは濃さの変化の方向）を任意に切り換え設定できるようにするものであって、この方向が角度０゜のときには、横方向に色やその濃さを順次変化させるものであり、角度９０゜のときには、縦方向に色やその濃さを順次変化させるものであり、角度４５℃のときには、斜め方向に色やその濃さを順次変化させるものである。例えば、「期間変更」ボタン５2内の背景５ｂ（図４）でグラテーションの方向を設定する場合には、図９に示すように、「ボタン背景色」のカラーセレクタ１９ｂで「グラテーション」タブ３０を選択し、この「グラテーション」タブ３０（図１０（ｂ））におけるグラデーション方向設定欄３０ｇでその方向に応じた角度を設定するように操作すればよい。ここでグラデーション方向を角度０゜に指定すると、この「期間変更」ボタン５2内の背景５ｂの色やその濃さが横方向に変化して表示され、角度９０゜に指定すると、この「期間変更」ボタン５2内の背景５ｂの色やその濃さが縦方向に変化して表示され、角度４５゜に指定すると、この「期間変更」ボタン５2内の背景５ｂの色やその濃さが斜め方向に変化して表示される。
【００７８】
グラデーション設定部３０ｆは、グラデーションを表わすグラデーションバー３０ｆ1と、グラデーションバー３０ｆ1の端を表わす端部マーク３０ｆ2，３０ｆ3と、グラデーションバー３０ｆ1の端部間の色または濃度を指示するための色相／濃度指示マーク３０ｆ4とからなっている。この色相／濃度指示マーク３０ｆ4は、グラデーションバー３０ｆ1に沿うその位置を変更させることもできるし、また、削除することができるし、さらに、削除の色相／濃度指示マーク３０ｆ4を再び追加することもできる。、
グラデーションバー３０ｆ1での端部マーク３０ｆ2，３０ｆ3や色相／濃度指示マーク３０ｆ4で指示される位置では、「単色」タブ２９での色指定の方法と同様の操作方法により、色を指定することができる。即ち、一方の端部マーク３０ｆ2または３０ｆ3を指定して（カーソル１１でタッチ操作して）、カラーパレット３０ｃで所望の濃度の色相を選択操作することにより、グラデーションバー３０ｆ1のこの端部マーク３０ｆ2または３０ｆ3側の端部にこの選択された濃度の色が設定され、他方の端部マーク３０ｆ3または３０ｆ2を指定操作して、カラーパレット３０ｃで所望の濃度の色相を選択操作することにより、グラデーションバー３０ｆ1のこの端部マーク３０ｆ3または３０ｆ2側の端部にこの選択された濃度の色が設定され、これにより、グラデーションバー３０ｆ1にこの一方の端部に設定された濃度の色から他方の端部に設定された濃度の色までのグラデーションが設定されることになる。これとともに、「色」表示欄２１の設定グラデーション表示部２１ｂに、この色グラデーションが表示されることになる。
【００７９】
なお、グラデーションバー３０ｆ1で設定される色クラデーションは、ここでは、カラーパレット３０ｃ上で、グラデーションバー３０ｆ1での一方の端部（例えば、端部マーク３０ｆ2側の端部）に対して指定された色と他方の端部（例えば、端部マーク３０ｆ3側の端部）に対して指定された色とを結ぶ直線に沿う色の列からなる色グラデーションが表示される。従って、これらの指定される２つの色がカラーパレット３０ｃの濃度座標軸に平行な１つの直線上にある色のときには、グラデーションバー３０ｆ1では、同じ色の濃さが変化する色グラデーションが得られるものであり、指定される２つの色が、濃度座標軸に平行でない１つの直線上にある色であるときには、少なくとも色が変化する色グラデーションが得られることになる。
【００８０】
ここで、グラデーション方向指定欄３０ｇが角度９０°であって、レイアウト６などの「要素」でのグラデーションの方向が垂直方向（縦方向）である場合には、グラデーションバー３０ｆ1の端部マーク３０ｆ2側の端部に設定された濃度と色相の色はこの「要素」の下端での色を表わしており、グラデーションバー３０ｆ1の他方の端部マーク３０ｆ3側の端部に設定された濃度の色はこの「要素」の上端での色を表わしており、グラデーションバー３０ｆ1でこれら濃度で色彩の色間のグラデーションが表わされることになり、このグラデーションでこの「要素」が色／濃度のグラデーション表示されることになる。また、グラデーション方向指定欄３０ｇが角度０°であって、レイアウト６などの「要素」でのグラデーションの方向が水平方向（横方向）である場合には、グラデーションバー３０ｆ1の端部マーク３０ｆ2側の端部に設定された濃度，色彩の色はこの「要素」の左端の色を表わしており、グラデーションバー３０ｆ1の他方の端部マーク３０ｆ3側の端部に設定された濃度，色彩の色はこの「要素」の右端の色を表わしており、これら濃度，色彩の色間のグラデーションがグラデーションバー３０ｆ1で表わされることになり、このグラデーションでこの「要素」が色／濃度のグラデーション表示されることになる。グラデーション方向指定欄３０ｇが角度０°や角度９０゜以外の角度であって、レイアウト６などの「要素」でのグラデーションの方向が斜め方向である場合には、グラデーションバー３０ｆ1の端部マーク３０ｆ2側の端部に設定された濃度，色彩の色はこの「要素」の、例えば、左下角側の色を表わしており、グラデーションバー３０ｆ1の他方の端部マーク３０ｆ3側の端部に設定された濃度，色彩の色はこの「要素」の右上角側の色を表わしており、これら濃度，色彩の色間のグラデーションがグラデーションバー３０ｆ1で表わされることになり、このグラデーションでこの「要素」が色／濃度のグラデーション表示されることになる。
【００８１】
色相／濃度指示マーク３０ｆ4は、グラデーションバー３０ｆ1の途中に所望の濃度で色相の色を指定することができるようにするものであって、色相／濃度指示マーク３０ｆ4を指定して、カラーパレット２９ｃで所望の濃度で色相の色を選択操作することにより、グラデーションバー３０ｆ1のこの色相／濃度指示マーク３０ｆ4の位置にこの選択された濃度，色相の色が設定される。この場合には、グラデーションバー３０ｆ1の一方の端部マーク３０ｆ2側の端部と色相／濃度指示マーク３０ｆ4に対向する位置との間で、これらに設定された濃度，色彩の色間のグラデーションが設定され、さらに、色相／濃度指示マーク３０ｆ4に対向する位置と他方の端部マーク３０ｆ3側の端部との間で、これらに設定された濃度，色相の色間のグラデーションが設定される。例えば、端部マーク３０ｆ2，３０ｆ3で夫々異なる濃度Ｄ１，Ｄ２で色彩が同じ色Ｃが設定され、色相／濃度指示マーク３０ｆ4でこれらと同じ色相で濃い濃度Ｄ３（＞Ｄ１，Ｄ２）の色Ｃが設定されたとすると、グラデーションバー３０ｆ1では、左側から濃度がＤ１からＤ３に変化し、さらに、Ｄ３からＤ２に変化するグラデーションが設定されることになる。そして、このグラデーションが該当する「要素」に設定されることになる。
【００８２】
以上の図１０は、「単色」タブ２９と「グラテーション」タブ３０の構成を示すが、これら「単色」タブ２９と「グラテーション」タブ３０では、上記の輝度コントラスト比を基に、それらのカラーパレット２９ｃ，３０ｃで選択不能な色（以下では、「色」といった場合、この「色」は色相と濃度とからなるものとする）と選択を勧めない色とが設定される。
【００８３】
図１１はかかる「単色」タブ２９のカラーパレットでの表示例を示す図であって、３１ａはバツ印を示す「×（バツ）」マーク、３１ｂは斜線印を示す「／」マークであり、図１０に対応する部分には同一符号を付けて重複する説明を省略する。
【００８４】
上記のように、要素「文字／記号」とこれに接する他の要素との間では、輝度コントラスト比が４．５：１以上でなければならず、要素「文字／記号」以外の要素間では、輝度コントラスト比が１．７：１以上でなければならないという規定があり、この実施形態では、この規定を満たさない色が「単色」タブ２９や「グラテーション」タブ３０のカラーパレットで表示される。
【００８５】
図１１（ａ）は、「単色」タブ２９を例として、要素「文字／記号」とこれに接する他の要素に対するカラーパレット２９ｃの表示状態の一具体例を示す図であって、これら「要素」間で輝度コントラスト比が４．５：１未満の色に対して、「×」マーク３１ａが示され、この色を選択できないようにしている。
【００８６】
図９に示す色カスタマイズ操作画面１７ａでは、選択された「期限変更」ボタン５2（図６）でのボタンの文字５ａ（図４）のカラーセレクタ１９ａにおいて、その「単色」タブ２９のカラーパレット２９ａで「×」マーク３１ａが付された色が示されているが、これは、この「期限変更」ボタン５2において、文字５ａとこれが重なって表示される文字の背景５ｂとにおいて、この文字の背景５ｂの色に対し、輝度コントラスト比が４．５：１未満となる文字５ａの色に対して「×」マーク３１ａが付されているものである。従って、図９に示す色カスタマイズ操作画面１７ａでは、カラーパレット２９ａで「×」マーク３１ａが付された色は、選択できないものである。このカラーパレット２９ａで「×」マーク３１ａが付されていない色を選択することにより、文字５ａが、これが重なって表示される文字の背景５ｂの色に対して、このコンテンツ画面２（図４）でユーザが明確に視認できるように色付けされていることになる。
【００８７】
図１１（ｂ）は、「単色」タブ２９を例として、要素「文字／記号」以外の２つの要素に対するカラーパレット２９ｃの表示状態の一具体例を示す図であって、これら「要素」間で輝度コントラスト比が１．７：１未満の色に対して、「／」マーク３１ｂが示され、この色は選択することができるが、それが選択されると、これら「要素」間で輝度コントラスト比が１．７：１未満の色となるので、推奨しないようにしている。
【００８８】
図９に示す色カスタマイズ操作画面１７ａでは、選択された「期限変更」ボタン５2（図６）でのボタンの枠線５ｃ（図４）のカラーセレクタ１９ｃにおいて、その「単色」タブ２９のカラーパレット２９ａで「／」マーク３１ｂが付された色が示されているが、これは、この「期限変更」ボタン５2において、枠線５ｃとこれに接して表示される文字の背景５ｂとにおいて、この文字の背景５ｂの色に対し、輝度コントラスト比が１．７：１未満となる枠線５ｃの色に対して「／」マーク３１ｂが付されているものである。従って、図９に示す色カスタマイズ操作画面１７ａでは、ボタン枠線色のカラーセレクタ１９ｃのカラーパレット２９ａで「／」マーク３１ｂが付された色は、選択が推奨されないものである。このカラーパレット２９ａで「／」マーク３１ｂが付されていない色を選択することにより、ボタンの枠線５ｃが、これに接して表示される文字の背景５ｂの色に対して、このコンテンツ画面２（図４）でユーザが明確に視認できるように色付けされていることになる。
【００８９】
ここで、図９に示す色カスタマイズ操作画面１７ａでは、各カラーセレクタ１９／２０毎に「クリア」ボタン２３が設けられているが、「クリア」ボタン２３が押下されると、「クリア」ボタン２３が押下されたカラーセレクタ１９／２０において、色の選択、あるいはグラテーションの選択が解除される。即ち、どの色も、また、どのようなグラテーションも選択されていない状態となる。例えば、図１１（ａ）において、「クリア」ボタン２３が押下されると、カラーセレクタ１９ａでのこのとき選択されている色は解除され、このため、このとき表示されている「期間変更」ボタン５2のボタンの文字５ａの色は消えるとともに、「色表示」欄２１で表示されている色も消える。また、図１１（ｂ）において、「クリア」ボタン２３が押下されると、カラーセレクタ１９ｂでのこのとき設定されているグラデーションは解除され、このため、このとき表示されている「期間変更」ボタン５2のボタンの背景５ｂでのグラデーションが消えるとともに、「色表示」欄２１で表示されているグラデーションも消える。
【００９０】
また、これとともに、上記の選択している色やグラテーションが消えることから、図１１に示す「×」マーク３１ａや「／」マーク３１ｂが設定されている色が変わってくる。例えば、図９において、「期間変更」ボタン５2のボタンの背景５ｂに対するカラーセレクタ１９ｂで「クリア」ボタン２３が押下され、そのグラデーションが解除されると、「期間変更」ボタン５2のボタンの文字５ａに対するカラーセレクタ１９ａにおいて、これまでのカラーセレクタ１９ｂで設定されているグラテーションによって選択することができず、「×」マーク３１ａが設定されていた色が選択可能となる場合もあり、このような色に対しては、この「×」マーク３１ａが除かれることになる。なお、図９において、カラーセレクタ１９ａで「クリア」ボタン２３が押下され、「期間変更」ボタン５2のボタンの文字５ａでそのとき選択されている色が解除されるが、このとき、これに対するカラーセレクタ１９ａでは、「期間変更」ボタン５2のボタンの背景５ｂに対するカラーセレクタ１９ｂでグラテーションの設定をしたときに、このグラテーションに対して選択できなくなった色に対して「×」マーク３１ａが設定されたものであるときには、カラーセレクタ１９ａで「クリア」ボタン２３が押下されても、「×」マーク３１ａが削除される色もあるが、「×」マーク３１ａが設定されているままの色もある。カラーセレクタ１９ａでのかかる色は、カラーセレクタ１９ｂでいずれの色が選択されても、選択することができない色である。
【００９１】
なお、カラーセレクタ１９ａでの色選択によってカラーセレクタ１９ｂで色に「×」マーク３１ａが設定されている場合も同様であり、カラーセレクタ１９ｂで「クリア」ボタン２３が押下されても、「×」マーク３１ａが設定されている色が残る場合もある。また、「／」マーク３１ｂが設定されている色についても同様である。
【００９２】
なお、図９に示す色カスタマイズ操作画面１７ａにおいて、レイアウト６のカラーセレクタ表示エリア２０では、このレイアウト６の背景６ａ，６ｂ（図４）のカラーセレクタ２０ｂのみが展開され、その「単色」タブ２９のカラーパレット２９ｃ（図１１）で「×」マーク３１ａが設定されていることが示されているが、これは、展開されていないが、このレイアウト６の文字６ａ，６ｂのカラーセレクタ２０ａでのカラーパレットでの色に対して、輝度コントラスト比が４．５：１未満となる色に対して「×」マーク３１ａが設定されていることになる。
【００９３】
また、「期限変更」ボタン５2の枠線５ｃは、レイアウト６の背景と接することになる。このため、これら間の色では、やはり輝度コントラスト比が１．７：１以上であるように、設定される。この場合、「期限変更」ボタン５2が上記のように指定されたものであるから、この枠線５ｃに対して、レイアウト６の方で選択可能な色が制限されることになる。即ち、「期限変更」ボタン５2の枠線５ｃのカラーパレット２９ｃで「／」マーク３１ａが設定されていない色に対して、レイアウト６の背景のカラーセレクタ２０ｂでのカラーパレット２９ｃで輝度コントラスト比が１．７：１未満となる色にも、「／」マーク３１ａが設定されることになる。
【００９４】
以上のように、図８に示す色カスタマイズ操作画面１７で色のカスタマイズを必要とする「要素」のカラーセレクタが指定されると、指定された「要素」のカラーセレクタが展開した図９に示す色カスタマイズ操作画面１７ａが表示されることになる（図３のステップＳ１０８）。
【００９５】
この場合、上記のように、指定された「部品」とこれに接する（つまり、この「部品」が重なったり、この「部品」に重なったりすることによって接している）他の１以上の部品毎に、その「要素」のカラーセレクタが展開していて、そのカラーセレクタでのカラーパレットで色を選択したり、グラデーションを選択したりすることにより、該当する「要素」をその選択した色で、あるいは選択したグラデーションで表現させることができる。また、夫々のカラーパレットには、該当する「要素」をこれに接した「要素」に対して必要な輝度コントラスト比を持たせて視認し易くするために、この必要な輝度コントラスト比未満の視認し易くない色に対し、その旨を表示する「×」マーク３１ａや「／」マーク３１ｂを付加し、選択できない、あるいは選択させないようにしている。
【００９６】
コンテンツ画面２（図４）が表示されたときに、上記のようにして、「部品」を指定してこの「部品」に対し、あるいはこの「部品」に接する「部品」に対し、そのいずれかの「要素」のカラーセレクタで色カスタマイズを行なうと、夫々の「要素」のカラーセレクタのカラーパレットの状態（「×」マーク３１ａや「／」マーク３１ｂが付加された状態）がそのまま保持され、次に同じコンテンツ画面２が表示されたときも、各「要素」のカラーセレクタのカラーパレットの状態はそのまま保持される。このとき、いずれのカラーセレクタの「クリア」ボタン２３も押下操作されなければ、この各「要素」のカラーセレクタのカラーパレットの状態は、変化しない。
【００９７】
けれども、いずれかの「要素」のカラーセレクタの「クリア」ボタン２３が押下操作されると、これに応じて、他の「要素」のカラーセレクタのカラーパレットでは、上記のように、適用される輝度コントラスト比に応じて、「×」マーク３１ａが設定されて選択禁止される色や使用を「／」マーク３１ｂが設定されて選択を勧めない色が変わることもあることになる。
【００９８】
図９に示す色カスタマイズ操作画面１７ａが表示される状態で（図３のステップＳ１０８）、色カスタマイズしたい「要素」があるが（図３のステップＳ１０９の“Ｙｅｓ”）、この「要素」のカスタマイズしたい色がこの「要素」のカラーセレクタのカラーパレットで選択可能な状態（「×」マーク３１ａや「／」マーク３１ｂが付加されていない状態）にあるときには（図３のステップＳ１１０の“Ｙｅｓ”）、このカラーパレットで、上記のように、希望する色を選択操作することにより、この「要素」がこの色で表示されるようになる（図３のステップＳ１１１）。
【００９９】
これに対し、このカラーパレットで希望する色が選択不可能な状態（「×」マーク３１ａが付加されている状態）や選択を勧めない状態（「／」マーク３１ｂが付加されている状態）にあるときには（図３のステップＳ１１０の“Ｎｏ”）、まず、このカラーパレットを有するカラーセレクタに該当する「要素」に接する他の「要素」のカラーセレクタで「クリア」ボタンを押圧して、その「要素」の色を設定解除し（図３のステップＳ１１２）、かかる状態でこのパレットで希望する色が選択可能になったか否かを判定し（図３のステップＳ１１０）、それでも、この希望する色が選択不能である場合には（図３のステップＳ１１０の“Ｎｏ”）、さらに、この他の「要素」に接するさらに他の「要素」のカラーセれクタで「クリア」ボタン２３を押下する（図３のステップＳ１１２）。かかる処理が順次行なわれて上記の希望する色に対して「×」マーク３１ａが解除され、選択可能となると（図３のステップＳ１１０の“Ｙｅｓ”）、この希望する色を選択することができるようになる（図３のステップＳ１１１）。従って、これにより、この「要素」の色をこの希望する色にカスタマイズできる（図３のステップＳ１１１）。
【０１００】
ここで、いま、図９に示す色カスタマイズ操作画面１７ａで、物品「期限変更」ボタン５2（図４）の「要素」である「文字」５ａ（図４）の色をカスタマイズしたいが、この「文字」５ａに対するカラーセレクタ１９ａのカラーパレット２９ｃ（図１０（ａ））で、このカスタマイズしようとする色にカスタマイズを不可とする「×」マーク３１ａが付加されているとすると、「期限変更」ボタン５2の「文字」５ａに接するこの「期限変更」ボタン５2の「背景」５ｂのカラーセレクタ１９ｂの「クリア」ボタン２３を押下操作することにより、このカラーセレクタ１９ｂで設定されているグラデーションが解除されることになり、これにより、「期限変更」ボタン５2の「文字」５ａに対するカラーセレクタ１９ａでカスタマイズしたい色が、その「×」マーク３１ａが解除されて、選択可能となったとすると、この色を選択することができることになる。
【０１０１】
そこで、カーソル１１の操作により、このカラーパレット２９ｃから希望する色を選択することにより、コンテンツ画面２（図６）で選択された「期限変更」ボタン５2の文字５ａがこの色で表示されることになるが、このことが、プレビューエリア２４での押下部品エリア１６で表わされ、この部品エリア１６での該当する「要素」である「期限変更」ボタン５2の文字５ａがこの選択された色で表現される。
【０１０２】
ところで、このとき、例えば、「期限変更」ボタン５2の「要素」である「背景」５ｂのこれまでの色がそのカラーセレクタ１９ｂでのカラーパレット２９ｃで「×」マーク３１ａが付加されている状態となることもある。しかし、かかる状態はそのまま維持されることになり、カラーパレットでこの色に「×」マーク３１ａが付加されていることから、現在設定されている色は、「期限変更」ボタン５2の「文字」５ａに対して、相対コントラスト比を満たしていない色であることが示されることになる。
【０１０３】
なお、ある要素、例えば、「期限変更」ボタン５2の「背景」５ｂに対し、上記のように、「クリア」ボタン２３を押下した後、所望とする色を選択した結果、「期限変更」ボタン５2の「文字」５ａで現在設定されている色が、これに対して「×」マーク３１ａが付加されて選択不能な色となった場合には、上記のように処理がなされない場合には、そのままかかる状態が維持されることになる。この場合も、カラーセレクタ１９ａのカラーパレットでこの色に「×」マーク３１ａが付加されることになるので、この色が選択不能な色であることを確認できる。 なお、図９に示す色カスタマイズ操作画面１７ａで、「全クリア」ボタン２８が指定操作されると、この色カスタマイズ操作画面１７ａで表示されている全てのカラーセレクタ１９／２０（即ち、ここでは、カラーセレクタ１９ａ〜１９ｃ，２０ａ〜２０ｃの全て）で、設定されている色が解除され、これらに対する「期限変更」ボタン５2やレイアウト６の色が消去されるとともに（従って、「色表示」欄２１（図１０）で色も表示されなくなる）、それらのカラーパレットでの「×」マーク３１ａや「／」マーク３１ｂが付加されない状態となる。
【０１０４】
かかる状態で、例えば、カラーセレクタ１９ａのカラーパレット２９ｃで「ボタンの文字」の文字色を選択すると、「期限変更」ボタン５2の「文字」５ａの色が設定され、これとともに、他のカラーセレクタ１９ｂ，１９ｃ，２０ａ〜２０ｃでのカラーパレット２９ｃ，３０ｃで、上記のようにして、選択できない色に「×」マーク３１ａが、選択を勧めない色に「／」マーク３１ｂが夫々付加されることになる。これにより、夫々のカラーパレット２９ｃ，３０ｃでは、上記の色を指定することが可能となる（図３のステップＳ１１０の“Ｙｅｓ”）。
【０１０５】
ここで、部品「期間変更」ボタンの１つの要素である「ボタンの文字」５ａの色が設定されると、色カスタマイズ操作画面１７ａに表示されている全てのカラーセレクタのカラーパレットにおいて、選択できない色に「×」マーク３１ａが、選択を進めない色に「／」マーク３１ｂが夫々付加される即ち、「ボタンの文字」５ｂの色が設定されると、これに接する「ボタンの背景」５ｂについて選択できない色が計算可能となるため、対象となる色に「×」マーク３１ａが付加される。「ボタンの文字」５ｂについて選択可能な色が決まると、これに接する「ボタンの枠線」５ｃについて選択を勧めない色が計算可能となるため、対象となる色に「／」マーク３１ｂが付加される。このように、接する「要素」順に順次計算を行なうことにより、１つの色が設定されると、全てのカラーパレットにおいて、「×」マーク３１ａ及び「／」マーク３１ｂを夫々付加することが可能となる。ここで、例えば、「ボタンの背景」５ｂについて選択可能な色の中からどの色を選択するかによって、「ボタンの枠線」５ｃにおける選択を勧めない色が変わる場合がある。この実施形態では、「ボタンの背景」５ｂでどの色を選択した場合にも、「ボタンの枠線」５ｃの色として、「選択を勧めない色」に該当するものにのみ選択を勧めない「／」マーク３１ｂを付加するものとする。
【０１０６】
図１２は「単色」タブ２９を用いて「期限変更」ボタン５2の「文字」５ａの色を設定する操作を示しているが、図１３は、「単色」タブ２９が選択されたカラーセレクタ１９ｃで、「期限変更」ボタン５2の「枠線」５ｃの色を設定する操作を示すものであり、図１４は、「単色」タブ２９が選択されたカラーセレクタ２０ｂで、レイアウト６の「背景」６ａの色を設定する操作を示すものである。いずれも、上記の「期限変更」ボタン５2の「文字」５ａの色設定操作と同様、「単色」タブ２９のカラーパレット２９ｃで色選択操作をすることにより、それら「要素」の色を決めることができる。そして、このように色カスタマイズされた「要素」には、プレビューエリア２４の押下部品エリア１６において、該当する色で色付けされる。
【０１０７】
なお、図１３，図１４では、図１２に対応する部分には同一符号を付けて重複する説明を省略するが、いずれの図面においても、説明の対象となる部分にのみ符号を付している。
【０１０８】
図１５は色カスタマイズ操作画面１７ａでのグラデーション設定部の調整操作例を示す図であって、前出図面に対応する部分には同一符号を付けて重複する説明を省略する。なお、図１５では、説明に必要な部分にのみ符号を付けている。
【０１０９】
同図において、「グラデーション」タブ３０でのグラデーション設定部３０ｆにおける色相／濃度指示マーク３０ｆ4を取り除くことができる。このためには、この色相／濃度指示マーク３０ｆ4をカーソル１１で指示し、カラーセレクタのエリア外にドラッグアンドドロップをすればよく、これにより、この色相／濃度指示マーク３０ｆ4がグラデーション設定部３０ｆ外の位置に置かれることになる。この状態では、この色相／濃度指示マーク３０ｆ4はグラデーション設定部３０ｆに対して機能することができず、このときのグラデーション設定部３０ｆに対しては機能しない。従って、グラデーションバー３０ｆ1では、その端部マーク３０ｆ2側の色から端部マーク３０ｆ3側の色へのグラデーションが表示されることになる。
【０１１０】
除かれたこの色相／濃度指示マーク３０ｆ4を追加して再度使用する場合には、グラテーション設定部３０ｆのグラデーションバー３０ｆ1の近くでダブルクリックすることにより、このグラデーションバー３０ｆ1の下側で、かつクリックした地点に一番近い位置に新たに色相／濃度指示マーク３０ｆ4が追加されることになる。
【０１１１】
図１６は図１５に示す色カスタマイズ操作画面１７ａでのグラテーション操作の一具体例を示す図であって、同図（ａ）はグラデーションバー３０ｆ1の一方の端部側の色の設定操作を示し、同図（ｂ）はグラデーションバー３０ｆ1の他方の端部側の色の設定操作を示すものであり、前出図面に対応する部分には同一符号を付けて重複する説明を省略する。なお、図１５では、説明に必要な部分にのみ符号を付けている。
【０１１２】
図１６（ａ）において、「グラデーション」タブ３０でのグラデーション設定部３０ｆにおけるグラデーションバー３０ｆ1の一方の端部側の端部マーク３０ｆ3をカーソル１１でクリック操作し、次いで、カラーパレット３０ｃで所望の色を指定すると、このグラデーションバー３０ｆ1の端部マーク３０ｆ3側の端部の色が設定される。
【０１１３】
次に、図１６（ｂ）において、このグラデーション設定部３０ｆにおけるグラデーションバー３０ｆ1の他方の端部側の端部マーク３０ｆ2をカーソル１１でクリック操作し、次いで、カラーパレット３０ｃで所望の色を指定すると、このグラデーションバー３０ｆ1の端部マーク３０ｆ2側の端部の色が設定される。
【０１１４】
これにより、グラデーションバー３０ｆ1でその一方の端部で設定された色から他方の端部で設定された色までのグラデーションが設定されたことになる。これとともに、このカラーセレクタ１９ｂでの「選択色表示」欄２１の設定色表示部２１ａに、この設定されたグラデーションが表示される。
【０１１５】
なお、「単色」タブ２９や「グラテーション」タブ３０での以上の色やグラデーションの設定は、図３でのステップＳ１１１で行なわれる。
【０１１６】
ところで、図９に示す色カスタマイズ操作画面１７ａにおいて、上記のように、プレビューエリア２４に、カラーセレクタ表示画面１８の操作で色カスタマイズされる「部品」を表わす押下部品エリア１６が表示され、この押下部品エリア１６に表示される「部品」が色カスタマイズの対象部品となる。
【０１１７】
かかる図９に示す色カスタマイズ操作画面１７ａにおいて、カーソル１１をプレビューエリア２４内の押下部品エリア１６内に移動させ、図１７に示すように（なお、図１７において、図９に対応する部分には同一符号を付けて重複する説明を省略する。但し、図１７では、必要な部分にのみ符号を付けている）、図示しないマウスを用いることによってドラッグしてこのカーソル１１を所定の方向に移動させると、レビューエリア２４内に表示されるコンテンツ画面２（図４）がその方向に移動する。このときには、押下部品エリア１６は位置が固定されている。このため、コンテンツ画面２でのこの押下部品エリア１６内に表示されているエリア（コンテンツ画面２での押下部品エリア１６内でプレビューされる部分）が変化する。これにより、コンテンツ画面２での押下部品エリア１６でプレビューされるエリアを変更させることができ、色カスタマイズの対象となる「部品」以外のエリアの表示内容を閲覧することができる。
【０１１８】
なお、プレビューエリア２４の任意の位置をキーボードでフォーカスし、キーボードの十字キーを操作することにより、コンテンツ画面２を移動させることもでき、これにより、コンテンツ画面２での押下部品エリア１６内に位置するエリアを変更させることもできる。これによっても、上記と同様、コンテンツ画面２での押下部品エリア１６でプレビューされるエリアを変更させることができる。
【０１１９】
また、上記のように、コンテンツ画面２でのプレビューされるエリアを変化させるカーソル１１の機能は、このカーソル１１がプレビューエリア２４にあるときに実行されるものであり、カーソル１１がプレビューエリア２４外に移動すると、もはやドラッグ操作によっては、プレビューエリア２４でのコンタンツ画面２は移動しない。従って、このコンテンツ画面２を大きく移動させてこのコンテンツ画面２で大きく離れた他の「部品」をプレビューの対象とするためには、カーソル１１をプレビューエリア２４内で大きく移動させた後、カーソル１１を押下部品エリア１６内の元の位置に戻し、再度ドラッグして同じ方向にカーソル１１を移動させる操作を繰り返せばよい。
【０１２０】
図９に示す色カスタマイズ操作画面１７ａでの色カスタマイズを必要とする全ての「要素」の色カスタマイズ操作が終了して、色カスタマイズ操作が必要な「要素」がなくなり、プレビューエリア２４での押下部品エリア１６で押下した部品である「期限変更」ボタン５2で色カスタマイズの結果が確認されて（図３のステップＳ１０９の“Ｎｏ”）、図１８に示すように、色カスタマイズ操作画面１７ａで「ＯＫ」ボタン２６が押下されると（図３のステップＳ１１３）、元のコンテンツ画面２に重なって色カスタマイズの対象となる「部品」を選択するための選択画面が表示される。
【０１２１】
図１９はかかる選択画面の一具体例を示す図であって、３２は選択画面、３３はテキスト、３４は「はい」ボタン、３５は「いいえ」ボタンである。
【０１２２】
同図において、コンテンツ画面２は透けて見える状態で表示されており、この透けて見えるコンテンツ画面２上に重ねて選択画面３２が表示される。
【０１２３】
この選択画面３２では、例えば、「同じレイアウト部品に乗っている同じ種類の部品は全て同じ色にしますか？」ということを指示したテキスト３３が表示され、この指示に従う場合に操作する「はい」ボタン３４と、指示に従わないときに操作する「いいえ」ボタン３５が設けられている。
【０１２４】
「はい」ボタン３４が押下操作されたときには（図３のステップＳ１１４の“Ｙｅｓ”）、図６に示すコンテンツ画面２でカーソル１１によって選択された「部品」（この場合では、「期間変更」ボタン５2）やそれに接する部品（ここでは、レイアウト６）とともに、このレイアウト６に接している他の「部品」（即ち、レイアウト６）に重なっているこの選択された「部品」と同じ種類の「部品」（この場合では、「重要度変更」ボタン５1や「担当者変更」ボタン５3，「ステータス変更」ボタン５4など）の各「要素」も、指定された「部品」の「要素」と同じ色に色カスタマイズされる（図３のステップＳ１１５）。しかる後、色カスタマイズ処理が終了する。
【０１２５】
また、「いいえ」ボタン３５が押下操作されたときには（図３のステップＳ１１４の“Ｎｏ”）、図６に示すコンテンツ画面２でカーソル１１によって選択された「部品」（即ち、「期間変更」ボタン５2）とこれに接する部品（ここでは、レイアウト６）とが色カスタマイズされる（図３のステップＳ１１６）。しかる後、色カスタマイズ処理が終了する。
【０１２６】
なお、図１９に示す選択画面３２に表示されるテキスト３３としては、上記のものに限定されるものではなく、例えば、「同種類の部品は全て同じ色に変えますか？」といったテキスト３３を表示し、「はい」ボタン３４が押下操作されたときには（図３のステップＳ１１４の“Ｙｅｓ”）、図６に示すコンテンツ画面２でカーソル１１によって選択された「部品」（即ち、「期間変更」ボタン５2）及びこれと同じ種類の部品（即ち、操作ボタンの全て）を同じ色に色カスタマイズしたり、「同種類のレイアウト部品で、かつ色が同じものに置かれている同種類の部品は全て同じ色に変更しますか？」といったテキスト３３を表示し、「はい」ボタン３４が押下操作されたときには（図３のステップＳ１１４の“Ｙｅｓ”）、これを満足する部品を設定された同じ色に色カスタマイズしたりすることができ、色カスタマイズする部品を適宜決めるようにすることができる。
【０１２７】
以上のようにして、図６に示すように、色カスタマイズモードに設定して色カスタマイズを希望する「部品」を選択することにより、いずれの「部品」も、希望する色にカスタマイズすることができる。但し、レイアウト６など多くの「部品」と重なったり、接したりして複数の部品に関連する場合には、これら関連する「部品」に応じて、カスタマイズする色が制限される「部品」もある。
【０１２８】
即ち、図１９に示す選択画面３２で「いいえ」ボタン３５が押下されると、上記の指定した操作ボタン５、上記の例では、「期間変更」ボタン５2とこれが重なっているレイアウト６とが夫々指定された色にカスタマイズされるが、さらに、他の操作ボタン５、例えば、「担当者変更」ボタン５3を色カスタマイズする場合には、同様にして、この「担当者変更」ボタン５3に対して、図８に示す色カスタマイズ操作画面１７が表示されるが、この「担当者変更」ボタン５3に該当するカラーセレクタ１９ａ〜１９ｃのみを選択することにより、既に色カスタマイズされたレイアウト６の色を誤って変化させるようなことなく、「担当者変更」ボタン５3のみを色カスタマイズすることができる。但し、この場合には、この「担当者変更」ボタン５3に対してカラーセレクタ１９ａ〜１９ｃが展開された図９に示すような色カスタマイズ操作画面１７ａでは（この場合、レイアウト６のカラーセレクタ２０ａ〜２０ｃは展開されていない）、色カスタマイズされたレイアウト６に影響されて、カラーセレクタ１９ａ〜１９ｃのカラーパレットにおいて、「／」マーク３１ｂや「×」マーク３１ａが付加された色があり、使用する色に制限が加わることになる。
【０１２９】
ところで、以上では、図４に示すコンテンツ画面２で「色カスタマイズモード設定」ボタン３が押下操作されて色カスタマイズモードが設定されたとき、このコンテンツ画面２で１つの「部品」（ここでは、「期限変更」ボタン５２）が色カスタマイズする対象として選択されたものであるが、この実施形態では、複数の部品を色カスタマイズの対象として選択するようにすることもできる。以下、これについて説明する。
【０１３０】
先に説明したように、図４に示すコンテンツ画面２で「色カスタマイズモード設定」ボタン３が押下操作され、色カスタマイズモードが指定されると（図３のステップＳ１０１）、図５に示す選択画面１２が透けて見えた状態のコンテンツ画面２上に表示され、この選択画面１２で「ＯＫ」ボタン１４が押下操作されると、図６に示すコンテンツ画面２が表示される。このコンテンツ画面２でのカーソル操作により、同時に色カスタマイズ対象とする複数の部品を指定操作することが可能となる。
【０１３１】
図２０はコンテンツ画面２でのかかる複数の部品を同時に色カスタマイズ対象とするための操作を示す図であって、３６はカーソル、３７はドラッグエリアであり、前出図面に対応する部分には同一符号を付けて重複する説明を省略する。但し、図２０では、説明に必要な部分についてのみ部号を付している。
【０１３２】
図５に示す選択画面１２で「ＯＫ」ボタン１４が押下操作されることによって表示される図６に示すコンテンツ画面２で、カーソル１１を色カスタマイズしたい「部品」の近傍位置に移動させ、その位置でクリック操作すると、図２０に示すように、この手形のカーソル１１が矢印状のカーソル３６に代わり、その位置からこのカーソル３６をドラッグすると、その位置を起点として、この起点とカーソル３６の現位置とを対向する２つの角部とする矩形状のドラッグエリア３７が形成される。
【０１３３】
このドラッグエリア３７がこのコンテンツ画面２での色カスタマイズの対象としたい複数の「部品」を含むように、カーソル３７をドラッグ操作する（図３のステップＳ１０２，Ｓ１１７）。そして、ドラッグ操作を終了し、このドラッグエリア３７が決まると、色カスタマイズ操作画面が表示されるとともに、このドラックエリア３７に含まれる「部品」毎に、当該「部品」の上に他の「部品」が重ねられているか否かを判定する（図３のステップＳ１１８）。当該「部品」の上に他の「部品」が重なっている場合には（図３のステップＳ１１８の“Ｙｅｓ”）、当該「部品」の各「要素」のカラーセレクタと当該「部品」上に重なっている他の「部品」の各「要素」のカラーセレクタとをこの色カスタマイズ操作画面に表示し（図３のステップＳ１１９）、当該「部品」の上に他の「部品」が重なっていない場合には（図３のステップＳ１１８の“Ｎｏ”）、当該「部品」の各「要素」のカラーセレクタと当該「部品」の下に置かれている他の「部品」の各「要素」のカラーセレクタとをこの色カスタマイズ操作画面に表示する（図３のステップＳ１２０）。かかる処理がドラッグエリア３７内の「部品」毎に順次行なわれ（図３のステップＳ１２１の“Ｎｏ”）、かかる処理がドラッグエリア３７内の全ての「部品」について行なわれると（図３のステップＳ１２１の“Ｙｅｓ”）、図２１に示すように、ドラッグエリア３７内の全ての「部品」について、その「要素」のカラーセレクタが設けられた色カスタマイズ操作画面３８が表示される。
【０１３４】
なお、図２１において、１９1〜１９3はカラーセレクタ表示エリアであり、前出図面に対応する部分には同一符号を付けて重複する説明を省略する。但し、図２１においては、説明に必要な部分にのみ符号を付け、他の部分の符号は省略している。
【０１３５】
ここでは、図２０に示すコンテンツ画面２において、ドラッグエリア３７に含まれる「部品」としては、「重要度変更」ボタン５1と「期限変更」ボタン５2と「担当者変更」ボタン５3と、これらが重なって表示されるレイアウト６としており、これに対し、図２１に示す色カスタマイズ操作画面３８では、これら「部品」毎にカラーセレクタ表示エリア１９／２０が設けられている。
【０１３６】
カラーセレクタ表示エリア１９1には、図２０での部品「重要度変更」ボタン５1の要素「文字」の文字色に対するカラーセレクタ１９ａと、同じく要素「背景」の背景色に対するカラーセレクタ１９ｂと、同じく要素「枠線」の枠線色に対するカラーセレクタ１９ｃとが設けられ、カラーセレクタ表示エリア１９2には、図２０での部品「期限変更」ボタン５2の要素「文字」の文字色に対するカラーセレクタ１９ａと、同じく要素「背景」の背景色に対するカラーセレクタ１９ｂと、同じく要素「枠線」の枠線色に対するカラーセレクタ１９ｃとが設けられ、カラーセレクタ表示エリア１９3には、図２０での部品「担当者変更」ボタン５3の要素「文字」の文字色に対するカラーセレクタ１９ａと、同じく要素「背景」の背景色に対するカラーセレクタ１９ｂと、同じく要素「枠線」の枠線色に対するカラーセレクタ１９ｃとが設けられている。
【０１３７】
これらカラーセレクタ１９ａ〜１９ｃは、図８におけるカラーセレクタ１９ａ〜１９ｃと同じ機能を備えている。また、各セレクタ表示エリア１９では、「部品」が有していない「要素」のカラーセレクタは表示されない。例えば、部品「担当者変更」ボタン５3（図２０）には、枠線がない場合には、カラーセレクタ表示エリア１９3では、枠線色に対するカラーセレクタ１９ｃが設けられない。
【０１３８】
また、カラーセレクタ表示エリア２０には、図２０での「部品」であるレイアウト６の要素「文字」の文字色に対するカラーセレクタ２０ａと、同じく要素「背景」の背景色に対するカラーセレクタ２０ｂと、同じく要素「枠線」の枠線色に対するカラーセレクタ２０ｃとが設けられており、このカラーセレクタ２０ａ〜２０ｃは図８におけるカラーセレクタ２０ａ〜２０ｃと同じ機能を有している。このカラーセレクタ表示エリア２０でも、レイアウト６が有していない「要素」のカラーセレクタは表示されない。例えば、レイアウト３（図２０）には、文字がない場合には、カラーセレクタ表示エリア２０では、文字色に対するカラーセレクタ２０ａが設けられない。
【０１３９】
なお、図２０におけるレイアウト６は、操作ボタン５1〜５3に共通のものであるから、即ち、これら操作ボタン５1〜５3は同じレイアウト６に重ねて表示されているものであるから、図２１に示す色カスタマイズ操作画面３８では、このレイアウト６のカラーセレクタ表示エリア２０は１つであって、これら操作ボタン５1〜５3のカラーセレクタ１９ａ〜１９ｃの後に配置されて設けられている。
【０１４０】
これに対し、操作ボタン５1〜５3に対するレイアウトが異なる場合には、それらのレイアウトのカラーセレクタ表示エリア２０はこれに関係する「部品」（ここでは、操作ボタン）のすぐ後に配置される。例えば、「重要度変更」ボタン５1と「期限変更」ボタン５2とが同じレイアウト６1に重なって表示され、「担当者変更」ボタン５3が別のレイアウト６2に重なって表示されているものとすると、図２１に示す色カスタマイズ操作画面３８では、「重要度変更」ボタン５1と「期限変更」ボタン５2とのカラーセレクタ表示エリア１９1，１９2の次にレイアウト６1のカラーセレクタ表示エリア２０1が配置され、「担当者変更」ボタン５3のカラーセレクタ表示エリア１９3の次にレイアウト６2のカラーセレクタ表示エリア２０2が配置される。
【０１４１】
このように、複数の「部品」とこれが重なって表示されている他の部品とのカラーセレクタ表示エリア／１９，２０との配置関係が設定されていることにより、これら「部品」とこれが重なって表示される他の「部品」とのコンテンツ画面２での関係を色カスタマイズ操作画面３８でも確認することができ、それら「部品」のカスタマイズする色の選択が容易となる。
【０１４２】
図２１に示す色カスタマイズ操作画面３８では、カラーセレクタ表示エリア１９1〜１９3で「要素」のカラーセレクタ１９ａ〜１９ｃのいずれかやカラーセレクタ表示エリア２０で「要素」のカラーセレクタ２０ａ〜２０ｃのいずれかを選択することにより、図８に示す色カスタマイズ操作画面１７と同様、図３のステップＳ１０７〜Ｓ１１６の処理が行なわれ、各「部品」での選択した「要素」の色カスタマイズが行なわれることになる。
【０１４３】
以上のように、複数の「部品」を同時に色カスタマイズの対象として指定することができ、同じ色カスタマイズ操作画面で夫々の「部品」の「要素」を所望とする色に、ユーザが視認し易い状態で、カスタマイズすることが可能となる。
【符号の説明】
【０１４４】
１ 表示画面
２ コンテンツ画面
３ 「色カスタマイズモード設定」ボタン
４ コンテンツデータ表示エリア
５ 操作ボタン
５1 「重要度変更」ボタン
５2 「期限変更」ボタン
５3 「担当者変更」ボタン
５4 「ステータス変更」ボタン
５5 プルダウンメニュー
５ａ ボタンの文字
５ｂ ボタンの背景
５ｃ ボタンの枠線
６ レイアウト（背景）
６ａ，６ｂ 文字
７ タブパネル
７ａ タブパネルの文字
７ｂ タブパネルの背景
８ テキスト
９ チェックボックス
１０ テキスボックス
１１ カーソル
１２ 選択画面
１３ テキスト
１４ 「ＯＫ」ボタン
１５ 「キャンセル」ボタン
１６ 押下部品エリア
１７，１７ａ 色カスタマイズ操作画面
１８ カラーセレクタ表示画面
１９，１９1〜１９3 「ボタン」のカラーセレクタ表示エリア
１９ａ〜１９ｃ カラーセレクタ
２０ 「レイアウト」のカラーセレクタ表示エリア
２０ａ〜２０ｃ カラーセレクタ
２１ 「選択色表示」欄
２１ａ 設定色表示部
２１ｂ 設定グラデーション表示部
２２ 「選択色の候補表示」ボタン
２３ 「クリア」ボタン
２４ プレビューエリア
２５ スクロール操作部
２６ 「ＯＫ」ボタン
２７ 「キャンセル」ボタン
２８ 「全クリア」ボタン
２９ 「単色」タブ
２９ａ 不透明度指定部
２９ｂ 色相表示欄
２９ｃ カラーパレット
２９ｄ1 色相指定部
２９ｄ2 濃度指定部
２９ｅ1，２９ｅ2 スライダ
３０ 「グラデーション」タブ
３０ａ 不透明度表示欄
３０ｂ 色種別欄
３０ｃ カラーパレット
３０ｄ1 色相指定部
３０ｄ2 濃度指定部
３０ｅ1，３０ｅ2 スライダ
３０ｆ グラデーション設定部
３０ｆ1 グラデーションバー
３０ｆ2，３０ｆ3 端部マーク
３０ｆ4 色相／濃度指示マーク
３０ｇ グラデーション方向設定欄
３１ａ 「×」マーク
３１ｂ 「／」マーク
３２ 選択画面
３３ テキスト
３４ 「 い」ボタン
３５ 「いいえ」ボタン
３６ カーソル
３７ ドラッグエリア
３８ 色カスタマイズ操作画面
【特許請求の範囲】
【請求項１】
コンテンツ画面で表示される部品の色の選択を支援するコンテンツ画面の色カスタマイズ方法であって、
該コンテンツ画面で色の選択の対象となる部品の指定とともに、色カスタマイズ操作画面が表示され、
該色カスタマイズ操作画面で、指定された該部品を構成する要素毎に、色選択用のカラーパレットが表示されるとともに、指定された該部品に接する他の部品を構成する要素毎に、色選択用のカラーパレットが表示され、
該カラーパレットで所望とする色を選択することにより、選択された該部品と該他の部品との該要素夫々を選択された該色で表示する
ことを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項２】
請求項１において、
前記部品は、前記要素としての文字と背景とから構成され、さらに、必要に応じて、枠線を前記要素として有することを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項３】
請求項２において、
前記要素としての文字と背景に対する前記カラーパレットのいずれか一方では、該文字と該背景との輝度コントラスト比が第１の比率未満となる色を選択不能な色として、該色に選択することができないことを示す色であることを示すマークを付し、
前記要素としての文字以外の２つの前記要素夫々に対する前記カラーパレットのいずれか一方では、これら要素での輝度コントラスト比が第２の比率未満となる色を選択を勧めない色として、該色に選択を勧めない色であることを示すマークを付する
ことを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項４】
請求項３において、
前記第１の比率は４．５：１であり、前記第２の比率は１．７：１であることを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項５】
請求項１〜４のいずれか１つにおいて、
前記指定された部品は、指定されたドラッグエリアに含まれる複数の部品であって、該ドラッグエリア内の該部品毎に、該部品を構成する要素夫々の前記色選択用のカラーパレットが表示されることを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項６】
請求項１〜５のいずれか１つにおいて、
前記他の部品は、前記指定された部品が重なって表示される部品であることを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項７】
請求項１〜６のいずれか１つにおいて、
前記コンテンツ画面で指定された前記部品を含む選択部品エリアが、前記色カスタマイズ操作画面で設定されているプレビューエリアに表示されることを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項１】
コンテンツ画面で表示される部品の色の選択を支援するコンテンツ画面の色カスタマイズ方法であって、
該コンテンツ画面で色の選択の対象となる部品の指定とともに、色カスタマイズ操作画面が表示され、
該色カスタマイズ操作画面で、指定された該部品を構成する要素毎に、色選択用のカラーパレットが表示されるとともに、指定された該部品に接する他の部品を構成する要素毎に、色選択用のカラーパレットが表示され、
該カラーパレットで所望とする色を選択することにより、選択された該部品と該他の部品との該要素夫々を選択された該色で表示する
ことを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項２】
請求項１において、
前記部品は、前記要素としての文字と背景とから構成され、さらに、必要に応じて、枠線を前記要素として有することを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項３】
請求項２において、
前記要素としての文字と背景に対する前記カラーパレットのいずれか一方では、該文字と該背景との輝度コントラスト比が第１の比率未満となる色を選択不能な色として、該色に選択することができないことを示す色であることを示すマークを付し、
前記要素としての文字以外の２つの前記要素夫々に対する前記カラーパレットのいずれか一方では、これら要素での輝度コントラスト比が第２の比率未満となる色を選択を勧めない色として、該色に選択を勧めない色であることを示すマークを付する
ことを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項４】
請求項３において、
前記第１の比率は４．５：１であり、前記第２の比率は１．７：１であることを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項５】
請求項１〜４のいずれか１つにおいて、
前記指定された部品は、指定されたドラッグエリアに含まれる複数の部品であって、該ドラッグエリア内の該部品毎に、該部品を構成する要素夫々の前記色選択用のカラーパレットが表示されることを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項６】
請求項１〜５のいずれか１つにおいて、
前記他の部品は、前記指定された部品が重なって表示される部品であることを特徴とするコンテンツ画面の色カスタマイズ方法。
【請求項７】
請求項１〜６のいずれか１つにおいて、
前記コンテンツ画面で指定された前記部品を含む選択部品エリアが、前記色カスタマイズ操作画面で設定されているプレビューエリアに表示されることを特徴とするコンテンツ画面の色カスタマイズ方法。
【図２】
【図３】
【図１】
【図４】
【図５】
【図６】
【図７】
【図８】
【図９】
【図１０】
【図１１】
【図１２】
【図１３】
【図１４】
【図１５】
【図１６（ａ）】
【図１６（ｂ）】
【図１７】
【図１８】
【図１９】
【図２０】
【図２１】
【図３】
【図１】
【図４】
【図５】
【図６】
【図７】
【図８】
【図９】
【図１０】
【図１１】
【図１２】
【図１３】
【図１４】
【図１５】
【図１６（ａ）】
【図１６（ｂ）】
【図１７】
【図１８】
【図１９】
【図２０】
【図２１】
【公開番号】特開２０１１−７６４５５（Ｐ２０１１−７６４５５Ａ）
【公開日】平成２３年４月１４日（２０１１．４．１４）
【国際特許分類】
【出願番号】特願２００９−２２８５５３（Ｐ２００９−２２８５５３）
【出願日】平成２１年９月３０日（２００９．９．３０）
【出願人】（０００００５１０８）株式会社日立製作所 (27,607)
【Ｆターム（参考）】
【公開日】平成２３年４月１４日（２０１１．４．１４）
【国際特許分類】
【出願日】平成２１年９月３０日（２００９．９．３０）
【出願人】（０００００５１０８）株式会社日立製作所 (27,607)
【Ｆターム（参考）】
[ Back to top ]