トーク

概要

本セッションでは、Material Design 3におけるAppBarのカスタマイズについて解説します。画面コンテンツのスクロール操作に連動したAppBarの動的な形状および背景の変化に焦点を当て、その実装手法や技術的なポイントを説明します。また、AppBarを透過させたり背景を変更することで、デザインにさらなる自由度を持たせ、視覚的に洗練されたUIを実現する方法なども取り上げます。これにより、アプリケーションのユーザー体験を向上させる具体的なアプローチを提案します。

想定視聴者

• UIに興味のある方
• M3に興味のある方

概要

メタプログラミングは、コードの生成や操作を動的に行う強力な技術であり、Dart においてもその重要性が高まっています。
特に、dart macros の登場により、メタプログラミングのアプローチが進化しています。
本セッションでは、メタプログラミングの基本概念を改めて紹介し、Dart におけるメタデータ管理のための meta ライブラリの主要なアノテーションを紹介します。
さらに、dart macros の概要に触れ、meta ライブラリとの利用方法の違いを比較し、それぞれがどのようにコードの効率的な管理や生成に寄与するかを探ります。

想定視聴者

• メタプログラミング初心者
• メタプログラミングに興味関心がある方
• metaライブラリ / dart macrosに興味関心がある方

概要

Flutter 3.24 から Flutter の iOS 側では CocoaPods に加えて Swift Package Manager のサポートが追加されました。
開発環境に Ruby の環境が必須ではなくなったり、 Swift Package Manager で新たに追加される機能等を利用可能になったりなど、さまざまな利点があります。

Flutter Plugin 開発は普通の package 開発に比べても手間のかかるもので、その課題はさまざまなところにあります。
このトークでは、Flutter Plugin 開発の従来の課題を示した上で、それが Swift Package Manager の登場でどのように変化していくのかを紹介します。

想定視聴者

・Flutter Plugin 開発に興味のある方
・Flutter でネイティブの機能を取り入れることに興味のある方

概要

Flutterは日進月歩でバグの修正や機能的な改善が続けられています。
私たちがアプリを開発する中で、「これはFlutterのバグなのか、それとも仕様なのか？」と惑わされることもあるでしょう。
しかし、実際にFlutterのissueについて読み、まとめられている方は少ないのではないでしょうか？
このLTでは、FlutterのHigh-priorityなissueに指定されている「P1ラベル」が付けられたものをまとめて紹介し、開発にどのように役立つか解説していきます。

想定視聴者

• Flutterのissueを把握したい人
• よりFlutterに根ざして開発したい人

概要

四半期ごとに行われるFlutterのアップデート。
日々の業務に追われてどんなアップデートがあったかお忘れの方も多いと思います。
そんな忙しい方に向けて、過去1年間のFlutterのアップデート内容を10分間にまとめます。

想定視聴者

Flutterの過去のアップデート内容を一通り復習したい方

概要

Xcode 16へのアップデートに伴い、Swiftの言語バージョンがSwift 6になった今、Swiftに大きな変革のときが訪れています。
このセッションでは、そんなSwift 6へのアップデートに伴い、Pigeonで生成されたSwiftコードをどのようにSwift 6に向けて最適化していくのがいいかを解説します。

• Swift 6について
  • Swift Concurrencyの基礎知識
  • Strict Concurrencyによるデータ競合の回避方法
• Pigeonについて
  • Pigeonの利用方法
  • Pigeonで生成されるコードの具体例
  • Pigeonで生成されたコードを利用したSwift 6プログラミングの実例と解説

想定視聴者

FlutterエンジニアでSwift側のコードをよりSwiftyに実装したいエンジニア

概要

現在、生成AIを用いたアプリケーションが増加しています。最近では、既存のデータと連携して社内ドキュメントの検索など、業務効率化に利用されることが多くなっています。また、生成AIはデータ分析も可能であり、構造化データだけでなく、図表や画像といった非構造化データに対しても認識能力を持ち、分析が可能です。

私は写真を撮ることが趣味で、上達するために上手な人の写真をよく研究しています。しかし、自分の写真に対して客観的なアドバイスをもらえる機会が非常に少ないため、せっかく上手な人の写真を研究しても、自分の写真はどこかパッとしない感じがするものの、上手な人との違いや改善点が分からず、行き詰まることがよくあります。

