Lovableの使い方｜日本語プロンプトと料金プラン解説

Lovableって日本語だけで使えるの？
Lovableの料金プランと使い方を知りたい！

Lovableは、チャットで指示するだけでReactとSupabaseを組み合わせたWebアプリが完成する、AI開発プラットフォームです。

日本語で指示できるのか、料金プランごとに何が変わるのか、実際の画面を見ないと判断しづらい部分も多いです。

この記事では、Lovableの特徴や料金体系、日本語対応の実態、実際にアプリを作る手順まで解説します。

結論から言うと、Lovableは日本語の指示でも十分にアプリ作りを進められるツールです。

ただし管理画面は英語表記のままで、複雑な指示は英語の方が精度が上がる場面もあります。

Lovableとは？特徴とできることを解説

まずはLovableがどんなツールなのか、全体像から見ていきましょう。

ここでは、以下の内容について詳しく解説します。

Lovableの基本概要｜バイブコーディングを代表するAI開発ツール

Lovableは、2023年11月にスウェーデン・ストックホルムで創業されたAI開発プラットフォームです。

前身は、創業者のAnton Osika氏が個人開発で公開した「GPT Engineer」というオープンソースツールでした。

公開直後からGitHub上で爆発的に星（スター）を集め、2024年12月に社名・サービス名を現在の「Lovable」に統一しています。

こうした成り立ちもあり、Lovableはチャットで要件を伝えるだけでコードが自動生成される、いわゆるVibe Coding（バイブコーディング）を代表するツールの一つに数えられています。

Vibe CodingそのものについてはVibe Coding入門｜やり方とプロンプト11選で詳しく解説しているので、あわせて読んでみてください。

生成される仕組みはシンプルで、フロントエンドにReact、バックエンドにSupabaseを使った構成のWebアプリを、チャット欄への指示だけで組み立てていきます。

作ったコードの権利は基本的に利用者自身のものになるため、商用利用を前提にしたプロジェクトでも扱いやすいのが特徴です。

Lovableの主要機能一覧

Lovableには、アプリ作りをスムーズに進めるための機能がいくつも用意されています。

代表的なのが、指示を送るとすぐに動作確認できる「リアルタイムプレビュー」機能です。

修正を加えるたびに画面がその場で更新されるため、完成イメージを都度確認しながら作業を進められます。

さらに「Agent Mode」と呼ばれる機能を使うと、AIが複数の作業をまとめて自律的に進めてくれるため、細かい指示を都度出さなくても実装が前に進みます。

バックエンド機能は「Lovable Cloud」という仕組みでまとめて自動構築され、データベースや認証機能をゼロから設定する手間がかかりません。

外部サービスとの連携幅も広く、SupabaseやStripeといった決済・認証系のサービスとも接続できます。

Bolt.new・Replit Agent・v0との違い

AI開発ツールにはいくつか種類があり、Lovableの立ち位置を知っておくと使い分けがしやすくなります。

Bolt.newは、ブラウザの中で開発環境をまるごと再現する技術を強みにしたツールで、環境構築なしでその場で動くアプリを作れます。

Replitの「Replit Agent」は、Replitのクラウド上の実行環境そのものを提供するタイプのツールで、Webアプリに限らず幅広い言語・用途のプロジェクトに対応できます。

v0は、Vercelが手がけるツールで、UIコンポーネントのデザイン生成に強みがあります。

一方でLovableは、フロントエンドからバックエンド、データベースまでを一気通貫でまとめ、実用に耐えるレベルのWebアプリを仕上げることに寄せて作られています。

どれか1つが優れているというより、作りたいものの性質に合わせて使い分けるのが現実的です。

Lovableは日本語で使える？日本語対応の実際

Lovableを検討するとき、多くの方が気になるのが日本語でどこまで使えるかという点だと思います。

ここでは、以下の内容について詳しく解説します。

管理画面は英語、プロンプトは日本語でOK

