日頃よりLULL TECH BEACH（以下、LTB）をご利用いただき、ありがとうございます。
運営スタッフのうってぃーです。

LTBは2024年4月1日に2周年を迎え、最近ではイベントの開催も活発になってきました。
交流会や飲み会、ランチ会、セミナーなど多岐に渡りますが、今回はハンズオンのワークショップ。
近年急速に市場が拡大しているノーコード開発ツール「.bubble」の使い方を
株式会社XYNAPSEの石井さんに教えていただきました。

第一回目の募集であっという間に定員に達し、追加枠も設けられた
「未経験者ためのBubbleハンズオンワークショップ」の様子をお届けします！

【目次】
・ノーコード開発ツールとは？
・「.bubble（ドットバブル）」とは？
・「.bubble」の強み
・ITエンジニア歴20年以上のプロから学ぶノーコード開発
・プログラミング未経験でも簡単！「.bubble」で作るマッチングアプリ
・「.bubble」はこのような人にオススメ
・参加者の反応

■ノーコード開発ツールとは？

ノーコード開発ツールは、従来のプログラミング言語の知識がなくてもアプリやウェブサイトを構築できる開発ツール。
ノーコード開発ツールのおかげで、企業や個人が効率的にソフトウェアを開発できるようになりました。
低コストで迅速な開発、柔軟性、使いやすさから、プログラミング経験のない人だけでなく、プロの開発者からも人気を高めています。

ノーコード開発ツールの世界市場規模は、2023年には約200億ドルに達し、年率20％以上の成長が見込まれるといわれているのだそう。
日本市場も急速に拡大しており、2023年には約数百億円の規模に達し、中小企業から大手企業まで、ノーコードツールを活用してデジタル化を推進する動きが加速しています。

例えば飲食業界では、ノーコードツールを活用して
ある居酒屋チェーンは、オーダーシステムや顧客管理システムをノーコードツールで開発し、店舗運営の効率化と顧客サービスの向上を図っています。
従来のカスタムソフトウェア開発に比べてコストや時間が大幅に削減され、店舗ごとのニーズに合わせたカスタマイズも容易に行えるため、多店舗展開を行う飲食企業にとって有益です。
今までは「開発コストが高いから、マンパワーでどうにかしよう」と後回しになりがちなDX化が
気軽に進められるのは企業にとっても、働く人にとっても、顧客にとっても利点ですね。
このような取り組みにより、注文から料理提供までのスピードが向上し、顧客満足度の向上にも繋がっているそうです。
もしかしたら、皆さんがよく利用する店舗の注文システムはノーコード開発ツールで作られているかもしれません。

■「.bubble（ドットバブル）」とは？

.bubble（ドットバブル）はノーコード開発ツールの1つであり、特にウェブアプリケーションの開発に焦点を当てています。
.bubbleは柔軟性が高く、データベース、ワークフロー、ユーザーインターフェースなど、多岐にわたる機能を備えています。
テンプレートやプラグインも豊富で、少ないリソースでプロトタイプを構築し、アイデアを実現するための手段として、
特にスタートアップ企業や個人の起業家にとって人気があります。

.bubbleの活用事例をまとめた記事もありました。
https://www.c3reve.co.jp/post/nocode-app-development

■「.bubble」の強み

1.ビジュアルなデザイン

.bubbleは直感的なビジュアルエディターを提供しており、ドラッグ＆ドロップで要素を配置し、独自のデザインを作成できます。他のツールと比べて、より柔軟性があり、カスタマイズが容易です。

2.データベース機能

.bubbleは、強力なデータベース機能を提供しています。リレーショナルデータベースを使って複雑なデータ構造を管理し、アプリケーションのパフォーマンスを最適化することができます。

3.ワークフローとロジック

.bubbleは、ワークフローとロジックを簡単に設定できる機能を提供しています。条件分岐やループなどの複雑なロジックを、直感的なインターフェースで設定できます。

4.コミュニティとサポート

.bubbleには、活発なコミュニティとサポート体制があります。ユーザー同士で情報交換や相談が行われ、公式のサポートも充実しています。
日本後のコミュニティはまだまだ小規模ではありますが、そこは石井さんが盛り上げてくださるとのこと。
.bubbleで分からないことがあったらぜひ石井さんに質問してみてください。

5.拡張性とカスタマイズ性

.bubbleは、外部APIやプラグインを活用してアプリケーションの機能を拡張することができます。さらに、カスタムコードの埋め込みも可能であり、ユーザーのニーズに応じた柔軟な開発が行えます。
今回は石井さんにおすすめのプラグインをいくつか教えていただき、早速開発の中で使ってみました。

■ITエンジニア歴20年以上のプロから学ぶノーコード開発

