Xamarinによるマルチデバイス・クロスプラットフォーム開発の実際

2014/09/05(Fri) Developers Summit 2014 Kansai (C-3: Mobile Track)

Transcript

1. Xamarinによる マルチデバイス・クロスプラットフォーム開発の実際 伊藤 伸裕 (@iseebi) フェンリル株式会社
2. 今⽇のお話 クロスプラットフォーム技術として Xamarinを導⼊したときに どうしたか＆どうなったかというお話
3. ⾃⼰紹介 伊藤 伸裕 フェンリル株式会社 共同開発部 ⼤阪⽣産課 所属 スマートフォンアプリ共同開発の実開発をしてるセクション スマートフォン/タブレットアプリエンジニア iOS/ Android / Windows (Phone|Store App) (元はPHPを使うWebエンジニア。システム全体設計もしてます) 最近はセールスエンジニア的な動きも(⾒習い) @iseebi / id:iseebi 会社としてはSleipnirというブラウザなどを作っています
4. 今⽇のスライドも Picky-Picsで作りました 誰でもプロ並みのデザインでポスターやチラシ、 プレゼン資料などが作れるオンラインデザインツール
5. 誰でもプロ並みのデザインでポスターやチラシ、 プレゼン資料などが作れるオンラインデザインツール https://picky-pics.com/
6. スマートフォンアプリの開発 フェンリルの共同開発では 数多くの企業様と http://www.fenrir-inc.com/jp/business/app/casestudy_app 多様なアプリを開発しています。
7. Xamarin開発事例 その他、複数の案件が進⾏中
8. iOS / Android ？ iOSとAndroidをどちらも作ったアプリは全体の半分以上 ※ストアには両対応で上がっているが、フェンリルが⽚⽅、他社が⽚⽅という場合は両対応としてカウントせず。 iOS/Android iOSのみ Androidのみ 57.1% 33.3% 9.5% フェンリルで作ったアプリの対応プラットフォーム(2013年度) ※2013年4⽉から2014年3⽉までの間にストアリリース・更新・本番化されたものが対象。
9. Windowsも盛り返しつつある タブレットの分野では盛り返してきている iOS Android Windows 43.8% 45.7% 10.5% 2013年度国内タブレット端末OS別出荷台数シェア 2013年度通期国内タブレット端末出荷概況 - 株式会社 ＭＭ総研 http://www.m2ri.jp/newsreleases/main.php?id=010120140521500
10. リリースまでの素早さは更に求められる 例：ニュースアプリ戦国時代 激しい他社追従・ジャンル特化が⾏われている
11. 通常の複数プラットフォーム開発の流れ 設計 iOS Android 開発 テスト 申請 ※いくつかのパターンのうちの⼀つ 開発 テスト
12. 通常の複数プラットフォーム開発の流れ 設計 iOS Android 開発 テスト 申請 ※いくつかのパターンのうちの⼀つ 開発 テスト iOS/Android同時リリース ※事前の設計次第ではうまく着地できる
13. マルチプラットフォーム同時開発で起こる問題 OSごとに処理フローが微妙に異なってしまう 異常系のうち1つが微妙に動作が違う、など 「同じものだから早く安くできるよね」という誤解 お客さんからしたら同じだけど、全く別のものを作っている 速さを求めると設計や試験でカバーしきれず、バグが残ったり... そもそもDRY的な意味でなんかヤダ 同じものを複数回作っちゃダメという原則に反する コストもほぼほぼ各プラットフォームごとに同じくらい
14. 開発期間は少ない、しかもリリースはずれない しかも iOS / Android 両対応 いかにスケジュールを守りつつ、品質を⾼めるか そういう開発は普通にある
15. クロスプラットフォーム開発 そうだ すればいいんだ！
16. クロスプラットフォーム開発、遅かった時代 HTML5ベース＝ハイブリッドアプリ パフォーマンスを出すのがとても⼤変＆APIも最⼤公約数的。 Facebookはハイブリッドだったが、不評だったのでネイティブに戻した。 App Generation
17. 2013/02/20 Xamarin 2.0 がリリースされる iOS / Android の開発がC#ででき、もともとC#のWindowsを含めると 3OSのアプリをC#だけでを全部カバーできる！
18. Xamarinを使ったクロスプラットフォーム開発 すべてのネイティブAPIをC#から扱える C#の既存資産・ライブラリも使える
19. ⽋点・・・ ライセンスがめっちゃ⾼い 会社で⼊れると 127,800円/1開発者・1OS・1年 きちんと運⽤できればそれを上回る効果は出せると思った。
20. 導⼊ 軽く振っただけでは偉い⼈はもちろん消極的 Xamarinの価格は、チーム分⼊れると⼤きな投資になる 半年近くロビー活動をつづけた 社内ツールをMonoMac(Xamarin.MacのOSS版)で作ってみる 社内の勉強会で紹介しまくる ⾒積をするとき、Xamarinでやったときの⾒積もおまけにつけておく →半年後「Xamarinでやってよい」 という案件を作り出すことができた！
21. Xamarinでの実開発 iOS / Android のクラスはそのままC#で扱える UIViewController, UITableView, UIButton, AVCaptureSession... ただ使うだけでは効率を上げることができない Activity, ListView, ToggleButton, Intent... ただ⾔語がC#になっただけで、やってることはObjective-C/Javaと まったく変わらないということは起こりえる。 C#らしく使えるような拡張もある(Clickイベントなど)
22. いかにして共有コードを 増やすかが勝負！
23. MVVMを使う！
24. MVVM: Model-View-ViewModel ソフトウェアデザインパターンの⼀つ WPF/Silverlight 系の環境で培われた ViewとViewModelの間はバインディングなどの定義で接続し、 Model と View と ViewModel にわけてアプリを作る Viewにはコードをなるべく書かない(書いたら負けと⾔われている) Data Binding Command Message View ViewModel Model
25. Xamarin＋MVVM＝コード共有が加速 ViewModelまでは全プラットフォームで共通にできる ビジネスロジック・画⾯の操作の⼤部分を共通にできる Viewにはコードをなるべく書かないというのが活きてくる Model ViewModel Shared C# Backend ＋ iOS View Android View → →
26. Xamarin 2⼤MVVMフレームワーク Xamarin⽤のMVVMフレームワークのうち、 広く使われているものは⼆つ MvvmCross オープンソース、⻑く使われていて実積あり、Windows8サポート Xamarin.Forms Xamarin公式、Viewまで共通化できる、モバイル専⽤
27. DEMO MvvmCrossを使ったアプリの実例
28. 実際に開発をしてみて 確かに効果はあった！ 実績値として、60%のコードを共有部分として括りだせた iOSで直したロジックのバグは、Androidではもうでない！ Xamarin、MvvmCross特有のところでつまづくことも ネイティブライブラリをリンクする⽅法など、探すのが難しいものもあった MvvmCrossのバグもちらほらある(Pull Request送ったりした) →詰まることもあるけど、だいたいなんとかなる！ （最初は学習コスト⾼いかも） MVVMの感覚に慣れるまでは時間がかかる
29. Xamarinでこうなる！ 設計 iOS Android 開発 テスト 申請 ※いくつかのパターンのうちの⼀つ 開発 テスト 共通化で後発の開発を短く！
30. MVVMチーム開発・これだけは気をつけたい ViewとViewModelのインターフェイスの決めが重要 画⾯要素とプロパティの紐付けの認識合わせは Data Binding Command Message View ViewModel Model ドキュメントなどでしっかりしておくこと。 ここの認識合わせ重要
31. まとめ
32. 誰でもプロ並みのデザインでポスターやチラシ、 プレゼン資料などが作れるオンラインデザインツール https://picky-pics.com/
33. クロスプラットフォーム開発 ⾼まる複数OS・⾼速開発の 要望に対応するための選択肢
34. アプリをC#で開発できる Xamarinなら ネイティブの速度で⾼速に動く
35. ⾼速かつ⾼品質なアプリ開発を MVVMで ソースの多くを共通化して
36. 最後に
40. ご清聴ありがとうございました