特許 7505931 コンピュータプログラム

(19)【発行国】日本国特許庁(JP)

(12)【公報種別】特許公報(B2)

(11)【特許番号】

(24)【登録日】2024-06-17

(45)【発行日】2024-06-25

(54)【発明の名称】コンピュータプログラム

(51)【国際特許分類】

   G06F 3/0485 20220101AFI20240618BHJP

   G06F 3/0481 20220101ALI20240618BHJP

   G06F 3/04886 20220101ALI20240618BHJP

   G09G 5/10 20060101ALI20240618BHJP

   G09G 5/14 20060101ALI20240618BHJP

   G09G 5/22 20060101ALI20240618BHJP

   G09G 5/34 20060101ALI20240618BHJP

   G09G 5/373 20060101ALI20240618BHJP

【ＦＩ】

G06F3/0485

G06F3/0481

G06F3/04886

G09G5/10 Z

G09G5/14 A

G09G5/22 630G

G09G5/34 Z

G09G5/373 200

【請求項の数】 4

(21)【出願番号】P 2020115967

(22)【出願日】2020-07-03

(65)【公開番号】P2022013425

(43)【公開日】2022-01-18

【審査請求日】2023-07-03

(73)【特許権者】

【識別番号】000155469

【氏名又は名称】株式会社野村総合研究所

(74)【代理人】

【識別番号】110003281

【氏名又は名称】弁理士法人大塚国際特許事務所

(74)【代理人】

【識別番号】100076428

【弁理士】

【氏名又は名称】大塚 康徳

(74)【代理人】

【識別番号】100115071

【弁理士】

【氏名又は名称】大塚 康弘

(74)【代理人】

【識別番号】100112508

【弁理士】

【氏名又は名称】高柳 司郎

(74)【代理人】

【識別番号】100116894

【弁理士】

【氏名又は名称】木村 秀二

(74)【代理人】

【識別番号】100130409

【弁理士】

【氏名又は名称】下山 治

(74)【代理人】

【識別番号】100134175

【弁理士】

【氏名又は名称】永川 行光

(74)【代理人】

【識別番号】100199277

【弁理士】

【氏名又は名称】西守 有人

(72)【発明者】

【氏名】太田 賢吾

(72)【発明者】

【氏名】横田 山都

【審査官】滝谷 亮一

(56)【参考文献】

【文献】How To Shrink The Divi Header Menu When Scrolling，2020年03月17日，[2024年1月17日検索], インターネット<https://www.youtube.com/watch?v=_SXMdYQx_Vg>

【文献】スクロールしても記事タイトルをずっと画面に固定表示するカスタマイズ(V3用)，2015年10月08日， [2024年1月17日検索], インターネット<https://web.archive.org/web/20151008001945/http://funcs.org/404>

【文献】あんざい ゆき，Ａｎｄｒｏｉｄ Ｐａｔｔｅｒｎ Ｃｏｏｋｂｏｏｋ ，初版，日本，株式会社インプレスジャパン，2014年03月21日，第235ページ

(58)【調査した分野】(Int.Cl.，ＤＢ名)

Ｇ０６Ｆ ３／０４８５

Ｇ０６Ｆ ３／０４８１

Ｇ０６Ｆ ３／０４８８６

Ｇ０９Ｇ ５／１０

Ｇ０９Ｇ ５／１４

Ｇ０９Ｇ ５／２２

Ｇ０９Ｇ ５／３４

Ｇ０９Ｇ ５／３７３

(57)【特許請求の範囲】

【請求項1】

ディスプレイを備える端末に、隣接する第１表示領域と第２表示領域とを含む画面を前記ディスプレイに表示させる機能を実現させるコンピュータプログラムであって、
前記第２表示領域は表示内容を前記第１表示領域の方へスクロール可能に構成され、
前記コンピュータプログラムは、
前記第２表示領域の表示内容のスクロール量がしきい値を超えることに応じて、前記第１表示領域の表示態様を第１態様から第２態様へ変更する機能、
をさらに前記端末に実現させ、
前記第１態様において、前記第１表示領域は、第１オブジェクトを含み、
前記第２態様において、前記第１表示領域は、前記第１オブジェクトと同じユーザ操作時の動作を提供する第２オブジェクトであって前記第１オブジェクトよりも小さい当該第２オブジェクト、及び、前記第２表示領域の表示内容に対応するテキストを含み、
前記第１態様における前記第１オブジェクトを前記第２態様における前記第２オブジェクトへ変更することにより生じるスペースが、前記テキストの表示のために使用可能である、
コンピュータプログラム。

【請求項2】

前記第１表示領域は、前記第１態様及び前記第２態様において、第３オブジェクトを含み、当該第３オブジェクトの表示態様は前記第２表示領域の表示内容のスクロール量に依らない、請求項１に記載のコンピュータプログラム。

【請求項3】

