(57)【要約】【課題】端末の種類に応じて生成された複数のプレビュー画面間の差分を容易に判別できるようにすること。【解決手段】情報処理装置は、第１の端末用のプレビュー画面と第２の端末用のプレビュー画面との共通部分を抽出する抽出手段と、第１の端末用のプレビュー画面における共通部分の表示態様を調整して第１の端末用のプレビュー画面を表示すると共に、第１の端末用のプレビュー画面の奥側に第２の端末用のプレビュー画面を表示する表示手段と、を備えている。【選択図】図１
2015191356.tif 000002
【特許請求の範囲】
【請求項１】
第１の端末用のプレビュー画面と第２の端末用のプレビュー画面との共通部分を抽出する抽出手段と、
前記第１の端末用のプレビュー画面における前記共通部分の表示態様を調整して前記第１の端末用のプレビュー画面を表示すると共に、前記第１の端末用のプレビュー画面の奥側に前記第２の端末用のプレビュー画面を表示する表示手段と、を備える、
ことを特徴とする情報処理装置。
【請求項２】
前記第１の端末および前記第２端末の双方のプレビュー画面を構成する複数の画面要素に対応する複数のデータ要素を保持する第１の記憶手段と、
前記複数のデータ要素に基づいて前記第１の端末用のプレビュー画面を生成する際、前記複数のデータ要素に含まれるプレースホルダを置換するための値を保持する第２の記憶手段と、
前記複数のデータ要素に基づいて前記第２の端末用のプレビュー画面を生成する際、前記複数のデータ要素に含まれるプレースホルダを置換するための値を保持する第３の記憶手段と、を備え、
前記抽出手段は、前記第１の端末または前記第２の端末用のプレビュー画面を生成する際にプレースホルダが置換されないデータ要素に対応する画面要素を、前記共通部分として抽出する、
請求項１に記載の情報処理装置。
【請求項３】
前記表示手段は、前記第１の記憶手段が保持するデータ要素に含まれるプレースホルダを前記第２の記憶手段が保持する値で置換して前記第１の端末用のプレビュー画面を生成すると共に、前記第１の記憶手段が保持するデータ要素に含まれるプレースホルダを前記第３の記憶手段が保持する値で置換して前記第２の端末用のプレビュー画面を生成する、
請求項２に記載の情報処理装置。
【請求項４】
前記第１の端末用のプレビュー画面を生成するためのデータ要素に含まれる値に対するユーザの編集を受け付ける編集手段を備え、
前記第１の記憶手段は、編集対象とされたデータ要素において編集された値をプレースホルダに置換したものを保持し、
前記第２の記憶手段は、前記プレースホルダと前記編集前の値の対応関係を保持し、
前記第３の記憶手段は、前記プレースホルダと前記編集後の値の対応関係を保持する、
請求項２または３に記載の情報処理装置。
【請求項５】
前記第１の端末用のプレビュー画面を生成するためのデータ要素に含まれる値として不適切な値を保持する辞書手段を備え、
前記表示手段は、前記第１の記憶手段が保持する複数のデータ要素に含まれるプレースホルダを前記第２の記憶手段が保持する値で置換したときに、置換後のデータ要素が前記辞書手段に登録された不適切な値を含む場合、前記第１の端末用のプレビュー画面において、不適切な値を含むデータ要素に対応する画面要素の表示態様を調整して表示する、
請求項２ないし４のいずれか１項に記載の情報処理装置。
【請求項６】
前記辞書手段は、前記不適切な値に対する修正候補の値を保持し、
前記表示手段は、前記第１の記憶手段が保持する複数のデータ要素に含まれるプレースホルダを前記第２の記憶手段が保持する値で置換したときに、置換後のデータ要素が前記辞書手段に登録された不適切な値を含む場合、該不適切な値に対する修正候補を表示する、
請求項５に記載の情報処理装置。
【請求項７】
前記共通部分の透過率を設定する設定手段を備え、
前記表示手段は、前記第１の端末用のプレビュー画面に含まれる前記共通部分を、設定された透過率で表示する、
請求項１ないし６のいずれか１項に記載の情報処理装置。
【請求項８】
前記設定手段は、前記第１の端末用のプレビュー画面の奥行き方向の表示位置に応じて、前記透過率を設定する、
請求項７に記載の情報処理装置。
【請求項９】
情報処理装置が、第１の端末用のプレビュー画面と第２の端末用のプレビュー画面との共通部分を抽出するステップと、
前記第１の端末用のプレビュー画面における前記共通部分の表示態様を調整して前記第１の端末用のプレビュー画面を表示するステップと、
前記第１の端末用のプレビュー画面の奥側に前記第２の端末用のプレビュー画面を表示するステップと、を含む、
ことを特徴とするプレビュー画面表示方法。
【請求項１０】
第１の端末用のプレビュー画面と第２の端末用のプレビュー画面との共通部分を抽出する処理と、
前記第１の端末用のプレビュー画面における前記共通部分の表示態様を調整して前記第１の端末用のプレビュー画面を表示する処理と、
前記第１の端末用のプレビュー画面の奥側に前記第２の端末用のプレビュー画面を表示する処理と、をコンピュータに実行させる、
ことを特徴とするプログラム。
【発明の詳細な説明】
【技術分野】
【０００１】
本発明は、情報処理装置、プレビュー画面表示方法、および、プログラムに関し、特に、コンテンツデータに基づいてプレビュー画面を生成すると共に、プレビュー画面を生成するためのコンテンツデータを編集するための情報処理装置、プレビュー画面表示方法、および、プログラムに関する。
【背景技術】
【０００２】
近年、タブレット端末が急速に普及し始めている。これに伴い、タブレット端末を用いて、社内または社外のＷｅｂサービスやＷｅｂアプリケーションを利用するケースが増えている。
【０００３】
関連技術として、特許文献１には、複数の画面を３次元の複数の階層に重ねて表示するとともに、上位の階層の画面を透過して下位の階層の画面の内容を視認可能に表示する技術が記載されている。
【０００４】
また、特許文献２には、画面データに対する変更前のバージョンと変更後のバージョンの差分を特徴的な表示態様で描画する技術が記載されている。
【先行技術文献】
【特許文献】
【０００５】
【特許文献１】特開２０１３−２５７６６６号公報
【特許文献２】特開２００８−０７０９４７号公報
【発明の概要】
【発明が解決しようとする課題】
【０００６】
上記特許文献の全開示内容は、本書に引用をもって繰り込み記載されているものとする。以下の分析は、本発明者によってなされたものである。
【０００７】
タブレット端末（以下「タブレット」という。）はＰＣ（Personal Computer）と比較すると携帯性に優れるものの、一般に、文書やコンテンツのデータを編集する作業には適していない。そのため、タブレットを使って利用するＷｅｂサービスやＷｅｂアプリケーション用の画面を作成したり編集したりする作業は、タブレットではなくＰＣを用いて行われる。また、タブレットが利用できるＷｅｂサービス、Ｗｅｂアプリケーションについては、ＰＣからも利用可能である場合が大半である。したがって、コンテンツの作成者は、ＰＣ向けの画面とタブレット向けの画面を並行して作成することが多い。
【０００８】
ＰＣ向けの画面とタブレット向けの画面をＰＣを用いて作成する場合、以下の方針に基づいて作成することが考えられる。
・ＰＣ向けとタブレット向けの２つの画面のレイアウト（画面構成）を同一とする。
・両画面の間で見た目（例えば、色、画像、フォントなど）を変更する。
・ＷｅｂサービスおよびＷｅｂアプリケーションの動作に関わるイベントや処理を、両者の間で変更する。なぜなら、ＰＣで使用可能なイベントや処理が、タブレットではサポートされていないことがあり、タブレット向けにイベントや処理の変更が必要になることが多いからである。
【０００９】
上記の方針に従ってタブレット向けの画面を作成する際、以下の問題が生じる。
【００１０】
（１）ＰＣ用の画面をベースとしてタブレット用の画面を構築すると、コンテンツ作成者がＰＣ用コンテンツの画面表示とタブレット用コンテンツの画面表示を目視によって比較しなければならない。しかしながら、端末（デバイス）の種類に応じた異なる画面表示になっているかどうか、端末に依存しない部分は同一の内容になっているかどうか、といった点を確認することは、コンテンツ作成者にとって大きな負担となる。
【００１１】
（２）コンテンツデータにおいて、ＰＣやタブレットなどの端末の種類に応じて異なるコンテンツ情報を記述しなければならない部分と、同一のコンテンツ情報を記述できる部分とが存在する。前者に対しては、端末に応じたリソースを個別に用意し、後者に対しては、共通のリソースを用意することが望ましい。しかし、画面を作成するに際して、これらのコンテンツ情報（前者と後者の両方）は頻繁に書き換えられ、どのコンテンツ情報をどのリソースで定義するかを適切に記述することは、コンテンツ作業者にとって大きな負担となる。
【００１２】
（３）コンテンツデータの中には、ＰＣ用またはタブレット用のどちらか一方でサポートされていない不適切なデータが存在することがある。不適切なデータを特定するためには、端末ごとにサポートされるデータとされないデータに関する十分な知識を有するコンテンツ作成者が、コンテンツデータのソースファイルを細かくチェックしなければならない。なぜなら、これらのデータは、プレビュー画面上には表示されないからである。したがって、コンテンツ編集作業の負荷が増大する要因となる。
【００１３】
（４）上記（３）のように、コンテンツデータ中に不適切なデータが存在する場合、コンテンツデータを適切に修正するためには、端末ごとにサポートされるデータとされないデータに関する十分な知識を有するコンテンツ作成者が、不適切なコンテンツデータを特定した上で、適切なデータに修正しなければならない。したがって、コンテンツ編集作業の負荷が増大する要因となる。
【００１４】
以上のように、（１）端末に応じた画面表示の差分を判別する作業、（２）端末に依存するデータと端末に依存しない共通データを管理する作業、（３）端末の種類に応じた不適合なコンテンツデータを判別する作業、（４）端末の種類に応じた不適合なコンテンツデータを修正する作業は、コンテンツ編集者にとって大きな負担となる。
【００１５】
そこで、端末の種類に応じて生成された複数のプレビュー画面間の差分を容易に判別できるようにすることが課題となる。本発明の目的は、かかる課題解決に寄与する情報処理装置、プレビュー画面表示方法、および、プログラムを提供することにある。なお、その他の課題、および、これを解決するための手段については、以下の記載から明らかにされる。
【課題を解決するための手段】
【００１６】
本発明の第１の態様に係る情報処理装置は、第１の端末用のプレビュー画面と第２の端末用のプレビュー画面との共通部分を抽出する抽出手段と、前記第１の端末用のプレビュー画面における前記共通部分の表示態様を調整して前記第１の端末用のプレビュー画面を表示すると共に、前記第１の端末用のプレビュー画面の奥側に前記第２の端末用のプレビュー画面を表示する表示手段と、を備えている。
【００１７】
本発明の第２の態様に係るプレビュー画面表示方法は、情報処理装置が、第１の端末用のプレビュー画面と第２の端末用のプレビュー画面との共通部分を抽出するステップと、前記第１の端末用のプレビュー画面における前記共通部分の表示態様を調整して前記第１の端末用のプレビュー画面を表示するステップと、前記第１の端末用のプレビュー画面の奥側に前記第２の端末用のプレビュー画面を表示するステップと、を含む。
【００１８】
本発明の第３の態様に係るプログラムは、第１の端末用のプレビュー画面と第２の端末用のプレビュー画面との共通部分を抽出する処理と、前記第１の端末用のプレビュー画面における前記共通部分の表示態様を調整して前記第１の端末用のプレビュー画面を表示する処理と、前記第１の端末用のプレビュー画面の奥側に前記第２の端末用のプレビュー画面を表示する処理と、をコンピュータに実行させる。なお、プログラムは、非一時的なコンピュータ可読記録媒体（non-transitory computer-readable storage medium）に記録されたプログラム製品として提供することもできる。
【発明の効果】
【００１９】
本発明に係る情報処理装置、プレビュー画面表示方法、および、プログラムによると、端末の種類に応じて生成された複数のプレビュー画面間の差分を容易に判別することが可能となる。
【図面の簡単な説明】
【００２０】
【図１】一実施形態に係る情報処理装置の構成を例示するブロック図である。
【図２】一実施形態に係る情報処理装置の他の構成を例示するブロック図である。
【図３】プレビュー画面の移動の様子を例示する図である。
【図４】プレビュー画面の画面要素に対する透過率をｚ座標に応じて変化させる様子を例示する図である。
【図５】第１の実施形態に係る情報処理装置の構成を例示するブロック図である。
【図６】第１の実施形態における画面表示の準備動作を例示するフロー図である。
【図７】共通コンテンツデータの内容を例示する図である。
【図８】ＰＣ用コンテンツデータの内容を例示する図である。
【図９】コンテンツデータ作用テーブルの内容を例示する図である。
【図１０】タブレット用コンテンツデータの内容を例示する図である。
【図１１】第１の実施形態におけるプレビュー画面を表示する動作を例示するフロー図である。
【図１２】編集対象画面を選択する動作を例示するフロー図である。
【図１３】コンテンツデータの内容を例示する図である。
【図１４】第１の実施形態において、コンテンツデータに対するユーザの編集をコンテンツデータに反映する動作を例示するフロー図である。
【図１５】編集後のデータの内容を例示する図である。
【図１６】編集前後のデータの差分の内容を例示する図である。
【図１７】ＰＣ用コンテンツデータおよび共通コンテンツデータに対するユーザの編集をコンテンツデータに反映する動作を例示するフロー図である。
【図１８】ＰＣ用コンテンツデータに対する編集内容を例示する図である。
【図１９】共通コンテンツデータに対する編集内容を例示する図である。
【図２０】差分に相当する画面要素の削除をコンテンツデータに反映する動作を例示するフロー図である。
【図２１】タブレット用プレビュー画面における差分に相当する画面要素が削除されたときの動作を例示する図である。
【図２２】第２の実施形態に係る情報処理装置の構成を例示するブロック図である。
【図２３】不適合コンテンツデータ辞書の内容を例示する図である。
【図２４】第２の実施形態における画面表示の準備動作を例示するフロー図である。
【図２５】第２の実施形態におけるプレビュー画面を表示する動作を例示するフロー図である。
【図２６】第２の実施形態において、コンテンツデータに対するユーザの編集を受け付ける動作を例示するフロー図である。
【発明を実施するための形態】
【００２１】
はじめに、一実施形態の概要について説明する。なお、この概要に付記する図面参照符号は、専ら理解を助けるための例示であり、本発明を図示の態様に限定することを意図するものではない。
【００２２】
図１は、一実施形態の情報処理装置の構成を例示するブロック図である。図１を参照すると、情報処理装置３１０は、第１の端末（例えば、タブレット）用のプレビュー画面と第２の端末（例えば、ＰＣ（Personal Computer））用のプレビュー画面との共通部分を抽出する抽出手段１１１と、第１の端末（タブレット）用のプレビュー画面における前記共通部分の表示態様（例えば、透過率）を調整して第１の端末（タブレット）用のプレビュー画面を表示すると共に、第１の端末（タブレット）用のプレビュー画面の奥側に第２の端末（ＰＣ）用のプレビュー画面を表示する表示手段１５７と、を備えている。
【００２３】
かかる情報処理装置３１０によると、端末の種類（例えば、ＰＣ、タブレット）に応じて生成されたプレビュー画面間の共通部分の表示態様を調整することで、両画面間の差分が強調して表示されるため、差分に相当する箇所を容易に判別することが可能となる。
【００２４】
図２は、一実施形態の情報処理装置３２０の他の構成を例示するブロック図である。図２を参照すると、情報処理装置３２０は、上記共通部分の透過率を設定する設定手段１１２を備え、表示手段１５７は、第１の端末（例えば、タブレット）用のプレビュー画面に含まれる上記共通部分を、設定された透過率で表示してもよい。図３は、タブレット用のプレビュー画面における共通部分の透過率を調整して、ＰＣ用のプレビュー画面の手前側に表示する様子を例示する図である。
【００２５】
また、設定手段１１２は、第１の端末（例えば、タブレット）用のプレビュー画面の奥行き方向の表示位置に応じて、透過率を設定してもよい。図４は、プレビュー画面の奥行方向（ｚ軸方向）の位置に応じて、透過率を設定する様子を例示する図である。
【００２６】
かかる情報処理装置３２０によると、プレビュー画面の表示位置に応じて共通部分の透過率を変化させることができ、ユーザはプレビュー画面の表示位置を操作することで、両プレビュー画面における差分に相当する箇所を容易に把握することが可能となる。
【００２７】
図２を参照すると、情報処理装置３２０は、第１の端末（例えば、ＰＣ）および第２端末（例えば、タブレット）の双方のプレビュー画面を構成する複数の画面要素に対応する複数のデータ要素（例えば、ＨＴＭＬ（Hyper Text Markup Language）要素）を保持する第１の記憶手段１４１と、前記複数のデータ要素に基づいて第１の端末（ＰＣ）用のプレビュー画面を生成する際、前記複数のデータ要素に含まれるプレースホルダを置換するための値を保持する第２の記憶手段１４２と、前記複数のデータ要素に基づいて第２の端末（タブレット）用のプレビュー画面を生成する際、前記複数のデータ要素に含まれるプレースホルダを置換するための値を保持する第３の記憶手段１４３と、を備え、抽出手段１１１は、第１の端末（ＰＣ）または第２の端末（タブレット）用のプレビュー画面を生成する際にプレースホルダが置換されないデータ要素（ＨＴＭＬ要素）に対応する画面要素を、前記共通部分として抽出してもよい。
【００２８】
また、表示手段１５７は、第１の記憶手段１４１が保持するデータ要素に含まれるプレースホルダを第２の記憶手段１４２が保持する値で置換して第１の端末（ＰＣ）用のプレビュー画面を生成すると共に、第１の記憶手段１４１が保持するデータ要素に含まれるプレースホルダを第３の記憶手段１４３が保持する値で置換して第２の端末（タブレット）用のプレビュー画面を生成してもよい。
【００２９】
さらに、情報処理装置３２０は、第１の端末（例えば、ＰＣ）用のプレビュー画面を生成するためのデータ要素に含まれる値に対するユーザの編集を受け付ける編集手段１３１を備え、第１の記憶手段１４１は、編集対象とされたデータ要素（例えば、ＨＴＭＬ要素）において編集された値をプレースホルダに置換したものを保持し、第２の記憶手段１４２は、前記プレースホルダと前記編集前の値の対応関係を保持し、第３の記憶手段１４３は、前記プレースホルダと前記編集後の値の対応関係を保持するようにしてもよい。
【００３０】
かかる情報処理装置３２０によると、利用者は、一方の端末（例えば、ＰＣ）の画面要素を生成するためのデータ要素を、他方の端末（例えば、タブレット）の画面要素を生成するためのデータ要素に書き換えるだけで、端末の種類に依存するデータと端末に依存しない共通データとを自動的に生成することが可能となり、これらのデータを管理する作業が容易となる。
【００３１】
図２を参照すると、情報処理装置３２０は、第１の端末（例えば、ＰＣ）用のプレビュー画面を生成するためのデータ要素に含まれる値として不適切な値を保持する辞書手段１６０を備え、表示手段１５７は、第１の記憶手段１４１が保持する複数のデータ要素に含まれるプレースホルダを第２の記憶手段１４２が保持する値で置換したときに、置換後のデータ要素が辞書手段１６０に登録された不適切な値を含む場合、第１の端末（ＰＣ）用のプレビュー画面において、不適切な値を含むデータ要素に対応する画面要素の表示態様を調整して（例えば、色を変更する、点滅させる等して）表示してもよい。
【００３２】
かかる情報処理装置３２０によると、利用者が端末によってはサポートされない不適切な値をデータ要素（例えば、ＨＴＭＬ要素）に挿入した場合、当該データ要素に対応する画面要素が強調して表示されるため、利用者は不適切なデータ要素を容易に判別することができるようになる。
【００３３】
また、辞書手段１６０は、不適切な値に対する修正候補の値を保持し、表示手段１５７は、第１の記憶手段１４１が保持する複数のデータ要素に含まれるプレースホルダを第２の記憶手段１４２が保持する値で置換したときに、置換後のデータ要素が辞書手段１６０に登録された不適切な値を含む場合、該不適切な値に対する修正候補を表示してもよい。
【００３４】
かかる情報処理装置３２０によると、利用者が端末によってはサポートされない不適切な値をデータ要素（例えば、ＨＴＭＬ要素）に挿入した場合、その修正候補が提供されるため、端末の種類ごとにサポートされるデータとされないデータに関する十分な知識を有していない利用者であっても、データ要素を適切な値に修正することが可能になる。
【００３５】
以上のように、一実施形態によると、例えば、ＰＣ用プレビュー画面とタブレット用プレビュー画面を２つ同時に表示し、２つの画面の位置関係を変化させると、一方のプレビュー画面に表示される内容を、他方のプレビュー画面を基準とした差分の内容だけに変化させることが可能となる。
【００３６】
また、一実施形態によると、端末の種類に応じた画面表示の差分を強調表示する統合プレビュー画面生成装置が提供され、特に、異なる端末のプレビュー画面間で、差分のない共通の画面要素を抽出し、抽出した要素の透過率が設定される。さらに、当該統合プレビュー画面生成装置において、端末の種類に応じて不適合なコンテンツデータを含む画面要素に対して警告が出力される。かかる統合プレビュー画面生成装置によると、端末に応じた画面表示の差分を判別する作業や、端末の種類に応じた不適合なコンテンツデータを判別する作業が容易となる。
【００３７】
また、一実施形態によると、例えば、ＰＣ用プレビュー画面またはタブレット用プレビュー画面を編集すると、２つのコンテンツの間で共通する内容と異なる内容とを自動的に判別して記憶する。これにより、端末に依存するデータと端末に依存しない共通データを管理する画面編集装置が提供される。また、編集時に選択された画面要素に基づいて、編集対象データを特定し、編集前後のコンテンツデータの差分を特定し、特定した差分に従って、端末に依存するデータと端末に依存しないデータを更新する画面編集装置が提供される。さらに、当該画面編集装置において、端末の種類に応じて不適合なコンテンツデータに対する警告が表示され、修正案として適切なコンテンツデータが提示される。かかる画面編集装置によると、端末に依存するデータと端末に依存しない共通データを管理する作業や、端末の種類に応じた不適合なコンテンツデータを判別して修正する作業が容易となる。
【００３８】
＜実施形態１＞
次に、第１の実施形態に係る情報処理装置について、図面を参照して詳細に説明する。
【００３９】
［構成］
図５は、本実施形態の情報処理装置１００の構成を例示するブロック図である。情報処理装置１００は、例えば、ＰＣ（Personal Computer）等の一般的な電子計算機であってもよい。図５を参照すると、情報処理装置１００は、コンテンツ表示・編集部２００、共通コンテンツデータ記憶部４１、ＰＣ用コンテンツデータ記憶部４２、および、タブレット用コンテンツデータ記憶部４３を備えている。
【００４０】
ＰＣ用コンテンツデータ記憶部４２、共通コンテンツデータ記憶部４１、および、タブレット用コンテンツデータ記憶部４３は、それぞれ、ＰＣまたはタブレットに表示されるコンテンツのデータを保持する。本実施形態では、ＰＣ用とタブレット用とに分けているが、端末の種類が増加した場合、コンテンツデータ記憶部を追加してもよい。例えば、スマートフォン用コンテンツデータ記憶部をさらに設けてもよい。
【００４１】
コンテンツ表示・編集部２００は、ユーザ（例えば、コンテンツの作成者）に対して、ＰＣ用およびタブレット用コンテンツのプレビュー画面を表示し、コンテンツデータの編集機能を提供する。コンテンツ表示・編集部２００は、統合プレビュー画面生成部１０、統合プレビュー画面操作部２０、画面編集部３０、ＰＣ用プレビュー画面生成部５０、タブレット用プレビュー画面生成部５１、ＰＣ用プレビュー画面記憶部５２、ＰＣ用コンテンツデータ作用テーブル記憶部５３、タブレット用プレビュー画面記憶部５４、タブレット用コンテンツデータ作用テーブル記憶部５５、統合プレビュー画面記憶部５６、および、画面表示部５７を備えている。
【００４２】
統合プレビュー画面生成部１０は、ＰＣ用コンテンツとタブレット用コンテンツの２つのプレビュー画面を、２つの画面間の差分を分かりやすい形に加工して生成する。統合プレビュー画面生成部１０は、共通画面要素抽出部１１、プレビュー画面透過部１２、および、プレビュー画面統合部１３を備えている。
【００４３】
共通画面要素抽出部１１は、ＰＣ用プレビュー画面とタブレット用プレビュー画面の間で、同一の内容の画面要素を抽出する。プレビュー画面透過部１２は、共通画面要素抽出部１１により抽出された画面要素の透過率（透明度）を、一例として、０％から１００％の範囲で変更する。プレビュー画面統合部１３は、ＰＣ用プレビュー画面とタブレット用プレビュー画面を同一の画面上に表示する。
【００４４】
統合プレビュー画面操作部２０は、ＰＣ用コンテンツとタブレット用コンテンツの２つのプレビュー画面を、ユーザの入力に従って操作（例えば、移動）する。統合プレビュー画面操作部２０は、プレビュー画面移動部２１およびプレビュー画面位置取得部２２を備えている。
【００４５】
図３は、プレビュー画面の移動の様子を例示する。プレビュー画面移動部２１は、図３に示すように、ＰＣ用プレビュー画面とタブレット用プレビュー画面を、ユーザの入力に従って、例えば、環状に移動する。プレビュー画面を円環状に移動する場合、図３に示したｚ軸（奥行き方向）に垂直な軸を移動の中心軸としてもよい。プレビュー画面位置取得部２２は、プレビュー画面移動部２１が移動した２つのプレビュー画面のそれぞれの位置情報（例えば、ｚ座標）を取得する。
【００４６】
画面編集部３０は、ＰＣ用コンテンツデータ、タブレット用コンテンツデータ、および、共通コンテンツデータを編集する。画面編集部３０は、編集部３１、コンテンツデータ特定部３２、コンテンツデータ差分特定部３３、および、コンテンツデータ更新部３４を備えている。
【００４７】
編集部３１は、ＰＣ用プレビュー画面およびタブレット用プレビュー画面内の画面要素のコンテンツデータを編集する。コンテンツデータ特定部３２は、ユーザが編集した画面要素に対応するコンテンツデータを特定する。コンテンツデータ差分特定部３３は、コンテンツデータの編集前後の差分を特定する。コンテンツデータ更新部３４は、編集されたコンテンツデータの内容を、ＰＣ用コンテンツデータ記憶部４２、共通コンテンツデータ記憶部４１、および、タブレット用コンテンツデータ記憶部４３に反映する。
【００４８】
ＰＣ用プレビュー画面生成部５０は、ＰＣ用コンテンツデータ記憶部４２、および、共通コンテンツデータ記憶部４１からコンテンツデータを取得し、ＰＣ用のプレビュー画面を生成する。一方、タブレット用プレビュー画面生成部５１は、共通コンテンツデータ記憶部４１、および、タブレット用コンテンツデータ記憶部４３からコンテンツデータを取得し、タブレット用のプレビュー画面を生成する。
【００４９】
また、ＰＣ用プレビュー画面生成部５０は、プレビュー画面生成時に、ＰＣ用のコンテンツデータが作用してＰＣ用の独自のコンテンツに変化した画面要素のＩＤを記録する。一方、タブレット用プレビュー画面生成部５１は、プレビュー画面生成時に、タブレット用のコンテンツデータが作用してタブレット用の独自のコンテンツに変化した画面要素のＩＤを記録する。本実施形態では、ＰＣ用とタブレット用に、ＰＣ用プレビュー画面生成部５０およびタブレット用プレビュー画面生成部５１を設けている。ただし、対象とする端末の種類が増加した場合、プレビュー画面生成部をさらに追加してもよい。
【００５０】
ＰＣ用プレビュー画面記憶部５２は、ＰＣ用プレビュー画面生成部５０が生成したプレビュー画面を保持する。一方、タブレット用プレビュー画面記憶部５４は、タブレット用プレビュー画面生成部５１が生成したプレビュー画面を保持する。本実施形態では、ＰＣ用とタブレット用に、ＰＣ用プレビュー画面記憶部５２とタブレット用プレビュー画面記憶部５４を設けている。ただし、端末の種類が増加した場合、プレビュー画面記憶部をさらに追加してもよい。
【００５１】
ＰＣ用コンテンツデータ作用テーブル記憶部５３は、ＰＣ用プレビュー画面生成部５０により記録された、ＰＣ用の独自のコンテンツに変化した画面要素のＩＤを保持する。一方、タブレット用コンテンツデータ作用テーブル記憶部５５は、タブレット用プレビュー画面生成部５１により記録された、タブレット用の独自のコンテンツに変化した画面要素のＩＤを保持する。本実施形態では、ＰＣ用とタブレット用に、ＰＣ用コンテンツデータ作用テーブル記憶部５３とタブレット用コンテンツデータ作用テーブル記憶部５５を設けている。ただし、端末の種類が増加した場合、コンテンツデータ作用テーブル記憶部をさらに追加してもよい。
【００５２】
統合プレビュー画面記憶部５６は、統合プレビュー画面生成部１０によって生成された画面を保持する。
【００５３】
画面表示部５７は、統合プレビュー画面記憶部５６が保持する画面を、情報処理装置１００のディスプレイに表示する。
【００５４】
［動作］
次に、本実施形態の情報処理装置１００の動作について説明する。情報処理装置１００の動作は、＜１．準備＞、＜２．（初期）表示＞、＜３．画面の移動・更新＞、＜４．編集：差分の作成＞、＜５．編集：差分の更新＞、および、＜６．編集：差分の削除＞の動作に大別することができる。
【００５５】
＜１．準備＞
図６は、情報処理装置１００の画面表示の準備動作を例示するフロー図である。
【００５６】
ＰＣ用プレビュー画面生成部５０は、ＰＣ用コンテンツデータ記憶部４２および共通コンテンツデータ記憶部４１から取得したデータに基づいて（ステップＳ１１）、ＰＣ用プレビュー画面を生成し（ステップＳ１２）、生成したＰＣ用プレビュー画面をＰＣ用プレビュー画面記憶部５２に保存する。
【００５７】
図７は、共通コンテンツデータの内容を例示する図である。図８は、ＰＣ用コンテンツデータの内容を例示する図である。ここでは、これらの例に基づいて、具体的な動作を説明する。ＰＣ用プレビュー画面生成部５０は、図７に示した共通コンテンツデータを走査し、当該データ中に存在するプレースホルダ（placeholder、$xxxなど）を、図８に示したＰＣ用コンテンツデータを用いて置換する。次に、ＰＣ用プレビュー画面生成部５０は、例えば、ＨＴＭＬ（Hyper Text Markup Language）レンダリングエンジンを用いて、プレビュー画面を生成する（ステップＳ１２）。ここでは、一例としてＨＴＭＬレンダリングエンジンを用いる場合について説明するが、本発明におけるプレビュー画面生成方法は、これに限定されない。
【００５８】
次に、ＰＣ用プレビュー画面生成部５０は、共通コンテンツデータ（図７）に対してＰＣ用コンテンツデータ（図８）が作用した部分を記録し、それをＰＣ用コンテンツデータ作用テーブル記憶部５３に保存する（ステップＳ１３）。図９は、コンテンツデータ作用テーブルの内容を例示する図である。例えば、ＰＣ用プレビュー画面生成部５０は、ステップＳ１２において置換されたプレースホルダを含むＨＴＭＬ要素のＩＤを図９に示した形式で記録する。
【００５９】
一方、タブレット用プレビュー画面生成部５１は、タブレット用コンテンツデータ記憶部４３および共通コンテンツデータ記憶部４１から取得したデータに基づいて（ステップＳ１１）、タブレット用プレビュー画面を生成し（ステップＳ１２）、生成したタブレット用プレビュー画面をタブレット用プレビュー画面記憶部５４に保存する。
【００６０】
図１０は、タブレット用コンテンツデータの内容を例示する図である。タブレット用プレビュー画面生成部５１は、ＰＣ用コンテンツデータ（図８）の代わりに、図１０に示したタブレット用コンテンツデータを用いて、図７に示した共通コンテンツデータ中に存在するプレースホルダ（placeholder、$xxxなど）を置換する（ステップＳ１２）。
【００６１】
次に、タブレット用プレビュー画面生成部５１は、共通コンテンツデータ（図７）に対してタブレット用コンテンツデータ（図１０）が作用した部分（置換された部分）を記録し、それをタブレット用コンテンツデータ作用テーブル記憶部５５に保存する（ステップＳ１３）。
【００６２】
＜２．（初期）表示＞
図１１は、情報処理装置１００によるプレビュー画面表示時の動作を例示するフロー図である。初期表示では、例えば、タブレット用プレビュー画面をディスプレイの手前側に表示し、ＰＣ用プレビュー画面を奥側に表示する。
【００６３】
統合プレビュー画面生成部１０は、ＰＣ用プレビュー画面、ＰＣ用コンテンツデータ作用テーブル、タブレット用プレビュー画面、および、タブレット用コンテンツデータ作用テーブルを取得する（ステップＳ２１）。
【００６４】
プレビュー画面位置取得部２２は、プレビュー画面の位置情報を取得する（ステップＳ２２）。ただし、初期表示の際には、デフォルトとして、タブレット用プレビュー画面をディスプレイの手前（ｚ＝−１の位置）に配置し、ＰＣ用プレビュー画面をディスプレイの奥（ｚ＝１の位置）に配置してもよい。
【００６５】
共通画面要素抽出部１１は、２つのプレビュー画面の位置情報に応じて、ｚ座標が小さい方の（すなわち、ディスプレイの手前側に位置する）プレビュー画面を選択する（ステップＳ２３）。初期表示の際には、共通画面要素抽出部１１は、タブレット用プレビュー画面を選択する。
【００６６】
共通画面要素抽出部１１は、タブレット用コンテンツデータ作用テーブルを参照することによって、タブレット用コンテンツデータが作用していない（すなわち、プレースホルダが置換されていない）画面要素を抽出する（ステップＳ２４）。
【００６７】
プレビュー画面透過部１２は、ステップＳ２４で抽出された画面要素の透過率を、ｚ座標に応じて決定する（ステップＳ２５）。プレビュー画面透過部１２は、一例として、透過率を、ｚ＝−１のときに１００％とし、ｚ＝０のときに０％としてもよい。また、プレビュー画面透過部１２は、−１＜ｚ＜０のとき、透過率をｚ座標に比例して線形に変化するように決定してもよい。初期表示の際にタブレット用プレビュー画面の位置をｚ＝−１とした場合、プレビュー画面透過部１２は、例えば、透過率を１００％に設定する。図４は、プレビュー画面の画面要素に対する透過率をｚ座標に応じて変化させる様子を例示する図である。
【００６８】
プレビュー画面統合部１３は、ステップＳ２２で取得した位置情報に従って、ＰＣ用プレビュー画面とタブレット用プレビュー画面を配置し、統合された画面を統合プレビュー画面記憶部５６に保存する（ステップＳ２６）。初期表示の際には、一例として、タブレット用プレビュー画面の差分プレビュー画面をディスプレイの手前側に配置し、ＰＣ用プレビュー画面をディスプレイの奥側に配置する。
【００６９】
次に、画面表示部５７は、統合プレビュー画面を情報処理装置１００のディスプレイに出力する（ステップＳ２７）。
【００７０】
＜３．画面の移動・更新＞
図１１を参照して、プレビュー画面の移動、更新時の動作について説明する
【００７１】
ユーザによる入力インタフェース（例えば、キーボード、マウスなど）を介した入力に従って、統合プレビュー画面操作部２０のプレビュー画面移動部２１は、ＰＣ用プレビュー画面とタブレット用プレビュー画面（または、その差分プレビュー画面）を移動させる。これらのプレビュー画面は、例えば、図３に示すように、環状に移動することができる。
【００７２】
プレビュー画面位置取得部２２は、移動後の２つのプレビュー画面の位置情報を取得する（ステップＳ２２）。
【００７３】
以下、情報処理装置１００は、図１１のステップＳ２３〜Ｓ２７の動作を実行して、プレビュー画面を表示する。
【００７４】
＜４．編集：差分の作成＞
本実施形態の情報処理装置１００は、ＰＣ用コンテンツデータ、タブレット用コンテンツデータ、および、共通コンテンツデータに対するユーザによる編集を受け付ける。
【００７５】
図１２は、情報処理装置１００による編集対象画面を選択する動作を例示するフロー図である。ＰＣ用またはタブレット用の差分に相当するコンテンツデータを編集する場合、上記＜３．画面の移動・更新＞で説明した動作に基づいて、編集対象となるプレビュー画面をディスプレイの手前側に移動させる。
【００７６】
図１２を参照すると、プレビュー画面位置取得部２２は、移動後の２つのプレビュー画面の位置情報を取得する（ステップＳ３１）。手前側（ｚ＜０）に位置する半透明になった状態のプレビュー画面を編集すると（ステップＳ３２のＹｅｓ）、その画面に対応するＰＣ用またはタブレット用のコンテンツデータを編集することができる（ステップＳ３３〜Ｓ３５）。一方、共通コンテンツデータを編集する場合、ディスプレイの奥側（ｚ≧０）に不透明で表示されているプレビュー画面を編集する（ステップＳ３２のＮｏ）。このとき、編集されるプレビュー画面がＰＣ用であるかタブレット用であるかに依らず、共通コンテンツデータを対象とした編集となる（ステップＳ３６）。
【００７７】
ここでは、一例として、図１３に示す共通のコンテンツデータを元にして、ＰＣ用コンテンツデータとタブレット用コンテンツデータを作成する場合について説明する。ここでは、共通コンテンツデータに存在するデータは図１３に示すものであり、ＰＣ用コンテンツデータとタブレット用コンテンツデータには、まだ何もデータが登録されていない状態とする。
【００７８】
図１４は、コンテンツデータに対するユーザの編集を、情報処理装置１００がコンテンツデータに反映する動作を例示するフロー図である。
【００７９】
画面編集部３０の編集部３１は、ユーザから、タブレット用プレビュー画面の画面要素に対するユーザの編集を受け付ける。ここでは、一例として、編集部３１は、図１３に示した<div id = "1">のＨＴＭＬ要素において、図１５に示すようにstyle属性値を"color:blue"に変更し、onmousedown属性名をontouchstart属性名に変更する編集をユーザから受け付けたとする。
【００８０】
コンテンツデータ差分特定部３３は、図１６に示すように、編集前のデータ（図１３の＜div id="1"＞の部分）と編集後のデータを比較して差分を特定する（ステップＳ４１）。
【００８１】
コンテンツデータ更新部３４は、ステップＳ４１で特定した差分に基づいて、共通コンテンツデータ、ＰＣ用コンテンツデータ、および、タブレット用コンテンツデータを次のように更新する。
【００８２】
コンテンツデータ更新部３４は、図１６の差分１および差分２に該当する部分を、それぞれプレースホルダ$xxxと$yyyで置換し、それを共通コンテンツデータに反映する（ステップＳ４２）。結果として、図１３のデータが、図７に示す＜div id="1"＞の部分に書き換えられる。
【００８３】
コンテンツデータ更新部３４は、プレースホルダ$xxxの値として、図１６の編集前のデータ"color:green"を対応付けて、ＰＣ用コンテンツデータに反映する。同様に、コンテンツデータ更新部３４は、プレースホルダ＄yyyの値（value）として、図１６の編集前のデータonmousedownを対応付けて、ＰＣ用コンテンツデータに反映する（ステップＳ４３）。結果として、図８における$xxxおよび$yyyのデータが追加される。
【００８４】
コンテンツデータ更新部３４は、プレースホルダ$xxxの値として、図１６の編集後のデータ"color:blue"を対応付けて、タブレット用コンテンツデータに反映する。同様に、コンテンツデータ更新部３４は、プレースホルダ$yyyの値として、図１６の編集後のデータontouchstartを対応付けて、タブレット用コンテンツデータに反映する（ステップＳ４４）。結果として、図１０における$xxxおよび$yyyのデータが追加される。
【００８５】
コンテンツ表示・編集部２００は、上記＜１．準備＞および＜２．（初期）表示＞を再度実行し、更新後のコンテンツデータを用いてプレビュー画面を再描画する。
【００８６】
＜５．編集：差分の更新＞
次に、上記＜４．編集：差分の作成＞の結果に対し、さらに、ＰＣ用コンテンツデータと共通コンテンツデータを対象として差分データを更新する動作について説明する。図１７は、ＰＣ用コンテンツデータおよび共通コンテンツデータに対するユーザの編集をコンテンツデータに反映する動作を例示するフロー図である。
【００８７】
「ＰＣ用コンテンツデータの更新」
統合プレビュー画面操作部２０のプレビュー画面移動部２１は、ユーザによる入力インタフェース（キーボード、マウスなど）を介した入力を受け付ける。プレビュー画面移動部２１は、入力に従ってＰＣ用プレビュー画面とタブレット用プレビュー画面（またはその差分プレビュー画面）を移動させ、ＰＣ用プレビュー画面をタブレット用プレビュー画面よりもディスプレイの手前側に移動する（ステップＳ５１）。
【００８８】
上記＜３．画面の移動・更新＞の動作によって、ディスプレイの手前側には「ＰＣ用プレビュー画面の差分プレビュー画面」が表示され、ディスプレイの奥側にはタブレット用プレビュー画面が表示される（ステップＳ５２）。
【００８９】
画面編集部３０の編集部３１は、ＰＣ用プレビュー画面の差分プレビュー画面上の画面要素に対するユーザの編集を受け付ける（ステップＳ５３）。ここでは、一例として、編集部３１は、図１８に示すように、style属性値を"color:red"に変更する編集をユーザから受け付けたものとする。
【００９０】
コンテンツデータ差分特定部３３は、図１８の編集前のデータと編集後のデータを比較して、差分を特定する（ステップＳ５４）。
【００９１】
コンテンツデータ更新部３４は、ステップＳ５４で特定した差分に基づいて、ＰＣ用コンテンツデータのプレースホルダ$xxxの値をcolor:redに変更する（ステップＳ５５）。
【００９２】
コンテンツ表示・編集部２００は、上記の＜１．準備＞と＜２．（初期）表示＞を再度実行し、更新後のコンテンツデータを用いてプレビュー画面を再描画する（ステップＳ５６）。
【００９３】
「共通コンテンツデータの更新」
画面編集部３０の編集部３１は、タブレット用プレビュー画面の画面要素に対するユーザの編集を受け付ける（ステップＳ５７）。ここでは、一例として、編集部３１は、図１９に示すように、"func1()"を"func9()"に変更する編集をユーザから受け付けたものとする。
【００９４】
コンテンツデータ更新部３４は、図１９に示した編集後のデータを、共通コンテンツデータに反映する（ステップＳ５８）。
【００９５】
コンテンツ表示・編集部２００は、上記の＜１．準備＞と＜２．（初期）表示＞を再度実行し、更新後のコンテンツデータを用いてプレビュー画面を再描画する（ステップＳ５９）。
【００９６】
＜６．編集：差分の削除＞
図２０は、タブレット用プレビュー画面における差分に相当する画面要素の削除をコンテンツデータに反映する動作を例示するフロー図である。
【００９７】
画面編集部３０の編集部３１は、ユーザから、タブレット用プレビュー画面の差分プレビュー画面に表示された画面要素の削除を受け付ける（ステップＳ６１）。
【００９８】
コンテンツデータ特定部３２は、削除された要素に対応する共通コンテンツデータ、ＰＣ用コンテンツデータ、および、タブレット用コンテンツデータを特定する（ステップＳ６２）。コンテンツデータ特定部３２は、削除された要素のＩＤと、当該要素に含まれるプレースホルダの名前を参照することによって、これらのコンテンツデータを特定することができる。
【００９９】
コンテンツデータ更新部３４は、ステップ６２で特定したタブレット用コンテンツデータを削除する（ステップＳ６３）。
【０１００】
コンテンツデータ更新部３４は、ステップ６２で特定したＰＣ用コンテンツデータを用いて、共通コンテンツデータのプレースホルダ部分を置換する（ステップＳ６４）。図２１は、タブレット用プレビュー画面における差分に相当する画面要素の削除を、共通コンテンツデータに反映する様子を例示する。
【０１０１】
コンテンツデータ更新部３４は、ステップＳ６２で特定したＰＣ用コンテンツデータを削除する（ステップＳ６５）。
【０１０２】
コンテンツ表示・編集部２００は、上記＜１．準備＞および＜２．（初期）表示＞を再度実行し、更新後のコンテンツデータを用いてプレビュー画面を再描画する（ステップＳ６６）。
【０１０３】
次に、本実施形態の情報処理装置１００によってもたらされる効果について説明する。
【０１０４】
情報処理装置１００は、異なる端末のプレビュー画面を同時に表示し、差分のない画面要素をｚ座標に応じて徐々に透明にして、差分のある画面要素だけを強調表示する。これにより、端末に応じた画面表示の差分を判別するユーザの負担を軽減することができる。ここで、情報処理装置１００は、画面要素の透過率をｚ座標とともに非単調に変化させることによって、差分をより判別しやすくすることができる。また、情報処理装置１００は、差分を有する画面要素を振動させることによって、差分をより判別しやすくすることもできる。さらに、情報処理装置１００は、差分を有する画面要素を本来の色と補色との間で交互に変化させることによって、差分をより判別しやすくすることもできる。
【０１０５】
また、情報処理装置１００は、端末に応じたコンテンツデータを編集する際に、編集前後のコンテンツデータの差分を判定すると共に、編集時に選択された画面に基づいて編集対象データを特定し、共通データまたは端末毎のデータの更新のいずれであるかを判断する。これにより、端末に依存するデータと端末に依存しない共通データを管理するユーザの負担を軽減することができる。
【０１０６】
＜実施形態２＞
次に、第２の実施形態に係る情報処理装置について、図面を参照して詳細に説明する。ＰＣを用いてタブレット向けの画面を作成する際、Ｗｅｂアプリケーション・Ｗｅｂサービスの動作に関わるイベント関係の定義情報はプレビュー画面上に表れない。したがって、実機を用いて動作させない限り、コンテンツデータが正しく記載されているかどうか確認することできない。
【０１０７】
例えば、ＰＣ向けのonmousedownというイベントは、タブレット上ではサポートされていない。この場合、タブレット用のイベントとして、onmousedownの代わりに、ontouchstartを使用する必要がある。しかし、タブレット向けのイベントとして誤ってＰＣ向けのイベントを使用した場合であっても、かかる誤りはプレビュー画面上に表示されない。したがって、コンテンツ作成者は、プレビュー前のコンテンツのソースファイルを確認しなければならず、大きな負担となる。
【０１０８】
そこで、本実施形態の情報処理装置においては、タブレットでサポートされないイベント系の情報が共通コンテンツデータで定義されている場合、その情報が定義されている画面要素を点滅させるなどして、コンテンツの作成者に警告を与える。これにより、コンテンツ作成の負担を軽減し、作業効率の向上を図る。
【０１０９】
［構成］
図２２は、本実施形態の情報処理装置１１０の構成を例示するブロック図である。第１の実施形態の情報処理装置１００（図５）と比較すると、本実施形態の情報処理装置１１０は、不適合コンテンツデータ辞書６０、ＰＣ用不適合コンテンツ記憶部６１、タブレット用不適合コンテンツ記憶部６２、警告表示部１５、および、不適合コンテンツデータ校正部３５をさらに備えている。
【０１１０】
図２３は、不適合コンテンツデータ辞書の内容を例示する図である。図２３を参照すると、不適合コンテンツデータ辞書６０は、端末の種類に応じてサポートされていない（すなわち、不適合な）データと、当該データの修正候補の（すなわち、適切な）データとを関連付けて保持する。
【０１１１】
ＰＣ用不適合コンテンツ記憶部６１、および、タブレット用不適合コンテンツ記憶部６２は、それぞれ、ＰＣ用プレビュー画面生成部５０、および、タブレット用プレビュー画面生成部５１が取り扱ったコンテンツデータにおいて、不適合コンテンツデータを含む画面要素のＩＤを保持する。ＰＣ用プレビュー画面生成部５０およびタブレット用プレビュー画面生成部５１は、それぞれ、不適合コンテンツデータ辞書６０を参照することによって、不適合コンテンツデータを含んでいるかどうかを検査する。
【０１１２】
警告表示部１５は、ＰＣ用不適合コンテンツ記憶部６１、および、タブレット用不適合コンテンツ記憶部６２から、不適合コンテンツデータを含む画面要素のＩＤを取得し、当該画面要素を強調表示する。
【０１１３】
不適合コンテンツデータ校正部３５は、不適合コンテンツデータ辞書６０の内容を参照して、編集後のコンテンツデータを検査し、不適合なコンテンツデータを指摘する。また、不適合コンテンツデータ校正部３５は、不適合なコンテンツデータの修正候補を提示する。
【０１１４】
［動作］
次に、本実施形態の情報処理装置１１０（図２２）の動作について説明する。
【０１１５】
＜１．準備＞
図２４は、本実施形態の情報処理装置１１０による画面表示の準備動作を例示するフロー図である。図２４のステップＳ７１、Ｓ７２、Ｓ７５、Ｓ７６は、第１の実施形態の情報処理装置１００の動作を示す図６のステップＳ１１〜Ｓ１３に相当する。ここでは、第１の実施形態に対して追加された動作を中心に説明する。
【０１１６】
ＰＣ用プレビュー画面生成部５０およびタブレット用プレビュー画面生成部５１は、ＰＣ用コンテンツデータとタブレット用コンテンツデータを用いて、共通コンテンツデータのプレースホルダをそれぞれ展開する（ステップＳ７２）。ここでは、一例として、タブレット用のコンテンツデータとして、図１３に示すデータが得られたものとする。
【０１１７】
ＰＣ用プレビュー画面生成部５０およびタブレット用プレビュー画面生成部５１は、ステップＳ７２で生成したコンテンツデータについて、不適合コンテンツデータ辞書６０に登録されたデータを参照して、不適合なデータの有無を検査する（ステップＳ７３）。
【０１１８】
不適合コンテンツデータ辞書６０は、図２３に例示するように、端末の種類に応じてサポートされていないデータと、当該データの修正候補のデータを保持する。タブレット用のコンテンツデータが図１３に示すデータである場合、タブレット用プレビュー画面生成部５１は、タブレットではサポートされていないonmousedownを不適合データとして検出する。
【０１１９】
ＰＣ用プレビュー画面生成部５０は、不適合コンテンツデータ辞書６０に定義されているものと同一のデータが存在する場合、該当する画面要素のＩＤをＰＣ用不適合コンテンツ記憶部６１に記録する。一方、タブレット用プレビュー画面生成部５１は、不適合コンテンツデータ辞書６０に定義されているものと同一のデータが存在する場合、該当する画面要素のＩＤをタブレット用不適合コンテンツ記憶部６２に記録する（ステップＳ７４）。
【０１２０】
タブレット用のコンテンツデータが図１３に示すデータである場合、タブレット用プレビュー画面生成部５１は、onmousedownを含む画面要素＜div id="1"＞のＩＤ＝１をタブレット用不適合コンテンツ記憶部６２に記録する。
【０１２１】
以下の動作（ステップＳ７５、Ｓ７６）は、第１の実施形態における動作（ステップＳ１２の後半、ステップＳ１３）と同様である。
【０１２２】
＜２．（初期）表示＞
図２５は、本実施形態におけるプレビュー画面を表示する動作を例示するフロー図である。図２５のステップＳ８１〜Ｓ８５、Ｓ８８、および、Ｓ８９は、第１の実施形態の情報処理装置１００の動作を示す図１１のステップＳ２１〜Ｓ２７に相当する。ここでは、本実施形態で追加された動作を中心に説明する。
【０１２３】
プレビュー画面透過部１２は、画面要素の一部の透過率を設定した後（ステップＳ８５）、上記＜１．準備＞のステップＳ７４（図２４）において記憶した、不適合なデータを含む画面要素のＩＤ一覧を取得する（ステップＳ８６）。ここでは、一例として、プレビュー画面透過部１２は、タブレット用不適合コンテンツ記憶部６２からＩＤ＝１を取得したものとする。
【０１２４】
警告表示部１５は、取得したＩＤを有する画面要素の透過率を０％に変更し、当該画面要素の上に、例えば、点滅する警告画像を表示する（ステップＳ８７）。なお、警告表示部１５による警告の方法は、かかる方法に限定されない。
【０１２５】
＜３．編集：差分の作成＞
図２６は、本実施形態において、コンテンツデータに対するユーザの編集を受け付ける動作を例示するフロー図である。
【０１２６】
画面編集部３０の編集部３１は、ＰＣ用またはタブレット用プレビュー画面の画面要素に対するユーザの編集を受け付ける（ステップＳ９１）。
【０１２７】
不適合コンテンツデータ校正部３５は、不適合コンテンツデータ辞書６０に格納されているデータを用いて、編集後のコンテンツデータを検査する（ステップＳ９２）。
【０１２８】
編集後のコンテンツデータに不適合なコンテンツデータが存在する場合、不適合コンテンツデータ校正部３５は、当該コンテンツデータを強調表示し（例えば、赤字にする、点滅させる等）、さらに、適切なコンテンツデータを修正候補として提示する（ステップＳ９３）。
【０１２９】
本実施形態の情報処理装置１１０は、端末の種類によってはサポートされていないイベント系の情報を検出し、プレビュー画面上に表示する。なお、本実施形態において、不適合コンテンツデータ辞書６０が保持する知識の内容を増やすことによって、さらに、以下の機能を実現することもできる。
【０１３０】
一例として画面要素の大きさ（高さ、幅）を相対値で指定していない箇所（例えば、１００ｐｘのように、ピクセル数で指定されている箇所）において、タブレットの画面には収まりきらないような大きさが指定されている場合、これを警告するようにしてもよい。また、警告とともに、または、警告の代わりに、その端末に適した画面要素の大きさを提示するようにしてもよい。さらに、ＰＣで見やすいフォントやタブレットで見やすいフォントが設定されていない画面が存在する場合、これらを警告するようにしてもよい。また、警告とともに、または、警告の代わりに、各端末上で見やすいフォントを提示するようにしてもよい。
【０１３１】
本実施形態の情報処理装置１１０は、端末の種類に応じた不適合なコンテンツデータを保持する辞書を用いて、コンテンツデータを検査し、該当するデータを含んだ画面要素をプレビュー画面で強調表示する。これにより、端末の種類に応じた不適合なコンテンツデータを判別するユーザの負担を軽減することができる。
【０１３２】
また、情報処理装置１１０は、端末の種類に応じた不適合なコンテンツデータの辞書を用いて、コンテンツデータを検査し、該当するデータに対する修正候補を提示する。これにより、端末の種類に応じた不適合なコンテンツデータを修正するユーザの負担を軽減することができる。
【０１３３】
＜実施形態の変形例＞
上記実施形態の変形例として、ｚ座標の変化に応じて、透過率を単調に変化させる代わりに、次のように透過率を非単調に変化させてもよい。上記実施形態では、透過率はｚ座標（の絶対値）に比例して一定の割合で単調に変化させるものとした。変形例として、ｚ座標の所定の桁が奇数の場合、透過率を半分の数値に再定してもよい。例えば、ｚ座標が−０．５０から−０．５１，−０．５２と変化した場合、透過率を５０％，２５．５％，５２％のように変化させてもよい。これによって、プレビュー画面のｚ座標を変化させたときの透過率の変化が単調な変化ではなくなる。人間の目には、透過率を単調に変化させるよりも非単調に変化させた方が視認しやすい。したがって、かかる変形例によると、ユーザは２つのプレビュー画面間の差分をより簡単に判別することができる。
【０１３４】
また、他の変形例として、ＰＣ用プレビュー画面とタブレット用プレビュー画面の間で異なる画面要素（差分）を、ディスプレイのｚ座標の変化に応じて振動させてしてもよい。人間の目には、静止している対象よりも動いている対象の方が判別しやすい。したがって、かかる変形例によると、ユーザは２つのプレビュー画面間の差分をより簡単に判別することができる。
【０１３５】
さらに、他の変形例として、ＰＣ用プレビュー画面とタブレット用プレビュー画面の間で異なる画面要素（差分）の色を、ディスプレイのｚ座標の変化に応じて、本来の色とその補色（反対色）とで交互に変化させて表示してもよい。補色同士の色の組み合わせは、互いの色を引き立てる効果がある。したがって、かかる変形例によると、ユーザは２つのプレビュー画面間の差分をより簡単に判別することができる。
【０１３６】
本発明に係る情報処理装置は、一例として、ＷｅｂサービスおよびＷｅｂアプリケーションのコンテンツ編集（画面、レイアウト、デザイン）に適用することができる。
【０１３７】
なお、本発明において、下記の形態が可能である。
［形態１］
上記第１の態様に係る情報処理装置のとおりである。
［形態２］
前記第１の端末および前記第２端末の双方のプレビュー画面を構成する複数の画面要素に対応する複数のデータ要素を保持する第１の記憶手段と、
前記複数のデータ要素に基づいて前記第１の端末用のプレビュー画面を生成する際、前記複数のデータ要素に含まれるプレースホルダを置換するための値を保持する第２の記憶手段と、
前記複数のデータ要素に基づいて前記第２の端末用のプレビュー画面を生成する際、前記複数のデータ要素に含まれるプレースホルダを置換するための値を保持する第３の記憶手段と、を備え、
前記抽出手段は、前記第１の端末または前記第２の端末用のプレビュー画面を生成する際にプレースホルダが置換されないデータ要素に対応する画面要素を、前記共通部分として抽出する、
形態１に記載の情報処理装置。
［形態３］
前記表示手段は、前記第１の記憶手段が保持するデータ要素に含まれるプレースホルダを前記第２の記憶手段が保持する値で置換して前記第１の端末用のプレビュー画面を生成すると共に、前記第１の記憶手段が保持するデータ要素に含まれるプレースホルダを前記第３の記憶手段が保持する値で置換して前記第２の端末用のプレビュー画面を生成する、
形態２に記載の情報処理装置。
［形態４］
前記第１の端末用のプレビュー画面を生成するためのデータ要素に含まれる値に対するユーザの編集を受け付ける編集手段を備え、
前記第１の記憶手段は、編集対象とされたデータ要素において編集された値をプレースホルダに置換したものを保持し、
前記第２の記憶手段は、前記プレースホルダと前記編集前の値の対応関係を保持し、
前記第３の記憶手段は、前記プレースホルダと前記編集後の値の対応関係を保持する、
形態２または３に記載の情報処理装置。
［形態５］
前記第１の端末用のプレビュー画面を生成するためのデータ要素に含まれる値として不適切な値を保持する辞書手段を備え、
前記表示手段は、前記第１の記憶手段が保持する複数のデータ要素に含まれるプレースホルダを前記第２の記憶手段が保持する値で置換したときに、置換後のデータ要素が前記辞書手段に登録された不適切な値を含む場合、前記第１の端末用のプレビュー画面において、不適切な値を含むデータ要素に対応する画面要素の表示態様を調整して表示する、
形態２ないし４のいずれか一に記載の情報処理装置。
［形態６］
前記辞書手段は、前記不適切な値に対する修正候補の値を保持し、
前記表示手段は、前記第１の記憶手段が保持する複数のデータ要素に含まれるプレースホルダを前記第２の記憶手段が保持する値で置換したときに、置換後のデータ要素が前記辞書手段に登録された不適切な値を含む場合、該不適切な値に対する修正候補を表示する、
形態５に記載の情報処理装置。
［形態７］
前記共通部分の透過率を設定する設定手段を備え、
前記表示手段は、前記第１の端末用のプレビュー画面に含まれる前記共通部分を、設定された透過率で表示する、
形態１ないし６のいずれか一に記載の情報処理装置。
［形態８］
前記設定手段は、前記第１の端末用のプレビュー画面の奥行き方向の表示位置に応じて、前記透過率を設定する、
形態７に記載の情報処理装置。
［形態９］
上記第２の態様に係るプレビュー画面表示方法のとおりである。
［形態１０］
前記情報処理装置が、前記第１の端末および前記第２端末の双方のプレビュー画面を構成する複数の画面要素に対応する複数のデータ要素を第１の記憶手段に保持するステップと、
前記複数のデータ要素に基づいて前記第１の端末用のプレビュー画面を生成する際、前記複数のデータ要素に含まれるプレースホルダを置換するための値を第２の記憶手段に保持するステップと、
前記複数のデータ要素に基づいて前記第２の端末用のプレビュー画面を生成する際、前記複数のデータ要素に含まれるプレースホルダを置換するための値を第３の記憶手段に保持するステップと、を含み、
前記情報処理装置は、前記第１の端末または前記第２の端末用のプレビュー画面を生成する際にプレースホルダが置換されないデータ要素に対応する画面要素を、前記共通部分として抽出する、
形態９に記載のプレビュー画面表示方法。
［形態１１］
前記情報処理装置が、前記第１の記憶手段が保持するデータ要素に含まれるプレースホルダを前記第２の記憶手段が保持する値で置換して前記第１の端末用のプレビュー画面を生成するステップと、
前記第１の記憶手段が保持するデータ要素に含まれるプレースホルダを前記第３の記憶手段が保持する値で置換して前記第２の端末用のプレビュー画面を生成するステップと、を含む、
形態１０に記載のプレビュー画面表示方法。
［形態１２］
前記情報処理装置が、前記第１の端末用のプレビュー画面を生成するためのデータ要素に含まれる値に対するユーザの編集を受け付けるステップと、
編集対象とされたデータ要素において編集された値をプレースホルダに置換したものを前記第１の記憶手段に蓄積するステップと、
前記プレースホルダと前記編集前の値の対応関係を前記第２の記憶手段に蓄積するステップと、
前記プレースホルダと前記編集後の値の対応関係を前記第３の記憶手段に蓄積するステップと、を含む、
形態１０または１１に記載のプレビュー画面表示方法。
［形態１３］
前記情報処理装置が、前記第１の端末用のプレビュー画面を生成するためのデータ要素に含まれる値として不適切な値を辞書手段に保持するステップと、
前記第１の記憶手段が保持する複数のデータ要素に含まれるプレースホルダを前記第２の記憶手段が保持する値で置換したときに、置換後のデータ要素が前記辞書手段に登録された不適切な値を含む場合、前記第１の端末用のプレビュー画面において、不適切な値を含むデータ要素に対応する画面要素の表示態様を調整して表示するステップと、を含む、
形態１０ないし１２のいずれか一に記載のプレビュー画面表示方法。
［形態１４］
前記情報処理装置が、前記不適切な値に対する修正候補の値を前記辞書手段に保持するステップと、
前記第１の記憶手段が保持する複数のデータ要素に含まれるプレースホルダを前記第２の記憶手段が保持する値で置換したときに、置換後のデータ要素が前記辞書手段に登録された不適切な値を含む場合、該不適切な値に対する修正候補を表示するステップと、を含む、
形態１３に記載のプレビュー画面表示方法。
［形態１５］
前記情報処理装置が、前記共通部分の透過率を設定するステップを含み、
前記情報処理装置は、前記第１の端末用のプレビュー画面に含まれる前記共通部分を、設定された透過率で表示する、
形態９ないし１４のいずれか一に記載のプレビュー画面表示方法。
［形態１６］
前記情報処理装置は、前記第１の端末用のプレビュー画面の奥行き方向の表示位置に応じて、前記透過率を設定する、
形態１５に記載のプレビュー画面表示方法。
［形態１７］
上記第３の態様に係るプログラムのとおりである。
［形態１８］
前記第１の端末および前記第２端末の双方のプレビュー画面を構成する複数の画面要素に対応する複数のデータ要素を第１の記憶手段に保持する処理と、
前記複数のデータ要素に基づいて前記第１の端末用のプレビュー画面を生成する際、前記複数のデータ要素に含まれるプレースホルダを置換するための値を第２の記憶手段に保持する処理と、
前記複数のデータ要素に基づいて前記第２の端末用のプレビュー画面を生成する際、前記複数のデータ要素に含まれるプレースホルダを置換するための値を第３の記憶手段に保持する処理と、
前記第１の端末または前記第２の端末用のプレビュー画面を生成する際にプレースホルダが置換されないデータ要素に対応する画面要素を、前記共通部分として抽出する処理と、を前記コンピュータに実行させる、
形態１７に記載のプログラム。
［形態１９］
前記第１の記憶手段が保持するデータ要素に含まれるプレースホルダを前記第２の記憶手段が保持する値で置換して前記第１の端末用のプレビュー画面を生成する処理と、
前記第１の記憶手段が保持するデータ要素に含まれるプレースホルダを前記第３の記憶手段が保持する値で置換して前記第２の端末用のプレビュー画面を生成する処理と、を前記コンピュータに実行させる、
形態１８に記載のプログラム。
［形態２０］
前記第１の端末用のプレビュー画面を生成するためのデータ要素に含まれる値に対するユーザの編集を受け付ける処理と、
編集対象とされたデータ要素において編集された値をプレースホルダに置換したものを前記第１の記憶手段に蓄積する処理と、
前記プレースホルダと前記編集前の値の対応関係を前記第２の記憶手段に蓄積する処理と、
前記プレースホルダと前記編集後の値の対応関係を前記第３の記憶手段に蓄積する処理と、を前記コンピュータに実行させる、
形態１８または１９に記載のプログラム。
［形態２１］
前記第１の端末用のプレビュー画面を生成するためのデータ要素に含まれる値として不適切な値を辞書手段に保持する処理と、
前記第１の記憶手段が保持する複数のデータ要素に含まれるプレースホルダを前記第２の記憶手段が保持する値で置換したときに、置換後のデータ要素が前記辞書手段に登録された不適切な値を含む場合、前記第１の端末用のプレビュー画面において、不適切な値を含むデータ要素に対応する画面要素の表示態様を調整して表示する処理と、を前記コンピュータに実行させる、
形態１８ないし２０のいずれか一に記載のプログラム。
［形態２２］
前記不適切な値に対する修正候補の値を前記辞書手段に保持する処理と、
前記第１の記憶手段が保持する複数のデータ要素に含まれるプレースホルダを前記第２の記憶手段が保持する値で置換したときに、置換後のデータ要素が前記辞書手段に登録された不適切な値を含む場合、該不適切な値に対する修正候補を表示する処理と、を前記コンピュータに実行させる、
形態２１に記載のプログラム。
［形態２３］
前記共通部分の透過率を設定する処理と、
前記情報処理装置は、前記第１の端末用のプレビュー画面に含まれる前記共通部分を、設定された透過率で表示する処理と、を前記コンピュータに実行させる、
形態１７ないし２２のいずれか一に記載のプログラム。
［形態２４］
前記第１の端末用のプレビュー画面の奥行き方向の表示位置に応じて、前記透過率を設定する処理を、前記コンピュータに実行させる、
形態２３に記載のプログラム。
【０１３８】
なお、上記特許文献の全開示内容は、本書に引用をもって繰り込み記載されているものとする。本発明の全開示（請求の範囲を含む）の枠内において、さらにその基本的技術思想に基づいて、実施形態の変更・調整が可能である。また、本発明の全開示の枠内において種々の開示要素（各請求項の各要素、各実施形態の各要素、各図面の各要素等を含む）の多様な組み合わせ、ないし、選択が可能である。すなわち、本発明は、請求の範囲を含む全開示、技術的思想にしたがって当業者であればなし得るであろう各種変形、修正を含むことは勿論である。特に、本書に記載した数値範囲については、当該範囲内に含まれる任意の数値ないし小範囲が、別段の記載のない場合でも具体的に記載されているものと解釈されるべきである。
【符号の説明】
【０１３９】
１０    統合プレビュー画面生成部
１１    共通画面要素抽出部
１２    プレビュー画面透過部
１３    プレビュー画面統合部
１５    警告表示部
２０    統合プレビュー画面操作部
２１    プレビュー画面移動部
２２    プレビュー画面位置取得部
３０    画面編集部
３１    編集部
３２    コンテンツデータ特定部
３３    コンテンツデータ差分特定部
３４    コンテンツデータ更新部
３５    不適合コンテンツデータ校正部
４１    共通コンテンツデータ記憶部
４２    ＰＣ用コンテンツデータ記憶部
４３    タブレット用コンテンツデータ記憶部
５０    ＰＣ用プレビュー画面生成部
５１    タブレット用プレビュー画面生成部
５２    ＰＣ用プレビュー画面記憶部
５３    ＰＣ用コンテンツデータ作用テーブル記憶部
５４    タブレット用プレビュー画面記憶部
５５    タブレット用コンテンツデータ作用テーブル記憶部
５６    統合プレビュー画面記憶部
５７    画面表示部
６０    不適合コンテンツデータ辞書
６１    ＰＣ用不適合コンテンツ記憶部
６２    タブレット用不適合コンテンツ記憶部
１００、１１０、３１０、３２０    情報処理装置
１１１    抽出手段
１１２    設定手段
１３１    編集手段
１４１〜１４３    記憶手段
１５７    表示手段
１６０    辞書手段
２００、２１０    コンテンツ表示・編集部
【図１】
2015191356.tif 000003
【図２】
2015191356.tif 000004
【図３】
2015191356.tif 000005
【図４】
2015191356.tif 000006
【図５】
2015191356.tif 000007
【図６】
2015191356.tif 000008
【図７】
2015191356.tif 000009
【図８】
2015191356.tif 000010
【図９】
2015191356.tif 000011
【図１０】
2015191356.tif 000012
【図１１】
2015191356.tif 000013
【図１２】
2015191356.tif 000014
【図１３】
2015191356.tif 000015
【図１４】
2015191356.tif 000016
【図１５】
2015191356.tif 000017
【図１６】
2015191356.tif 000018
【図１７】
2015191356.tif 000019
【図１８】
2015191356.tif 000020
【図１９】
2015191356.tif 000021
【図２０】
2015191356.tif 000022
【図２１】
2015191356.tif 000023
【図２２】
2015191356.tif 000024
【図２３】
2015191356.tif 000025
【図２４】
2015191356.tif 000026
【図２５】
2015191356.tif 000027
【図２６】
2015191356.tif 000028