JP6918057B2 - 画面開発支援装置、画面開発支援方法及び画面開発支援プログラム - Google Patents

Description

この発明は、条件に応じた画面表示を行う画面表示システム等の開発支援技術に関する。

ウェブサイト等の画面表示を伴うシステムの開発を行う場合には、開発者はシステムを提供する顧客の要望に基づき画面設計を行う。その後、開発者は、画面設計に基づく表示例を顧客に提示し、顧客からの変更の要望に基づき画面設計に修正を加えるという作業を繰り返し行う。
多くの画面表示を伴うシステムは、システムの利用者からの設定入力等の条件に応じて動的に画面の表示内容が切り替わる。顧客に提示される表示例は、ある条件における表示内容を表示する表示コードを画面設計に基づき生成することにより作成される。これにより、顧客は、画面設計を採用した場合の正確な表示イメージを確認可能である。

特許文献１には、表示コードからソースコードとテストデータとを抽出するとともに、ソースコードとテストデータとから表示コードを生成することが記載されている。これにより、特許文献１では、画面デザインを行い表示コードを生成するデザイナーと、動的に画面の表示内容を切り替えるといったロジック開発を行いソースコードを生成するロジック開発者とがウェブページ等の画面の開発を共同で行う際の効率化を図っている。

特開２０１２−１８１６３６号公報

表示例を顧客に提示し、要望に基づき画面設計に修正を加えるという作業を繰り返し行う場合には、画面設計に修正を加える度に、表示例である表示コードを作成する必要があり、開発者に負担がかかる。
また、開発フェーズがある程度進むと、画面設計と並行してロジック開発も進められ、条件に応じて動的に表示コードを出力する動的コードが作成される。この段階で画面設計に修正が加わると、動的コードに修正を加えることにより、表示例である表示コードが作成されることになる。動的コードに修正を加える作業は、表示コードに修正を加える作業に比べ、負担が大きい。

特許文献１に記載された技術は、デザイナーとロジック開発者とが画面の開発を共同で行う際の効率化することは可能である。しかし、顧客との間で画面設計を進める作業における開発者の負担を軽減することは難しい。

この発明は、顧客との間で画面設計を進める作業における開発者の負担を軽減可能にすることを目的とする。

この発明に係る画面開発支援装置は、
画面表示の仕様を表す設計書データを取得する設計書取得部と、
前記設計書取得部によって取得された前記設計書データを変換して、前記画面表示を行う表示命令を動的に出力する動的コードを生成する動的コード生成部と、
前記設計書データを変換して、選択状態における前記画面表示を行う表示命令を出力する表示コードを生成する表示コード生成部と
を備える。

この発明では、設計書データから動的コードが生成されるとともに、選択状態における表示コードが生成される。これにより、開発者が顧客の要望に基づき設計書データを変更すれば、要望を反映した動的コードと、選択状態における要望を反映した表示コードとが生成される。そのため、顧客との間で画面設計を進める作業における開発者の負担を軽減可能である。

実施の形態１に係る画面開発支援装置１０の構成図。 実施の形態１に係る画面開発支援装置１０の動作概要の説明図。 実施の形態１に係る設計書データ３４の説明図。 実施の形態１に係る項目定義３４１の説明図。 実施の形態１に係る制御定義３４２の説明図。 実施の形態１に係る文言定義３４３の説明図。 実施の形態１に係る画面開発支援装置１０の動作を示すフローチャート。 実施の形態１に係る出し分けのプログラムコードの例を示す図。 実施の形態１に係る状態選択画面の例を示す図。 実施の形態１に係る表示コード３３によって表されたウェブ画面の例を示す図。 実施の形態１に係る表示コード３３によって表されたウェブ画面の例を示す図。 実施の形態１に係る画面開発支援装置１０を用いたウェブ画面開発の流れの一例の説明図。 変形例１に係る画面開発支援装置１０の構成図。

実施の形態１．
＊＊＊構成の説明＊＊＊
図１を参照して、実施の形態１に係る画面開発支援装置１０の構成を説明する。
画面開発支援装置１０は、コンピュータである。
画面開発支援装置１０は、プロセッサ１１と、メモリ１２と、ストレージ１３と、通信インタフェース１４とのハードウェアを備える。プロセッサ１１は、信号線を介して他のハードウェアと接続され、これら他のハードウェアを制御する。

