Webアプリケーション自動生成ツール 　 Web Performer V1.5.0 ご紹介資料

Transcription

1 JIMUC オープン セミナー 超高速開発ツール Web Performer Ver2.0 ご紹介 2016 年 9 月 14 日ソリューション推進センターソリューション企画第二部杉本達雄

2 IT 部門の課題 システム化の目的 業務効率化 対象業務 経理人事生産コンピュータを活用する業務は限定的 必要な技術 スペシャリスト CSR システム化の目的 業務効率化売上拡大ビジネス戦略 対象業務 企画監査経理人事稟議生産販売部門別全ての業務にシステムは必須システム設計 必要な技術 ハード面汎用機 ソフト面 COBOL ハード面汎用機 サーバ PC スマホ タブレット ソフト面 Windows,Linux,iOS Java,C#,PHP,ObjC プログラマー システム化の目的や 知識 スキルが限定的 目的の多様化と IT 技術の急速な変化 2

3 IT 部門の役割り 現在と今後の IT 部門に求められる役割 従来型の機能は大きく縮小 ビジネス戦略はやや拡大 (%) (*) 出展 :ITR IT 投資動向調査 2015 IT 部門の役割 ( 現在 / 今後 ) このままでは役割を失う IT 部門 部門横断型で各部門と 協業 するという社内での独特な立ち位置 先進技術のビジネス活用に関する目利き を行う高度なノウハウとスキルを担う必要がある (*) 出展 : 上記と同じ 3

4 IT 部門とユーザ部門の共創関係が重要 システム開発におけるスタイルは ユーザ部門との 共創型 へ これまでは 一方向 これからは 共創型 ユーザ部門 ( ユーザ企業 ) ユーザ部門 ( ユーザ企業 ) IT 部門 (SI 企業 ) IT 部門 (SI 企業 ) IT 部門はユーザ部門の注文に応える役割 膨れるシステム仕様に納期を守って応える IT 部門のビジネス戦略への参画 ユーザ部門の IT 投資への責任 4

5 アジャイル型のスピード開発 開発の流れ 1 まずは1~2 時間のミーティングで要望概要や イメージを書き出し ユーザと認識を合わせる 23 それらを元に作成した画面をユーザに触ってもらう 1 要件定義 2 開発 45 さらに細かい要望やニーズを引き出してから ビジネスプロセスを使い機能を載せていく 再度確認の繰り返し 3 確認 4 追加開発 開発者 5 確認 スピードを優先する中でも 要望を取り入れて作りこんでいく 失敗を恐れない開発 5

6 アジャイル型のスピード開発 開発の流れ 1 まずは1~2 時間のミーティングで要望概要や イメージを書き出し ユーザと認識を合わせる 2 開発 1 要件定義 23 それらを元に作成した画面をユーザに触ってもらう 開発ツールを利用する 45 さらに細かい要望やニーズを引き出してから ビジネスプロセスを使い機能を載せていく 再度確認の繰り返し 方法が有効な手段 3 確認 4 追加開発 開発者 5 確認 スピードを優先する中でも 要望を取り入れて作りこんでいく 失敗を恐れない開発 6

7 開発ツールの現状と予測 ~ リーマンショック 2012/3/15 日経コンピュータ 特集 : 超高速開発 2013/1/10 日経コンピュータ 特集 : 軽い内製 2013/8/6 超高速開発コミュニティ発足 コスト削減目的での需要が高まる ビジネスに乗り遅れない迅速なシステム開発が必要 ガートナー発表アプリケーション戦略 2018 年までに 日本の大企業における基幹系カスタム アプリケーション開発プロジェクトの 40% では プログラム自動生成ツールを利用した開発の自動化 効率化を行うようになる 出展 :2015 年 2 月 18 日ガートナージャパン株式会社プレス リリース記事 攻めの IT 投資ニーズも 市場成長率 Web アプリ開発ツールは ソフトウェア市場全体の 15% 程度 年間平均成長率は 8% 程度 出展 :@IT 業務アプリにおける次世代テクノロジの 3 大トレンド 現在の業務アプリの課題 出展 :2014 年 11 月 17 日 IDC Japan 株式会社 国内エンタープライズ Web/ モバイルアプリケーション開発ソフトウェア市場 ) 7

8 製品概要

