従来のアプリ開発は、プログラマーがプログラミング言語を駆使して開発をしていく必要がありました。しかし、ノーコードツールであるFlutterflowを使用することで、従来の方法よりも非常に容易にアプリ開発をすることができるようになりました。
同じアプリを作る際にiOS、Androidとwebで、それぞれ別の言語を使用する必要がありますが、Flutterflowではその必要がありません。
今回の記事では、Flutterflowの基本的な内容や特徴について解説していきます。
１. Flutterflowって何？
Flutterflowとは、端的に言うと「モバイルアプリケーション開発のためのノーコードツール」です。FlutterflowはGoogle出身のエンジニアであるAlexとAbelの二人が開発しました。
Flutterflowを使用することで、プログラミングができなくてもアプリ開発にチャレンジするのが魅力の一つです。
Flutterflowは、FlutterというGoogleが開発したオープンソースのUIフレームワークです。
Flutterでは、Dartというプログラミング言語を用いてネイティブアプリケーションを開発します。
このFlutterをもとにFlutterflowというノーコードツールが作成されています。
２. Flutterflowの特徴4選
iOSとAndroidでの同時開発が可能
従来のアプリ開発では、あるアプリを開発するのに、iOSに対応した言語（Objective-C、Swiftなど）とAndroidに対応した言語（Java、Kotlinなど）で、それぞれ開発を行う必要がありました。
一方で、Flutterflowを使用すると、iOSとAndroidの両方のアプリを同時に開発できるようになるため、開発コストを抑えられます。
直感的にアプリケーションのデザインができる
Flutterflowは、決済サービス、認証機能、検索エンジンなどのサービスを簡単に組み込むことが可能です。
直感的な操作でデザインできるため、「バックエンドの仕組みがよくわからなかい」「見た目は作れるけれど、裏側は作れない」といった方でも、様々な機能を簡単に試せます。
画像引用：https://flutterflow.io
ソースコードをダウンロード可能
ソースコードとは、プログラムやソフトウェアの開発において、人間が読み書きできる形式のテキストで書かれたコンピュータプログラムの記述です。
Flutterflowでは、ソースコードをダウンロードできるため、大枠の機能をFlutterflowで素早く作成し、細かいデザインや機能の修正はソースコードをダウンロードして、開発者が変更していくことが可能です。
リアルタイムプレビューが可能
Flutterflowでは、作成したアプリの機能を即座にプレビューすることができます。変更をする度にレビューをして微調整をし、迅速なアプリ開発ができる環境が整っています。
3. Flutterflowと他のノーコードツールの比較
Flutterflowの他にも、ノーコードで開発ができるプラットフォームがいくつかあります。
今回は、同じくアプリ開発のノーコードツールであるBubble、Adaloとの比較を解説していきます。
BubbleとFlutterflowの比較
よく使われているノーコードツールにBubbleがあります。
Flutterflowはモバイルアプリケーション開発に特化しているのに対して、Bubbleはウェブアプリケーション開発に特化しています。
Bubbleも直感的なデザインは可能ですが、Flutterflowよりは制約がかかりますし、ソースコードのダウンロードはできません。
これらの点を踏まえると、ウェブの開発もできるFlutterflowを使うのが良いと言えるでしょう。
AdaloとFlutterflowの比較
AdaloはFlutterflowと同じく、アプリケーション開発とウェブアプリケーション開発ができるノーコードツールです。
AdaloとFlutterflowの仕組みは似ており、両者とも簡単な操作で決済機能や検索エンジン、アプリ内広告の機能を搭載できます。
違う点はAdaloのほうが操作が単純であることです。
Flutterflowに比べAdaloは比較的初心者にもチャレンジしやすく作られています。
一方で、Flutterflowのほうが複雑な機能やデザインにも対応しており、Adaloよりは難易度が少し高くなっていると言えます。
Flutterflowはソースコードをダウンロードし、Flutterを用いて開発者が更に手を加えることが可能ですが、Adaloはソースコードのダウンロードができないため、これらの操作ができません。
4. Flutterflowの利用料と機能について
Flutterflowには無料版と有料版があります。有料版にすると使える機能も多くなるので、Flutterflowでよりサービスが充実したアプリを作りたい場合は参考にしてみてください。
無料プラン
無料プランでは、基本的なコンポーネント、カスタムWidget、画像テンプレートの使用、Webアプリケーション実行、チーム共有などが可能です。
定義されている多数のコンポーネントや画像テンプレートがあるため、無料版でも様々なアプリを試しに作ることができます。
有料プラン（スタンダードver）
スタンダード版は月額30ドルです。無料版の機能に加え、アプリケーション実行、APKダウンロード、ソースコードダウンロードが可能になります。
無料版ではWebアプリケーション上でしか実行ができませんでしたが、有料版になるとモバイルアプリケーションとしての実行が可能です。
更に、ソースコードもダウンロードできるため、より素早い作業で高度なアプリを開発することができるでしょう。
有料プラン（プロver）
プロ版は月額70ドルです。
スタンダード版の機能に加え、AppStoreへのデプロイ、APIのカスタム、Githubとの統合、Firestoreデータの編集ができるようになります。
実際のアプリケーション実行やGUI上の編集ができ、よりアプリ開発の精度が高まることに違いありません。
絶対に世の中に広めたいサービスがある方はプロ版にして、アプリ開発にチャレンジしてください。
5. Flutterflowを使うべき人は？
アプリ開発初心者
Flutterflowは、ノーコードツールでありプログラミングができなくてもアプリ開発をすることが可能です。
プログラミングをやってみても上手くできなかった方や、プログラミングをするのは億劫だけど、何かアプリを作ってみたい方におすすめです。
筆者は、プログラミングをすることにどうしても慣れず、挫折してしまった経験がありますが、Flutterflowを使ったことで、簡単にアプリ制作に取り掛かることができました。
より早く新しいサービスを開発、リリースをしたい人
プログラミング言語でコードを打つよりも早く、機能を追加し実行できる観点から見ると、より早く新しいサービスを開発したい方や、アイディアを試したい方に向いていると言えます。
今、アイディアがあってとりあえず試しに開発をしてみて実行したいという方は、Flutterflowを使ってみましょう。
6. Flutterflowの始め方
Flutterflowの始め方を解説します。Flutterflowは２つのステップで簡単に始めることができます。
ステップ１Flutterflowアカウントに登録
手順としては次のとおりです。
①Flutterflowの公式サイトに行きます。
②画面右上のStart for freeと書かれた青いボタンを押します。
③Googleアカウント、AppleID、Githhubアカウント、MicrosoftIDの中から登録するものを選び「Create Account」を押します。もちろん、任意のメールアドレスでも登録可能です。
以上で登録完了です。
ステップ２Firebaseアカウントに登録
①Firebaseの公式サイトに行きます。
②画面左に「使ってみる」と書かれた白いボタンを押します。
③Firebaseへようこそという画面になるので、「プロジェクトの作成」を押します。
④プロジェクト名を付け、画面下の2つのチェックボックスにチェックを入れ、進みます。
⑤この画面で、Googleアナリティクスを使わない場合は無効にし「プロジェクトの作成」を押します。
⑥「新しいプロジェクトの準備ができました」と表示されたら続行を押してください。
⑦続いて画面左上の歯車アイコンを押し、「プロジェクトの設定」を押します。
⑧「ユーザーと権限」から「メンバーの追加」という青ボタンを押します。
⑨「メールアドレス：firebase@flutterflow.io メンバー：編集者」を入力しメンバーの追加を押します。
以上でFirebaseアカウントが登録完了です。
その後、Flutterflowのサイトへ行き、Create Newを押すとアプリを作り始められます。
７最後に
近年は数多くのノーコードツールが開発され、注目を浴びています。
その中でもFlutterflowには、たくさんのメリットがあることが分かっていただけたと思います。
ノーコードツールで多くの機能を実行できるFlutterflowは、アプリ開発の初心者から既にアプリ開発を経験している人まで幅広く利用することができます。
英語表記が基本であるため、英語が苦手な方には少し使いづらいかもしれません。しかし、
ドラッグアンドドロップの操作が基本ですので、ぜひ一度お試しくださいませ。
FlutterFlow：https://flutterflow.io