前記第１態様において、前記第１表示領域は、前記第２表示領域の表示内容の続きの表示内容を表示する第１状態と、前記第２表示領域の表示内容の続きの表示内容を前記第１状態よりも淡く表示する第２状態と、前記第２表示領域の表示内容の続きの表示内容が表示されない第３状態と、をとることができ、
前記コンピュータプログラムは、
前記第２表示領域の表示内容のスクロール量に応じて、前記第１表示領域がどの状態をとるかを決定する機能、
をさらに前記端末に実現させる、請求項１に記載のコンピュータプログラム。

【請求項4】

前記第１表示領域が前記第２状態にある場合、前記第２表示領域の表示内容のスクロール量に応じて、前記第１表示領域の表示の濃淡を変える機能、
をさらに前記端末に実現させる、請求項３に記載のコンピュータプログラム。

【発明の詳細な説明】

【技術分野】

【0001】

本発明は、コンピュータプログラムに関する。

【背景技術】

【0002】

情報を提供するためのユーザインタフェースが知られている（例えば、特許文献１参照）。

【先行技術文献】

【特許文献】

【0003】

【文献】特開２０１１－２０３９１４号公報

【発明の概要】

【発明が解決しようとする課題】

【0004】

ユーザに情報を提供し、ユーザと対話するためのより直観的で利便性の高いユーザインタフェースが望まれている。

【0005】

本発明はこうした課題に鑑みてなされたものであり、その目的は、ユーザに情報を提供し、ユーザと対話するためのより直観的で利便性の高いユーザインタフェースを実現できる技術の提供にある。

【課題を解決するための手段】

【0006】

本発明のある態様は、コンピュータプログラムに関する。このコンピュータプログラムは、ディスプレイを備える端末に、隣接する第１表示領域と第２表示領域とを含む画面を上記ディスプレイに表示させる機能を実現させる。上記第２表示領域は表示内容を上記第１表示領域の方へスクロール可能に構成される。上記コンピュータプログラムは、上記第２表示領域の表示内容のスクロール量がしきい値を超えることに応じて、上記第１表示領域の表示態様を第１態様から第２態様へ変更する機能、をさらに上記端末に実現させる。上記第１態様において、上記第１表示領域は、第１オブジェクトを含む。上記第２態様において、上記第１表示領域は、上記第１オブジェクトと同じユーザ操作時の動作を提供する第２オブジェクトであって上記第１オブジェクトよりも小さい当該第２オブジェクト、及び、上記第２表示領域の表示内容に対応するテキストを含む。上記第１態様における上記第１オブジェクトを上記第２態様における上記第２オブジェクトへ変更することにより生じるスペースが、上記テキストの表示のために使用可能である。

【0007】

なお、以上の構成要素の任意の組み合わせや、本発明の構成要素や表現を装置、方法、システム、コンピュータプログラムを格納した記録媒体などの間で相互に置換したものもまた、本発明の態様として有効である。

【発明の効果】

【0008】

本発明によれば、ユーザに情報を提供し、ユーザと対話するためのより直観的で利便性の高いユーザインタフェースを実現できる。

【図面の簡単な説明】

【0009】

【図1】実施の形態に係るアプリケーションプログラムがインストールされる携帯端末の模式図である。

【図2】図１の携帯端末のハードウエア構成図である。

【図3】携帯端末のディスプレイに表示される第１状態の情報表示画面の代表画面図である。

【図4】携帯端末のディスプレイに表示される第２状態の情報表示画面の代表画面図である。

【図5】携帯端末のディスプレイに表示される第３状態の情報表示画面の代表画面図である。

【図6】携帯端末のディスプレイに表示される第１状態の詳細情報表示画面の代表画面図である。

【図7】携帯端末のディスプレイに表示される第２状態の詳細情報表示画面の代表画面図である。

【図8】携帯端末のディスプレイに表示される第３状態の詳細情報表示画面の代表画面図である。

【図9】携帯端末のディスプレイに表示される第４状態の詳細情報表示画面の代表画面図である。

【図10】携帯端末のディスプレイに表示される第５状態の詳細情報表示画面の代表画面図である。

【図11】携帯端末のディスプレイに表示される第６状態の詳細情報表示画面の代表画面図である。

【図12】携帯端末のディスプレイに表示される第４状態の情報表示画面の代表画面図である。

【図13】携帯端末のディスプレイに表示されるお気に入り表示画面の代表画面図である。

【図14】携帯端末のディスプレイに表示される第５状態の情報表示画面の代表画面図である。

【発明を実施するための形態】

【0010】

以下、各図面に示される同一または同等の構成要素、部材、処理には、同一の符号を付するものとし、適宜重複した説明は省略する。また、各図面において説明上重要ではない部材の一部は省略して表示する。

【0011】

図１は、実施の形態に係るアプリケーションプログラムがインストールされる携帯端末１０の模式図である。携帯端末１０は例えばスマートフォンやタブレット型端末であり、ディスプレイ１８などの情報を表示する手段と、タッチパネルなどのユーザから入力を受け付ける手段と、を有する。

【0012】

