Google IO 2019

Google I/O 2019, focus on Flutter.
- 2019/05/15 potatotips #61 @Wantedly
- 2019/05/22 Flutter Meetup Tokyo #9 @Studyplus

Transcript

1. Google I/O 2019で直接確認した、 FlutterでのAndroid/iOSのUI出し分け方法 と今後のUI検討指針 Yuma Tanaka Mobile Application Engineer at MTI Ltd.（Video Market Corp.）
2. 2019年7月にFlutterアプリを公開予定（iOS版）
3. Google I/O 2019 【主な参加目的】 • Office HoursでGoogle社員の方に Flutterに関する質問をさせて頂き、業 務で扱っているアプリの実装に活かす • Flutterに関する最新情報の取得
4. UI出し分け方法
5. UI出し分けを実装する機会はあまりなさそう • UI出し分け ◦ Android → Material Components Widgetsで実装 ◦ iOS → Cupertino Widgetsで実装 • 考えられる実装の動機（稀では？） ◦ Flutterアプリで、Google PlayやApp StoreでのFeaturedを本気で狙う ◦ 個人的な学習
6. ソースコード例（一部） https://api.dartlang.org/stable/2.3.0/dart-io/Platform-class.html
7. これまで実装してきて感じた事 • 厳密に、Widget毎にプラットフォーム判別を行 い、出し分けを実装するのは大変、ソースコー ドも長くなる • Cupertino Widgetsと比較してMaterial Components Widgetsが豊富 • 同じ用途のWidgetでも、Cupertino Widgets よりMaterial Components Widgetsの方が、 機能が豊富で実装しやすい印象
8. Office Hoursで質問 【質問】 Widget毎にプラットフォーム判別を行ってUI出し 分けを行うのが大変である。何か簡単にできる方 法はないか。 【回答】 現時点でない。ダイアログ等、アプリ構成の一部だ け判別して出し分けを行い、基本的には判別せず 共通Widgetを使用する方針はどうか。 Brett Morgan Developer Relations Engineer, Dart and Flutter at Google https://events.google.com/io/schedule/events/
9. UI検討指針
10. Flutter for Web: Technical Preview announced at Google I/O 2019
11. UI検討指針 ・Mobile Platform ↓ ・Multi Platform https://developers.googleblog.com/2019/05/Flutter-io19.html
12. Office Hoursで質問 【質問】 Flutterでマルチプラットフォーム化が進んでいる。 Android/iOSだけで見てもナビゲーションの文化 が異なったりするが、何を指針にして実装していく べきか。 【回答】 プラットフォーム側の提示するデザインガイドライ ンに拘りすぎない。ユーザに一番大切にして欲し い行動を各自・各社考えた上で、サービスに反映 していくべき。 Brett Morgan Developer Relations Engineer, Dart and Flutter at Google https://events.google.com/io/schedule/events/
13. Summary • Flutter ◦ Google I/O 2019での注目度は高いと感じた。 ◦ プラットフォーム毎に UI出し分けを実装できるが、何か一発で完全に実現する方法は現時点で存在しない。厳密にやると Widget毎に定義する必要があり大変。 ◦ Material Components Widgetが豊富で実装しやすい為、特別な理由のない限り Materialベースでの実装を推奨。 ◦ マルチプラットフォーム化が進んでいるが、ユーザにどのような行動をして欲しいのか熟考した上で、サービスに反映させていく べき。 • Other ◦ Google I/Oに参加するなら、App Review や Office Hoursにも行く事を推奨。 ◦ Office Hoursでは他にも入手できた情報があるので、興味のある方は別途。
14. References • Google I/O Schedule https://events.google.com/io/schedule/events/ • Dart > dart:io > Platform class https://api.dartlang.org/stable/2.3.0/dart-io/Platform-class.html • Flutter: a Portable UI Framework for Mobile, Web, Embedded, and Desktop https://developers.googleblog.com/2019/05/Flutter-io19.html