株式会社XYNAPSE
代表取締役　石井さん
ITエンジニア歴20年以上、開発をメインとして上流工程から開発・保守まで様々なポジションに携わってきました。ここ10年ほどは主に業務効率化やDX推進のための業務系アプリケーションのプロジェクトにコンサルタントやエンジニアとして参画しています。
2019年に株式会社XYNAPSEを設立して、DX推進関連のプロジェクトなどに携わると共に、DX内製化の鍵となる社内エンジニアの育成のための研修等も行なっております。
URL：https://xynapse.co.jp/

■プログラミング未経験でも簡単！「.bubble」で作るマッチングアプリ

今回は、チャット機能と決済機能などもついた本格的なマッチングアプリを作っていきました。
今回のワークショップのためにアプリの設計、デザイン、素材まで全て石井さんにご用意いただきました。

全15ページ。初めはユーザー登録画面から。
真っ白なワークスペースに何をしたらいいのかさっぱりだったのですが、本当に文字通りドラッグ&ドロップで文字やボタンや画像が配置できて驚きました。
画像のアップロードや、ドロップダウンでの入力なども楽々。
全4回の開催でマッチングアプリが完成しました。

このマッチングアプリが作れるようになると、LINEのようなチャットツールや、XやInstagramのような投稿サービスなどが作れてしまうそうです。
こんなに気軽に作れると、PDCAも短期的なサイクルで回せそうですし、
「とりあえず作ってみよう！」と思えるのが良いですね。

私も、マッチングアプリを作りながら「こういうサービス作ってみたいな」「こんなこともできるかな？」と妄想が膨らんでいきました。

■「.bubble」はこのような人にオススメ

ノーコード開発ツールが世に出る前までは、プログラミングは専門領域。エンジニアが何百時間、何千時間もかけて勉強し習得するスキルでした。
しかし、ノーコード開発ツールは勉強する時間もお金も大幅に削減でき、直感的に操作できることによって誰もが思い描いたWEBアプリケーションを作れるようになりました。
プログラミングの専門職ではない人こそ活用したいツールです。

例えば、ビジネスオーナーや起業家。ノーコード開発ツールを使えば自分のアイデアを自分で実現し、構想から短期間でビジネスを立ち上げることができます。
ビジネスはスピード感が大事。
誰かに先を越される前に、.bubbleを活用してまずはカタチにしちゃいましょう。

マーケターなら、.bubbleを使ってランディングページやキャンペーンページを作成し、効果的なマーケティング戦略を展開できます。
プログラミングの知識がなくても、素早く魅力的なコンテンツを制作できます。
もう、エンジニアやデザイナーとのラリーは不要かもしれません。

プログラミングのスキルがない人や時間や予算の制約がある場合でも、
ノーコード開発ツールを使って自分のアイデアを形にし、ビジネスやプロジェクトを推進したい人にオススメです。

既にエンジニアとしてお仕事をされている方も、.bubleを上手く活用すれば
プロトタイプを短期間で作り、必要なところだけコーディングをするハイブリッドな開発もできます。

日常で「こんなアプリがあったら便利なのにな～」「この業務、もっと効率化できないかな～」と思ったら
ぜひ.bubbleを使って気軽に開発してみちゃいましょう！

■参加者の反応

「決済の設定が思っていたより簡単にできてびっくりしました！お金のやりとりとか難しそうなのにクリックだけでできちゃうんだという感じ！
自由にデコレーションができるおしゃれな予定管理ツールを作ってみたいと思っているので
今回教えてもらったことを活用しながら作ってみたいと思います！」

「.bubbleは触ったことがあるが、データベースの細かな仕組みは理解していなかったので
少人数で質問しながら開発できたのが良かった。和やかな雰囲気で質問しやすかった。」

「あっという間にWEBアプリができて面白かった。.bubbleのベースが理解できて、自分で作りたい機能を調べるようになった。
4回の講座でなんとなく使い方が分かったので、今後は自力で開発できそう。」

「丁寧に教えていただき、プログラミングをしたことがない私でも何とかそれっぽいものが作れました。ありがとうございました。参加してみて良かったです。また参加させていただきたいです。」

今回のワークショップがきっかけでアプリ開発、サービス開発がぐーんと身近になったのではないでしょうか？
今まで眠ってしまっていたアイディアが、たくさん世に出ていくと思うとワクワクしますね！
今後は企業向けのワークショップも企画中とのこと。
また次回の開催をお楽しみに！

■今回の開催概要

https://connpass.com/event/312681

開催日時：
本ワークショップは以下の全４回（合計：20h）で開催
・第１回：4/6（土）13:00〜18:00
・第２回：4/13（土）13:00〜18:00
・第３回：4/20（土）13:00〜18:00
・第４回：4/27（土）13:00〜18:00

【学習内容】
・Webアプリの基本構造
・Bubbleの概要と基本操作
・画面のデザイン
・ワークフロー（ロジック作成）
・データベース設計とデータ操作
・ユーザー認証とセキュリティ
・Stripeを用いたユーザ課金