そこで、生成AIの画像認識能力に注目し、写真教室の先生のようにフィードバックをしてくれるアプリのプロトタイプを、FlutterとVertex AI for Firebaseを用いて開発しました。本セッションでは、その作成過程について発表させていただきます。

想定視聴者

• 生成AIを使用したアプリケーションに興味がある方
• 写真撮影が好きな方

概要

FlutterにはプラットフォームのViewを表示する方法は現状で2つ、Viewをなるべくそのまま表示するPlatformViewと、描画フレームをプラットフォームから渡して表示するTextureが挙げられます。
一般的な方法としてはPlatformViewで、公式ドキュメントにも記述がある上、PlatformViewを採用したpackageも多くあります。一方で、Textureは事例をあまり見かけませんが、有名なところだとvideo_playerで採用されています。
「プラットフォームのViewを表示したい」という目的を達成するためには、基本的にはPlatformViewを選択すれば間違いはありません。しかし、Textureを使う状況にはそれなりの理由があります。では、Textureを使う場面とは一体何でしょうか。あるいは、PlatformViewを使わない理由とは？

このトークでは、上記2つの方法について実装方法やその違い、メリデメ等を紹介します。このトークを通じて、プラットフォームのViewを表示する実装を行うときに適切な選択ができるようになることを目標とします。

想定視聴者

• Flutterの基本的な知識があり、より多くの引き出しを増やしたい方
• プラットフォームのネイティブViewを表示するような実装をしたい、またはpackageを作成したい方

概要

iOS App Extensionを使うと、 ユーザーが他のアプリやシステムを操作している間でも、その機能やコンテンツを利用できるようになります。
しかしApp ExtensionをFlutterアプリで使いたい場合、思ったより色んな問題が発生します。
このセッションではiOS App ExtensionをFlutterアプリに導入した経験を共有し、
どのような設定をすれば良いのか、そしてMethod channelはどのように実装すれば良いのかについて説明します。

• なぜApp Extensionが必要？
• iOS App Extension実装
  ・ 簡単にApp Extensionを作る
  ・ Xcodeの設定など、設定に必要なことを紹介
• Method channelの構成
  ・ App ExtensionのUIをFlutterを使って実装
  ・ App ExtensionとやりとりするためのMethod Channelのコードを実装
• よく発生する問題
  ・ App Extensionを導入しながら、よく発生する問題を紹介
  ・ メモリの制限を回避する方法
  ・ Flutterの公式ドキュメントの注意点を共有

想定視聴者

• iOS App Extensionに興味がある方
• Method Channelの実装に興味がある方

概要

WebRTC技術は映像、音声、テキストなどをリアルタイムでPeer 2 peer通信ができるようにする技術です。
このセッションではflutter_webrtcパッケージを使ってWebRTCを利用したビデオ通話アプリを作る方法を共有します。
WebRTC通信をするためにはSignaling server、STUN(TURN) serverが必要です。 Signaling serverをとても簡単なレベルのJavascriptコードでデモし、
STUN/TURNサーバーのためのcoturnのインストールと設定について簡単に説明します。

• WebRTCとは？
  ・ WebRTCを使うために必要なこと
  ・ WebRTCのProtocol
• flutter_webrtcを使ってWebRTCアプリ実装
  ・ Project初期設定
  ・ 簡単なビデオ通話アプリの実装
  ・ WebRTC通信のためのSocketクライアント実装
  ・ STUNサーバー設置、Signaling server実装（Javascript）
• WebRTCを導入する際、注意事項

想定視聴者

• WebRTCに興味がある方
• ビデオ通話などの機能をサービスに導入したい方

Flutterを使ってアプリ独自の世界観をUIで表現することは、複数のプラットフォームに対応するUIを単一のDartコードで構築できるというFlutterの最大のメリットを活かすための一つの手段です。
独自の世界観を表現する際に、画面遷移アニメーションにもこだわることで、さらに魅力的な演出が可能です。