プロセッサ１１は、プロセッシングを行うＩＣ（Ｉｎｔｅｇｒａｔｅｄ Ｃｉｒｃｕｉｔ）である。プロセッサ１１は、具体例としては、ＣＰＵ（Ｃｅｎｔｒａｌ Ｐｒｏｃｅｓｓｉｎｇ Ｕｎｉｔ）、ＤＳＰ（Ｄｉｇｉｔａｌ Ｓｉｇｎａｌ Ｐｒｏｃｅｓｓｏｒ）、ＧＰＵ（Ｇｒａｐｈｉｃｓ Ｐｒｏｃｅｓｓｉｎｇ Ｕｎｉｔ）である。

メモリ１２は、データを一時的に記憶する記憶装置である。メモリ１２は、具体例としては、ＳＲＡＭ（Ｓｔａｔｉｃ Ｒａｎｄｏｍ Ａｃｃｅｓｓ Ｍｅｍｏｒｙ）、ＤＲＡＭ（Ｄｙｎａｍｉｃ Ｒａｎｄｏｍ Ａｃｃｅｓｓ Ｍｅｍｏｒｙ）である。

ストレージ１３は、データを保管する記憶装置である。ストレージ１３は、具体例としては、ＨＤＤ（Ｈａｒｄ Ｄｉｓｋ Ｄｒｉｖｅ）である。また、ストレージ１３は、ＳＤ（登録商標，Ｓｅｃｕｒｅ Ｄｉｇｉｔａｌ）メモリカード、ＣＦ（ＣｏｍｐａｃｔＦｌａｓｈ，登録商標）、ＮＡＮＤフラッシュ、フレキシブルディスク、光ディスク、コンパクトディスク、ブルーレイ（登録商標）ディスク、ＤＶＤ（Ｄｉｇｉｔａｌ Ｖｅｒｓａｔｉｌｅ Ｄｉｓｋ）といった可搬記録媒体であってもよい。

通信インタフェース１４は、外部の装置と通信するためのインタフェースである。通信インタフェース１４は、具体例としては、Ｅｔｈｅｒｎｅｔ（登録商標）、ＵＳＢ（Ｕｎｉｖｅｒｓａｌ Ｓｅｒｉａｌ Ｂｕｓ）、ＨＤＭＩ（登録商標，Ｈｉｇｈ−Ｄｅｆｉｎｉｔｉｏｎ Ｍｕｌｔｉｍｅｄｉａ Ｉｎｔｅｒｆａｃｅ）のポートである。

画面開発支援装置１０は、機能構成要素として、設計書取得部２１と、画面表示部２２と、動的コード生成部２３と、表示コード生成部２４とを備える。画面開発支援装置１０の各機能構成要素の機能はソフトウェアにより実現される。
ストレージ１３には、画面開発支援装置１０の各機能構成要素の機能を実現するプログラムが格納されている。このプログラムは、プロセッサ１１によりメモリ１２に読み込まれ、プロセッサ１１によって実行される。これにより、画面開発支援装置１０の各機能構成要素の機能が実現される。

図１では、プロセッサ１１は、１つだけ示されていた。しかし、プロセッサ１１は、複数であってもよく、複数のプロセッサ１１が、各機能を実現するプログラムを連携して実行してもよい。

＊＊＊動作の説明＊＊＊
図２から図１２を参照して、実施の形態１に係る画面開発支援装置１０の動作を説明する。
実施の形態１に係る画面開発支援装置１０の動作手順は、実施の形態１に係る画面開発支援方法に相当する。また、実施の形態１に係る画面開発支援装置１０の動作を実現するプログラムは、実施の形態１に係る画面開発支援プログラムに相当する。

