コードなしで、AIを使って一日の午後にちゃんと動く顧客向けツールを作る方法

A person working on a laptop in a bright modern coworking space with plants

6 min read

あなたには、何か月ものあいだ静かに何時間も奪ってきた小さな問題があります。たとえば、乱雑な内容をメールで送ってきて、それをあなたが打ち直している予約フォームかもしれません。たとえば、三つの別々のアプリを行き来して回している顧客の受付かもしれません。それを直すために、きちんとしたツールを作ろうと考え、開発者に見積もりを取り、数千ドルという金額に、そっとタブを閉じたのではないでしょうか。このガイドは、あなたが知らなかった三つ目の選択肢についての話です。ツールを平易な言葉で説明し、AIに一日の午後で作らせるという選択肢です。

あなたが実際に作るもの

使うのは Lovable です。これは、書かれた説明を、動く Web アプリに変えてくれる AI アプリビルダーです。ほしいものを入力すると、画面、その裏側のロジック、そしてデータを保存する場所を生成し、そのすべてを、共有できるリンクとしてオンラインに公開してくれます。コードには一切触れません。コードを書かずに Web サイトに AI チャットボットを設置する方法 についての手順を読んだことがあるなら、これはそれと同じ精神で、もう一歩踏み込んだものです。ウィジェットを追加するのではなく、その小さなオーダーメイドのツールそのものを作るのです。

この例では、シンプルな顧客受付アプリを作ります。顧客が記入するフォーム、検索できるすべての送信の整った一覧、そして新しい送信が届いたときにあなたへ送られるメールです。進めながら、あなた自身のアイデアに置き換えてください。受付フォームでも、シンプルな予約ページでも、社内用のトラッカーでも、手順は同じです。

必要になるもの

無料の Lovable アカウント、ほしいツールのおおよその見当、そしておよそ 2 時間。それだけです。ホスティングも、別のデータベースも、開発者も要りません。メモ帳を開いておいてください。というのも、何よりも大切な入力は、ほしいものをはっきり説明することであり、ツールに打ち込み始める前に、それを書き出しておくと役立つからです。

ステップ 1:一段落の説明を書く

何かを開く前に、気の利くアシスタントに説明するつもりで、そのツールを説明する短い一段落を書きましょう。この例なら、「顧客受付アプリを作って。顧客は、名前、メールアドレス、案件の種類、予算の範囲、説明を入力するフォームに記入する。送信はすべて、私が見て検索できる一覧に保存して。新しいものから先に表示して。」ここで具体的にしておくことが、あとで最も時間を節約してくれます。あいまいな依頼からは、あいまいなアプリしか生まれません。

ステップ 2:説明を貼り付けて、作らせる

Lovable を開き、新しいプロジェクトを始め、あなたの一段落を最初のメッセージとして貼り付けます。1、2 分のうちに、最初の版が生成されます。フォーム、保存された一覧、そして基本的なレイアウトです。これが魔法のように感じられる瞬間で、今朝までは作れなかった、動くアプリが手元にあるのだと立ち止まって気づく価値があります。完璧ではありません。それは想定どおりで、それを直すのが次のステップです。

ステップ 3:コードではなく、話しかけて直す

作られたものを見て、直したいところを平易な言葉で伝えます。「予算の欄を、三つの範囲があるドロップダウンにして。」「それぞれの送信が届いた日付を追加して。」「私のロゴを一番上に置いて。」メッセージ 1 通ごとに、プランに含まれるクレジットがわずかに消費され、単純な編集は最も安く済むので、五つの要望を 1 通に詰め込むのではなく、一度に一つのはっきりした変更を行いましょう。新人の手伝いに指示を出すつもりで接してください。短く、具体的な指示が、きれいな結果を生みます。

ステップ 4:データが置かれる場所をつなぐ

Lovable は、Supabase というサービスを使って、あなたの送信を内蔵のデータベースに保存します。これについては、ここまで理解すれば十分です。それは、あなたのフォームが記入内容を放り込む書類棚です。検索できる送信の一覧を求めると、それらはそこに保管されます。あとでそのデータを書き出したり、別の場所につないだりできますが、最初の一作としては、そのままにしておくので申し分なく機能します。

ステップ 5:公開して、顧客になったつもりで試す

公開を押すと、Lovable が実際に使えるリンクをくれます。ここで、ほとんどの人が飛ばす、たった一つのことをしましょう。あなたの顧客が使うように、それを使うのです。架空の送信でフォームを記入し、送信し、それがあなたの一覧に届き、受信箱に入ることを確かめます。スマホでも試しましょう。項目を空のままにするなど、少し変わったことを入力して、何が起きるか見てください。今の 10 分のテストが、あとで恥ずかしい壊れたリンクを避けてくれます。

避けておきたいよくある落とし穴

一度に欲張りすぎる。 まず中心を作り、それから足していきましょう。動くフォームは、半分しか動かない壮大な計画に勝ります。

誰が記入するかを忘れる。 各項目が何を意味するかは、あなたには分かっています。顧客には分かりません。あなたの言葉ではなく、顧客の言葉でラベルを付けましょう。

テスト送信を飛ばす。 自分で先に使っていないリンクは、決して共有しないでください。

細かな調整でクレジットを燃やす。 1 ピクセルずつ動かすのではなく、見た目の好みを一つのはっきりした指示にまとめましょう。

これにかかる費用

Lovable の無料プランで作って試すことができ、毎日いくつかの制作クレジットがもらえます。それで、このガイドの受付アプリを作り、このやり方があなたの働き方に合うかどうかを見るには十分です。夢中になってもっと作りたくなったら、Pro プランはひと月およそ 25 ドル、Business プランはおよそ 50 ドルで、いずれも毎月のクレジット枠が付きます。オーダーメイドの開発にかかる数千ドルと比べれば、勝負になりません。無料で始め、本当に使うツールが手に入ってから、そのときだけ支払いましょう。それより前ではありません。

成功とはどんな姿か

その午後の終わりには、メールの署名やサイトに載せられるリンクが手に入り、何か月も我慢してきた面倒な手作業のひと手間は、なくなっています。より深い収穫は、何ができそうかという感覚の変化です。この方法で小さなツールを一つ作ってしまえば、次の問題は、耐えるものには見えなくなり、直せるものに見えてきます。これが気に入ったなら、次の自然な一歩は、ツールを自動でつなげていくことです。それはまさに、私たちの個人事業主がこの週末に組める 9 個の AI 自動化のまとめが案内している内容です。

関連する読みもの

あなたが最初に作るとしたら、どんな小さなツールですか。コメントでそれを説明してください。説明文をどう書けばよいか、提案します。

コメントする

上部へスクロール