携帯端末１０のユーザは、ダウンロードサイトからインターネットなどのネットワークを介して実施の形態に係るアプリケーションプログラム（以下、単にアプリと称す）を携帯端末１０にダウンロードし、インストールする。あるいはまた、アプリは携帯端末１０にプリインストールされていてもよい。アプリが携帯端末１０により実行されることにより、携帯端末１０は表示制御に係る各種機能を実現する。以下、携帯端末１０（のＣＰＵ（Ｃｅｎｔｒａｌ Ｐｒｏｃｅｓｓｉｎｇ Ｕｎｉｔ）等の処理ユニット）がアプリを実行することにより実現する機能を携帯端末１０の機能として説明する。それらの機能は実際はアプリが携帯端末１０に実現させる機能である。

【0013】

他の実施の形態ではアプリをインストールする代わりに、ブラウザが用いられる。他の実施の形態に係るコンピュータプログラムは、サーバから携帯端末１０のウェブブラウザにネットワークを介して送信され、そのウェブブラウザによって実行される、ＨＴＭＬ（Ｈｙｐｅｒｔｅｘｔ ｍａｒｋｕｐ ｌａｎｇｕａｇｅ）などのプログラミング言語により記述されたコンピュータプログラムである。このコンピュータプログラムは、本明細書で説明するアプリと同等の表示制御機能を有する。

【0014】

他の実施の形態では携帯端末の代わりに、デスクトップＰＣなどの据え置き型の端末が用いられる。他の実施の形態に係るコンピュータプログラムは据え置き型の端末にインストールされるか当該端末のブラウザによって実行される。

【0015】

図２は、図１の携帯端末１０のハードウエア構成図である。携帯端末１０は、メモリ１２と、プロセッサ１４と、通信インタフェース１６と、ディスプレイ１８と、入力インタフェース２０と、を含む。これらの要素はそれぞれバス２２に接続され、バス２２を介して互いに通信する。

【0016】

メモリ１２は、データやプログラムを記憶するための記憶領域である。データやプログラムは、メモリ１２に恒久的に記憶されてもよいし、一時的に記憶されてもよい。特にメモリ１２はアプリを記憶する。プロセッサ１４は、メモリ１２に記憶されているプログラム、特にアプリを実行することにより、携帯端末１０における各種機能を実現する。通信インタフェース１６は、携帯端末１０の外部との間でデータの送受信を行うためのインタフェースである。例えば、通信インタフェース１６は、携帯電話の無線通信網にアクセスするためのインタフェースや、無線ＬＡＮ（Ｌｏｃａｌ Ａｒｅａ Ｎｅｔｗｏｒｋ）にアクセスするためのインタフェース等を含む。また、通信インタフェース１６は、例えば、ＵＳＢ（Ｕｎｉｖｅｒｓａｌ Ｓｅｒｉａｌ Ｂｕｓ）等の有線ネットワークのインタフェースを含んでいてもよい。ディスプレイ１８は、各種情報を表示するためのデバイスであり、例えば、液晶ディスプレイや有機ＥＬ（Ｅｌｅｃｔｒｏｌｕｍｉｎｅｓｃｅｎｃｅ）ディスプレイなどである。入力インタフェース２０は、ユーザからの入力を受け付けるためのデバイスである。入力インタフェース２０は、例えば、ディスプレイ１８上に設けられたタッチパネルや、各種入力キー等を含む。

【0017】

（第１の表示制御例）
以下、アプリによる第１の表示制御例を、図３～図５を参照して説明する。
図３は、携帯端末１０のディスプレイ１８に表示される第１状態の情報表示画面１００の代表画面図である。情報表示画面１００は、トップバー領域１０２と、情報表示領域１０４と、表示切替領域１０６と、を有する。トップバー領域１０２と情報表示領域１０４とは隣接しており、情報表示領域１０４と表示切替領域１０６とは隣接している。情報表示領域１０４には任意の情報が表示され、当該情報表示領域１０４は表示内容をトップバー領域１０２の方へスクロール可能に構成される。本例では情報表示領域１０４は表示内容を上下方向にスクロール可能に構成される。情報表示領域１０４は表示内容の少なくとも一部を他の方向、例えば左右方向にもスクロール可能に構成されてもよい。情報表示領域１０４には様々な情報が表示されるが、特に表示される情報のタイトルを表すテキスト（または文字列）１１８を含む。図３の第１状態では、トップバー領域１０２と情報表示領域１０４との境界に線はなく、あたかもそれらが一続きであるかのように表示されている。

【0018】

トップバー領域１０２は、第１メニューオブジェクト１０８と、検索オブジェクト１１０と、を有する。第１メニューオブジェクト１０８は略角丸長方形状であり、中に「ｍｅｎｕ」の文字列とメニューを表す記号とを含む。検索オブジェクト１１０は一般的な虫眼鏡形状のオブジェクトである。第１メニューオブジェクト１０８がタップされると、アプリは、メニュー画面に遷移させるか、またはメニューを示すポップアップを表示させる。

【0019】

表示切替領域１０６は、探すオブジェクト１１２と、気になるオブジェクト１１４と、チケットオブジェクト１１６と、を有する。これらのオブジェクトはそれぞれ、タップされると、情報表示領域１０４の表示内容をそのタップされたオブジェクトに対応する表示内容に変えるまたは遷移させる。

