Download as PDF, PPTX
![2018.05.19
(Kenichi Kambara)
I/O Extended 2018 Tokyo@GDG
Flutter / Wear OS
[Google I/O 2018 Highlights]](https://image.slidesharecdn.com/ioextended2018tokyogdgkenichikambara-180519043951/75/Google-I-O-2018-Highlights-Flutter-WearOS-1-2048.jpg)
![Sessions about Flutter
•Code beautiful UI with Flutter and Material Design
https://www.youtube.com/watch?v=hA0hrpR-o8U
•Total mobile development made fun with Flutter and Firebase
https://www.youtube.com/watch?v=p4yLzYwy_4g
[Day1]
•Build reactive mobile apps with Flutter
https://www.youtube.com/watch?v=RS36gBEp8OI
•Add Firebase to your cross-platformReact Native or Flutter app
https://www.youtube.com/watch?v=8wQ_MorYCEk
•Customize Material Components for your product
https://www.youtube.com/watch?v=3VUMl_l-_fI
•Build great Material Design products across platforms
https://www.youtube.com/watch?v=Ty6VjgVHiko
[Day2]
[Day3]](https://image.slidesharecdn.com/ioextended2018tokyogdgkenichikambara-180519043951/75/Google-I-O-2018-Highlights-Flutter-WearOS-10-2048.jpg)
![References
•Flutter
https://flutter.io
•MATERIAL DESIGN
https://material.io
•Google Codelabs (Flutter)
https://codelabs.developers.google.com/?cat=Flutter
•Flutter Sessions on I/O 2018
https://events.google.com/io/schedule/?topic=flutter
•Wear OS Session on I/O 2018
https://www.youtube.com/watch?v=VZVosFzD9NU
•Wear OS by Google [Android Developers]
https://developer.android.com/wear/](https://image.slidesharecdn.com/ioextended2018tokyogdgkenichikambara-180519043951/75/Google-I-O-2018-Highlights-Flutter-WearOS-69-2048.jpg)
Uploaded byKenichi Kambara
[Google I/O 2018 Highlights] Flutter / WearOS
This document summarizes Kenichi Kambara's presentation on Flutter and Wear OS at Google I/O 2018 Tokyo. The presentation introduced Flutter, Google's mobile app SDK for building native iOS and Android apps using Dart. It covered how to build beautiful UIs using Flutter and Material Design through live coding examples. It also summarized sessions from Google I/O about Flutter and introduced updates to Wear OS, including new features from Google Assistant, text-to-speech, and creating actions for Wear OS using Kotlin.
More Related Content
Similar to [Google I/O 2018 Highlights] Flutter / WearOS
![[ABC2018Spring]Flutterアプリ開発入門](https://cdn.slidesharecdn.com/ss_thumbnails/abc2018sflutterkenichikambara-180609052604-thumbnail.jpg?width=640&height=640&fit=bounds)
![[Google I/O 2018 Highlights] Sandbox](https://cdn.slidesharecdn.com/ss_thumbnails/lifull-apk2kenichikambara-180528135902-thumbnail.jpg?width=640&height=640&fit=bounds)
![[Kotlin勉強会] Hello Kotlinの次におさえたいKotlinの勘所](https://cdn.slidesharecdn.com/ss_thumbnails/kotlinkenichikambara20170822-170822110808-thumbnail.jpg?width=640&height=640&fit=bounds)
![Vibe Coding vs. Spec-Driven Development [Free Meetup]](https://cdn.slidesharecdn.com/ss_thumbnails/vibecodingvsspecdrivendevelopment-251209105622-43f455e7-thumbnail.jpg?width=640&height=640&fit=bounds)
[Google I/O 2018 Highlights] Flutter / WearOS
- 1. 2018.05.19 (Kenichi Kambara) I/O Extended2018 Tokyo@GDG Flutter / Wear OS [Google I/O 2018 Highlights]
- 2. About me • • • DroidconUK/FR/NL/ES/SH • Developers Summit • Android Bazaar and Conference • StackOverflow DevDays • Cloud Days • • Mobile Dev Blog • Android • NTT (@korodroid)
- 3. Beta3 Cool ※ GoogleI/O 2018 Google I/O 2018
- 4.
- 5. Flutter Flutter is Google’smobile app SDK for crafting high-quality native interfaces on iOS and Android in record time. •Fast development (Hot Reload!) •Expressive, beautiful UIs •Modern, reactive framework •Dart •Android Studio / VS Code
- 6.
- 7.
- 8.
- 9.
- 10. Sessions about Flutter •Codebeautiful UI with Flutter and Material Design https://www.youtube.com/watch?v=hA0hrpR-o8U •Total mobile development made fun with Flutter and Firebase https://www.youtube.com/watch?v=p4yLzYwy_4g [Day1] •Build reactive mobile apps with Flutter https://www.youtube.com/watch?v=RS36gBEp8OI •Add Firebase to your cross-platformReact Native or Flutter app https://www.youtube.com/watch?v=8wQ_MorYCEk •Customize Material Components for your product https://www.youtube.com/watch?v=3VUMl_l-_fI •Build great Material Design products across platforms https://www.youtube.com/watch?v=Ty6VjgVHiko [Day2] [Day3]
- 11. Sessions 1 •Code beautifulUI with Flutter and Material Design ➡Cool UI Flutter •Total mobile development made fun with Flutter and Firebase ➡Flutter+Firebase •Build reactive mobile apps with Flutter ➡ •Add Firebase to your cross-platformReact Native or Flutter app ➡Firebase React Native/Flutter •Customize Material Components for your product ➡Material Components UI/UX •Build great Material Design products across platforms ➡Material Design (Design/Develop/Tools)
- 12. Designer/Developer •Code beautiful UIwith Flutter and Material Design ➡Cool UI Flutter •Total mobile development made fun with Flutter and Firebase ➡Flutter+Firebase •Build reactive mobile apps with Flutter ➡ •Add Firebase to your cross-platformReact Native or Flutter app ➡Firebase React Native/Flutter •Customize Material Components for your product ➡Material Components UI/UX •Build great Material Design products across platforms ➡Material Design (Design/Develop/Tools)
- 13. Flutter • Customize MaterialComponents for your product • Build great Material Design products across platforms
- 14. Flutter is afirst-class platform in Material Design
- 15.
- 16. Material Theming With materialtheming, you can create a custom theme of material which is personalized for your product, expressing its brand through color, type, and shape.
- 17.
- 18.
- 19.
- 20.
- 21.
- 22.
- 23.
- 24.
- 25. (3)Tools:Material Theme Editor https://material.io/tools/theme-editor/ 1.Sketch Material Theme Editor 2. Sketch :Plugins→Material→Open Theme Editor
- 26.
- 27.
- 28.
- 29. Brand Examples Cuts onthe cornerBottom app bar + FAB
- 30. Developer •Code beautiful UIwith Flutter and Material Design ➡Cool UI Flutter •Total mobile development made fun with Flutter and Firebase ➡Flutter+Firebase •Build reactive mobile apps with Flutter ➡ •Add Firebase to your cross-platformReact Native or Flutter app ➡React Native/Flutter Firebase •Customize Material Components for your product ➡Material Components UI/UX •Build great Material Design products across platforms ➡Material Design (Design/Develop/Tools)
- 31. Flutter Code beautiful UIwith Flutter and Material Design
- 32. Looks like Google’sBrand…
- 33. The guidance ourdesigner gave us
- 34.
- 35.
- 36.
- 37. (1)Theme Tools for pickingcolors(material.io/Design) https://material.io/design/color/the-color-system.html#tools-for-picking-colors
- 38.
- 39.
- 40.
- 41.
- 42.
- 43.
- 44.
- 45.
- 46.
- 47.
- 48.
- 49.
- 50.
- 51.
- 52.
- 53.
- 54.
- 55.
- 56.
- 57. Summary •Material Components CoolUI/UX •Hot Reload • (Firebase,Reactive ) •Codelabs ( 9 ) •Flutter Write Your First Flutter App •Flutter Building Beautiful UIs with Flutter MDC Series 101/102/103/104 https://codelabs.developers.google.com/?cat=Flutter
- 58. Watch OS byGoogle
- 59.
- 60.
- 61. Sessions about WearOS •What's new in Wear OS by Google •https://www.youtube.com/watch?v=VZVosFzD9NU
- 62.
- 63.
- 64.
- 65. Google Assistant Talk toWatch Text To Speech Suggestion Chips
- 66. Create Actions forWear OS
- 67.
- 68.
- 69. References •Flutter https://flutter.io •MATERIAL DESIGN https://material.io •Google Codelabs(Flutter) https://codelabs.developers.google.com/?cat=Flutter •Flutter Sessions on I/O 2018 https://events.google.com/io/schedule/?topic=flutter •Wear OS Session on I/O 2018 https://www.youtube.com/watch?v=VZVosFzD9NU •Wear OS by Google [Android Developers] https://developer.android.com/wear/
- 70. - Please letme know if you have any requests such as technical speeches, technical writings and so on. Facebook:http://fb.com/kanbara.kenichi Google+:+Kenichi Kambara LinkedIn:http://www.linkedin.com/in/korodroid Twitter:@korodroid Thank you so much.