はじめに
Lovableは、技術的な知識の有無にかかわらず、誰もがアイデアを形にできるように作られました。しかし、最高のイノベーションがLovable自身のコミュニティから生まれることもあります。そこで登場するのがRezaulさんです。自称「タイピングが面倒な人」である彼は、日々のLovableの利用で感じた現実的な課題を解決するため、自らChrome拡張機能を開発しました。組み込みのプロンプトライブラリから音声入力機能、SEOメタタグ生成、プロジェクト管理、スマートカラーピッカーまで、RezaulさんはLovable.devのワークスペースを強化する充実したツールキットを作り上げました。
要約
- 開発者について：Rezaulさんはバングラデシュからオーストラリアに移住し、ネットワークエンジニアとして働きながら、週末にソフトウェアを開発しています。
- Lovableとの出会い：従来のノーコードビルダーに不満を感じていた彼は、LovableのAI主導のアプローチに隠れた逸品を見出しました。
- なぜ拡張機能を作ったのか：しっかりしたプロジェクト整理、音声入力、SEOツールなど、ユーザーから繰り返し寄せられる要望に触発され、Rezaulさんは解決策を作ることにしました。
- 今後のロードマップ：Capacitorを使い、LovableプロジェクトのGitHubリポジトリから直接Androidアプリを生成する作業を自動化すること。
音楽スタートアップからLovableのパワーユーザーへ
S：Rezaulさん、本日はご参加いただきありがとうございます。まず、ご自身について、そしてこれまでの経歴を教えてください。
R：Rezaulです。2015年にバングラデシュからオーストラリアに移住しました。こちらでITの学士号を取得し、パンデミック直後に卒業して、ネットワークエンジニアとしてフルタイムで働き始めました。本業はネットワーク関連ですが、昔からコーディングや小規模なスタートアップのアイデアを形にすることに惹かれていました。この10年ほどの間に、「Beast Bangla」という音楽プラットフォームから、Flutter FlowやWebflowといったノーコードソリューションの探求まで、さまざまなことに挑戦してきました。
S：興味深い経歴ですね。では、Lovableとはどのように出会ったのですか？
R：正直なところ、少しの運と、粘り強くGoogle検索を続けた結果です。AIを活用したコーディングプラットフォームを探していたところ、LovableのCEOであるAntonがLovableを使って暗号資産のダッシュボードを作るYouTubeチュートリアルを見つけました。特にSupabaseとの連携に目を引かれました。それまで他のノーコードツールには不満を感じていて、プラットフォームに縛られるか、学習コストが非常に高いかのどちらかでした。だからこそ、LovableのAIにはすぐに魅力を感じたんです。Discordに参加し、Twitterのフィードもチェックして、すべてのコードを自分で書かなくてもカスタムアプリを作れるLovableこそが理想的な方法だとすぐに気づきました。
S：Lovableではどのようなプロジェクトを作ってきましたか？
R：かなりたくさんあります！一例は、カテゴリで絞り込みができるレストラン検索アプリです。CRMツールも作りました。こちらは約80%をLovableだけで作り、その後コードをエクスポートして自分で開発を続けました。それ以前には、個人のサイドプロジェクト向けに小さな「マイクロサービス」アプリをいくつか作りました。Lovableの一番の魅力は、動くプロトタイプをすばやく立ち上げられ、しかもソースコードの所有権を自分で持ち続けられることです。
Lovable Chrome拡張機能
S: Lovable向けのChrome拡張機能についてお聞かせください。作ろうと思ったきっかけは何だったのでしょうか？
R: 私自身も含め、ユーザーは繰り返し発生する作業をもっと簡単にこなす方法を求めていることに気づいたんです。たとえば、過去のチャット履歴を検索したり、Lovableから離れずに画面上の色をすぐに取得したりといったことです。ほかにも、音声入力やプロンプトライブラリ、さらには基本的なSEO機能を求める声もありました。Lovableチームは素晴らしいですが、すべての機能を一度に実装することはできません。そこで「こうした隙間を埋めるChrome拡張機能を作ればいいじゃないか」と考えたんです。こうして最初のバージョンが生まれました。シンプルなカラーピッカーと基本的な検索機能だけのものです。その後、ユーザーからのフィードバックが集まるにつれて、機能を追加し続けていきました。
S: 主な機能を紹介していただけますか？
R: もちろんです！拡張機能はかなり成長しました。概要は次のとおりです：
音声入力機能
- リアルタイムの音声文字起こし
- 話している間の視覚的フィードバック
- Lovable内でハンズフリーにプロンプトを作成
プロンプトライブラリ＆プロンプトエンハンサー
- よくある作業向けの既製プロンプト（モバイルレイアウトのはみ出しの修正やメタタグの追加など）
- Groq AIとの連携（DeepSeek Llama 70B、Mixtral 8x7B、Gemma2 9B、LLaMA 3.3 70B）
- 出力を一貫性のある信頼できる形に構造化する「システムプロンプト」方式
プロジェクト管理
- 複数のLovableプロジェクトを整理できるカスタムフォルダ
- ドラッグ＆ドロップでプロジェクトを並べ替え
- 進行中のビルドが50件以上あっても（私のように！）すばやく移動
高度なチャット検索
- 特定のメッセージを効率的に絞り込んで検索
- Lovableをブレインストーミングやプロジェクトの議論に活用しているチームに最適
スマートカラーピッカー
- キャンバスから直接色を取得
- カスタムパレットを保存
- カラーコードをHEX、RGB、HSL形式でコピー（デザイナーに最適）
SEOツール
- メタタグをすばやく生成・検証
- メタタイトル、ディスクリプション、SNSプレビューを簡単に挿入
- コードを手動で編集する手間を省略
こうした機能のおかげで、私も（そしてほかの誰もが）Lovableの中でより長く作業できます。ツール間を行き来する手間を減らすことが、ずっと私の目標でした。
S: 素晴らしいですね。Lovableのプロジェクトを直接Androidアプリに変換する計画についても触れていましたね。詳しく教えてください。
R: はい、それが次の大きな目標です。Lovableが生成したGitHubリポジトリにCapacitorをインストールするCLIを試しているところです。変更をプッシュするたびに、自動的にAndroidアプリがビルドされるという仕組みです。最初のステップはめどが立ちましたが、まだ磨き込みが必要です。最終的には、拡張機能にシンプルな「Androidアプリを作成」ボタンを追加して、Lovableユーザーが複雑な設定に煩わされることなくネイティブアプリを立ち上げられるようにしたいと考えています。
1.1.3などの以前のバージョンでは、主にGroq AIへの対応とプロンプトエンハンサーが導入されました。一方、1.5は音声機能と高度なSEO機能を備えた大きな飛躍となっています。
S: これまでの反響はいかがですか？
R: 正直、驚いています。X（Twitter）で拡張機能について投稿したところ、多くのLovableユーザーがすぐに反応してくれました。あなたをはじめLovableチームの皆さんが拡散してくれたり、フィードバックをくれたりして、デイリーアクティブユーザー数は着実に伸びています。現在ユーザーは200人近くになり、音声入力機能が特に好評です。Lovableコミュニティからのフィードバックは欠かせません。何がうまくいっていて何がそうでないかを聞くのが大好きで、それをもとに調整や改善ができるんです。
最後に
S: 連携機能を作りたいと考えているほかのLovableユーザーに向けて、最後にひと言やアドバイスをお願いします。
R: 自分自身が直面している問題に取り組むことを恐れないでほしいですね。自分が必要としているものは、きっとほかの誰かも必要としています。Lovableの既存ツールを活用し、Discordに参加し、Twitterでフォローして、早めに助けを求めましょう。私にとって拡張機能を作ることは、外部ツールとの間を行き来するのではなく、みんながLovableのエコシステムの中にとどまれるようにするためのものでした。それに、楽しかったです。私にできたのだから、誰にでもできます！
まとめ
RezaulさんのChrome拡張機能は、Lovableのコミュニティが本物のイノベーションを生み出せることを見事に示しています。しっかりしたプロジェクト整理機能がない、もっと速い入力方法がほしい、SEOを統合したいといった日常的な課題を見つけ出し、作業の流れを妨げることなく開発を効率化する使いやすいアドオンを作り上げました。
試してみませんか？ 拡張機能のページにアクセスしてインストールし、どれだけ速く開発できるようになるか確かめてみてください。また、Lovableでどこまでできるのか気になる方は、ワンクリックでLovableアプリをネイティブのAndroidビルドに変換するといった、Rezaulさんの今後のプロジェクトにもぜひご注目ください。
