Windows ストアアプリ、Windows Phone アプリのユニバーサルプロジェクトを例に、クロスプラットフォーム開発で気を付けることを話します。

1. クロスプラットフォーム開発雑感
プログラミング生放送
CLR/H
Sapporo.cpp
＠札幌 ユビキタス協創広場 U-cala
@KatsuYuzu
2014/07/12

2. クロスプラットフォーム開発雑感
• クロスプラットフォーム開発って？
• 何に気を付けたらいい？
• universal Windows apps
• Windows ストアアプリ
×
Windows Phoneアプリ

3. 自己紹介
• しみみん@KatsuYuzu
• 仕事
• VB.NET
• SQL Server, Oracle
• 趣味
• C#, XAML
• WPF
• Windowsストアアプリ
• Windows Phoneアプリ

4. コミュニティ紹介
• CLR/H（http://clr-h.jp/）
• 2か月に1度くらい
• テーマ自由
• 開発
• インフラ
• その他
5分～
話してくれる方 募集中
Web系とかデザイン系とか
ゲーム系とか聞きたいな（チラ

5. コミュニティ紹介
• Code（http://www.codejapan.jp/2014）
• コーディング好きーによる温泉同好会
• 今年で3年目

6. クロスプラットフォーム開発って？

7. クロスプラットフォーム開発雑感
• クロスプラットフォーム開発って？
• 何に気を付けたらいい？

8. クロスプラットフォーム開発って？
• 異なるプラットフォームに対する開発

9. クロスプラットフォーム開発って？
• 異なるプラットフォームに対する開発
• 今日は”アプリ”について
• Android, iOSが花形

10. クロスプラットフォーム開発って？
• 異なるプラットフォームに対する開発
• 今日は”アプリ”について
• Android, iOSが花形
• Windows ストアアプリ・・・？
• Windows Phoneアプリ・・・？
• 安価で品質が高いので世界で普及中
• ※ただし日本

11. クロスプラットフォーム開発って？
• AndroidとiOSでちゃりんちゃりん！

12. クロスプラットフォーム開発って？
• 片方の言語しかできません
• ○○版だけ△△で不具合です
• [戻る]が届かないので☆1です

13. クロスプラットフォーム開発って？
• すべてがばらばら
• 開発対象
• 開発言語
• ユーザー層

14. クロスプラットフォーム開発って？
• 開発フレームワーク
• Titanium
• Sencha Touch
• PhoneGap
• Unity

15. クロスプラットフォーム開発って？
• 開発フレームワーク
• Titanium
• Sencha Touch
• PhoneGap
• Unity
• Xamarin
• iOS, Andorid, Win系の
すべてをC#とVSでできる
• 激熱

16. クロスプラットフォーム開発って？
• 開発フレームワーク
• Titanium
• Sencha Touch
• PhoneGap
• Unity
• Xamarin
• universal Windows apps
• Windows ストアアプリ
×
Windows Phoneアプリ
• 激熱 ※

17. 何に気を付けたらいい？

18. クロスプラットフォーム開発雑感
• クロスプラットフォーム開発って？
• 何に気を付けたらいい？

19. 何に気を付けたらいい？
• 対象を決めよう
• OS
• バージョン
• 具体的な端末

20. 何に気を付けたらいい？
• 対象の違いを理解しよう

21. 何に気を付けたらいい？
• 対象の違いを理解しよう
• ガイドライン
• 各種タッチ操作が表す機能
• メニュー、戻るボタンの位置

22. 何に気を付けたらいい？
• 対象の違いを理解しよう
• ガイドライン
• 各種タッチ操作が表す機能
• メニュー、戻るボタンの位置
• ユーザー層
• 裕福な層に普及するiOS
• 安価で老若男女に普及するAndroid

23. 何に気を付けたらいい？
• フレームワークの違いを理解しよう
• ネイティブ
• Sencha Touch
• WebView
• PhoneGap

24. 何に気を付けたらいい？
• フレームワークの違いを理解しよう
• ネイティブ
• よさげ
• コントロールなどの見た目が標準
• パフォーマンスでやすい

25. 何に気を付けたらいい？
• フレームワークの違いを理解しよう
• WebView
• 要注意

26. 何に気を付けたらいい？
• フレームワークの違いを理解しよう
• WebView
• 要注意
• 見た目をHTML,CSSで作る
• 標準にそぐわない
• パフォーマンスがでづらい

27. 何に気を付けたらいい？
• フレームワークの違いを理解しよう
• WebView
• 要注意
• 見た目をHTML,CSSで作る
• 標準にそぐわない
• パフォーマンスがでづらい
• Androidで確認しながら進める

28. 何に気を付けたらいい？
• フレームワークの違いを理解しよう
• ネイティブ
• クオリティ重視
• WebView
• コスト重視（短期的にみた場合）
• 長期的に見た場合
他フレームワークへリメイクの可能性

29. まとめ
• クロスプラットフォーム開発
• AndroidやiOSなどの
複数のプラットフォーム向けに開発する
• フレームワークを利用する
• 気を付けること
• 各プラットフォームの
ガイドラインに目を通す
• フレームワークを選定する

30. universal Windows apps

31. universal Windows apps
• アプリケーションの統合
• 開発の統合
• 実際のアプリでハマった落とし穴

32. universal Windows apps
• アプリケーションの統合
• マーケットの統合
• ローミングデータの統合
• 開発ライセンスの統合
• 開発の統合
• アプリ名で
ストアの関連付けを行う
• DevCenterで[アプリ名を予約]

33. universal Windows apps
• 開発の統合
• 90%のAPIが共通
• ファイルやカメラ、
デバイス制御は独自

34. universal Windows apps
• 開発の統合

35. universal Windows apps
• 開発の統合
• Windowsストアアプリ
（以降、WinRT）
• Windows Phoneアプリ
（以降、WP）
• 共有コード

36. universal Windows apps
• 開発の統合
• ビルドはそれぞれ行われる
• WinRT + Shared
• WP + Shared
• Sharedは見かけ上
分離されているが
同一プロジェクトと
扱うことができる

37. universal Windows apps
• 開発の統合
• 専用コードは
#ifディレクティブ

38. universal Windows apps
• 開発の統合
• エディタ上部で
切り替え

39. universal Windows apps
• 実際のアプリでハマった落とし穴
• 同じコードで動いたーやったー！！
• WPでみたら
画面端しかみえない
じゃないですかーやだー

40. universal Windows apps
• Accent Color Camera
• http://apps.microsoft.com/windows/ja-jp/app/accent-
color-camera/2bc046d8-37d4-4af0-8e7b-cdf6b4015fde

41. universal Windows apps
• Accent Color Camera
• http://apps.microsoft.com/windows/ja-jp/app/accent-
color-camera/2bc046d8-37d4-4af0-8e7b-cdf6b4015fde
• おしゃんてぃーなアプリ
• WP7（IS12T）アプリのuniversal化
• WP: Silverlight
• WinRT: ユニバーサルアプリ
• 現状、universal化のための
ベータリリースです。

42. まとめ
• universal Windows apps
• アプリケーションの統合
• ストアで関連付け
• 必ずしもユニバーサルアプリで開発する
必要はない
• ユニバーサルアプリ
• 開発の統合
• クロスプラットフォーム開発
• VS2013 update2から
• 画面と処理は疎結合
• 画面の共通化はしない