レガシーシステム脱出計画!~Silverlight時代の  コンポーネント活用術<br />19-E-2<br />山田 達也<br />インフラジスティックス・ジャパン<br />
自己紹介<br />会社<br />インフラジスティックス・ジャパン<br />仕事<br />デベロッパーエバンジェリスト<br />ブログ<br />http://blogs.jp.infragistics.com/blogs/tyamad...
ついにSilverlight時代到来!<br />
アンケート結果 今後、Silverlight開発の予定は?<br />49%<br />※当社調べ 2009年10月時点のアンケート結果より<br />
インフラジスティックスの実感<br />※当社調べ 2009年後半のデータ<br />
現場の声~Silverlightをどこで活用?<br />旧システムからの<br />リプレイスで<br />新規案件で<br />
よくあるマイグレーションシナリオ<br />
こんな感じの旧システムがあるとします。<br />人事管理システム Ver2.25<br />X<br />社員照会<br />X<br />検索条件<br />社員詳細<br />X<br />社員番号<br />1997HA0043<br ...
何かと複雑!<br />操作性<br />画面遷移<br />ナビゲーション<br />デメリット<br />習得性が低い(トレーニングコスト大)<br />作業効率が悪い<br />->新システムで一挙に解決したい!!<br />一般的なレガ...
システム切り替え時のよくある会話<br />開発者の本音<br />どうせなら、今後のことも考えて最新技術で提案したいなぁ<br />かといって、まだSilverlight開発のノウハウが無いんだよね<br /><ul><li>ユーザーの本音<...
Silverlight移行にあたって3つの「実現」ポイント<br />とくにUI面を中心にお話します<br />
ポイントその1機能を実現<br />
機能を実現するためには<br />ユーザー<br />当然、前にも出来てたことは<br />ちゃんと出来るんだよね?<br />まずはSilverlightのUIの基本を学ぼう<br />コントロールを知る<br />UIの構造を知る<br /...
SilverlightのUIクラス分類<br />図形描画<br />グラフィックス<br />標準コントロール<br />Ellipse<br />Line<br />Grid<br />Rectangle<br />Geometry<br ...
3種類のSilverlight標準コントロール<br />コントロールの成熟度<br />
SilverlightのUI構造<br />ユーザーコントロールとダイアログ<br />ナビゲーションフレームワーク<br />
ユーザーコントロールとダイアログ<br />UserControl<br />UIをカスタマイズするときの基本単位<br />VBやWinFormsにおける Form / UserControl<br />ChildWindow<br />モー...
ナビゲーションフレームワーク<br />一般的なナビゲーション機能をビルトイン<br />フレーム(親)とページ(子)<br />ページ間のナビゲーション<br />履歴管理<br />ディープリンク(SEO対策)<br />
最初のご提案<br />よし! Silverlightの基本的な仕組みはわかったぞ。<br />標準コントロールとナビゲーションを使って提案しよう!<br />レガシーシステム<br />Silverlightによる新システム<br />ユーザ...
ユーザーレビューによる改善点<br />MDIライクな子ウインドウ<br />を実現する<br />多機能なデータグリッドが必要<br />
足りない機能はどうしよう…<br />困ったなぁ。<br />必要な機能が標準で提供されてないや・・・<br />今後のためも考えて自作ライブラリを作るかぁ<br />そんな予算と期間ないぞ!<br />むぅ・・・ <br />あっ、そうだ、<...
NetAdvantageSilverlight を使って足りない機能を効果的に補足する<br />Demo-1<br />
XamWebDialogWindowによるMDIライクな画面の実現<br />各コントロールに対し<br />XamWebDialogWindowを<br />コンテナーとして割り当て<br />親コンテナーの中でのみ位置変更が<br />可能...
プラスαを実現するXamWebGridの機能<br />階層化<br />グルーピング<br />列固定<br />列移動<br />フィルター<br />ソート<br />遅延スクロール<br />etc.<br />
再度、ご提案!<br />今度は標準コントロールとNetAdvantageを組み合わせて<br />機能を強化したぞ!<br />Silverlight + NetAdvantage<br />による新システム<br />レガシーシステム<br...
Silverlight3の制限事項を正しく把握する<br />できなくて困りがちなこと<br />IME制御<br />右クリックやドラッグ&ドロップ<br />ローカルリソースへのアクセス<br />クロスドメインアクセス<br />ただし、...
Silverlight4 ベータではさまざまな機能向上が!<br />IME制御<br />IMEモードの切り替え<br />フリガナ取得 (IME_COMPOSITION)<br />痒いところに手が届くAPI強化<br />右クリック、ドラ...
ポイントその2性能を実現<br />
本格的な開発に入る前に・・・<br />機能的にはメドがたったけど、<br />果たしてパフォーマンス要件は<br />満たせるだろうか・・・<br />初回ロード時間は削減できる?<br />コントロールの描画・応答性能は?<br />開発者...
初回ロードの高速化<br />アプリケーション ライブラリ キャッシュを活用する<br />アセンブリの動的ロード<br />
Silverlightアプリケーションの標準的な配布スタイル<br />一つのXAPファイル<br />に集約される<br />アプリケーション<br />Silverlight SDK/ToolKit<br />XAPファイル<br />(=...
アプリケーション ライブラリ キャッシュを有効にすることで・・・<br />個別にパッケージして<br />ダウンロード<br />ブラウザーキャッシュを<br />有効活用できる<br />アプリケーション<br />Silverlight ...
アプリケーション ライブラリ キャッシュを有効にする方法<br />オプションを有効化<br />自作/3rd パーティライブラリに適用<br />マッピングファイル(.extmap.xml)を作成<br />ユーティリティを使うと便利<br ...
アプリケーションが大きくなると・・・<br />XAPファイル<br />共通機能<br />機能B<br />機能A<br />初期ロードコストが大きくなる<br />機能C<br />
アセンブリの動的ロード<br />初回ロード<br />必要なときに動的にロード<br />(ロードオンデマンド)<br />共通機能<br />画面B<br />画面A<br />画面C<br />
アセンブリの動的ロード実現方法<br />WebClientとリフレクションを使用します<br />WebClient.OpenReadAsync<br />追加するアセンブリを<br />非同期ロード<br />AssemblyPart.Lo...
コントロールの描画・応答性能<br />これはもう単純に<br />ハイパフォーマンスな<br />コントロールを<br />使ってください!!<br />
NetAdvantagexamWebGridによるパフォーマンス向上テクニック<br />Demo-2<br />
ポイントその3UXを実現<br />
UX実現の壁~三者三様の悩み<br />上流設計者<br />仕様<br />プログラマーは実装の過程において<br />UXは二の次とすることが多く、<br />UX->実装の解釈の際に<br />デザイナーと軋轢をきたしがち<br />デザ...
壁を乗り越えてUXを高めるためには<br />
壁を乗り越えてUXを高めるためには<br />上流設計者<br />三者に共通する言葉で話そう!<br />プログラマー<br />デザイナー<br />擬音語やローカル方言からの脱却<br />UXパターンの知識を身につける<br />
QuinceによるUXコラボレーション開発<br />Demo-3<br />http://jp.quince.infragistics.com/<br />
もっと手っ取り早くUXを!<br />高いUXがもともとビルトインされた<br />コントロールを使う<br />
UXを高めるNetAdvantage コントロールの使いどころ<br />Demo-4<br />
UXとともに~アプリケーションが目指すべきもの<br />使いやすさ<br />超ハッピー♥ <br />日々労働・・・<br />見掛け倒し<br />救いよう無し<br />カッコ良さ<br />
レガシーからの脱出<br />
NetAdvantageについて<br />NetAdvantage Silverlight<br />業務向けコントロール集<br />http://jp.infragistics.com/dotnet/netadvantage/silver...
インフラジスティックスからのご提案<br />NetAdvantage を使ってください<br />トライアル版を無料ダウンロードできます<br />トライアル期間中もオンラインサポートが有効です<br />Quinceを体験してください<br...
インフラジスティックスからの更なるご提案<br />Developer Days7 にご参加ください<br />インフラジスティックス主催の無料セミナー<br />http://jp.infragistics.com/devdays7.aspx...
トレーニングもご提供<br />Silverlight ブートキャンプ<br />Silverlightのキホンをマスターできる<br />2日間ハンズオン・トレーニング<br />次回、2010年5月開催予定!<br />DevDays7東京...
リソース<br />インフラジスティックス関連<br />フォーラム<br />http://forums.jp.infragistics.com/<br />ブログ<br />http://blogs.jp.infragistics.com/...
参考リンク<br />アセンブリキャッシュ<br />MSDN<br />http://msdn.microsoft.com/ja-jp/library/dd833069(VS.95).aspx<br />Extmap maker / Alex...
ご清聴ありがとうございました<br />
Upcoming SlideShare
Loading in …5
×

【19-E-2】レガシーシステム脱出計画

2,589 views

Published on

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,589
On SlideShare
0
From Embeds
0
Number of Embeds
14
Actions
Shares
0
Downloads
89
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

【19-E-2】レガシーシステム脱出計画

  1. 1. レガシーシステム脱出計画!~Silverlight時代の  コンポーネント活用術<br />19-E-2<br />山田 達也<br />インフラジスティックス・ジャパン<br />
  2. 2. 自己紹介<br />会社<br />インフラジスティックス・ジャパン<br />仕事<br />デベロッパーエバンジェリスト<br />ブログ<br />http://blogs.jp.infragistics.com/blogs/tyamada/<br />Twitter<br />http://twitter.com/tan2_men<br />
  3. 3. ついにSilverlight時代到来!<br />
  4. 4. アンケート結果 今後、Silverlight開発の予定は?<br />49%<br />※当社調べ 2009年10月時点のアンケート結果より<br />
  5. 5. インフラジスティックスの実感<br />※当社調べ 2009年後半のデータ<br />
  6. 6. 現場の声~Silverlightをどこで活用?<br />旧システムからの<br />リプレイスで<br />新規案件で<br />
  7. 7. よくあるマイグレーションシナリオ<br />
  8. 8. こんな感じの旧システムがあるとします。<br />人事管理システム Ver2.25<br />X<br />社員照会<br />X<br />検索条件<br />社員詳細<br />X<br />社員番号<br />1997HA0043<br />名前<br />塚越 寛正<br />所属<br />システム部<br />ツカコシ ヒロマサ<br />フリガナ<br />F1<br />F2<br />F3<br />F4<br />F5<br />F6<br />F7<br />F8<br />
  9. 9. 何かと複雑!<br />操作性<br />画面遷移<br />ナビゲーション<br />デメリット<br />習得性が低い(トレーニングコスト大)<br />作業効率が悪い<br />->新システムで一挙に解決したい!!<br />一般的なレガシーUIの問題点<br />
  10. 10. システム切り替え時のよくある会話<br />開発者の本音<br />どうせなら、今後のことも考えて最新技術で提案したいなぁ<br />かといって、まだSilverlight開発のノウハウが無いんだよね<br /><ul><li>ユーザーの本音</li></ul>当然、前にも出来てたことはちゃんと出来るんだよね?<br />新しくすることで前よりも遅くなったりしない?<br />慣れた操作性は変わらないで欲しいんだけど・・・<br />結局、画面は相変わらずだったりして?(苦笑)<br />機能要求<br />性能要求<br />UX要求<br />
  11. 11. Silverlight移行にあたって3つの「実現」ポイント<br />とくにUI面を中心にお話します<br />
  12. 12. ポイントその1機能を実現<br />
  13. 13. 機能を実現するためには<br />ユーザー<br />当然、前にも出来てたことは<br />ちゃんと出来るんだよね?<br />まずはSilverlightのUIの基本を学ぼう<br />コントロールを知る<br />UIの構造を知る<br />開発者<br />できること・できないことを知る<br />
  14. 14. SilverlightのUIクラス分類<br />図形描画<br />グラフィックス<br />標準コントロール<br />Ellipse<br />Line<br />Grid<br />Rectangle<br />Geometry<br />UserControl<br />
  15. 15. 3種類のSilverlight標準コントロール<br />コントロールの成熟度<br />
  16. 16. SilverlightのUI構造<br />ユーザーコントロールとダイアログ<br />ナビゲーションフレームワーク<br />
  17. 17. ユーザーコントロールとダイアログ<br />UserControl<br />UIをカスタマイズするときの基本単位<br />VBやWinFormsにおける Form / UserControl<br />ChildWindow<br />モーダルダイアログを表示する<br />
  18. 18. ナビゲーションフレームワーク<br />一般的なナビゲーション機能をビルトイン<br />フレーム(親)とページ(子)<br />ページ間のナビゲーション<br />履歴管理<br />ディープリンク(SEO対策)<br />
  19. 19. 最初のご提案<br />よし! Silverlightの基本的な仕組みはわかったぞ。<br />標準コントロールとナビゲーションを使って提案しよう!<br />レガシーシステム<br />Silverlightによる新システム<br />ユーザー<br />開発者<br />データグリッドの機能が<br />前より少ないな・・・<br />え~? 画面2個<br />同時に開けないの??<br />
  20. 20. ユーザーレビューによる改善点<br />MDIライクな子ウインドウ<br />を実現する<br />多機能なデータグリッドが必要<br />
  21. 21. 足りない機能はどうしよう…<br />困ったなぁ。<br />必要な機能が標準で提供されてないや・・・<br />今後のためも考えて自作ライブラリを作るかぁ<br />そんな予算と期間ないぞ!<br />むぅ・・・ <br />あっ、そうだ、<br />サードパーティ製コントロールを試してみよう!<br />開発者<br />開発者<br />偉い人<br />
  22. 22. NetAdvantageSilverlight を使って足りない機能を効果的に補足する<br />Demo-1<br />
  23. 23. XamWebDialogWindowによるMDIライクな画面の実現<br />各コントロールに対し<br />XamWebDialogWindowを<br />コンテナーとして割り当て<br />親コンテナーの中でのみ位置変更が<br />可能にする設定<br />最小化時にWindowが格納される<br />コンテナー(StackPanel)を指定<br />
  24. 24. プラスαを実現するXamWebGridの機能<br />階層化<br />グルーピング<br />列固定<br />列移動<br />フィルター<br />ソート<br />遅延スクロール<br />etc.<br />
  25. 25. 再度、ご提案!<br />今度は標準コントロールとNetAdvantageを組み合わせて<br />機能を強化したぞ!<br />Silverlight + NetAdvantage<br />による新システム<br />レガシーシステム<br />ユーザー<br />開発者<br />よし、<br />これでいきましょう!<br />期待してますよ!!<br />そうそう、<br />これができなきゃ<br />はじまらないよ<br />
  26. 26. Silverlight3の制限事項を正しく把握する<br />できなくて困りがちなこと<br />IME制御<br />右クリックやドラッグ&ドロップ<br />ローカルリソースへのアクセス<br />クロスドメインアクセス<br />ただし、これらの問題はSilverlight4で解決の見込み!<br />
  27. 27. Silverlight4 ベータではさまざまな機能向上が!<br />IME制御<br />IMEモードの切り替え<br />フリガナ取得 (IME_COMPOSITION)<br />痒いところに手が届くAPI強化<br />右クリック、ドラッグ&ドロップ、クリップボード、印刷処理など<br />アウトオブブラウザーの権限昇格モード<br />ファイルシステムやクロスドメインへのアクセス制限がなくなる<br />フルスクリーンでのキーボードサポート<br />
  28. 28. ポイントその2性能を実現<br />
  29. 29. 本格的な開発に入る前に・・・<br />機能的にはメドがたったけど、<br />果たしてパフォーマンス要件は<br />満たせるだろうか・・・<br />初回ロード時間は削減できる?<br />コントロールの描画・応答性能は?<br />開発者<br />
  30. 30. 初回ロードの高速化<br />アプリケーション ライブラリ キャッシュを活用する<br />アセンブリの動的ロード<br />
  31. 31. Silverlightアプリケーションの標準的な配布スタイル<br />一つのXAPファイル<br />に集約される<br />アプリケーション<br />Silverlight SDK/ToolKit<br />XAPファイル<br />(= ZIP形式)<br />NetAdvantage<br />小さな変更でも全体をダウンロードし直す必要あり<br />
  32. 32. アプリケーション ライブラリ キャッシュを有効にすることで・・・<br />個別にパッケージして<br />ダウンロード<br />ブラウザーキャッシュを<br />有効活用できる<br />アプリケーション<br />Silverlight SDK/Toolkit<br />アプリケーション<br />XAP<br />ZIP<br />ZIP<br />NetAdvantage<br />
  33. 33. アプリケーション ライブラリ キャッシュを有効にする方法<br />オプションを有効化<br />自作/3rd パーティライブラリに適用<br />マッピングファイル(.extmap.xml)を作成<br />ユーティリティを使うと便利<br />http://blogs.microsoft.co.il/blogs/alex_golesh/archive/2009/07/16/small-utility-extmap-maker.aspx<br />
  34. 34. アプリケーションが大きくなると・・・<br />XAPファイル<br />共通機能<br />機能B<br />機能A<br />初期ロードコストが大きくなる<br />機能C<br />
  35. 35. アセンブリの動的ロード<br />初回ロード<br />必要なときに動的にロード<br />(ロードオンデマンド)<br />共通機能<br />画面B<br />画面A<br />画面C<br />
  36. 36. アセンブリの動的ロード実現方法<br />WebClientとリフレクションを使用します<br />WebClient.OpenReadAsync<br />追加するアセンブリを<br />非同期ロード<br />AssemblyPart.Load<br />ロード結果を<br />Assemblyとして取得<br />
  37. 37. コントロールの描画・応答性能<br />これはもう単純に<br />ハイパフォーマンスな<br />コントロールを<br />使ってください!!<br />
  38. 38. NetAdvantagexamWebGridによるパフォーマンス向上テクニック<br />Demo-2<br />
  39. 39. ポイントその3UXを実現<br />
  40. 40. UX実現の壁~三者三様の悩み<br />上流設計者<br />仕様<br />プログラマーは実装の過程において<br />UXは二の次とすることが多く、<br />UX->実装の解釈の際に<br />デザイナーと軋轢をきたしがち<br />デザイナーはUXを担当するが、<br />実装やコントロールについては専門外であるため、<br />なかなか自分の思いがプロダクトに正確に反映されず<br />やきもきする<br />上流設計者は仕様に対して責任を持つが、<br />UXやコントロールに対する知識が薄いため、<br />基本的なパーツのみでUI設計を行うことが多い<br />デザインと<br />UX<br />実装と<br />コントロール<br />プログラマー<br />デザイナー<br />
  41. 41. 壁を乗り越えてUXを高めるためには<br />
  42. 42. 壁を乗り越えてUXを高めるためには<br />上流設計者<br />三者に共通する言葉で話そう!<br />プログラマー<br />デザイナー<br />擬音語やローカル方言からの脱却<br />UXパターンの知識を身につける<br />
  43. 43. QuinceによるUXコラボレーション開発<br />Demo-3<br />http://jp.quince.infragistics.com/<br />
  44. 44. もっと手っ取り早くUXを!<br />高いUXがもともとビルトインされた<br />コントロールを使う<br />
  45. 45. UXを高めるNetAdvantage コントロールの使いどころ<br />Demo-4<br />
  46. 46. UXとともに~アプリケーションが目指すべきもの<br />使いやすさ<br />超ハッピー♥ <br />日々労働・・・<br />見掛け倒し<br />救いよう無し<br />カッコ良さ<br />
  47. 47. レガシーからの脱出<br />
  48. 48. NetAdvantageについて<br />NetAdvantage Silverlight<br />業務向けコントロール集<br />http://jp.infragistics.com/dotnet/netadvantage/silverlight.aspx<br />NetAdvantage for Silverlight Data Visualization<br />データ視覚化コントロール集<br />http://jp.infragistics.com/dotnet/netadvantage/silverlight/data-visualization.aspx<br />
  49. 49. インフラジスティックスからのご提案<br />NetAdvantage を使ってください<br />トライアル版を無料ダウンロードできます<br />トライアル期間中もオンラインサポートが有効です<br />Quinceを体験してください<br />すべての機能を無料公開中なので、<br /> ぜひ活用してください<br />
  50. 50. インフラジスティックスからの更なるご提案<br />Developer Days7 にご参加ください<br />インフラジスティックス主催の無料セミナー<br />http://jp.infragistics.com/devdays7.aspx<br />
  51. 51. トレーニングもご提供<br />Silverlight ブートキャンプ<br />Silverlightのキホンをマスターできる<br />2日間ハンズオン・トレーニング<br />次回、2010年5月開催予定!<br />DevDays7東京当日にも、ダイジェスト版をご用意しています<br />http://jp.infragistics.com/devdays7/Tokyo-handson.aspx<br />
  52. 52. リソース<br />インフラジスティックス関連<br />フォーラム<br />http://forums.jp.infragistics.com/<br />ブログ<br />http://blogs.jp.infragistics.com/blogs/<br />オンラインヘルプ<br />http://jp.infragistics.com/support/documentation.aspx<br />
  53. 53. 参考リンク<br />アセンブリキャッシュ<br />MSDN<br />http://msdn.microsoft.com/ja-jp/library/dd833069(VS.95).aspx<br />Extmap maker / Alex Goleshさんのブログ<br />http://blogs.microsoft.co.il/blogs/alex_golesh/archive/2009/07/16/small-utility-extmap-maker.aspx<br />アセンブリの動的ロード<br />MSDN<br />http://msdn.microsoft.com/ja-jp/library/cc903931(VS.95).aspx<br />XAPをオンデマンドで読み込むには/マイクロソフト荒井省三さんのブログ<br />http://blogs.msdn.com/shozoa/archive/2010/01/26/xap-ondemand-download.aspx <br />Silverlight4 / INavigationContentLoaderインターフェースに関するリンク<br />http://www.wintellect.com/CS/blogs/jprosise/archive/2010/02/08/silverlight-4-s-new-inavigationcontentloader-interface.aspx<br />http://www.davidpoll.com/2010/02/01/on-demand-loading-of-assemblies-with-silverlight-navigation-revisited-for-silverlight-4-beta/<br />
  54. 54. ご清聴ありがとうございました<br />

×