【0020】

アプリが図３に示される第１状態の情報表示画面１００の情報表示領域１０４に対する上向きのスクロール操作を受け付けると、アプリは情報表示領域１０４の表示内容を上向きにスクロールさせて情報表示画面１００を第２状態（図４を参照して後述する）とする。アプリがそこからさらに上向きのスクロール操作を受け付けると、アプリは情報表示領域１０４の表示内容をさらに上向きにスクロールさせて情報表示画面１００を第３状態（図５を参照して後述する）とする。

【0021】

情報表示画面１００を第１状態から第２状態を経て第３状態へと変化させるスクロール操作は、一続きのスクロール操作であってもよいし、スクロールしていったん指を離し、またスクロールするといった離散的なスクロール操作の集合であってもよい。いずれにせよ、情報表示画面１００は、スクロール量に応じてその状態を変化させる。

【0022】

情報表示画面１００の状態の変化は可逆的である。すなわち、アプリが第３状態の情報表示画面１００の情報表示領域１０４に対する下向きのスクロール操作を受け付けると、アプリは情報表示領域１０４の表示内容を下向きにスクロールさせて情報表示画面１００を第２状態とする。アプリがそこからさらに下向きのスクロール操作を受け付けると、アプリは情報表示領域１０４の表示内容をさらに下向きにスクロールさせて情報表示画面１００を第１状態とする。

【0023】

スクロール量はスクロール位置と言ってもよく、情報表示領域１０４よりも大きなページを情報表示領域１０４にスクロール可能に表示させるときの、デフォルト表示位置（初期表示位置であってもよい）と現在の表示位置との差に対応する。スクロール量は、スクロールバーがある場合はそのバーの位置に対応する。本例ではデフォルト表示位置をページの先頭すなわち最上部とし、図３の第１状態の情報表示画面１００の情報表示領域１０４がスクロール量＝０、すなわちデフォルト表示位置に対応するものとする。図３の情報表示領域１０４に対して下向きにスクロール操作を行っても表示内容のスクロールは発生しない。

【0024】

図４は、携帯端末１０のディスプレイ１８に表示される第２状態の情報表示画面１００の代表画面図である。第２状態の情報表示画面１００では、トップバー領域１０２の第１メニューオブジェクト１０８および検索オブジェクト１１０の表示態様は第１状態と変わらないが、トップバー領域１０２と情報表示領域１０４との境界を示す直線１２０が表示される。直線１２０の表示は、スクロール量が第１しきい値を超えると開始される。第２状態の情報表示画面１００ではスクロールの結果、テキスト１１８の約上半分がトップバー領域１０２の下に入って見えなくなっている。

【0025】

図５は、携帯端末１０のディスプレイ１８に表示される第３状態の情報表示画面１００の代表画面図である。第３状態の情報表示画面１００では、トップバー領域１０２と情報表示領域１０４との境界を示す直線１２０の表示は第２状態から維持されるが、トップバー領域１０２のメニューオブジェクトの表示態様が変わる。トップバー領域１０２のうち第１メニューオブジェクト１０８が表示されていた位置には、第１メニューオブジェクト１０８の代わりに新たに第２メニューオブジェクト１２２が表示される。言い換えると、第１メニューオブジェクト１０８が第２メニューオブジェクト１２２に変化する。第２メニューオブジェクト１２２は第１メニューオブジェクト１０８に対応し、第２メニューオブジェクト１２２がタップされたときの動作は第１メニューオブジェクト１０８がタップされたときの動作と同じである。第２メニューオブジェクト１２２は略円形状であり、中に第１メニューオブジェクト１０８のものと同じメニューを表す記号を含む。第２メニューオブジェクト１２２は第１メニューオブジェクト１０８よりも小さい。

【0026】

第３状態の情報表示画面１００のトップバー領域１０２には、第１状態の情報表示画面１００の情報表示領域１０４に表示されていたテキスト１１８と同じテキスト１２４が表示される。テキスト１２４は、第２メニューオブジェクト１２２と検索オブジェクト１１０との間に配置される。第１状態の情報表示画面１００の情報表示領域１０４に表示されていたテキスト１１８は情報表示領域１０４に表示される情報のタイトルを表すので、テキスト１２４も第３状態の情報表示画面１００の情報表示領域１０４の表示内容に対応する。

【0027】

第３状態の情報表示画面１００のトップバー領域１０２における検索オブジェクト１１０の表示態様は第２状態と変わらない。したがって、検索オブジェクト１１０の表示態様は第１状態、第２状態、第３状態を通じて同じであり、情報表示領域１０４の表示内容のスクロール量に依らない。

【0028】

トップバー領域１０２のメニューオブジェクトの表示態様の変更、すなわち第１メニューオブジェクト１０８から第２メニューオブジェクト１２２への変化は、スクロール量が第２しきい値を超えると開始される。第２しきい値は第１しきい値よりも大きい。アプリは、このメニューオブジェクトの表示態様の変更に合わせて、トップバー領域１０２におけるテキスト１２４の表示を開始する。具体的には、テキスト１２４の表示は、スクロール量が上記と同じ第２しきい値を超えると開始される。

