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.）
   

   View Slide

2. 2019年7月にFlutterアプリを公開予定（iOS版）
   

   View Slide

3. Google I/O 2019
   【主な参加目的】
   ● Office HoursでGoogle社員の方に
   Flutterに関する質問をさせて頂き、業
   務で扱っているアプリの実装に活かす
   ● Flutterに関する最新情報の取得
   

   View Slide

4. UI出し分け方法
   

   View Slide

5. UI出し分けを実装する機会はあまりなさそう
   ● UI出し分け
   ○ Android → Material Components Widgetsで実装
   ○ iOS → Cupertino Widgetsで実装
   ● 考えられる実装の動機（稀では？）
   ○ Flutterアプリで、Google PlayやApp StoreでのFeaturedを本気で狙う
   ○ 個人的な学習
   

   View Slide

6. ソースコード例（一部）
   https://api.dartlang.org/stable/2.3.0/dart-io/Platform-class.html
   

   View Slide

7. これまで実装してきて感じた事
   ● 厳密に、Widget毎にプラットフォーム判別を行
   い、出し分けを実装するのは大変、ソースコー
   ドも長くなる
   ● Cupertino Widgetsと比較してMaterial
   Components Widgetsが豊富
   ● 同じ用途のWidgetでも、Cupertino Widgets
   よりMaterial Components Widgetsの方が、
   機能が豊富で実装しやすい印象
   

   View Slide

8. Office Hoursで質問
   【質問】
   Widget毎にプラットフォーム判別を行ってUI出し
   分けを行うのが大変である。何か簡単にできる方
   法はないか。
   【回答】
   現時点でない。ダイアログ等、アプリ構成の一部だ
   け判別して出し分けを行い、基本的には判別せず
   共通Widgetを使用する方針はどうか。
   Brett Morgan
   Developer Relations Engineer,
   Dart and Flutter at Google
   https://events.google.com/io/schedule/events/
   

   View Slide

9. UI検討指針
   

   View Slide

10. Flutter for Web:
    Technical Preview
    announced at Google I/O 2019
    

    View Slide

11. UI検討指針
    ・Mobile Platform
    ↓
    ・Multi Platform
    https://developers.googleblog.com/2019/05/Flutter-io19.html
    

    View Slide

12. Office Hoursで質問
    【質問】
    Flutterでマルチプラットフォーム化が進んでいる。
    Android/iOSだけで見てもナビゲーションの文化
    が異なったりするが、何を指針にして実装していく
    べきか。
    【回答】
    プラットフォーム側の提示するデザインガイドライ
    ンに拘りすぎない。ユーザに一番大切にして欲し
    い行動を各自・各社考えた上で、サービスに反映
    していくべき。
    Brett Morgan
    Developer Relations Engineer,
    Dart and Flutter at Google
    https://events.google.com/io/schedule/events/
    

    View Slide

13. Summary
    ● Flutter
    ○ Google I/O 2019での注目度は高いと感じた。
    ○ プラットフォーム毎に UI出し分けを実装できるが、何か一発で完全に実現する方法は現時点で存在しない。厳密にやると
    Widget毎に定義する必要があり大変。
    ○ Material Components Widgetが豊富で実装しやすい為、特別な理由のない限り Materialベースでの実装を推奨。
    ○ マルチプラットフォーム化が進んでいるが、ユーザにどのような行動をして欲しいのか熟考した上で、サービスに反映させていく
    べき。
    ● Other
    ○ Google I/Oに参加するなら、App Review や Office Hoursにも行く事を推奨。
    ○ Office Hoursでは他にも入手できた情報があるので、興味のある方は別途。
    

    View Slide

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
    

    View Slide

15. View Slide