Lovableの管理画面（ダッシュボードやメニュー）は、現時点ではすべて英語表記です。

「Settings」「Billing」「Workspace」といったメニュー名も英語のままなので、初めて開いたときは戸惑うかもしれません。

ブラウザの翻訳機能を使えば表示自体は日本語にできますが、ボタンの配置や項目名の対応関係が崩れることもあるため、英語のまま慣れてしまう方が結果的に早いです。

一方で、実際にアプリを組み立てるためのチャット欄への指示は、日本語で入力しても問題なく解釈されます。

「タスク管理アプリを作って」のように日本語で送っても、AIはそのまま意図をくみ取ってコードを生成してくれます。

ただし、認証やデータベース設計のような複雑な要件を伝えるときは、英語で指示した方が意図通りの結果になりやすい場面もあります。

日本語プロンプトの実例とコツ

実際に日本語でどんな指示を送ればいいのか、具体例を見てみましょう。

在庫管理アプリを作って。商品名・在庫数・価格を登録できて、在庫数が5個以下になったら一覧で赤く表示してほしい。

このように、画面に表示したい要素と条件を具体的に書くことが、狙い通りの結果を引き出すコツです。

「使いやすいアプリにして」のような抽象的な指示だけでは、AIも解釈に迷い、想定と違う仕上がりになりがちです。

また、修正を依頼するときは一度に複数の要望を詰め込まず、1つずつ順番に伝えると精度が安定します。

あいまいな指示で見当違いの修正が返ってくると、その分やり取りが増え、後で紹介するクレジットも余分に消費してしまいます。

最初の一往復で狙い通りの結果に近づけるほど、時間もクレジットも節約できると考えておくとよいです。

Lovableの料金プラン｜無料でどこまで使えるか

プラン選びで迷わないために、まずは料金体系を整理しておきましょう。

ここでは、以下の内容について詳しく解説します。

Free/Pro/Business/Enterpriseの違い

Lovableには、無料の「Free」から法人向けの「Enterprise」まで、4段階のプランが用意されています。

Freeプランでは、1日5クレジット・月間最大30クレジットまでの範囲でアプリの作成や修正を試せます。
クレジットカードの登録なしで始められるので、まずは操作感を確かめる用途に向いています。

本格的に使うなら、月額25ドル（年払いなら1か月あたり21ドル換算）の「Pro」プランが基本の選択肢になります。
Proプランでは月100クレジットに加え日次5クレジットのボーナスが付与され、非公開プロジェクトも作成できます。

チームで使う場合は、月額50ドル（年払いなら1か月あたり42ドル換算）の「Business」プランが候補になります。
SSO（シングルサインオン）やAIの学習へのデータ利用をオプトアウトできる設定など、組織利用向けの機能が加わります。

大規模な組織向けには、料金個別見積もりの「Enterprise」プランも用意されています。

クレジット消費の仕組みと節約のコツ

Lovableでは、AIとのやり取り1回ごとに「クレジット」という単位が消費される仕組みになっています。

消費量は作業の複雑さによって変わり、ボタンの色を変えるような軽微な修正では約0.5クレジット、ログイン機能の追加のような作業では約1.2クレジット、ランディングページ全体を組み立てる作業では約2クレジットが目安です。

同じ内容の指示でも、要件が具体的であるほど無駄なやり取りが減り、結果的にクレジットの節約につながります。

逆に、抽象的な指示を出して期待と違う結果を何度も直させると、その分クレジットを余分に消費してしまいます。

ダッシュボードの画面から現在の残りクレジットをいつでも確認できるので、月の途中でこまめにチェックしておくと使いすぎを防げます。

Lovableの使い方を6つの手順で解説

ここからは、実際にLovableを動かしてアプリを作る流れを順番に見ていきましょう。

ここでは、以下の内容について詳しく解説します。

【手順1】公式サイトでアカウント登録する