【0029】

第２しきい値は、情報表示領域１０４に表示されていたテキスト１１８の全体がトップバー領域１０２の下に入って丁度見えなくなるスクロール量に対応するよう設定される。言い換えると、スクロール量が第２しきい値を下回ると、トップバー領域１０２におけるテキスト１２４の表示が止み、情報表示領域１０４におけるテキスト１１８の一部の表示が開始される。これにより、上向きにスクロールしていってタイトルが見えなくなるとすぐに、同じタイトルがトップバー領域１０２に表示され固定されるという視覚効果が実現される。この際、タイトルの表示が開始されるのと実質的に同時にメニューオブジェクトが小さくなるので、タイトルをトップバー領域１０２に表示するためのより広いスペースを確保することができる。逆に第１状態や第２状態ではタイトルを情報表示領域１０４で確認できるから、トップバー領域１０２においてはタイトルを表示する代わりにメニューオブジェクトを大きく表示することで、メニューオブジェクトへのタップを受け付け易くする。これにより、ユーザ利便性が向上する。

【0030】

（第２の表示制御例）
以下、アプリによる第２の表示制御例を、図６～図１１を参照して説明する。
図６は、携帯端末１０のディスプレイ１８に表示される第１状態の詳細情報表示画面１２６の代表画面図である。詳細情報表示画面１２６は、トップバー領域１２８と、詳細情報表示領域１３０と、状況表示領域１２９と、を有する。トップバー領域１２８と詳細情報表示領域１３０とは隣接しており、詳細情報表示領域１３０と状況表示領域１２９とは隣接している。詳細情報表示領域１３０には任意の情報が表示され、当該詳細情報表示領域１３０は表示内容をトップバー領域１２８の方へスクロール可能に構成される。一例では、詳細情報表示領域１３０には、図３の情報表示画面１００に表示される情報項目のうちのひとつについての詳細な情報が表示される。

【0031】

本例では詳細情報表示領域１３０は表示内容を上下方向にスクロール可能に構成される。詳細情報表示領域１３０は表示内容の少なくとも一部を他の方向、例えば左右方向にもスクロール可能に構成されてもよい。詳細情報表示領域１３０には様々な情報が表示されるが、特に表示される情報のタイトルを表すテキスト（または文字列）１３２と、静止画や動画などの画像１３４の下部分１３４ｂと、を含む。図６の第１状態では、トップバー領域１２８と詳細情報表示領域１３０との境界に線はなく、あたかもそれらが一続きであるかのように表示されている。

【0032】

トップバー領域１２８は、戻るオブジェクト１３６と、ハートオブジェクト１３８と、バーコードオブジェクト１４０と、を有する。図６に示される第１状態のトップバー領域１２８は、上記３つのオブジェクト以外の部分において、詳細情報表示領域１３０の表示内容の続きの表示内容をデフォルトの濃さで表示する。本例では、詳細情報表示領域１３０の上部に画像１３４の下部分１３４ｂが表示されているので、トップバー領域１２８には詳細情報表示領域１３０に表示されている下部分１３４ｂの続きの画像である上部分１３４ａが、詳細情報表示領域１３０における下部分１３４ｂの濃さと同じ濃さで表示される。その結果、画像１３４はトップバー領域１２８と詳細情報表示領域１３０とにまたがるひとつの画像として表示される。第１状態の画像１３４の濃さを１（最も薄い）から１０（最も濃い＝デフォルトの濃さ）の１０段階で表現すると１０となる。

【0033】

戻るオブジェクト１３６、ハートオブジェクト１３８、バーコードオブジェクト１４０はいずれも赤、青、緑、黄、黒などの色を有する背景に対して模様（矢印、ハート等）を白色または無色で描いた略円形状のオブジェクトである。戻るオブジェクト１３６がタップされると、アプリは、図３の情報表示画面１００に遷移させる。ハートオブジェクト１３８がタップされると、アプリは、詳細情報表示領域１３０に表示されているイベント等の内容をユーザのお気に入りに登録する。バーコードオブジェクト１４０がタップされると、図６の第１状態の詳細情報表示画面１２６へのリンク（ＵＲＬ）を含む二次元バーコードがディスプレイ１８に表示される。

【0034】

アプリが図６に示される第１状態の詳細情報表示画面１２６の詳細情報表示領域１３０に対する上向きのスクロール操作を受け付けると、アプリは詳細情報表示領域１３０の表示内容を上向きにスクロールさせて詳細情報表示画面１２６を第２状態（図７を参照して後述する）とする。アプリがそこからさらに上向きのスクロール操作を受け付けると、アプリは詳細情報表示領域１３０の表示内容をさらに上向きにスクロールさせて詳細情報表示画面１２６を第３状態（図８を参照して後述する）、第４状態（図９を参照して後述する）、第５状態（図１０を参照して後述する）と変化させ、第６状態（図１１を参照して後述する）に至らしめる。

【0035】