確かに、Flutterには MaterialPageRoute というネイティブライクな画面遷移アニメーションが標準で用意されており、多くのケースではこれで十分対応できます。
しかし、オリジナルの画面遷移アニメーションを取り入れることで、ユーザーをより深くその世界観に没入させることができるかもしれません。
Flutterを選んでいるからこそ、画面遷移にもこだわりを持ち、独自の世界観をさらに引き立ててみてはいかがでしょうか？

本セッションでは、私が公開している画面遷移アニメーションのパッケージ turn_page_transition を作った経験をもとに、次の内容を話します

• CustomPaintの基本
• 画面遷移アニメーションの基本
• オリジナルの画面遷移アニメーションの描き方
• テストの書き方

概要

Flutter 3.24 からプレビュー版が使えるようになった Flutter GPU で「何が出来るようになるのか・何が出来ないのか」を、簡単なサンプルコードを動かしながら解説していきます。
Flutter GPU はOpenGLで3Dレンダリングをしたり、シェーダーでエフェクトをかけたりすることの出来る機能ですが、最大の特長は Widget と親和性が高く、発想次第で新しいアプリ体験が作り出せる点だと思います。
まだプレビュー版なので実際に開発で利用できるのはもう少し先の話ですが、今から未来のFlutterを体験して一緒にわくわくしませんか？

想定視聴者

• Flutter GPU に興味があり、基本的な概要を知りたい方
• 視覚的な面白さを重視したアプリを作りたい方
• Flutterでのゲーム作りを検討している方

概要

アクセシビリティ対応は単に利便性を向上させるだけでなく、多様なユーザーがアプリケーションを使いやすくするための重要な要素となります。
Flutterの公式ドキュメントではアクセシビリティ対応のための一連の基準を提供し、開発者がアプリケーションをより使いやすく、アクセシブルなものにするためのガイドラインの「Accessibility release checklist」を提供しています。

本セッションではサンプルアプリである"Counter App"を「Accessibility release checklist」に倣いながら追加実装を行ったアプリのソースコードを用いて、Flutterにおけるアクセシビリティ対応について解説していきます。

想定視聴者

• Flutterにおけるアクセシビリティについて知りたい人
• Flutterについて最近開発を始めた人

概要

OpenApi Generatorによる通信周りのDartのクライアントコードを自動生成できる。
このコードを使ってRepositoryの実装を行なっていくことになる。
恐らく、多くの方は基本的な方針として「swaggerのYAMLファイルをメンテナンスする」としたいはず。

そうなると、生成されたコードには一切の手をつけないままで、
プロダクトコードとUnitTestコードともに動作させられるコードを書く必要がある。

このコードの中で
「どのようにテストコードを書いたらよいか」を一つのアプローチを実例を踏まえて説明をしたいと思います。

想定視聴者

OpenApi Generatorによるプロダクトコードへの反映を考えているエンジニア
テストコードの書き方が気になっているエンジニア

概要

生成AIの急速な進化により、私達の生活や仕事においてAIを利用することが身近になりました。
2024年現在、複数の生成AIサービスが提供されており、チャット形式で疑問に答えてくれたり、コーディングのサポートなど徐々に私達の生活に欠かせないものになりつつあります。

本セッションでは、単一の生成AIサービスを用いて、デザインからFlutter用のコード出力した場合のポイントやTipsを深堀りする形で解説していきます。（ChatGPTを想定）

想定視聴者

・AIに興味がある

・プロトタイプを爆速で開発したい

・デザイナーやPMなど、エンジニア以外でも開発に興味がある

概要

生成AIの急速な進化により、私達の生活や仕事においてAIを利用することが身近になりました。
2024年現在、複数の生成AIサービスが提供されており、チャット形式で疑問に答えてくれたり、コーディングのサポートなど徐々に私達の生活に欠かせないものになりつつあります。
本セッションでは、生成AIの中でも特に注目されている「画像からコードを生成する機能」に焦点を当てます。ChatGPTやGeminiをはじめとする最新の生成AIサービスを徹底的に比較し、読み込ませたデザインからFlutter用のコード出力結果にどのような違いがあるのかを明らかにします。また、性能や使い勝手を実際の例を用いて検証・比較をしていきます。