図２を参照して、実施の形態１に係る画面開発支援装置１０の動作の概要を説明する。実施の形態１では、ウェブサイト用のウェブ画面を開発するときの画面開発支援装置１０の動作について説明する。
画面開発支援装置１０は、入力データ３１を入力として、画面表示を行う表示命令を動的に出力する動的コード３２と、選択状態における画面表示を行う表示命令を出力する表示コード３３を生成する。
動的コード３２は、実施の形態１では、ＪＳＰ（ＪａｖａＳｅｒｖｅｒ Ｐａｇｅｓ）を用いて記述されたプログラムコードである。また、表示コード３３は、タグを含むマークアップ言語で記述されたプログラムコードであり、実施の形態１では、ＨＴＭＬ（ＨｙｐｅｒＴｅｘｔ Ｍａｒｋｕｐ Ｌａｎｇｕａｇｅ）を用いて記述されたプログラムコードである。選択状態における画面表示とは、制御または表示に関する選択肢があるとき、開発者によりいずれかの選択肢が選択された状態における画面表示を意味する。表示コード３３であるＨＴＭＬプログラムコードをＨＴＭＬプレビュー表示させることにより、動的コード３２により動的に出力される画面表示を個別に確認することができる。

入力データ３１は、設計書データ３４と、テンプレート３５と、画像データ３６とを含む。
設計書データ３４は、表計算ソフトウェアによって表形式で作成されたウェブ画面の仕様を表すデータである。設計書データ３４は、ウェブ画面を構成する複数の表示項目についての仕様を表す。表示項目とは、画面オブジェクトと表示文言といったウェブ画面に表示される項目である。
テンプレート３５は、設計書データ３４が表す各表示項目をプログラムコードに変換するためのデータであり、プログラムコードの雛形である。設計書データ３４が表す表示項目に対応する雛形に、その表示項目について設定された情報を埋め込むことにより、その表示項目を表すプログラムコードが生成される。テンプレート３５には、動的コード生成用のテンプレートである第１テンプレート３５１と、表示コード生成用のテンプレートである第２テンプレート３５２とが含まれる。
画像データ３６は、画面オブジェクトとしてアイコン及びボタンといった表示項目を表すための画像である。画像データ３６は、設計書データ３４の表示項目の仕様として指定され、利用される。

図３を参照して、実施の形態１に係る設計書データ３４を説明する。
設計書データ３４は、項目定義３４１と、制御定義３４２と、文言定義３４３とを含む。実施の形態１では、項目定義３４１と制御定義３４２と文言定義３４３とは、それぞれ別のシートとして作成される。
項目定義３４１は、各表示項目について、テンプレート３５の割り当てと、テンプレート３５に埋め込む情報として各種パラメータとが定義される。制御定義３４２は、少なくとも一部の表示項目について表示条件が設定される。つまり、制御定義３４２は、少なくとも一部の表示項目について、どの場合に表示され、どの場合に表示されないかを制御する項目の出し分け制御が定義される。文言定義３４３は、少なくとも一部の表示項目に埋め込まれる文言が定義される。また、文言定義３４３は、文言の出し分け制御が定義される場合がある。出し分け制御とは、制御や文言表示に関して、複数の選択肢があるとき、開発者等の選択により、選択肢の中のどの選択を出し分けるかを制御することを意味する。

図４を参照して、実施の形態１に係る項目定義３４１を説明する。
項目定義３４１は、項番毎に、項目名と、深度と、入出力と、タグと、部品名称と、説明と、初期値とが設定される。項目定義３４１は、各行が１つの表示項目を表している。
項番は、表示項目の識別子である。項目名は、表示項目の名称である。深度は、表示項目を表すコードの階層を指定する値である。入出力は、入出力項目であるか否かを示す。タグは、テンプレート３５における雛形との紐づけ情報である。部品名称は、テンプレート３５の部品の名称である。説明は、表示項目の説明である。初期値は、表示項目に設定される文字列である。初期値に［文言定義］と設定されている場合には、文言定義３４３で文字列が定義されることを意味する。また、表示する文字列に付随して修飾する文字サイズ、文字色、文字フォント、字体等の情報（図示せず）がある。

図５を参照して、実施の形態１に係る制御定義３４２を説明する。
制御定義３４２は、項番毎に、項目名と、オブジェクト出し分けとが設定される。
項番は、表示項目の識別子であり、項目定義３４１に設定された項番のうち、出し分け制御が行われる項番が設定される。項目名は、表示項目の名称である。オブジェクト出し分けは、表示項目の出し分け制御を行うための表示条件が設定される。
図５では、オブジェクト出し分けに、“〇”が設定されている場合にはその項目は表示され、“×”が設定されている場合にはその項目は表示されないことを意味している。また、オブジェクト出し分けに“−”が設定されている場合には、その項目はそのオブジェクト出し分けの対象外であることを意味する。
したがって、パターン１の場合には、項番７の但し書パターン１は表示され、項番７−１の但し書パターン２は表示されない。また、パターン２の場合には、項番７−１の但し書パターン２は表示され、項番７の但し書パターン１は表示されない。