詳細情報表示画面１２６を第１状態から第２状態～第５状態を経て第６状態へと変化させるスクロール操作は、一続きのスクロール操作であってもよいし、スクロールしていったん指を離し、またスクロールするといった離散的なスクロール操作の集合であってもよい。いずれにせよ、詳細情報表示画面１２６は、スクロール量に応じてその状態を変化させる。スクロール量は第１の表示制御例で説明したスクロール量に準じる。

【0036】

詳細情報表示画面１２６の状態の変化は可逆的である。すなわち、アプリが第６状態の詳細情報表示画面１２６の詳細情報表示領域１３０に対する下向きのスクロール操作を受け付けると、アプリは詳細情報表示領域１３０の表示内容を下向きにスクロールさせて詳細情報表示画面１２６を第５状態とする。アプリがそこからさらに下向きのスクロール操作を受け付けると、アプリは詳細情報表示領域１３０の表示内容をさらに下向きにスクロールさせて詳細情報表示画面１２６を第４状態、第３状態、第２状態と変化させ、最終的に第１状態とする。

【0037】

図７は、携帯端末１０のディスプレイ１８に表示される第２状態の詳細情報表示画面１２６の代表画面図である。第２状態の詳細情報表示画面１２６では、トップバー領域１２８の戻るオブジェクト１３６、ハートオブジェクト１３８およびバーコードオブジェクト１４０の表示態様は第１状態と変わらないが、画像１３４の濃さが第１状態から変化する。図７に示される第２状態の画像１３４は、図６に示される第１状態の画像１３４よりも淡く表示される。本例では、第２状態の画像１３４の濃さは上記の０段階で表現すると６となる。第２状態では、トップバー領域１２８と詳細情報表示領域１３０との境界に線はなく、あたかもそれらが一続きであるかのように表示されている。

【0038】

図７に示される第２状態のトップバー領域１２８は、３つのオブジェクト以外の部分において、詳細情報表示領域１３０の表示内容の続きの表示内容を表示する。トップバー領域１２８には詳細情報表示領域１３０に表示されている下部分１３４ｂの続きの画像である上部分１３４ａが、詳細情報表示領域１３０における下部分１３４ｂの濃さと同じ濃さで表示される。その結果、画像１３４はトップバー領域１２８と詳細情報表示領域１３０とにまたがるひとつの画像として表示される。第２状態の画像１３４は第１状態の画像１３４よりも淡く表示されるので、第２状態のトップバー領域１２８は、詳細情報表示領域１３０の表示内容の続きの表示内容を第１状態よりも淡く表示していると言える。

【0039】

図８は、携帯端末１０のディスプレイ１８に表示される第３状態の詳細情報表示画面１２６の代表画面図である。第３状態の詳細情報表示画面１２６では、トップバー領域１２８の戻るオブジェクト１３６、ハートオブジェクト１３８およびバーコードオブジェクト１４０の表示態様は第２状態と変わらないが、画像１３４の濃さが第２状態から変化する。図８に示される第３状態の画像１３４は、図７に示される第２状態の画像１３４よりも淡く表示される。本例では、第３状態の画像１３４の濃さは上記の０段階で表現すると２となる。第３状態では、トップバー領域１２８と詳細情報表示領域１３０との境界に線はなく、あたかもそれらが一続きであるかのように表示されている。

【0040】

図８に示される第３状態のトップバー領域１２８は、３つのオブジェクト以外の部分において、詳細情報表示領域１３０の表示内容の続きの表示内容を表示する。トップバー領域１２８には詳細情報表示領域１３０に表示されている下部分１３４ｂの続きの画像である上部分１３４ａが、詳細情報表示領域１３０における下部分１３４ｂの濃さと同じ濃さで表示される。その結果、画像１３４はトップバー領域１２８と詳細情報表示領域１３０とにまたがるひとつの画像として表示される。第３状態の画像１３４は第２状態の画像１３４よりも淡く表示されるので、第３状態のトップバー領域１２８は、詳細情報表示領域１３０の表示内容の続きの表示内容を第２状態よりも淡く表示していると言える。

【0041】

図９は、携帯端末１０のディスプレイ１８に表示される第４状態の詳細情報表示画面１２６の代表画面図である。第４状態の詳細情報表示画面１２６では、トップバー領域１２８の戻るオブジェクト１３６、ハートオブジェクト１３８およびバーコードオブジェクト１４０の表示態様は第３状態と変わらないが、画像１３４の表示が止み、代わりにトップバー領域１２８と詳細情報表示領域１３０との境界を示す直線１４２が表示される。

【0042】

第１状態、第２状態、第３状態のトップバー領域１２８の透過率は１００％に設定される。したがって、トップバー領域１２８に詳細情報表示領域１３０の表示内容の続きの表示内容が表示される。第４状態のトップバー領域１２８の透過率は０％に設定される。したがって、トップバー領域１２８に詳細情報表示領域１３０の表示内容の続きの表示内容は表示されない。

【0043】

画像１３４の表示が止むタイミングと、直線１４２の表示が開始されるタイミングと、は実質的に一致する。さらに、画像１３４の表示が丁度止んだときの画像１３４の下側の境界線１３４ｃ（図８参照）は直線１４２と実質的に重なる。すなわち、上方向のスクロールに伴って画像１３４が徐々に淡くなっていき、消えたところで画像１３４の下側の境界線１３４ｃのみが残って直線１４２となるような視覚効果が実現される。