Lovable公式サイトにアクセスし、画面右上の登録ボタンからアカウントを作成します。

Google、GitHub、メールアドレスのいずれかを使えば、1分ほどで登録が完了します。

登録が終わると、チャット欄が中央に大きく表示されたトップ画面に切り替わります。

この画面がLovableでの作業のすべての起点になるので、まずは触って操作感をつかんでみてください。

初回ログイン時には簡単なチュートリアルが表示され、テンプレートを選ぶかゼロから作り始めるかを選択できます。

迷ったら、まずはシンプルなテンプレートを選んで画面構成の雰囲気をつかんでから、自分のアイデアに切り替えるとスムーズです。

登録直後は英語の案内表示が多く出てきますが、操作自体はボタンをクリックしていくだけなので身構える必要はありません。

【手順2】プロンプトでアプリのアイデアを入力する

チャット欄に、作りたいアプリの内容を日本語でそのまま打ち込みます。

「顧客リストを登録・検索できる名刺管理アプリを作って」のように、やりたいことを一文で明確に伝えるのがコツです。

送信するとAIが数十秒でコードを書き始め、画面右側にファイルが次々と生成されていく様子が確認できます。

完成と同時に、実際に操作できるプレビュー画面が表示されます。

【手順3】生成結果を確認し、チャットで修正指示を出す

生成が終わったら、プレビュー画面を実際に触って動作を確認します。

気になる点があれば、同じチャット欄に「検索ボックスを上部に移動して」のように追加で指示を出すだけで修正されます。

修正のたびに直前の状態へ戻せる履歴（チェックポイント）も残るため、指示が思った方向と違っても気軽にやり直せます。

この会話のキャッチボールで少しずつ完成度を上げていく感覚が、Lovableならではの使い心地です。

一度で完璧を目指すよりも、小さな修正を何度も重ねる方が、結果的に完成までの時間が短くなります。

特にレイアウトの調整は言葉で伝えにくい部分もあるため、思ったとおりの見た目になるまで気軽に指示を出し直してみてください。

【手順4】Supabaseと連携してデータベース・認証を追加する

アプリにログイン機能やデータ保存機能を持たせたい場合は、Supabaseとの連携を行います。

チャット画面から「Supabaseと連携してユーザー登録機能を追加して」と伝えるだけで、必要な設定画面へのリンクが提示されます。

連携時にはデータを保存するリージョン（Americas・Europeなど）を選ぶ画面が出てくるので、利用者の多い地域に近いものを選んでおくと表示速度で有利になります。

外部アカウントの作成さえ済ませておけば、複雑な設定をゼロから自分で書く必要はありません。

より細かくテーブル設計を調整したい場合は、Supabase側の管理画面に直接入って確認することもできます。

【手順5】ロジックやデザインを細部まで微調整する

基本機能が動くようになったら、画面ごとに細部を調整していきます。

配色やレイアウトのようなデザイン面の調整と、計算処理や条件分岐のようなロジック面の調整は、分けて指示を出す方が混乱しにくいです。

1つずつ確認しながら進める方が、遠回りに見えて結果的に早く仕上がります。

細かい見た目の調整だけをしたい場合は、コードを直接編集できる「Dev Mode」を使うと、チャットを介さずに済むぶん反映も速くなります。

スマートフォンでの見え方も忘れずに確認しておくと、公開してから慌てて直す手間を減らせます。
パソコンでは綺麗に見えても、スマホだと文字が詰まって読みにくいケースは意外とよくあります。

【手順6】Publishボタンで公開・デプロイする

アプリが完成したら、画面上部の公開ボタンから世界に公開できます。

特別な設定をしなくても、Lovableが用意する無料のサブドメインがその場で発行されます。

独自ドメインを使いたい場合は、Pro以上のプランで接続設定を行うことで対応できます。
この場合、自分が契約しているドメイン管理サービス側でDNS設定を変更する作業も必要になります。

