お客様が望んでいるモダンデスクトップアプリとは？／傾向と対策 Part2
•
1 like•880 views
11/25 に日本マイクロソフト株式会社で開催されたデスクトップ アプリ最新化セミナーにおいて弊社池原がお話させていただいた内容です。詳細については http://jp.infragistics.com をご覧ください。
Recommended
More Related Content
Similar to お客様が望んでいるモダンデスクトップアプリとは？／傾向と対策 Part2
Similar to お客様が望んでいるモダンデスクトップアプリとは？／傾向と対策 Part2 (20)
More from インフラジスティックス・ジャパン株式会社
More from インフラジスティックス・ジャパン株式会社 (20)
Recently uploaded
Recently uploaded (10)
お客様が望んでいるモダンデスクトップアプリとは？／傾向と対策 Part2
- 2. お客様が望んでいる モダンデスクトップアプリとは？ 傾向と対策 インフラジスティックス・ジャパン株式会社 デベロッパーエバンジェリスト 池原大然 dikehara@infragistics.com @Neri78 インフラジスティックス・ジャパン株式会社 代表取締役シニアUX アーキテクト 東賢 kazuma@infragistics.com @kenazuma
- 3. ここからは Office が要件に与える影響 インフラジスティックスが提供するOffice UI
- 6. 要件 標準 コンポーネント 作業見積り Officeのようなリボン形式でメニューを表示できること 顧客ごとに受注レコードを展開して表示できること 複数列の並べ替えができること Excel 2010 のようなフィルタリングができること Excelの枠の固定を実現できること。特定の列については右に固定 セル内部において桁数表示を行うこと Outlookのように任意にビューを切り替えられること テンプレートのエクセルを読み込み、入力された内容をもとに Excel ファイルを出力すること ユーザーが任意にテーブル上のレイアウトを操作し、 保存・ロードできること 統一感のある外観をユーザーに提供すること 要件例
- 7. 要件 標準 コンポーネント 作業見積り Officeのようなリボン形式でメニューを表示できること × 5 顧客ごとに受注レコードを展開して表示できること △ 3 複数列の並べ替えができること ○ 1 Excel 2010 のようなフィルタリングができること × 5 Excelの枠の固定を実現できること。特定の列については右に固定 × 5 セル内部において桁数表示を行うこと ○ 1 Outlookのように任意にビューを切り替えられること × 5 テンプレートのエクセルを読み込み、入力された内容をもとに Excel ファイルを出力すること △ 3 ユーザーが任意にテーブル上のレイアウトを操作し、 保存・ロードできること × 5 統一感のある外観をユーザーに提供すること △（×） 3 標準 コントロール カバーできない部分の工数が跳ね上がる 今回の見積もりでは36 (人日？）
- 9. Infragistics ツール利用 要件 標準 コンポーネント 作業見積り Officeのようなリボン形式でメニューを表示できること ○ 1 顧客ごとに受注レコードを展開して表示できること ○ 1 複数列の並べ替えができること ○ 1 Excel 2010 のようなフィルタリングができること ○ 1 Excelの枠の固定を実現できること。特定の列については右に固定 ○ 1 セル内部において桁数表示を行うこと ○ 1 Outlookのように任意にビューを切り替えられること ○ 1 テンプレートのエクセルを読み込み、入力された内容をもとに Excel ファイルを出力すること △ 3 ユーザーが任意にテーブル上のレイアウトを操作し、 保存・ロードできること ○ 1 統一感のある外観をユーザーに提供すること ○ 1 コンポーネントを利用した場合の見積もり 12 (人日？）＝1/3 に低減
- 10. できるだけ部品をそのまま利用することによって、 「作らない」ことを検討する。 そのために、標準コントロールだけでなく、 多くのUIコントロールをカードとして持っておく。 既に顧客の頭の中にあるUIのイメージは 標準コントロールの範囲を大幅に超えている。
- 11. インフラジスティックス が 提供する Office UI コントロール
- 12. コンセプト •圧倒的な機能セットの提供 •開発生産性向上の仕組み •様々なサポートオプションの提供 生産性 ユーザビリティ 信頼性
- 13. •フィルタリング •枠の固定 •グルーピング •集計 •条件付き書式 •クリップボードサポート •スパークライン •etc データグリッドにおける Office UI 機能の提供
- 16. •Office 2007, 2010, 2013 形式 リボンスタイル •バックステージビューの搭載 •タッチ対応デザイン •Office ライクなリボン ウィンドウの提供 XamRibbon
- 17. •Outlook スタイルの ナビゲーションバー •折り畳み、展開 •グループ別の表示 •バックステージビューの搭載 •タッチ対応デザイン •Office ライクなリボン ウィンドウの提供 XamOutlookBar
- 18. •Project ライクな ガントチャート •Project XML ファイルの ロード、保存 XamGanttView
- 19. •Excel ピボットテーブルを実現 •フラットデータ •OLAP キューブ •データスライサー •データチャート コントロールとの連動による ドリルダウン XamPivotGrid
- 20. •Outlook の スケジュールを実現 •日、週、月表示 •グループスケジュール表示 •Exchange コネクター XamSchedule
- 21. •OneNote MX メニューを 実現 •タッチ ソリューション用 メニュー XamRadialMenu
- 22. 継続的な バージョンアップ
- 23. 最近追加されたOffice UI コントロール •XamDiagram •XamSpreadSheet
- 24. •Microsoft Visio のダイアグラム デザイン機能を実現 •2タイプの項目の表現、編集 •ノード(項目)–図形オブジェクト •接続–ノード間、あるいは点の接続を サポート •データバインディングサポート •カスタムノードの実装サポート •選択、切り取り、貼り付けなどの コマンドをサポート XamDiagram
- 25. •Microsoft Excel ライクなセルベース テーブルコントロール •Data Grid は行ベーステーブル •Infragistics Excel Engineでサポート されるデータモデルを表示・編集 •≒Excel データ(.xlsx) •セル編集・数式・図形の表示・ズーム など、Excel で提供されている機能の 一部を実装 XamSpreadSheet
- 26. サポートされている機能 セルの配置 セル境界線 セル 塗りつぶし セルのイン プレース 編集 コマンド コンテキスト メニュー クリップボード サポート フォント スタイル 数式バー 枠の固定 グリッド線 行列ヘッダー 行列非表示 セル、行、 列の挿入・削除 サイズ変更 図形オブ ジェクトの 表示（編集 は未対応） 選択 元に戻す/ やり直し ワークシートの 背景 ズーム 今後随時拡充
- 28. コントロールの利用 •XamSpreadSheetコントロールを画面に追加 <Windowxmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:ig="http://schemas.infragistics.com/xaml" x:Class="xamSpreadSheet_1.MainWindow" Title="MainWindow"Height="350"Width="525"> <Grid> <ig:XamSpreadsheet/> </Grid> </Window>
- 29. Infragistics Excel Engine を利用した 既存ワークブックの読み込みと保存 •XamSpreadSheet.Workbookプロパティを利用 privatevoidButton_Click(objectsender, RoutedEventArgse) { // ファイルダイアログを開いてExcel ファイルをロード OpenFileDialogdiag= newOpenFileDialog(); diag.Filter= "xlsxファイル(*.xlsx)|*.xlsx"; if(diag.ShowDialog() == true) { // ワークブックをDataContextに渡す Workbookwb= Workbook.Load(diag.OpenFile()); this.DataContext= wb; } } privatevoidButton_Click_1(objectsender, RoutedEventArgse) { // ファイルダイアログを開いてExcel ファイルを保存 SaveFileDialogdiag= newSaveFileDialog(); diag.Filter= "xlsxファイル(*.xlsx)|*.xlsx"; if(diag.ShowDialog() == true) { // DataContextのWorkbook オブジェクトを書き出す。 (this.DataContextasWorkbook).Save(diag.FileName); } } <ig:XamSpreadsheetWorkbook="{Binding}"Grid.Row="1"/>
- 30. IG ショーケース •プロジェクトテンプレートを利用し Microsoft Excel ライクなサンプルアプリケーションを利用 •ソースコードの参照
- 31. ユーザーニーズの変化に対応できる コンポーネント「スイート」 •圧倒的な機能セットの提供 •開発生産性向上の仕組み •様々なサポートオプションの提供 生産性 ユーザビリティ 信頼性
- 32. リソース Infragistics Ultimatehttp://jp.infragistics.com/ULTIMATE xamDiagram-ヘルプトピック http://bit.ly/xamDiagramJP xamSpreadSheet–ヘルプトピック http://bit.ly/xamSpreadSheetJP