デスクトップアプリの 使い勝手を超える Web業務アプリケーションを作る グレープシティ株式会社 森谷 勝 グレープシティ株式会社 1993年Visual Basic向けコンポーネント販売開始 業務アプリケーション開発者を支援する製品を提供し続けて 20年の開発ツールベンダー 2 グレープシティのツール 業務アプリ開発の 生産性向上と工数削減 3 UIコンポーネント 業務アプリUI 未入力 4 GrapeCity テクノロジー Windowsのリッチな環境で使い勝手の良いUIを 構築してきたエンジニアがWeb開発でも活躍で きるようにツールを提供していきます。 .NET Framework ActiveX Java WPF ASP.NET 5 GrapeCityのHTML5 本日ご紹介する製品 6 Wijmo [ウィジモ] 7 Wijmo [ウィジモ]って何? 日本の業務アプリケーションに最適な UIを提供するJavaScriptライブラリ 特徴 ・jQueryベース ・UIウィジェット集 8 jQueryベース jQuery ベースに拡張 = 独自フレームワークではない jQuery Mobile WebサイトでもWijmoを紹介 http://jquerymobile.com/resources/ 9 jQueryベースのメリット 独自手法の習得不要 jQuery の知識があれば開発可能 ライブラリ独自の実装ルールがない Wijmoの採用により技術スキルが偏らない 技術スキルの応用 広い範囲に既存スキルを活かせる jQueryの知識は他プロジェクトでも活かせる 初期の学習コストが比較的低い 10 スタンダードライブラリをサポート jQuery をベースに拡張 スタンダードライブラリをサポート 11 jQuery UI収録ウィジェット jQuery UIだけでは 業務アプリのUIとしては不足 ユーティリティ Accordion Dialog Tooltip ビジュアライズ Progressbar Slider 入力 Button Datepicker Spinner Autocomplete コンテナ Tabs メニュー Menu 12 Wijmo 収録ウィジェット jQuery UIの足りない部分を 大幅にカバー グリッド Grid Spread Sheet 入力 Combobox InputText InputDate InputMask InputNumber List Checkbox Dropdown Radio Textbox チャート Barchart Bubblechart Compositechart Linechart Piechart Scatterchart ユーティリティ Accordion Expander Carousel Calendar EventsCalendar Dialog Editor Pager Tooltip Wizard LinearGauge RadialGauge Progressbar Rating Slider モバイル向け AppView ListView コンテナ Superpanel Tabs Gallery Splitter ビジュアライズ メニュー Menu Tree Ribbon 画像・ビデオ Video Player 13 Demo Wijmoウィジェット 14 日本の業務で要求される WebアプリケーションのUI 15 日本の業務アプリケーションの傾向 20年にわたる製品サポートから見えるもの 伝統を重んじる 既存のワークフローや手順を変えたくない アーキテクチャが変わっても同じUIを求める 日本固有の要件が存在 Excel依存 IME制御 半角(1byte)と全角(2byte) とサロゲートペア(4byte)の制御 日付の表記方法(西暦/和暦) 同じ文字を複数の文字種で表現(氏名/シメイ/しめい) 16 ケーススタディ(日本の業務アプリケーション) Excelと同じ感覚で使いたい Excelで出来ることは簡単に やれるでしょ? 既存Excelファイルを読み 込んで画面で入力したい 日本の現状です 画面で入力した データをExcelファ イルに出力したい 17 SpreadJS [スプレッドJS] Excelライクな操作性を実現するグリッド 18 Demo SpreadJS 19 ケーススタディ(日本の業務アプリケーション) 日本語が表示できればいいわけではない 官公庁向けには「和暦」だし、2バイト文字 のカウントとかも必要だし・・ この紙伝票と同じ画 面をつくってほしい 日本の現状です 20 入力系ウィジェット 日本固有の業務要件をサポート 日付の表記(西暦/和暦) 入力書式と表示書式の分離 半角(1byte)と全角(2byte) の制御 日本語文字種の入力制限 入力時と表示時で異なる書式 電話番号(アンダースコア)の表示 入力時 HTML5 表示時 Wijmo 21 Demo 入力UI 22 デスクトップとモバイルの開発 同一ウィジェットを モバイル環境へ最適化 参照を jQuery UI から jQuery Mobile へ変えることでモバイルのウィ ジェットとして利用できます。モバイルで利用する時は、モバイル向けに 設計する必要があります。 23 モバイルに最適化されるウィジェット グリッド Grid Spread Sheet 入力 Combobox InputText InputDate InputMask InputNumber List Checkbox Dropdown Radio Textbox チャート Barchart Bubblechart Compositechart Linechart Piechart Scatterchart ユーティリティ Accordion Expander Carousel Calendar EventsCalendar Dialog Editor Pager Tooltip Wizard LinearGauge RadialGauge Progressbar Rating Slider モバイル向け AppView ListView コンテナ Superpanel Tabs Gallery Splitter ビジュアライズ メニュー Menu Tree Ribbon 画像・ビデオ Video Player 24 ライセンス(デュアルライセンス) 商用ライセンス(1年契約のサブスクリプション) 1開発者につき1ライセンス必要(ランタイムフリー) 年3回(5月/9月/1月)メジャーバージョンアップ サブスクリプション更新価格:2年目以降は本体価格の40% Eメールサポート オープンソースライセンス(OSS) お客様が開発されたアプリケーションをGPLv3に基づいたオープンソースアプリ ケーションとして配布する必要があります。 収録製品 ライセンス 商用価格 1年契約 Wijmo Professional Wijmo Enterprise Optional Pack for Wijmo Enterprise 基本40 ウィジェット Wijmo Professional +SpreadJS SpreadJS用 デザイナ+Excel I/O 商用/OSS(GPLv3) 商用/OSS(GPLv3) 商用のみ 55,000円 90,000円 25,000円 (更新:22,000円) (更新:36,000円) (更新:10,000円) 全て税別価格 25 UIウィジェットの選択 Enterprise Professional全てのウィジェットとSpreadJSが収録 + Optional Pack for Wijmo Enterprise Enterpriseのオプション製品 SpreadJS デザイナ と Excel I/O を収録 Professional グリッドやチャートなど高度なウィジェットを40種類以上収録 Wijmoは 実現したい機能によっ て選べます 26 Visual WebGui [ビジュアル ウェブグイ] 27 業務アプリのプラットフォーム割合 グレープシティサポート.NET開発プラットフォーム割合 WPF その他 3% 2% ASP.NET Web フォーム 26% Silverlight Windows 4% フォーム 65% 28 Windowsフォームの スキルをWebで生かす 29 開発手法は変えない HTML/CSS/JavaScriptでのコーディング不要 で、Windowsフォームのクライアントアプリを 開発するのとまったく同じ感覚でHTML5の Webアプリケーションを開発できます。 30 Visual Studioに統合 Windowsフォームと同じデザイン、同じコード 31 Demo 32 ASP.NET Web Formsとの開発時間の比較 ・同一仕様のWebアプリ(2画面) ・同一のスキルと経験を持つ開発者 ・スクラッチ開発 ■Visual WebGui ■ ASP. NET 0.5 1.5 プログラミング 4.8 4.2 0.8 2.0 画面デザイン (時間)0 0.4 1.6 5 検索条件設定画面 10 0 2 4 6 検索結果表示画面 ㈱インタース 調べ 33 Windowsフォームとまったく同じ Windowsフォームの主要コントロールに対応す るコントロールを収録 34 Demo 35 アーキテクチャー 36 必要システム 開発ツール Visual Studio 2008 SP1/2010/2012 ※ Express Editionでは使用できません。 ブラウザ Internet Explorer 8/9/10、Chrome、Firefox ※ Internet Explorerの互換表示はサポートしていません。 Webサーバー Internet Information Services (IIS) OS Windows Vista/7/8 Windows Server 2008/2008 R2/2012 37 お問い合わせ窓口 グレープシティ株式会社 ツール事業部 営業部 Eメール : sales@grapecity.com 電話番号: 048-222-3001 FAX番号: 048-222-1211 営業時間: AM9:00~12:00 PM1:00~6:00 (月~金) 住所: 〒 332-0012 埼玉県川口市本町4-1-8 川口センタービル3F 38
© Copyright 2024 Paperzz