【0044】

画像１３４の下側の境界線１３４ｃの位置がトップバー領域１２８と詳細情報表示領域１３０との境界の位置と一致するときのスクロール量が第３しきい値として設定される。画像１３４の濃さは、スクロール量［０、第３しきい値）の範囲で定義されるスクロール量の単調減少関数で表現されてもよい。この単調減少関数は線形であってもよいし非線形であってもよい。スクロール量が０から第３しきい値に向けて変化するにつれて、画像１３４の濃さは１０から徐々に減少し、スクロール量が第３しきい値になると画像１３４が表示されなくなる。直線１４２の表示は、スクロール量が第３しきい値を超えると開始される。これらを併せることで上記の視覚効果が実現される。

【0045】

なお、他の実施の形態では、画像１３４の表示が止むスクロール量のしきい値と、直線１４２の表示が開始されるスクロール量のしきい値と、は異なっていてもよい。この場合、画像１３４の表示の停止と直線１４２の表示の開始とが異なるタイミングで生じる。また、画像１３４の表示が丁度止んだときの画像１３４の下側の境界線１３４ｃの位置は、トップバー領域１２８と詳細情報表示領域１３０との境界の位置に一致しなくてもよい。

【0046】

図１０は、携帯端末１０のディスプレイ１８に表示される第５状態の詳細情報表示画面１２６の代表画面図である。第５状態の詳細情報表示画面１２６では、トップバー領域１２８の戻るオブジェクト１３６、ハートオブジェクト１３８およびバーコードオブジェクト１４０の表示態様は第４状態と変わらず、直線１４２の表示も維持される。第５状態の詳細情報表示画面１２６ではスクロールの結果、テキスト１３２の約上半分がトップバー領域１２８の下に入って見えなくなっている。

【0047】

図１１は、携帯端末１０のディスプレイ１８に表示される第６状態の詳細情報表示画面１２６の代表画面図である。第６状態の詳細情報表示画面１２６では、トップバー領域１２８と詳細情報表示領域１３０との境界を示す直線１４２の表示は第５状態から維持されるが、トップバー領域１２８のオブジェクトの表示態様が変わる。戻るオブジェクト１３６、ハートオブジェクト１３８、バーコードオブジェクト１４０はそれぞれ色が反転して反転戻るオブジェクト１３６’、反転ハートオブジェクト１３８’、反転バーコードオブジェクト１４０’になる。反転戻るオブジェクト１３６’について、色が反転すると背景が白色または無色となり、模様（矢印、ハート等）が有色となる。したがって、図１１の例では反転戻るオブジェクト１３６’の背景がトップバー領域１２８の色と同じになり、オブジェクトの境界が消失している。これにより、オブジェクトの模様（矢印、ハート等）が浮き出るように表示される。反転ハートオブジェクト１３８’、反転バーコードオブジェクト１４０’についても同様である。反転戻るオブジェクト１３６’、反転ハートオブジェクト１３８’、反転バーコードオブジェクト１４０’がタップされたときの動作は、対応する戻るオブジェクト１３６、ハートオブジェクト１３８、バーコードオブジェクト１４０がタップされたときの動作とそれぞれ同じである。
なお、本例では反転されたオブジェクトの背景の色とトップバー領域１２８の色とが同じ場合を説明したが、これに限られず、反転されたオブジェクトの背景の色とトップバー領域１２８の色とは異なっていてもよい。この場合、反転されたオブジェクトの境界が見えるようになる。また、反転前のオブジェクトの背景の色とトップバー領域１２８の色とを同じとすることで、色の反転によりオブジェクトの境界が出現するような視覚効果を実現してもよい。あるいはまた、色の反転に限らず、スクロール量に応じてオブジェクトの色を段階的または連続的に変更してもよい。

【0048】

第６状態の詳細情報表示画面１２６のトップバー領域１２８には、第１状態の詳細情報表示画面１２６の詳細情報表示領域１３０に表示されていたテキスト１３２と同じテキスト１４４が表示される。テキスト１４４は、反転戻るオブジェクト１３６’と反転ハートオブジェクト１３８’との間に配置される。第１状態の詳細情報表示画面１２６の詳細情報表示領域１３０に表示されていたテキスト１３２は詳細情報表示領域１３０に表示される情報のタイトルを表すので、テキスト１４４も第６状態の詳細情報表示画面１２６の詳細情報表示領域１３０の表示内容に対応する。

【0049】

トップバー領域１２８の３つのオブジェクトの表示態様の変更すなわちオブジェクトの色の反転は、スクロール量が第４しきい値を超えると開始される。第４しきい値は第３しきい値よりも大きい。アプリは、３つのオブジェクトの表示態様の変更に合わせて、トップバー領域１２８におけるテキスト１４４の表示を開始する。具体的には、テキスト１４４の表示は、スクロール量が上記と同じ第４しきい値を超えると開始される。

【0050】