9 導入実績 Web Performer は 2005 年に販売を開始し 大手 中堅を問わず企業内の開発部門や SI ベンダーなど様々な開発分野で導入 520 社 ライセンス 650 本以上の導入実績を誇ります (2016 年 7 月 1 日時点 ) 2008 年 2009 年 2010 年 2012 年 2013 年 2014 年 2015 年 2016 年 マルチブラウザ対応 スマートデバイス対応 多言語対応 GUI エディタ対応 バッチ生成対応 画面遷移図対応 HTML5 対応 データグリッド対応グラフ表示 累積導入社数 520 社 650 本 ライセンス売上推移 100 社 200 社 2008 上 2008 下 2009 上 2009 下 2010 上 2010 下 2011 上 2011 下 2012 上 2012 下 2013 上 2013 下 2014 上 2014 下 2015 上 2015 下 2016 上 9

10 導入実績 ユーザ企業様 サッポロビール株式会社 日本通運株式会社 京セラクリスタルデバイス株式会社 三井住友海上火災保険株式会社 株式会社東京商工リサーチ 株式会社ソディック 清水建設株式会社 日機装株式会社 システムインテグレータ様 株式会社日立ソリューションズ 新日鉄住金ソリューションズ株式会社 西日本コンピュータ株式会社 株式会社オーユーシステム 株式会社ユニットシステムエンジニアリング AJS 株式会社 株式会社静岡情報処理センター 大鵬薬品工業株式会社 とぴあ浜松農業協同組合 科研製薬株式会社 東京航空計器株式会社 千葉ガス株式会社 東急不動産株式会社 順不同 東京東信用金庫 ミドリ安全株式会社 株式会社 JSP 日新加工株式会社 累計導入ライセンス 650 本 10

11 結合実装要件 件分岐業務用承認者条Web アプリ自動生成ツール 基本設計情報に基づきリポジトリを登録 業務要件自動生成 Webアプリケーション JavaScript JSP Servlet JavaBeans 起案者 承認者

12 自動生成の概念 自動生成時に選択 HTML4 HTML5 マルチブラウザ スキーマ情報 データモデル (DM) IE Firefox Chrome Safari 画面情報 入出力 (IO) (PC) (MOBILE) 自動生成 スマートデバイス JQuery Mobile 業務ロジック ビジネスプロセス (BP) バッチアプリケーション アプリケーションをノンプログラミング開発 Windows RedHat IBMi AIX Solaris CentOS 12

13 GUIエディタによる開発 画面のレイアウトの設定をグラフィカルに行い プレビュー参照も可能 定義内では カーソルの移動順や項目間の参照関係を確認 レイアウトエディタ画面 プレビュー画面 デザインテーマの切替や 設計を補助するツール群 CSVデータに よるテストデータ表示 項目の参照関係や カーソルの移動順表示 表形式による画面設定 ドラックアンドドロップ によるレイアウト定義 同期 双方向の定義が可能 13 Copyright 2016, Canon IT Solutions Inc. All rights reserved.

14 操作性の良い Web 画面を自動生成 画面表示レスポンスが速く 操作性の高いアプリケーションの自動生成を実現 カレンダー機能 Ajax による画面項目の部分再描画 データ入力に伴う自動計算 データ候補を表示するサジェスト機能 Enter キーやフル桁キーで自動カーソル遷移 データに応じて表示項目切り替え データ取得 14

15 画面遷移図出力機能 画面遷移図上で新規画面追加 入出力定義の 入出力名 ロール 等変更可能 入出力定義上での変更も 画面遷移図にも反映 画面をクリックすると対象画面の定義へ 未定義の入出力の追加画面遷移アクションの追加外部システム画面の追加メモの追加等 画像ファイル出力 入出力定義 画部システム画面 の 入出力名 ロール サイズ 位置 等の変更 画面遷移アクション アクション名 パラメータ ロール 等の変更 画面遷移図エディタ上の各要素の変更 修正 整列 15

16 選ばれる 3 つのポイント

17 Web Performer 選ばれる 3 つのポイント 1 生産性の向上 2 保守性の向上 3 信頼性への取組み 17

18 詳細設計プログラミング仕様書基本設計 生産性の向上 : 超高速開発 ウォーターフォール型 Java スクラッチ開発工程 単体テスト テスト単体テスト結合テスト システム システムフロー DB テーブルレイアウト 画面レイアウト 項目設計 機能設計 等 オブジェクト設計 クラス図 シーケンス図 等 プログラマーのコーディング作業 結合テスト仕様書 機能テスト結合テスト運用テスト性能テスト等 システムテスト仕様書 従来通り 簡略 リポジトリ定義 簡略 従来通り 基本設計 出典 : StatCounter Global Stats 詳細設計 WP 単体 結合テスト システムテスト 実装工数 Web Performer による開発工程 手戻り 18