図６を参照して、実施の形態１に係る文言定義３４３を説明する。
文言定義３４３は、項番毎に、項目名と、文言出し分けと、出し分け条件と、出力文言とが設定される。
項番は、表示項目の識別子であり、項目定義３４１に設定された項番のうち、文言定義がされる項番が設定される。具体的には、項目定義３４１の初期値として［文言定義］と設定された項番が設定される。項目名は、表示項目の名称である。出し分けは、文言の出し分け制御がされる場合に、“〇”が設定され、出し分け制御がされない場合に、“−”が設定される。つまり、文言出し分けは、制御定義３４２に設定された項番については“〇”が設定され、その他の項番については“−”が設定される。
図６では、項番４の説明文について、文言出し分けに“〇”が設定されている。項番４の説明文は、出し分け条件及び出力文言の欄に設定されているように、国内会員であるか、海外会員であるかによって、文言が切り替えられるようになっている。

図７を参照して、実施の形態１に係る画面開発支援装置１０の動作を説明する。
（ステップＳ１１：設計書取得処理）
設計書取得部２１は、ウェブ画面の仕様を表す設計書データ３４を取得する。
具体的には、開発者等によって設計書データ３４が作成され、ストレージ１３又は画面開発支援装置１０の外部の記憶装置に設計書データ３４が記憶される。設計書取得部２１は、ストレージ１３又は画面開発支援装置１０の外部の記憶装置から設計書データ３４を読み出す。設計書取得部２１は、設計書データ３４をメモリ１２に書き込む。

（ステップＳ１２：コード選択画面表示処理）
画面表示部２２は、動的コード３２を生成するか、又は、表示コード３３を生成するかを選択させるコード選択画面を表示する。
具体的には、画面表示部２２は、動的コード３２を生成するか、又は、表示コード３３を生成するかを選択させるコード選択画面を、通信インタフェース１４を介して表示装置に出力する。これにより、コード選択画面が表示装置に表示される。
動的コード３２を生成することが選択された場合には、画面表示部２２は処理をステップＳ１３に進める。一方、表示コード３３を生成することが選択された場合には、画面表示部２２は処理をステップＳ１４に進める。

（ステップＳ１３：動的コード生成処理）
動的コード生成部２３は、ステップＳ１１で取得された設計書データ３４を変換して、画面表示を行う表示命令を動的に出力する動的コード３２を生成する。
具体的には、動的コード生成部２３は、動的コード生成用のテンプレート３５である第１テンプレート３５１を用いて設計書データ３４を変換して、動的コード３２を生成する。つまり、動的コード生成部２３は、設計書データ３４が表す各表示項目を対象として、対象の表示項目に対応する第１テンプレート３５１における雛形に、対象の表示項目について設計書データ３４で設定された情報を埋め込むことにより、動的コード３２を生成する。

より具体的には、動的コード生成部２３は、設計書データ３４に含まれる項目定義３４１の１行目から順に各行を対象として読み込む。動的コード生成部２３は、対象の行が読み込まれると対象の行が表す表示項目に対応する第１テンプレート３５１の雛形に、対象の行に設定された情報を埋め込んで、対象の行が表す表示項目に対応するプログラムコードを生成する。対象の行が表す表示項目に対応する第１テンプレート３５１における雛形は、対象の行のタグ（図４参照）によって特定される。つまりタグごとに第１テンプレート３５１が記憶されている。
この際、動的コード生成部２３は、対象の表示項目についての深度に応じて字下げして、対象の表示項目を表すプログラムコードを記述する。例えば、動的コード生成部２３は、深度が１であれば字下げせず、深度が２であれば１段階字下げし、深度が３であれば２段階字下げする。
また、動的コード生成部２３は、対象の行が表す表示項目によっては、対象の行が読み込まれると対象の行が表す表示項目についての開始コード及び要素を設定し、対象の行が表す表示項目についての深度よりも小さい深度の行が読み込まれると、対象の行が表す表示項目についての終了コードを設定する。例えば、表示項目がフォントの指定であれば、開始コード及び要素は、開始タグ“＜ｆｏｎｔ ｓｉｚｅ＝“ｘｘ” ｃｏｌｏｒ＝“＃ｘｘｘｘｘｘ”＞”、であり、終了コードは、終了タグ“＜／ｆｏｎｔ＞”である。また、表示項目が繰り返しを表すｆｏｒ文であれば、開始コード及び終了コードは、ｆｏｒ文の繰り返しの開始を表す記号“｛”、及び、終了を表す記号“｝”である。また、要素は、繰り返しの実体を表す“ｆｏｒ（ｖａｒ ｉ＝０；ｉ＜１０；ｉ＋＋）”といったコードである。

