Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Google IO 2019

tanaka
May 15, 2019

Google IO 2019

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

tanaka

May 15, 2019
Tweet

More Decks by tanaka

Other Decks in Technology

Transcript

  1. Google I/O 2019で直接確認した、
    FlutterでのAndroid/iOSのUI出し分け方法
    と今後のUI検討指針
    Yuma Tanaka
    Mobile Application Engineer at MTI Ltd.(Video Market Corp.)

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  4. UI出し分け方法

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size 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 full-size slide

  9. UI検討指針

    View full-size slide

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

    View full-size slide

  11. UI検討指針
    ・Mobile Platform

    ・Multi Platform
    https://developers.googleblog.com/2019/05/Flutter-io19.html

    View full-size 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 full-size 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 full-size 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 full-size slide