チーム開発において、効率的な開発環境はプロジェクトの成功に不可欠です。
本セッションでは、Flutter 開発における環境構築から CI/CD といった開発フロー全体における、具体的なノウハウとプラクティスを発表します。
チームメンバーが開発に集中できる環境を整え、生産性の向上を目指しましょう。
具体的には、以下のトピックを中心に解説します。
デザインシステムの文脈の元、
Flutterでデザイン再現度を上げるにはどうすべきか以下のような内容を話します。
※ デザインツールはFigmaを前提としています。
・ チームでのデザインシステムへの取り組みの紹介
・ デザイナーの巻き込んでいくか
・ 実際のFlutterでのデザインの再現方法
・ プログラムしやすいデザインとして、デザイナーに何を連携して何をデザインシステムとしてまとめたか紹介
・ デザインの再現度を高めたい方。
・ Figmaを見てFlutterで実装する際のTipsを知りたい方。
・ 「デザインシステム」・デザイナーと実装しやすいデザインについて協議を進めていきたい方。
「ダウンロードしておいたファイル(端末に保存したファイル)を利用してアプリを動作させる方法」について設計・Tips・注意点を紹介します。
※ 実際に業務で利用した知見が含まれます。
現状含んでいない内容
オフラインで実行した処理(ポイント付与など)を、オンラインに繋げた際に連携する方法。
※ 実績がないため、用意できたとしても調査した結果のみとなります。
・ オフラインを前提としたアプリを検討したことがあり、Flutterアプリを動作させる方法についてヒントが欲しい方。
・ 端末内にファイル保存をする仕様を検討されている方。
Awarefyでは、MaestroによるE2Eテスト環境を構築し、運用しています。そして、実行にかかるコストを削減するため、Maestroが用意しているCIサービスであるMaestro Cloudを使わず、GitHub Actionsからself-hosted runnersで実行することに成功しました。
Maestroを用いたE2Eテストの実装から、self-hosted runnersで実行するためのハウツーについて話します。
社内向けのOpenID Connect (OIDC)クライアントライブラリ 開発した経験を共有します。
株式会社GENDA が提供するGENDA ID (グループ横断の ID プラットフォーム)に対応するため、FlutterアプリからOIDCのRelying Partyとして機能するPublic Clientライブラリの開発プロセス、直面した課題、そしてその解決策について詳しく説明します。
弊社ではネイティブアプリとWebアプリをFlutterでのフルリプレイスを進めていて、AndroidとWebをフルリプレイスすることができました。
Flutterで独自デザインを実現するためのカスタマイズには制限があり、どこまでできるのか頻繁にデザイナーとのやり取りが発生しました。
本セッションでは、Flutterのデザインカスタマイズの制限をどのように克服し、デザイナーとの調整をスムーズに進めたかを共有します。
特に、Widgetbookを活用することでデザイン調整の工数をどのように削減したか、実際の体験談を交えて紹介します。
画像切り抜きパッケージ "crop_your_image" の公開から 3 年が経ちました。
LIKE 数は 500 に迫り、POPULARITY は 98%、リポジトリへの issue やプルリクは今でも定期的に作成され、画像切り抜きパッケージとして当初の想定の何倍も使われていると自画自賛しています。
このセッションでは、そんな crop_your_image パッケージの開発を振り返りながら、パッケージ開発の経緯や使いやすいパッケージを実現するためのアイデア、パッケージ開発から得られるスキルやノウハウなどを余すところなく共有しながら、パッケージ開発が普段のアプリ開発に対しても大きな糧になることを説明します。
Mobile向けに開発したものをWebや他のDesktopプラットフォームで表示すると、「なんか違う?」と感じたことはありませんか?
本セッションでは、MobileとDesktopをワンソースで開発する中で遭遇した実際の事例を基に、Desktopプラットフォームでの開発時に特に注意が必要なポイントを詳しく解説します。
Studyplusは、多機能かつユーザー数の多い大規模なネイティブアプリです。弊社では、数年前からこのStudyplusのネイティブアプリと同様の機能を持つWebアプリをFlutterを使ってフルリプレイスするプロジェクトを進めてきました。
このセッションでは、ネイティブとWebをワンソースで開発するという他にないレアな事例を基に、リプレイスプロジェクトの進め方、直面した課題、そして得られた知見について詳しくお話しします。
アプリケーションの機能やレイヤーをディレクトリで分けて表現することは普通に行うことだと思います。
このディレクトリの構成を機能単位やレイヤーでパッケージ化します。
パッケージ化すると機能ごとの依存度が減り、意図しない機能を実行する危険性を減らすことができます。
また、単一のパッケージのみテストを実行したり、依存度が少ないことで機能を切り離したりすることも比較的容易になります。
ただし、レイヤーでパッケージ化する場合はある程度入念な設計が必要になります。
例えば、 UI から直接通信処理を実行させたくないような場合、単純にパッケージを分割しているだけではファイルをインポートすることで簡単に処理を実行できてしまい、あまりその恩恵を受けることができません。
この恩恵を受けるための一つの手法として依存性逆転の原則があります。
ここでは、 Riverpod を利用した依存性逆転の原則の実装の説明と melos を利用した依存の解決方法、並列でテストを実行した際のカバレッジの算出など、開発の現場で行った実践的なお話をさせてもらいます。
位置情報と連動してポイントを獲得できる新機能を自社サービス内でリリースしました。
不正にポイントを得られないような様々な対策を行い、大きなイベントも無事乗り越えられました。
本セッションでは、Flutterアプリにおける位置情報やマップに関する実装のプラクティスとセキュリティ対策について紹介します
アプリを運用していく上で、安定した品質とデリバリーはプロダクトに対するユーザーの満足度やチームの生産性にも影響します。
不具合を起こさずに施策や改善を提供することはできません。
本セッションではそういった不具合の中でも、パフォーマンスに対するトピックを掘り下げます。
開発環境で素早く問題に気づき、本番環境で素早く問題を検知する状態を目指すアプローチを紹介します
SLI/SLOはSREでよく使われる概念ですが、モバイルアプリ開発にはまだ馴染みが薄いかもしれません。
私たちのプロダクトでは障害発生率が高く、早期の検知と解消が求められていました。
そこで、SLI/SLOの概念をモバイルアプリに適用し、ユーザー体験の低下を即時に検知する仕組みを構築しました。
この仕組みにより、以下の指標をリアルタイムで監視し、即時に対応可能となりました:
現在、この監視システムは40以上の機能に適用されています。
このセッションでは以下の内容について詳しく解説します:
モバイルアプリのリリースにおいて、一度リリースしたバイナリを完全に取り消すことができないという課題があります。
iOSとAndroidの両方で「段階リリース」を活用することで、リリースバイナリの浸透を調整し、リスクを管理することが可能です。
しかし、段階リリースはユーザーに価値を届けるまでに時間がかかることや、チーム内でのコミュニケーションコストの増加といったデメリットも伴います。
私のチームでは、リリースする機能の増加に対応するため、リリース頻度を週3回にする体制を構築しました。
このセッションでは、段階リリースを行いながら、24時間以内に公開率を100%にするか、公開を中断する体制の詳細を紹介します。
具体的には以下の内容についてお話します。
2024年に発表されたFigmaの新機能 フォーカスビュー、ステータス管理、etc... これらDev Modeの機能の概要を説明すると共に、ベストプラクティスを共有します。
Figma Dev Modeの活用がFlutterの開発体験をどれだけ向上されるかをご覧頂きます。
エンジニアとデザイナーが共同で発表するこのトークでは、デザインから実装までの一貫したワークフローをロールプレイング形式でお見せします。
エンジニアとデザイナーそれぞれの仕事の相互理解に繋がる内容で、一緒にご覧頂くことで組織のコラボレーションを強化することにも繋がるでしょう。
本セッションではFlutter開発者の視点からGitHub Actionsの魅力と効果的な活用法を探ります。
GitHubに統合されたGitHub Actionsは、開発者が柔軟にワークフローを定義し、多様な開発タスクを効率化できる強力なCI/CDツールです。
Flutter開発者にとって、GitHub Actionsは開発サイクルを加速し、品質を向上させる強力な味方となり得ます。
このトークではテストやビルドなどの具体的なワークフローの紹介は最小限に留め、その代わりに以下のトピックを通じてFlutter開発におけるGithub Actionsの魅力を深掘りしたいと思います。
ここで得た知識が、ご自身のFlutterプロジェクトでのGitHub Actionsの活用や、CI/CDを導入するきっかけとなれば幸いです。
Flutter大学というFlutterエンジニア向けのサービスを4年間運営しています。このサービスは、Flutterで作られており、iOS、Android、webに対応しています。これまで日本向けに運用してきましたが、今年海外向けにリニューアルを図りました。このプロセスで、生成AI(GeminiやChatGPT)とslangパッケージを使って、大きなリソースをかけることなく、たった一人で日本語のサービスを英語圏にも対応させました。本セッションでは、ここで得た技術的知見やハマりどころなどを紹介します!海外展開を図ろうとしている皆さんの一助になれば幸いです。
効率の良いローカリゼーションの実装に興味のある方
個人アプリを海外展開したいエンジニア
本セッションでは、Material Design 3におけるAppBarのカスタマイズについて解説します。画面コンテンツのスクロール操作に連動したAppBarの動的な形状および背景の変化に焦点を当て、その実装手法や技術的なポイントを説明します。また、AppBarを透過させたり背景を変更することで、デザインにさらなる自由度を持たせ、視覚的に洗練されたUIを実現する方法なども取り上げます。これにより、アプリケーションのユーザー体験を向上させる具体的なアプローチを提案します。
Impellerについて知っていますか?Skiaに代わる形で導入されたレンダリングエンジンでFlutter v3.7.0でiOSにおいてpreviewが始まり、v3.16.0ではAndroidでもpreviewが開始されました。
皆さん様々な印象があると思います。有効にしたら動作が速くなった、名前が強そう、シャドウ重くない?などなど...
とはいえ実際にSkiaからどのように変わり、なぜ速くなったのかを理解してる人はあまり多くないと思います。
FlutterはありがたいことにOSSでこの魔法のような技術がどう実現されているかを実際に読むことができます。
このトークではWidgetTreeから実際に描画されるまでを追いながらSkiaからImpellerでどのように改善されたかを解説していきます。
Flutter 3.24 から Flutter の iOS 側では CocoaPods に加えて Swift Package Manager のサポートが追加されました。
開発環境に Ruby の環境が必須ではなくなったり、 Swift Package Manager で新たに追加される機能等を利用可能になったりなど、さまざまな利点があります。
Flutter Plugin 開発は普通の package 開発に比べても手間のかかるもので、その課題はさまざまなところにあります。
このトークでは、Flutter Plugin 開発の従来の課題を示した上で、それが Swift Package Manager の登場でどのように変化していくのかを紹介します。
・Flutter Plugin 開発に興味のある方
・Flutter でネイティブの機能を取り入れることに興味のある方