第４しきい値は、詳細情報表示領域１３０に表示されていたテキスト１３２の全体がトップバー領域１２８の下に入って丁度見えなくなるスクロール量に対応するよう設定される。言い換えると、スクロール量が第４しきい値を下回ると、トップバー領域１２８におけるテキスト１４４の表示が止み、詳細情報表示領域１３０におけるテキスト１３２の一部の表示が開始される。これにより、第１の表示制御例と同様の作用効果が奏される。

【0051】

（第３の表示制御例）
以下、アプリによる第３の表示制御例を、図３、図５および図１２～図１４を参照して説明する。
アプリが図３に示される第１状態の情報表示画面１００において上向きのスクロール操作を受け付けると、情報表示領域１０４の表示内容を上向きにスクロールさせて情報表示画面１００を第２状態を経て第３状態とすることは第１の表示制御例と同様である。アプリが図５に示される第３状態の情報表示画面１００に対するさらなる上向きのスクロール操作を受け付けると、アプリは情報表示領域１０４の表示内容をさらに上向きにスクロールさせて情報表示画面１００を第４状態とする。図１２は、携帯端末１０のディスプレイ１８に表示される第４状態の情報表示画面１００の代表画面図である。

【0052】

図１２に示される第４状態の情報表示画面１００において、アプリが気になるオブジェクト１１４へのタップを受け付けると、アプリはタップされた気になるオブジェクト１１４に対応するお気に入り表示画面１４６に表示を遷移させる。図１３は、携帯端末１０のディスプレイ１８に表示されるお気に入り表示画面１４６の代表画面図である。

【0053】

図１３に示されるお気に入り表示画面１４６において、アプリが探すオブジェクト１１２へのタップを受け付けると、アプリはタップされた探すオブジェクト１１２に対応する情報表示画面１００に表示を遷移させる。このとき、まずはお気に入り表示画面１４６に遷移する直前の第４状態の情報表示画面１００が表示される。その後、何らユーザから入力を受けることなく自動的に、デフォルト表示位置に向けて情報表示領域１０４の表示内容をスクロールさせる。本例では、図１２に示される第４状態の情報表示画面１００から自動的に下向きのスクロールが進行する。

【0054】

アプリは第４状態の情報表示領域１０４の表示内容を下向きに自動的にスクロールさせて情報表示画面１００を第５状態とする。図１４は、携帯端末１０のディスプレイ１８に表示される第５状態の情報表示画面１００の代表画面図である。アプリは第５状態の情報表示領域１０４の表示内容をさらに下向きに自動的にスクロールさせて情報表示画面１００を図５の第３状態に戻す。続けてアプリは第３状態の情報表示領域１０４の表示内容をさらに下向きに自動的にスクロールさせて情報表示画面１００を図３の第１状態に戻す。以上の遷移をまとめると、図３→（上向きスクロール操作）→図５→（上向きスクロール操作）→図１２→（気になるオブジェクトタップ）→図１３→（探すオブジェクトタップ）→図１２→（自動スクロール）→図１４→（自動スクロール）→図５→（自動スクロール）→図３となる。

【0055】

上述の実施の形態において、保持部の例は、ハードディスクや半導体メモリである。また、本明細書の記載に基づき、各部を、図示しないＣＰＵや、インストールされたアプリケーションプログラムのモジュールや、システムプログラムのモジュールや、ハードディスクから読み出したデータの内容を一時的に記憶する半導体メモリなどにより実現できることは本明細書に触れた当業者には理解される。

【0056】

本実施の形態に係るアプリによると、スクロール量に応じてトップバー領域内のオブジェクトの表示態様が変更される。したがって、変化に富んだ斬新なユーザインタフェースを提供することができる。

【0057】

また、本実施の形態に係るアプリでは、表示される情報のタイトルがスクロールアウトすると、トップバー領域における当該タイトルの表示が開始される。したがって、トップバー領域および（詳細）情報表示領域の両方にタイトルが表示される状況を回避することができる。タイトルは一画面にひとつ表示されていれば十分であるから、本アプリはより洗練された見やすいユーザインタフェースを提供できる。

【0058】

以上、実施の形態に係るアプリについて説明した。この実施の形態は例示であり、各構成要素や各処理の組み合わせにいろいろな変形例が可能なこと、またそうした変形例も本発明の範囲にあることは当業者に理解される。

【0059】

実施の形態では、スクロール量に応じてオブジェクトの大きさ（第１の表示制御例）または色（第２の表示制御例）を変える場合を説明したが、これに限られず、スクロール量に応じてオブジェクトの表示態様を変えるものであればよく、例えばオブジェクトの濃さを変えてもよいし、シャープネスを変えてもよいし、オブジェクトをアニメーション化する・しないを切り替えてもよい。

【符号の説明】

【0060】

１０ 携帯端末、 １８ ディスプレイ、 １００ 情報表示画面、 １２６ 詳細情報表示画面。

【図1】

【図2】

【図3】

【図4】

【図5】

【図6】

【図7】

【図8】

【図9】

【図10】

【図11】

【図12】

【図13】

【図14】