公開前に誰かへ確認してもらいたいときは、正式公開せずプレビュー用のURLだけを共有することもできます。

公開後のアプリをどう育てていくかについては、AIで作ったアプリの公開方法｜5つの方法を詳しく解説！で他の公開手段と合わせて解説しているので、参考にしてください。

Lovableを使いこなすコツと注意点

基本の使い方に慣れてきたら、もう一段階うまく使うためのポイントを押さえておきましょう。

ここでは、以下の内容について詳しく解説します。

つまずきやすいポイントと対策

Lovableがうまく動かないと感じるとき、原因の多くは指示の出し方にあります。

「いい感じのアプリにして」のような曖昧な指示では、AIも解釈に迷い、思った通りの結果になりません。

また、無料プランのクレジットを使い切ってから慌てて有料化を検討すると、作業が止まってしまうタイミングが読みにくくなります。

もう一つ気をつけたいのが、APIキーやパスワードといった機密情報をチャット欄にそのまま貼り付けないことです。

入力した内容はAIの処理に使われるため、決済情報や個人情報は直接プロンプトに書き込まず、外部サービスとの連携は公式の連携機能を使って設定するのが基本です。

小さな指示を積み重ねていく方が、結果的に早く完成に近づきます。

個人開発SaaSとして育てる視点

Lovableで作ったアプリは、試作品で終わらせず個人開発のSaaSとして育てていくこともできます。

Stripeと連携すれば決済機能を組み込めるため、無料版と有料版を分けた課金モデルも実現できます。

アイデア出しの段階から収益化までの流れを整理しておくと、Lovableで形にしたあとの動き方に迷いにくくなります。

公開して終わりにせず、実際に触った人の反応や要望を集める仕組みを最初から組み込んでおくと、次にどの機能を作り込むべきかの判断がしやすくなります。

小さく公開してから育てていく感覚は、大きな仕様を最初に固めてしまうよりも、個人開発とは相性がよいです。

Lovableの使い方・日本語対応に関するよくある質問

Q：Lovableは無料でどこまで使えますか？

A：無料のFreeプランでは1日5クレジット、月間最大30クレジットの範囲でアプリの作成や修正を試せます。
ただし複雑な機能を作り込むには心もとない量なので、本格的に使うならProプラン以降を検討する方が現実的です。

Q：Lovableは日本語だけで使えますか？

A：チャット欄への指示は日本語で問題なく通じますが、管理画面のメニューや設定項目は英語表記のままです。
複雑な要件を伝えるときは、英語で書いた方が意図通りに仕上がる場面もあります。

Q：プログラミング未経験でも使えますか？

A：日本語や英語の指示だけでコードが生成されるため、未経験の方でも基本的なアプリ作成までは進められます。
ただし生成されたコードの中身を理解しておくと、修正の幅も広がり、トラブル対応もしやすくなります。

Q：Lovableで作ったアプリは商用利用できますか？

A：生成したコードの権利は基本的にユーザー自身のものになるため、商用利用も可能です。
チームで使う場合や非公開プロジェクトを増やしたい場合は、Pro以上の有料プランを選んでおくと安心です。

まとめ

Lovableは、チャットで指示するだけでフロントエンドからバックエンドまで一気に仕上がる、実用的なAI開発ツールです。

日本語の指示でも十分に使いこなせますが、管理画面が英語表記である点や、複雑な要件は英語の方が伝わりやすい場面がある点は覚えておいてください。

料金プランごとの違いと6つの手順を押さえておけば、最初の1本を形にするまでの距離はぐっと縮まります。

完璧な指示を最初から出そうとせず、まずは思いついたアイデアをそのまま打ち込んでみてはいかがでしょうか。

個人開発によるAI搭載SaaSの始め方は、個人開発によるAI搭載SaaSの始め方｜アイデアから法人化まで総まとめで全体の流れを整理していますので、あわせて確認してみてください。