また、動的コード生成部２３は、制御定義３４２に設定された項番が示す表示項目について、表示条件を満たす場合には表示され、表示条件を満たさない場合には表示されないように画面表示を行う表示命令を出力する動的コード３２を生成する。例えば、図８に示すように、項番７の但し書パターン１及び項番７−１の但し書パターン２については、ｉｆ文を使った条件分けがされたプログラムコードが記述される。
動的コード生成部２３は、文言定義３４３で出し分け制御を行うように設定された表示項目についても、同様に、表示条件を満たす場合には表示され、表示条件を満たさない場合には表示されないように画面表示を行う表示命令を出力する動的コード３２を生成する。

これにより、動的コード生成部２３は、動的コード３２を生成する。そして、動的コード生成部２３は、生成された動的コード３２を通信インタフェース１４を介して開発者等の端末に出力する。

（ステップＳ１４：状態選択画面表示処理）
画面表示部２２は、どの状態における表示コード３３を生成するかを表す選択状態を選択させる状態選択画面を表示する。
具体的には、画面表示部２２は、ステップＳ１１で取得された設計書データ３４において出し分け制御の対象となっている項目について、どのような状態で表示させるかを表す選択状態を選択させる状態選択画面を生成する。画面表示部２２は、生成された状態選択画面を、通信インタフェース１４を介して表示装置に出力する。これにより、状態選択画面が表示装置に表示される。
例えば、ステップＳ１１で取得された設計書データ３４には、図４に示す項目定義３４１と、図５に示す制御定義３４２と、図６に示す文言定義３４３とが含まれていたとする。この場合には、制御定義３４２において、項番７の但し書パターン１及び項番７−１の但し書パターン２がオブジェクト出し分けの対象になっている。オブジェクト出し分けとは、制御対象とするオブジェクトの選択肢があり、管理者によりいずれかを選択させることを意味する。また、文言定義３４３において、項番４の説明文が文言出し分け制御の対象になっている。文言出し分けとは、文言に関して選択肢があり、管理者によりいずれかを選択させることを意味する。したがって、図９に示すように、これらの項目についてどのような状態で制御させ、表示させるかを表す選択状態の状態選択画面が生成される。選択状態が選択されると、画面表示部２２は処理をステップＳ１５に進める。

（ステップＳ１５：表示コード生成処理）
表示コード生成部２４は、ステップＳ１１で取得された設計書データ３４を変換して、ステップＳ１４で選択された選択状態における画面表示を行う表示命令を出力する表示コード３３を生成する。
具体的には、表示コード生成部２４は、表示コード生成用のテンプレート３５である第２テンプレート３５２を用いて設計書データ３４を変換して、表示コード３３を生成する。つまり、表示コード生成部２４は、設計書データ３４が表す各表示項目を対象として、対象の表示項目に対応する第２テンプレート３５２における雛形に、対象の表示項目について設計書データ３４で設定された情報を埋め込むことにより、表示コード３３を生成する。より具体的には、表示コード生成部２４は、設計書データ３４に含まれる項目定義３４１の１行目から順に各行を対象として読み込む。表示コード生成部２４は、対象の行が読み込まれると対象の行が表す表示項目に対応する第２テンプレート３５２の雛形に、対象の行に設定された情報を埋め込んで、対象の行が表す表示項目に対応するプログラムコードを生成する。

この際、動的コード生成部２３が動的コード３２を生成する場合と同様に、表示コード生成部２４は、対象の表示項目についての深度に応じて字下げして、対象の表示項目を表すプログラムコードを記述する。また、表示コード生成部２４は、対象の行が表す表示項目によっては、対象の行が読み込まれると対象の行が表す表示項目についての開始コード及び要素を設定し、対象の行が表す表示項目についての深度よりも小さい深度の行が読み込まれると、対象の行が表す表示項目についての終了コードを設定する。

