Flutterのアプリ事例3選/おすすめの活用法も紹介

「Flutterってよく聞くけどどんなところで使われているの?」

フロントエンドやアプリケーション開発のメジャーなフレームワークであるFlutter、しかし具体的にどのようなアプリケーションに使われているのかなかなか知る機会はないのではないでしょうか。

今回はFlutterを使ったアプリケーション開発の事例を3つ紹介します。実際にFlutterを作る際のおすすめの活用法も紹介するので是非参考にして下さい。

Flutterの基本

Flutterは開発者が同一のコードベースを使用して、iOSとAndroidの両方で動作するアプリを作成できるオープンソースフレームワークです。さまざまなメリットからモダンなアプリケーション開発の主流となる技術です。ここではFlutterの基本項目について説明します。

Flutterの概要

Flutterは、Googleによって開発されたオープンソースのUIソフトウェア開発キットです。Dart言語で構築され、iOS、Android、Web、およびデスクトップアプリケーションの開発を可能にします。

Flutterの主な特徴は、「ウィジェット」という再利用可能なUIコンポーネントを用いて、ネイティブに近いパフォーマンスと見た目を実現できることです。このため、開発者は、異なるプラットフォームに対して一度のコード作成で、一貫したユーザー体験を提供することができます。

Flutterを使うメリット

Flutterを利用する主なメリットは、「ウィジェットの利用」です。Flutterではボタン、ヘッダー、画像などUIの様々な部分がウィジェットによって構成されています。ウィジェットは再利用可能で、一度定義すれば、アプリケーションのどこでも利用できます。ウィジェットを自由に入れ替えることで、複雑なUIを形成できます。

また、「クロスプラットフォーム」「ホットリロード」もFlutterの便利なポイントです。「クロスプラットフォーム」は一つのコードで複数のOS間で適用するアプリケーションを作れる機能で、これにより作業時間を大幅に短縮できます。「ホットリロード」はコードの変更内容が即座に反映される機能で、これによりアプリの変更をすぐに確認してバグの対処などを実行できます。

Dart言語の役割と特性

FlutterはDart言語で書かれています。DartはGoogleが2011年に開発したオープンソースのプログラミング言語です。JavaScriptの代替言語として作られており、記法もよく似ています。

Flutterが開発される前はJavaScriptと役割が被っていたためにあまり認知されていませんでした。静的型付けであるなどのメリットはありますが、それですらTypeScriptの利用などで補えたためです。Flutterが知れ渡ってからは一気にメジャーな言語になりました。歴史の浅い言語でまだまだ未開発な部分が大きく、今後も発展が期待されます。

多様なアプリ事例

これらのメリットを持つFlutterは、さまざまなアププリケーションに利用されています。Alibaba、Google、トヨタ、世界を代表する企業もFlutterの可能性に目をつけ、自社アプリケーションの開発に目をつけています。このセクションでは、これらの企業でのFlutterの利用事例を詳しく紹介します。

eコマースアプリの事例…Alibaba

eコマースアプリの開発にもFlutterは効果的です。Flutterを使ったアプリケーション開発の事例はAlibabaの制作したフリマアプリ「閑魚（シェンユー）」です。2億人以上に使われており、中国で一番人気のフリマアプリです。

シェンユーはすでに開発したアプリに徐々にFlutterを取り入れていった事例になります。Flutterの「クロスプラットフォーム」機能により開発時間の大幅削減に成功したとの報告があります。

プラットフォームの事例…Google

Flutterをベースにアプリのプラットフォームそのものを制作できます。Flutterの開発者である「Google」自身「Google広告」や「Google Pay」などの多数のアプリケーションを制作しています。

https://developers.googleblog.com/2021/03/announcing-flutter-2.html

コードの統合によりプラットフォーム間の機能格差を取り除いたり、コード量を大幅に削減できたりするメリットが合ったと報告されています。iOSとAndroidの両方でセキュリティレビューやコードレビューを行った結果、導入以前よりはるかに効率的であると言う報告が上がりました。

車載器の事例…トヨタ

トヨタは車載器、自動車のコックピットのUX/UIなどの開発に使う言語にDart、Flutterを採用することを発表しました。

Flutterはホットリロードとクロスプラットフォームでスピーディーな開発が可能であること、アプリの動作が早いこと、何より車載器にスマホのようなリッチなタッチスクリーンのUX/UIが搭載可能であることが一番の理由でした。

https://techplay.jp/column/1516

現在社内でFlutterエンジニアを増やすためにGoogleのエンジニアを講師として招聘し、社内での徹底した教育を行っています。

Flutterの活用法

ここまでFlutterを使った事例をいくつか紹介しました。しかし、私達が実際にFlutterを活用するにはどのようなケースで使えるのでしょうか。ここでは以下の3つの例を紹介します。

ECサイト開発

FlutterはECアプリケーションとの相性は抜群です。

まず、マテリアルデザインをベースにしたウィジェットが用意されているため、それらを組み合わせるだけできれいなECサイトのデザインが作れます。ECサイトは複数の商品を並べるなど同じウィジェットを並べることも多いですが、Flutterならきれいなレイアウトが手軽に作れます。

