Upload
daizen-ikehara
View
624
Download
1
Embed Size (px)
DESCRIPTION
2012 年 12 月 7 日に実施した Webinar において NetAdvantage for WPF / Silverlight 2012 Volume2 の新機能を紹介したスライドです。
Citation preview
NetAdvantage 2012 Volume2 最新情報XAML プラットフォーム編
Daizen Ikehara : Marketing & Developer [email protected] @Neri78
池原 大然(いけはらだいぜん)インフラジスティックス・ジャパン株式会社
マーケティング & デベロッパーエバンジェリスト
Microsoft MVP for Development Platforms
Client App Dev 2010/04 – 2013/03
自己紹介
Blog
NETADVANTAGE
Cross Platform Modern User Experience
XAML styles to match published Microsoft themes.
利用のポイント/傾向
ユーザーインターフェイス開発において、いかに生産性を高め、優れたUXを実現するための支援が出来るかを追求
• プロジェクトにおける工数の削減
• 提案/設計時のラピッドプロトタイピングにも利用SIer
• 自社製品の継続的アップグレードに伴う価値向上
• 弊社製品による他のプラットフォームへの迅速な対応ISV
• セルフ開発スキーム確立における標準パーツとしての利用
• 「作らない」ための弊社製品の利用In-house IT
• 開発/テスト双方における工数の削減• パフォーマンスの高さ(特にグリッド/チャート)• 手軽に一貫した優れたスタイルによる外観の高い品質を得ることが可能• 日本法人によるダイレクトサポート• サブスクリプション/アップグレードにおける継続的な価値向上(大小の機能追加及びバグフィックスを含む)
• ソースコードの開示(100万行以上の洗練されたコード!)• どの製品でも一貫したアーキテクチャと同じアプローチをとっていることによる学習コストの削減
要件定義 基本設計 詳細設計 開発単体
テスト
結合
テスト
システム
テスト
従来、導入が検討されたのは開発一歩手前、あるいは開発に着手してからであり、要件が完全に固まった状態であった。そのため、やむを得ずコントロールのカスタマイズをされるケースも多く、あまり効率の良い状態ではない。
要件定義 基本設計 詳細設計 開発単体
テスト
結合
テスト
システム
テスト
有効活用されているお客様では、共通して「設計段階においてUIコンポーネントで要件が満たせるかどうかについて評価」を行い、開発の難易度を決定されている。結果として見積もりが正確になり、手戻りが少なくなる。
UIコントロールの有効活用
XAML プラットフォームと
NetAdvantage のキーコンセプト
2012 Volume2 新機能
XAML の将来
まとめ
XAML プラットフォームと
NetAdvantage の
キーコンセプト
ハイプ・サイクル
流行期
幻滅期
安定期
黎明期
WPF3.5SL3
WPF4SL4
WP7.1
WPF4.5SL5WP8
テクノロジとしてこなれた状態(安定している)
回復期
プラットフォーム選択
Web Standard Application
Native ApplicationRich
Reach
Third Party Framework
Third Party Framework
要求によっては XAML プラットフォームが適している 要求
WPF
Silverlight
WP
WinRT
NetAdvantage のキー コンセプト
ツール
セット
パフォー
マンス
使い勝手
機能セット
スタイル
Modern Application
Exceptional User Experience
Interaction Design+
Engineering
WPFコンポーネント
• データグリッド
• チャート
• リボン
• ドックマネージャー
• エクセル/XPSエクスポート
• カレンダー
• タブ
• データカルーセル
• データカード
• カルーセルリストボックス
• カルーセルパネル
• 各種エディター
• ゲージ
• タイムライン
• ズームバーブレットグラフ
• マップ
• ガント、他
• グリッド• チャート• ツリー• メニュー• コンテキストメニュー• HTMLビューワー• Outlookバー• ダイアログウィンドウ• タイルビュー• エディター• スケジュール• スペルチェッカー• タグクラウド• エクセルエクスポート• ドラッグアンドドロップ• マップ• タイムライン• ズームバー• ブレットグラフ• ピボットグリッド• ガント、他
Silverlightコンポーネント
高パフォーマンス
• 業界最速の Silverlightデータグリッド
– 対象コントロール:XamGrid
– テスト内容:xamGrid をさまざまな ItemSource へバインドし、LayoutUpdated イベントの描画にかかった時間を測定
– 想定操作:データの読み込み時のエンド ユーザーの待ち時間を測定
■表3:描画に要した時間 ※IList へバインド - 10 列、1,000,000 行のデータ
弊社製品 競合製品 I 競合製品 II
所要時間 (ms) 1,028 2,050 99% 遅い 1,962 90% 遅い
メモリ使用量- テスト前(KB)
91,852 88,964 0.3% 少ない 90,683 0.1% 多い
メモリ使用量- テスト後(KB)
91,762 144,394 57% 多い 128,511 40% 多い
■表4:描画に要した時間 ※ObservableCollection へバインド - 10 列、1,000,000 行のデータ
弊社製品 競合製品 I 競合製品 II
所要時間 (ms) 1,028 2,025 96% 遅い 1,962 90% 遅い
メモリ使用量 - テスト前(Kb)
91,852 91,360 等しい 90,660 1% 少ない
メモリ使用量 - テスト後(Kb)
91,762 113,795 24% 多い 128,207 39% 多い
xamGrid の仮想化
描画されていないコンテンツを仮想化
表示されているセルのビジュアル要素のみが読み込まれる
リソースウォッシング
基本色を1色選択するだけでアプリケーションの外観をキレイにスタイリング
カラーチューナー
リソースウォッシャー機能を拡張し、デザイン時に手軽にスタイリング
Demo
カラー チューナー / リソース ウォッシング
スタイリング サポート
テーマ提供
工数と外観のバランス
リソース ウォッシャー カラー チューナー
広がり続けるプラットフォーム
Core Data Visualization
API
Silverlight
WPF
HTML5Windows
Phone
iOS
WinRT
Cross Platform Shared Code Strategy
プラットフォーム横断による工数
コードの共通化
Demo
コード共有によるプラットフォーム間の互換性
コード共有による “効率化”
• XAMLコードの共通化
– WPF/Silverlight/WP 開発でのコードシェア・コスト低減
• APIセットの共通化
– マルチプラットフォーム開発でのコスト低減
単独 APIセット共有
共通部分 Silverlight Windows Phone WPF jQuery
API共通化による学習・開発コストの削減
NetAdvantage2012 Volume2
新機能
xamGantt コントロール
MS プロジェクトのガント表示を XAML プラットフォームで実現
関連タスク表示ドラッグ移動期間変更など
タスクデータをグリッド表示
編集、追加、削除
タイムスケール追加、変更
xamPivotGrid + xamDataChart
OLAP 軸を利用したデータ分析支援 UI を素早く構築Excel スタイル フィルタリング、コンパクトレイアウト、ドラッグイベントハンドリングといった機能も
データ セレクターピボット グリッド
Excel スタイルフィルタリング
チャート
xamGeographicMap
大量データや時系列データの表示を可能に
構文解析ライブラリー + エディター
ルールに従って構文を解析できるInfragistics Syntax Parsing Engine
上記エンジンを組み込んだエディター コントロールxamSyntaxEditor
xamCalculationManager + xamDataGrid
動的に書式を組み立て、グリッドに適用
その他グリッド機能拡張
– 外部演算、並び替え、グループ化などのパフォーマンス向上
Demo
XamPivotGrid + OLAP 軸構築
XAMLの将来
NetAdvantage for Windows UI
XAML & HTML コントロール
• Grid
• Chart
特にデータ視覚化パターンを実装した UI に
注力
Demo
Running Total
ロードマップ
2012 Q4
ベータ版公開
2013 H1
v1 リリース
2013 H2
v2 リリース
まとめ
まとめ
XAML プラットフォームの安定性
•先進的よりは安定的
•UI の表現力の優位性
UI コンポーネント活用
•高機能、高パフォーマンス
•開発生産性を考慮
•コード共有による将来へのリスクヘッジ
要件定義 基本設計 詳細設計 開発単体
テスト
結合
テスト
システム
テスト
従来、導入が検討されたのは開発一歩手前、あるいは開発に着手してからであり、要件が完全に固まった状態であった。そのため、やむを得ずコントロールのカスタマイズをされるケースも多く、あまり効率の良い状態ではない。
要件定義 基本設計 詳細設計 開発単体
テスト
結合
テスト
システム
テスト
有効活用されているお客様では、共通して「設計段階においてUIコンポーネントで要件が満たせるかどうかについて評価」を行い、開発の難易度を決定されている。結果として見積もりが正確になり、手戻りが少なくなる。
UIコントロールの有効活用(再)
&
NetAdvantage 利用を前提としたサービスでの協業を開始!
2nd FACTORY CO.,Ltd. CONFIDENTIAL 41
セカンドファクトリー様との協業でお届けできるものは:
ユーザー、課題の理解仮説
インタラクション設計
プロトタイプ開発早期の検証
触れる、実機で動く、最終に近い、ユーザーの想像力を喚起できる
プロトタイプ
グラフィックアセットテーマ/スタイル
ビジュアルデザイン
コードレベルで再利用可能な実際にコントロールを配置した
レイアウトデザイン
継続的な開発に利用できる練りこまれたUXを表現するための
UI ガイドライン
触って確かめられるプロトタイプ
タッチ アンド トライ プロトタイピング