また、表示コード生成部２４は、制御定義３４２に設定された項番が示す表示項目について、選択状態が表示条件を満たす場合には表示される表示コード３３を生成し、選択状態が表示条件を満たさない場合には表示されない表示コード３３を生成する。
表示コード生成部２４は、文言定義３４３で出し分け制御を行うように設定された表示項目についても、同様に、選択状態が表示条件を満たす場合には表示されるように画面表示を行う表示命令を出力する表示コード３３を生成し、選択状態が表示条件を満たさない場合には表示されないように画面表示を行う表示命令を出力する表示コード３３を生成する。

これにより、表示コード生成部２４は、表示コード３３を生成する。そして、表示コード生成部２４は、生成された表示コード３３を通信インタフェース１４を介して開発者等の端末に出力する。その結果、端末のブラウザに、表示コード３３によって表されたウェブ画面が表示される。

具体例としては、図９でパターン１及び国内会員が選択された場合には、図１０に示すように、項番４の説明文として、日本語の説明文が表示され、項番７の日本語の但し書が表示されるウェブ画面を表す表示コード３３が生成される。一方、図９でパターン２及び海外会員が選択された場合には、図１１に示すように、項番４の説明文として、英語の説明文が表示され、項番７−１の英語の但し書が表示されるウェブ画面を表す表示コード３３が生成される。

図１２を参照して、実施の形態１に係る画面開発支援装置１０を用いたウェブ画面開発の流れの一例を説明する。
（１）開発者が設計書データ３４を作成する。そして、開発者は、設計書データ３４に基づき、画面開発支援装置１０に表示コード３３を生成させる。
（２）（１）で生成された表示コード３３が表すウェブ画面を顧客が確認する。顧客は、表示位置及び表示順序といった表示内容の変更を開発者に依頼する。
（３）開発者は、（２）で依頼された表示内容の変更に従い、設計書データ３４を修正する。この際、開発者は、設計書データ３４の修正中に、画面開発支援装置１０に表示コード３３を生成させて、依頼された通りにウェブ画面が修正されていることを確認する。 （４）（３）の処理と並行して、顧客は、ウェブ画面に表示させる文言といった技術者でなくても可能な修正を設計書データ３４に対して行う。例えば、顧客は、設計書データ３４のうち、文言定義３４３だけに修正を加える。この際、顧客は、設計書データ３４の修正中に、画面開発支援装置１０に表示コード３３を生成させて、想像した通りにウェブ画面が修正されていることを確認する。
（５）（４）で修正された設計書データ３４を顧客が開発者に渡す。また、顧客は、修正個所を開発者に伝える。
（６）開発者は、（５）で渡された設計書データ３４の修正個所を、（３）で修正した設計書データ３４に反映する。例えば、開発者は、文言定義３４３の出力文言が修正されたとする。この場合には、（５）で渡された設計書データ３４のうちの修正された行のデータで、（３）で修正した設計書データ３４の対応する行のデータを上書きする。そして、開発者は、修正を反映した設計書データ３４に基づき、画面開発支援装置１０に表示コード３３を生成させる。
（７）（６）で生成された表示コード３３が表すウェブ画面を顧客が確認する。顧客は、さらに修正が必要であれば、開発者に依頼し、（３）の処理に戻る。一方、修正が必要なければ、ウェブ画面の設計は完了になる。
（８）ウェブ画面の設計が完了すると、開発者は、設計書データ３４に基づき、画面開発支援装置１０に動的コード３２を生成させる。そして、開発者は、動的コード３２の動作の確認を行う。

＊＊＊実施の形態１の効果＊＊＊
以上のように、実施の形態１に係る画面開発支援装置１０は、設計書データ３４から表示命令を動的に出力する動的コード３２を生成するとともに、選択状態における画面表示を行う表示命令を出力する表示コード３３を生成する。これにより、開発者が顧客の要望に基づき設計書データ３４を変更すれば、要望を反映した動的コード３２と、選択状態における要望を反映した画面表示を行う表示コード３３とが生成される。そして表示コード３３をプレビュー表示し画面表示をシミュレーションすることにより、開発者と顧客との間で、動的コード３２による画面表示の画面設計を共有するために用いることができる。そのため、顧客との間で画面設計を進める作業における開発者の負担を軽減可能である。