19 生産性の向上 : 超高速開発 開発工数比較 顧客名 システム名 開発 期間 画面数 ( バッチ数 ) スクラッチ開発の工数は 以下の指標を元に算出ユーザー企業ソフトウェアメトリックス - 要点ハンドブック - 一般財団法人日本情報システム ユーザ協会 (JUAS) WP の場合 システム規模 スクラッチ開発の場合 A 社業務パッケージシステム 3 か月 50 6 人月 20 人月 3.33 比率 B 社 製品管理システム 3か月 50 (10) 9 人月 20 人月 2.22 C 社予算管理システム 5 か月 人月 58 人月 3.87 D 社 IT 資産管理システム 7か月 108 (24) E 社 人事給与システム 22か月 1050 (550) 30 人月 77 人月 人月 1659 人月 4.15 スクラッチ開発と比較して 2 倍から 4 倍の生産性を実現! 19

20 生産性の向上 : 習得が容易 習得が容易 (Javaスキル不要) オブジェクト指向を意識することなく開発可能 業務知識とDB 設計知識でWebアプリケーションを開発 オブジェクト指向 HTML Java 言語習得に比べると楽 COBOL 技術者の私が Web アプリ開発者になれた ユーザの声 集まらない Java 技術者を雇うよりも効率的 設計書情報を リポジトリ リポジトリに登録するだけ ( ご参考 ) ご導入ユーザ様の習得期間 73% のお客様が 2 か月以内に Web Performer の操作を習得しています 第 5 回 Web Performer Developers Meeting(2013 年 3 月 6 日開催 ) 顧客アンケート結果より 20

21 Web Performer 選ばれる 3 つのポイント 1 生産性の向上 2 保守性の向上 3 信頼性への取組み 21

22 去の生成アプリしい生成アプリ保守性の向上 : 容易なバージョンアップ 稼働環境のバージョンアップ対応をWeb Performerで吸収 開発したアプリケーションはWeb Performerをバージョンアップし再生成すれば新しい環境に対応 OS やブラウザのサポート切れ問題にもスムーズに対応可能新定義情報アプリケーション過Windows 7 IE11 対応 定義情報はそのまま Windows 10 MS Edge 対応アプリケーション 22

23 保守性の向上 : 属人性を排除した開発 少ない入力工数 ( プロパティベースの設定 ) にて Web アプリ構築が可能 定義ルールの明確化による開発 改修が容易 開発チームの問題点 悩み 項目属性定義 頻繁な要員異動により 技術やノウハウが蓄積しない 構成がわからない 開発プロセス, ドキュメント コーディング規約の習熟 ドキュメント管理, ソース管理が不十分 改修によるシステム影響度調査 演算や表示 / 非表示定義 選択リスト定義 WebPerformer の採用 機能別に定義ルールが明確化されているため Web Performer で定義した内容は開発者に依存しない 23

24 Web Performer 選ばれる 3 つのポイント 1 生産性の向上 2 保守性の向上 3 信頼性への取組み 24

25 信頼性への取組み : 純国産製品 製造から販売 サポートを同じ会社で担当 セキュリティリスク対応 採用 新たなニーズに対応する稼働環境 製品開発 市場ニーズ 機能追加 / 改善要望 製品へ反映 調査依頼 調査回答 取込み 企画 / 販売 契約状況機能追加 / 改善要望 サポート 反映 サポートサイト ユーザ要望 問合せ回答 25

26 信頼性への取組み : セキュリティリスク対策 外部機関によるセキュリティ対策を実施 SQL インジェクション ディレクトリ インデックス SQL エラーの 発生 Cookie の 扱い クロスサイトス クリプティング セッション ID の保持方法 CSRF ( クロスサイト リクエスト フォージェリ ) 改行コード インジェクション 26

27 信頼性への取組み : 独自ランタイム不要 クライアント ブラウザ Pure Java のアプリケーションを自動生成 サーバ ユーザインターフェース部 ビジネスプロセス部 データアクセス部 画面制御 画面入出力情報 画面表示 業務ロジック駆動 業務ロジック アプリケーション DB アプリケーション DB JavaScript JSP JavaBeans JPA CSS Servlet Spring Framework 自動生成されるソースコードの可読性にも配慮 27

