初心者でもわかるBubble AIビルダーの使い方と活用法

Bubbleの新機能であるAIビルダーの使い方を徹底解説
目次

Bubble AIビルダーとは

Bubble AIビルダーは、ノーコードツールBubbleに新たに搭載されたAIを使った自動フロントエンド作成機能です。

いくつかの選択肢の中から好きなものを選ぶことでわずか数分でフロントエンドが完成します。

今回はそんなAIビルダーの使い方を紹介します。

AIビルダーの主な機能

Bubble AIビルダーの主要機能としては、自動でページを生成することにあります。

具体的な使い方としては、生成したいページの種類と説明文をBubble側に伝えることで自動でフロントエンドが生成できます。

記事の後半ではAIビルダーの使い方をステップに分けて詳しく解説していきます。

なぜBubble AIビルダーが注目されるのか

Bubbleは言わずと知れたノーコードWeb開発の分野での王道ツールです。

そんなBubbleですが、これまでAI機能は搭載されていませんでした。

しかし、今回AIビルダーが搭載されたことでノーコード開発の可能性が広がることは間違いなく大きく注目されました。

ノーコードの理念である「開発の民主化」に向けて着実に前に進んでいると言えるでしょう。

Bubble AIビルダーの使い方

使い方

ここではAIビルダーの使い方について順を追って紹介していきます。

STEP
ページを追加する箇所にあるAdd new page with AIを選択する
STEP
生成するページの種類を選択する

ランディングページ、ダッシュボード、ソーシャルフィード、マーケットプレイス、ユーザープロフィール、プロダクトリスティング、セッティング、サインインページから1つを選択します。

STEP
ページの詳細情報を文章で伝える

AIに対してこんな風にカスタマイズしたいというのを文章で書く必要があります。

STEP
生成ボタン「Generate with AI」を押す
STEP
生成が終わるまで待機する
STEP
生成完了

お好みで色やテキストを変更すると良いでしょう。

動画で学びたい方はこちら

注意:バックエンドは自分で設定する必要がある

AIビルダーでは最低限のワークフローのみ設定された状態でページが生成されます。

そのため他のページに遷移させたい場合やデータの作成などを行う場合、自分で設定する必要があります。

Bubble開発者として思うこと

AIビルダーは、あくまでも開発の補助的な役割を担っていくのではないかという印象です。

初心者の場合はページが完成した状態から構築をする必要があるため、逆に理解するのが難しいのではないかと思います。

そのため現段階では、Bubble開発経験者が使うツールと言えるでしょう。

しかし、現段階ではAIビルダーはβ版ということもあり、今後の精度向上にも十分に期待できると思います。

まとめ

今回はBubbleに新しく搭載されたAIビルダーの使い方について解説しました。

ノーコード×AIという流れは今後も加速していくと予想されるため、日々のキャッチアップが重要になります。

アプリ開発見積もりシミュレーション

執筆者
松永勇樹
ノーコード専門メディア「ノクステック」運営。STUDIO Experts加盟。
Web講座の事業責任者を経て、ノクステックを設立。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次