また、設計書データ３４は、表計算ソフトウェアによって表形式で作成される。そのため、ウェブ画面に表示させる文言といった技術者でなくても可能な修正であれば、顧客であっても行うことができる。したがって、このような修正に関しては、顧客が、設計書データ３４を修正し、修正された設計書データ３４から表示コード３３を生成して、表示コード３３が表すウェブ画面の確認が可能である。例えば、説明文を修正した場合に、ウェブ画面のレイアウトとして適切な範囲に収まるかを確認するといったことであれば、開発者に依頼しなくても、顧客自身が行うことができる。そのため、顧客との間で画面設計を進める作業における開発者の負担を軽減可能である。
特に、設計書データ３４は、表計算ソフトウェアによって表形式で作成される。そのため、修正した部分だけをコピーするといったことが可能である。したがって、設計書データ３４のうち顧客が修正した部分を、開発者が修正した設計書データ３４に反映させるといったことも容易に行える。また、複数の開発者が分担して設計書データ３４を修正し、後に各開発者によって修正された設計書データ３４を統合するといったことも容易に行える。

また、実施の形態１に係る画面開発支援装置１０は、設計書データ３４において各表示項目について指定された深度に応じて字下げした動的コード３２及び表示コード３３を生成する。そのため、動的コード３２及び表示コード３３について、開発者が意図した通りの字下げを入れることが可能である。動的コード３２及び表示コード３３は、適切な字下げがされているため、読みやすく、メンテナンス性が高い。したがって、動的コード３２及び表示コード３３は、不具合があった場合に、原因箇所の特定等を容易に行うことができる。

また、実施の形態１に係る画面開発支援装置１０は、表示項目によっては、深度に基づき終了コードの位置を特定して、動的コード３２及び表示コード３３を生成する。これにより、設計書データ３４における終了コードを記述する位置の設定を容易に行うことができる。つまり、例えば、設計書データ３４の項目定義３４１に対して、終了コードを記述する位置に、終了コードを表す行を追加して、どの開始コードに対応する終了コードを記述するかを設定するといったことは必要ない。

また、実施の形態１に係る画面開発支援装置１０は、設計書データ３４の制御定義３４２及び文言定義３４３の設定によって、表示項目の出し分け制御を伴う動的コード３２及び表示コード３３を生成することが可能である。そのため、出し分け制御を含むウェブ画面についても、設計書データ３４を作成するだけで、動的コード３２及び表示コード３３を生成することが可能である。

＊＊＊他の構成＊＊＊
＜変形例１＞
実施の形態１では、各機能構成要素がソフトウェアで実現された。しかし、変形例１として、各機能構成要素はハードウェアで実現されてもよい。この変形例１について、実施の形態１と異なる点を説明する。

図１３を参照して、変形例１に係る画面開発支援装置１０の構成を説明する。
各機能構成要素がハードウェアで実現される場合には、画面開発支援装置１０は、プロセッサ１１とメモリ１２とストレージ１３とに代えて、電子回路１５を備える。電子回路１５は、各機能構成要素と、メモリ１２と、ストレージ１３との機能とを実現する専用の回路である。

電子回路１５としては、単一回路、複合回路、プログラム化したプロセッサ、並列プログラム化したプロセッサ、ロジックＩＣ、ＧＡ（Ｇａｔｅ Ａｒｒａｙ）、ＡＳＩＣ（Ａｐｐｌｉｃａｔｉｏｎ Ｓｐｅｃｉｆｉｃ Ｉｎｔｅｇｒａｔｅｄ Ｃｉｒｃｕｉｔ）、ＦＰＧＡ（Ｆｉｅｌｄ−Ｐｒｏｇｒａｍｍａｂｌｅ Ｇａｔｅ Ａｒｒａｙ）が想定される。
各機能構成要素を１つの電子回路１５で実現してもよいし、各機能構成要素を複数の電子回路１５に分散させて実現してもよい。

＜変形例２＞
変形例２として、一部の各機能構成要素がハードウェアで実現され、他の各機能構成要素がソフトウェアで実現されてもよい。

プロセッサ１１とメモリ１２とストレージ１３と電子回路１５とを処理回路という。つまり、各機能構成要素の機能は、処理回路により実現される。