想定視聴者

・AIに興味がある

・プロトタイプを爆速で開発したい

・デザイナーやPMなど、エンジニア以外でも開発に興味がある

概要

セッションの概要を記載してください。

このセッションでは、Pigeonを活用してDartとネイティブプラットフォーム（iOS/Android）間の連携を加速する方法について詳しく解説します。
Pigeonは、Flutterアプリケーションとネイティブコードの間の通信を簡素化し、開発効率を向上させるツールです。
以下のポイントに焦点を当てて説明します。

1. Pigeonの基本概念
2. Pigeon導入方法
   • 導入手順や初期設定のガイド
   • 必要な依存関係や準備すべき環境
3. 使用例
   • 実際にPigeonを使用して、Flutterアプリケーションとネイティブコード間のデータ交換や機能呼び出しを実現する具体例を紹介します。

想定視聴者

誰に向けたセッションなのかを記載してください。
・MethodChannelで四苦八苦している方
・Pigeonに興味がある方

概要

GraphQL は Meta 社が REST の問題点を解決するために開発した API クエリ言語およびランタイムです。
エンドポイントの統一、オーバーフェッチやアンダーフェッチの解消などが利点としてよく挙げられます。
中でも GraphQL クライアント技術は宣言的 UI と非常に相性がよく、Flutter アプリケーションのアーキテクチャに選択肢を増やしました。

このセクションでは、実際に Flutter アプリに GraphQL を採用して得られた以下の知見を共有します。

• GraphQL の概要
• GraphQL と Flutter の親和性
• 実際のアーキテクチャ
• 開発における工夫点
• React から推測する Flutter の今後

想定視聴者

• GraphQL を使ってみたい方
• Flutter アプリのアーキテクチャに興味のある方
• 大規模プロジェクトの開発に興味のある方

概要

「Web3.0」というキーワードを耳にする機会が増えています。
しかし、現在Flutterで開発されているアプリの多くは、まだWeb3の完全な実装には達していません。本セッションでは、Flutterを用いてWeb3アプリを開発する際の技術的な実装方法に加え、直面した課題やそれを克服した経験を共有します。
FlutterでWeb3アプリを開発することに興味がある方にとって、実践的な知識や技術選定のヒントなどが得られるセッションになります。

主な内容

• MetaMaskログインとウォレットアドレス取得
• 秘密鍵による署名の実装
• Web3Authでのソーシャルログイン（Apple, Google）
• Web3関連Packagesの選定の課題と対策
• ドキュメント不足やMetaMaskのバグを乗り越えた方法

想定視聴者

• Flutterエンジニア - FlutterアプリにWeb3機能を統合したいエンジニア。
• モバイルアプリ開発者 - Web3技術を使ってアプリのユーザー体験を向上させたい開発者。
• ブロックチェーンエンジニア - ブロックチェーン技術を活用したアプリ開発に興味がある方。

概要

このセッションでは、Flutterを使ってUIを構築し、Kotlin Multiplatform (KMP) を利用してビジネスロジックを実装する、Dartに依存しないクロスプラットフォームアプリ開発の新しいアプローチを紹介します。
Flutterはその優れたUI構築能力で知られていますが、ビジネスロジックをDartで実装する必要があり、一部の開発者にとっては学習コストが高くなりがちです。Dartの学習を最小限に抑えつつ、Kotlinの強力な機能を活用して、iOSやAndroid両方で動作するアプリを効率的に開発しましょう。

具体的には、FlutterでのUI構築とKMPを用いたビジネスロジックの分離統合の手法、Kotlin/Nativeを用いたプラグインの作成、FlutterとKMP間のデータのやり取りをシンプルに行うためのベストプラクティスを取り上げます。Flutterを活かし、Kotlinでビジネスロジックを管理することで、保守性や開発効率を向上させましょう。

想定視聴者

・Dartの学習に課題を感じているFlutter初心者
・Kotlinのスキルを活用したい他プラットフォーム開発者
・KotlinやKMPの経験があり、Flutterを用いた開発に興味があるAndroidエンジニア
・Kotlinのエコシステムを生かしてモバイル開発を効率化したい開発者