次に、ECサイト構築において優れている点は「Firebase」との連携です。FirebaseはGoogle が提供するウェブ開発プラットフォームで、ユーザー認証やデータベースの保存、顧客行動分析などECサイトに必要な多種多様な機能が揃っています。

FlutterはFirebaseと相性がよく、簡単に連携させることができます。Firebaseの利用でアプリ開発が簡単になるので、ぜひ使ってみて下さい。

モバイルゲーム開発

Flutterはモバイルゲーム開発にも有用です。

「Flame Engine」や「Casual Games Toolkit」などのフレームワークを使い、2Dゲームを作成できます。またクロスプラットフォームにより、iOSとAndroidでコードを分けなくても作れるのが何よりの強みと言えます。

Unityなどと違 い、ゲームに特化したフレームワークではないので、高クオリティなゲームを作るのは難しいですが、お手軽なゲーム作成はプログラミングの練習には最適です。テトリスなどの簡単なパーティゲームなら気軽に作れるので、自作のゲームで友達と遊んでみましょう。

業務効率化アプリの開発

スマホを使った業務効率化アプリを作るのもよいでしょう。

例として、タスク管理アプリを想定します。タスク管理アプリの場合、以下の機能が必要になります。

• タスクの追加、編集、削除
• タスクの一覧表示

タスクの追加時・更新時に必要な状態管理の機能はFlutterのRiverpodで、一覧表示は豊富なウィジェットから選べます。タスク管理アプリは複雑な機能が必要なく。Flutterの基本的な機能を一通り学べるので、初心者におすすめのアプリケーションです。

Flutterの現状と未来

Flutterはまだ新しいフレームワークですが、日進月歩で進化しています。国内でもトヨタを始め多くの企業もFlutterの採用を進めており、Dartはもはやウェブアプリケーション開発の定番言語と言えるでしょう。最後にFlutterの現状と今後の進化について解説します。

【2023年現在】Flutterの最新アップデート

2023年5月10日「Flutter」の最新版「3.10」が発表されました。3.10は以下のような新機能を兼ね備えています。

• Material 3へ対応強化
• グラフィック性能の向上
• SLSA level1への対応
• WebAssembly対応

この中で特に注目すべきは「Material 3」と「WebAssembly」でしょう。

Material 3はユーザの端末の壁紙の色をベースにアプリケーションの色を変えられる「Material You」や、スタイルの値を変数化し複数のプラットフォームで共有できる「Design tokens」など新機能を兼ね備えた、マテリアルデザインの強化版です。デザインと開発の連携を取りやすくなったり、より柔軟にデザインしたりすることが可能です。

WebAssemblyはWebブラウザ上で機械語並みのスピードで実行できるバイナリフォーマットで、Webサイトの読み込みがこれまでにない速度に高速化されます。

今後のFlutterはこれらの機能を搭載すると報告されており、ますます高性能になることが期待されます。

Flutterコミュニティの発展

Flutterエンジニアのコミュニティは世界中で成長中です。

DiscordやRedditで開かれた公式コミュニティには数万人規模の参加者がいるほか、GitHubでは日夜さまざまFlutterコードが共有されています。

これらの公式コミュニティでは世界中からFlutterエンジニアが集まっており、自らのコードを共有したり、開発の最新動向を聞いたりできるメリットがあります。

また、日本国内でもさまざまな地域で勉強会が開かれており、Flutterでわからない点があれば積極的に交流・質問しに行くとよいでしょう。

新たな可能性：AR・VR技術/LLMとの組み合わせ

AR・VR技術やLLMとFlutterを組み合わせることで、更に革新的なアプリを生み出すことができます。

AR・VR技術と組み合わせることにより、没入感のある体験を実装可能です。FlutterにAR・VR技術と組み合わせられるアプリが数多くあります。

また、ChatGPTなどのLLMと組み合わせることで、チャットボットやコンテンツの要約などさまざまな機能をつけることができます。LLMに関する機能はこちらを参考にして下さい。

AR・VRやLLMはFlutterに限らず今後とも発展していく分野なので積極的に追っていきましょう。

まとめ：- Flutterの事例を参考に、自分で開発してみよう

ここまでFlutterの主要な事例や開発できるアプリを紹介しました。Flutterの最大の特徴はクロスプラットフォームなどの開発効率の良さ、Firebaseなどと組み合わせることによる機能の高さで、今回紹介した事例はそれらを最大限活かしたアプリケーションです。これらの機能は個人開発でも利用可能です。まずはモバイルゲームやタスク管理アプリなどから作ってみましょう。

エンジニアとして転職を考えるあなたへ

①自分のスキルについて詳しく知る
②自分のスキルについてより知識や知見を深める
②転職活動成功のノウハウを学ぶ

以上のようなポイントを抑えることで、
あなたのスキルをより強度で豊かなものへと成長させると共に、転職活動の成功をおさめることにもつながるでしょう。
このサイトでは今回紹介した内容以外にも、たくさんの情報を記載しております。
下記の記事にも触れておくことは、あなたのスキルアップやキャリアアップの後押しになることでしょう。
javascriptが難しいって本当？真実を解明してスキルアップをしよう
Rubyの難易度は？どこまで習得していれば転職に使えるのか徹底解説
JavaScript経験者って転職に有利？転職活動を成功させる秘訣5つ