１０ 画面開発支援装置、１１ プロセッサ、１２ メモリ、１３ ストレージ、１４ 通信インタフェース、１５ 電子回路、２１ 設計書取得部、２２ 画面表示部、２３ 動的コード生成部、２４ 表示コード生成部、３１ 入力データ、３２ 動的コード、３３ 表示コード、３４ 設計書データ、３４１ 項目定義、３４２ 制御定義、３４３ 文言定義、３５ テンプレート、３５１ 第１テンプレート、３５２ 第２テンプレート、３６ 画像データ。

Claims (6)

1. 画面表示の仕様を表す設計書データを取得する設計書取得部と、
   制御状態に応じて前記画面表示を動的に行う動的コードを生成するか、制御又は表示に関する選択肢のうち選択された選択状態における前記画面表示を行う表示コードを生成するかを選択させるコード選択画面を表示する画面表示部と、
   前記画面表示部によって表示された前記コード選択画面で動的コードを生成することが選択された場合に、前記設計書取得部によって取得された前記設計書データを用いて、前記動的コードを生成する動的コード生成部と、
   前記画面表示部によって表示された前記コード選択画面で表示コードを生成することが選択された場合に、前記設計書データを用いて、前記表示コードを生成する表示コード生成部と
   を備える画面開発支援装置。
2. 前記動的コード生成部は、動的コード生成用のテンプレートである第１テンプレートを用いて前記設計書データを変換して、前記動的コードを生成し、
   前記表示コード生成部は、表示コード生成用のテンプレートである第２テンプレートであって、前記第１テンプレートとは異なる第２テンプレートを用いて前記設計書データを変換して、前記表示コードを生成する
   請求項１に記載の画面開発支援装置。
3. 前記設計書データは、複数の表示項目それぞれを対象として、対象の表示項目を表すコードの階層を指定する深度を有し、
   前記表示コード生成部は、前記対象の表示項目についての深度に応じて字下げして、前記対象の表示項目を表すコードを設定した前記表示コードを生成する
   請求項１又は２に記載の画面開発支援装置。
4. 前記設計書データは、複数の表示項目それぞれについての仕様を表し、少なくとも一部の表示項目について表示条件が設定され、
   前記動的コード生成部は、前記表示条件が指定された表示項目について、前記表示条件を満たす場合には表示され、前記表示条件を満たさない場合には表示されないように前記画面表示を行う表示命令を出力する前記動的コードを生成し、
   前記表示コード生成部は、前記表示条件が指定された表示項目について、前記選択状態が前記表示条件を満たす場合には表示されるように前記画面表示を行う表示命令を出力する前記表示コードを生成し、前記選択状態が前記表示条件を満たさない場合には表示されないように前記画面表示を行う表示命令を出力する前記表示コードを生成する
   請求項１から３までのいずれか１項に記載の画面開発支援装置。
5. 設計書取得部が、画面表示の仕様を表す設計書データを取得し、
   画面表示部が、制御状態に応じて前記画面表示を動的に行う動的コードを生成するか、制御又は表示に関する選択肢のうち選択された選択状態における前記画面表示を行う表示コードを生成するかを選択させるコード選択画面を表示し、
   前記コード選択画面で動的コードを生成することが選択された場合に、動的コード生成部が、前記設計書データを用いて、前記動的コードを生成し、
   前記コード選択画面で表示コードを生成することが選択された場合に、表示コード生成部が、前記設計書データを用いて、前記表示コードを生成する画面開発支援方法。
6. 画面表示の仕様を表す設計書データを取得する設計書取得処理と、
   制御状態に応じて前記画面表示を動的に行う動的コードを生成するか、制御又は表示に関する選択肢のうち選択された選択状態における前記画面表示を行う表示コードを生成するかを選択させるコード選択画面を表示する画面表示処理と
   前記画面表示処理によって表示された前記コード選択画面で動的コードを生成することが選択された場合に、前記設計書取得処理によって取得された前記設計書データを用いて、前記動的コードを生成する動的コード生成処理と、
   前記画面表示処理によって表示された前記コード選択画面で表示コードを生成することが選択された場合に、前記設計書データを用いて、前記表示コードを生成する表示コード生成処理と
   を行う画面開発支援装置としてコンピュータを機能させる画面開発支援プログラム。

Images