28 Web Performer V2.0.0 動作環境 クライアント OS Windows 7/8.1/10 ツール 1 Eclipse 4.2/4.3/4.4/4.5 AP サーバ Tomcat 7.0/8.0 Java 2 JDK6/7/8 * 推奨環境 : [CPU]Core 2 Duo2.13GHz 以上 [ メモリ ]3.0GB 以上 [Disk] 空き容量 3.0GB 以上 1 Eclipse の推奨バージョンは 以上 となります 2 JDK8 に対応した Tomcat のリビジョンは 以上 以上 となります サーバ OS Windows Server 2008/2008 R2/2012/2012 R2 AIX V6.1/V7.1 Solaris 10/11 RedHat EL5/6/7 IBM i V6R1/V7R1/V7R2 CentOS 5/6/7 クライアント データベース Oracle 11g/11g R2/12c R1 SQL Server 2008/2008 R2/2012/2014 MySQL 5.6/5.7 PostgreSQL 9.3/9.4 DB2 v9.7/v10.1/v10.5 DB2 400 V6R1/V7R1/V7R2 APサーバ WebSphere 7.0/8.0/8.5/8.5.5 Oracle Weblogic Server 11g 以降 /12c 以降 Tomcat 7.0/8.0 ucosminexus Application Server Standard V アプリタイプ 4 PC スマートデバイス デバイスタイプ 5 PC ipad iphone,ipad Android OS ブラウザ Windows 7/8.1/10 Internet Explorer 11.0 Firefox Chrome Microsoft Edge Mac OS X V10.7/V10.8/ V10.9/V10.10 /V10.11 Safari 6/7/8/9 i OS 7/8/9 i OS 7/8/9 Android 4.1/4.2/ 4.3/4.4/ 5.0 モバイル版 Safari モバイル版 Safari モバイル版 Chrome * クライアント推奨環境 : [CPU]Core 2 Duo2.13GHz 以上 [ メモリ ]3.0GB 以上 3 動作に際しての留意点等に関しましては別途メーカまでお問合せください 4 PC とスマートデバイスを併用する場合 アプリタイプを分けてそれぞれ画面を作成してください 5 ワークフローオプションのクライアント環境は ワークフローオプション稼動環境をご確認ください 28

29 動作環境 1 AIX 利用例 OS : AIX Web Sphere Web アプリ DB2 RDBMS Web Client 29

30 動作環境② IBM i利用例 Power Systems OS V6.1/V7.1/V7.2 DB DB2 for i RPG Application 5250 Client Web Server DB OS Windows Server etc Web Sphere Web Sphere, Tomcat etc Webアプリ Webアプリ 5250 Emulator Web Client OS Windows 30 Copyright 2016, Canon IT Solutions Inc. All rights reserved.

31 主な機能紹介

32 高機能な UI を持つアプリを実現 データグリッド グラフ表示 列幅の変更 列の入れ替え 32

33 スマートデバイス対応イメージ 一覧画面 親子画面 入力画面 33

34 多国語対応 イメージ Unicodeを採用しているため 初期設定済みの 日本語 英語 中国語 簡体字 以外の言語にも対応可能 エンドユーザのブラウザ言語設定に合わせて 自動切り替え可能 日本語 英語 中国語 その他言語 34 Copyright 2016, Canon IT Solutions Inc. All rights reserved.

35 Web サービス連携 業務ルール SOAP Web サービス アプリケーション層 ( ビジネスプロセス ) データ層 ( データモデル ) プレゼンテーション層 ( 入出力 ) HTML Web サービスプロバイダ PC 画面 SOAP or REST モバイル RDBMS Web ブラウザ 35

36 帳票ツール連携 imageware Form Manager 連携 キヤノンが提供する帳票ツールとの連携 Web Performer 側に連携用の機能が標準機能として用意しており シームレスな連携が可能 JasperReports 連携 オープンソースのJavaレポーティングエンジン Web Performerと連携する場合拡張定義が必要 エクセルダウンロード機能による帳票出力 エクセル出力時に帳票形式で出力するよう ダウンロード用のテンプレートシートを作成 マクロを組込むことでグラフ等の表示も可能 36

37 imageware Form Manager 連携 システム構成 Form Editor (Eclipse) 帳票作成 imageware Form Manager 定義 印刷設定 アプリケーション 帳票 FMServlet ( サーバ機能 ) 起動スクリプト ( 標準機能 ) 印刷 ボタン 任意のフォルダ 帳票 Tomcat サーバ 37

38 JasperReports 連携 システム構成 ireport Eclipse (Eclipse) ireport インストール時にインストールされた jar ファイルを使用 帳票作成 JasperReports 向け定義 作成 作成 & 印刷設定 アプリケーション 帳票 JasperReports サーブレット サンプルあり Servlet 呼出 (JavaScript) サンプルあり 印刷 ボタン 任意のフォルダ 帳票 Tomcat サーバ 38

39 Excel ダウンロード機能による帳票出力 システム構成 Excel (Eclipse) 表示データを EXCEL 出力しマクロが帳票に配置 マクロ付き帳票作成 アプリケーション 帳票 XLS 任意のフォルダ 印刷 ボタン 帳票 Tomcat サーバ 39