📋 目次
【無料パート】
Readdyって何? → AIサイトビルダーの革命児 こんな人におすすめ Readdyの主要機能をざっくり解説
無料プランでできること
アカウント登録から基本的な使い方
実際にサイトを作ってみる → 超簡単な3ステップ
【有料パート】
Readdyで月5万円稼ぐまでのロードマップ
案件受注テクニック → 初心者でも取れる案件の見つけ方
プロが使ってる実践的ワークフロー
料金プランの詳細と選び方 → 損しないプラン選択術 爆速制作のための時短テクニック
よくある失敗例と対策 絶対に押さえておくべき注意点
それでは無料パートを書いていきます!
Readdyって何? → AIサイトビルダーの革命児
Readdyは、2024年にローンチされた最新のAIウェブサイトビルダーなんですが、これがマジで革命的なんです。
何が革命的かって?
文章で指示するだけで、プロ級のサイトが完成するんですよ。
例えば、こんな感じ。
「カフェのウェブサイトを作って。温かみのある雰囲気で、予約機能も付けて」
これだけ入力したら、30秒後には完成したサイトが出てきます。
デザイン、レイアウト、文章、画像、全部AIが自動生成してくれる。しかも、出来上がったサイトのクオリティが半端ないんです。「これ、本当にAIが作ったの?」って疑うレベルですよ。
従来のサイト制作との違い
WordPressとかWixとか、今までのツールって結局「自分で組み立てる」必要がありましたよね。
テンプレート選んで、画像差し替えて、文章入れて、レイアウト調整して...
でも、Readdyは違います。
最初から完成形が出てくる。あとは細かい修正だけ。
これ、制作時間が10分の1になるってことなんです。マジで。
どんなサイトが作れるの?
実際に作れるサイトの種類はこんな感じです。
コーポレートサイト → 会社の公式HP ランディングページ → 商品やサービスの紹介ページ ポートフォリオサイト → 自分の作品を見せるサイト 飲食店サイト → カフェ、レストランの公式HP ECサイト → 商品販売ページ(基本的なもの) イベントページ → セミナーやイベントの告知サイト
基本的に、複雑なシステムが必要ない普通のサイトなら、ほぼ全部作れちゃいます。
こんな人におすすめ
Readdyが向いてる人、向いてない人を正直に書きますね。
✅ Readdyが向いてる人
副業でサイト制作を始めたい人
これが一番ですね。
クラウドワークスやココナラで「LP制作5万円」みたいな案件、見たことありますよね?あれ、Readdyなら1時間で作れちゃうんです。
コーディングの知識がなくても、プロ並みのサイトが納品できる。これ、めちゃくちゃ大きいです。
フリーランスのデザイナー・ライター
デザインはできるけどコーディングは苦手、って人にも最適なんですよ。
Readdyで形を作って、細かいデザインだけ調整すればOK。逆に、ライターさんもサイト制作サービスを追加メニューにできます。文章書けて、サイトも作れるって、めちゃくちゃ強いですよ。
起業したばかりの人
自分のビジネスサイトを作りたいけど、制作会社に30万円も払えない...
そんな時、Readdyなら月額2,000円程度で本格的なサイトが作れちゃいます。これは本当にありがたい。
Web制作会社で働いてる人
実は、プロの現場でも使えるんですよ。
クライアントへの提案用モックアップを爆速で作れるし、コードも書き出せるので、そのまま開発に回せます。「これ、いいね」ってなったら、本格的に作り込めばいい。提案段階でのスピードが全然違います。
❌ Readdyが向いてない人
正直に言いますね。
複雑なECサイトを作りたい人
在庫管理、決済システム、会員機能とか、そういう複雑な機能が必要なら、Shopifyとかの専用ツールの方がいいです。
Readdyは「見せるサイト」は得意なんですが、「システム」は苦手なんですよね。
完全オリジナルデザインにこだわる人
AIが生成するデザインは洗練されてるんですが、やっぱり「AIっぽさ」は若干残ります。
1ピクセル単位でこだわりたい、みたいな人には物足りないかもしれません。
本格的なブログを運営したい人
記事を100本、200本と積み上げていくなら、やっぱりWordPressの方が向いてます。
Readdyにもブログ機能はあるんですが、あくまで「サイトの一部としてのブログ」って感じですね。メインでブログやるなら、WordPress一択です。
結局、どんな人が一番稼げる?
私の経験上、こんな人が一番結果出してます。
「コーディングはできないけど、デザインセンスはある程度ある人」
Readdyが土台を作ってくれるので、あとは自分のセンスで微調整するだけ。これができれば、案件単価5万円〜10万円は普通に取れますよ。マジで。
Readdyの主要機能をざっくり解説
ここでは、Readdyの主要機能を分かりやすく説明していきます。
🤖 AI自動生成機能
これがReaddyの心臓部です。
チャット形式で指示を出すと、AIがサイト全体を作ってくれます。しかも、音声入力にも対応してるんですよ。「カフェのサイト作って」って喋るだけでもOK。
生成される内容はこんな感じ。
レイアウト・デザイン → 色、フォント、配置まで全部
文章 → ページごとの見出しや本文
画像 → AIが生成した画像、または適切なストック写真
ページ構成 → トップページ、会社概要、お問い合わせなど
最初の生成は大体30秒〜1分くらい。早すぎてビックリしますよ。
✏️ リアルタイム編集機能
生成されたサイトは、そのまま編集できます。
編集方法は2パターンあります。
パターン1 → AIに指示して修正
「このボタンをもっと大きくして」 「背景色を青っぽくして」 「この画像を明るくして」
こんな感じで、チャットで指示するだけで修正されます。細かい座標とか数値とか、全部AIが判断してくれるんです。
パターン2 → 直接クリックして編集
普通のWebエディタみたいに、要素をクリックして直接編集もできます。文章の変更、画像の差し替え、色の変更とか。これは直感的で分かりやすいですね。
📱 レスポンシブ対応
作ったサイトは、自動的にスマホ対応になります。
PC版、タブレット版、スマホ版、全部自動調整してくれる。これ、地味にめちゃくちゃありがたいんですよ。普通にコーディングしたら、レスポンシブ対応だけで半日かかりますからね。
🎨 テンプレートライブラリ
「ゼロから作るのは不安...」って人向けに、テンプレートも用意されてます。
カフェ、美容室、コンサルティング、ECサイトなど、業種別に分かれてて便利なんです。テンプレートを選んで、中身だけ自分の情報に変えればOK。これだけでも十分なクオリティになります。
💻 コードエクスポート機能
これ、かなり重要な機能です。
作ったサイトのコードを、HTML、CSS、Reactなどの形式でダウンロードできるんです。つまり、Readdyで作ったサイトを、自分のサーバーに持っていけるってこと。
プラットフォームに縛られないんですよ。クライアント案件でも安心して使えます。
🎨 Figma連携
デザイナーさんには嬉しい機能。
Readdyで作ったデザインを、Figmaにエクスポートできます。Readdyで大枠を作って、Figmaで細かい調整、みたいな使い方ができる。これは有料プランの機能なんですが、かなり便利ですよ。
🔗 独自ドメイン接続
無料プランだと「yoursite.readdy.ai」みたいなURLになるんですが、有料プランにすると自分のドメインが使えます。
「yoursite.com」みたいなやつですね。クライアント案件では必須の機能です。
🤖 Readdy Agent(AIアシスタント機能)
これは最近追加された機能。
サイトに訪問した人と自動で会話してくれるAIチャットボットです。24時間365日対応で、問い合わせ対応や予約受付まで自動化できる。これ、使いこなせばかなり強力ですよ。
📊 SEO最適化機能
作ったサイトは、最初からSEO対策されてます。
メタタグの自動設定
画像のalt属性
ページ速度の最適化
モバイルフレンドリー
この辺は全部自動でやってくれる。もちろん、後から細かく調整もできます。
無料プランでできること
さて、気になる料金の話です。
Readdyには無料プランがあるんですが、実際どこまでできるのか。これ、結構大事なので詳しく説明しますね。
無料プランの制限
クレジット数 → 月250クレジット
プロジェクト数 → 2個まで
ドメイン → readdy.aiのサブドメインのみ
Readdyのロゴ → 表示される
クレジットって何?
これが重要なんですよ。
Readdyでは、サイトの生成や編集に「クレジット」を消費します。
新規ページ生成 → 25クレジット
編集・修正 → 25クレジット
つまり、無料プランだと月に10回くらいしか操作できないってこと。お試しで使うには十分だけど、本格的に使うなら有料プラン必須ですね。
無料プランでもできること
それでも、無料プランでこれだけはできます。
サイトの作成と公開
AIによる自動生成
基本的な編集機能
テンプレートの利用
レスポンシブ対応
コードのエクスポート
コードをエクスポートできるのは大きいです。無料プランで形を作って、コードだけ持ち出せば、あとは自分のサーバーで運用できますからね。
実際の使い方
無料プランは、こんな使い方がおすすめ。
パターン1 → お試し利用
まずは無料で触ってみて、使い勝手を確認する。自分に合ってると思ったら、有料プランに移行。これが一番安全ですね。
パターン2 → ポートフォリオサイト
自分の作品を見せるサイトなら、無料プランでも十分。クライアントに見せるためのサンプルサイトとして使えます。
パターン3 → プロトタイプ作成
クライアントへの提案用に、サッと形を作る。OKもらったら、有料プランで本格制作に移行する感じ。
月250クレジットって聞くと少なく感じるけど、使い方次第では十分実用的なんです。
アカウント登録から基本的な使い方
それでは、実際にReaddyを使い始める手順を説明していきます。
超簡単なので、5分もあれば終わりますよ。
ステップ1 → アカウント登録
まず、Readdyの公式サイトにアクセスします。
URL → readdy.ai
トップページに「Get Started」とか「Start Building」みたいなボタンがあるので、それをクリック。
登録方法は3パターンから選べます。
Googleアカウントで登録
メールアドレスで登録
GitHubアカウントで登録
Googleアカウントが一番楽ですね。ワンクリックで終わります。
メールアドレスで登録する場合は、確認メールが届くので、リンクをクリックして認証すればOK。
ステップ2 → ダッシュボードの確認
登録が完了すると、ダッシュボード画面に入ります。
ここで見るべきポイントは2つ。
残りクレジット数
画面の右上あたりに表示されてます。無料プランだと「250 credits remaining」って感じで出てる。
これ、結構大事なので常にチェックしておいてください。気づいたらゼロになってた、とかあるので。
プロジェクト一覧
作成したサイトが一覧で表示されます。最初は当然空っぽです。
ステップ3 → 新規プロジェクトの作成
さあ、ここからが本番です。
「Create New Project」とか「New Website」みたいなボタンをクリック。すると、2つの選択肢が出てきます。
選択肢1 → AIに全部お任せ(推奨)
「Describe your website」みたいな入力欄が出てきます。ここに作りたいサイトの内容を書くだけ。
日本語でもOKです。
例えば、こんな感じ。
「東京にあるイタリアンレストランのウェブサイトを作りたい。温かみのある雰囲気で、予約フォームとメニューページも欲しい。色は赤とベージュを基調にして」
これくらい詳しく書けば、かなり理想に近いものが出てきます。
選択肢2 → テンプレートから選ぶ
「Browse Templates」を選ぶと、業種別のテンプレートが出てきます。カフェ、美容室、コンサル、EC、ポートフォリオなど。
気に入ったものを選んで、中身を入れ替えるだけでもOK。初心者はこっちの方が安心かもしれないですね。
ステップ4 → 生成を待つ
プロンプトを入力したら、「Generate」ボタンをクリック。
あとはAIが勝手に作ってくれます。待ち時間は大体30秒〜1分。
画面に「Generating your website...」って出て、プログレスバーが進んでいきます。この間、コーヒーでも飲んで待っててください。本当に早いですから。
ステップ5 → 完成したサイトを確認
生成が終わると、完成したサイトがドーンと表示されます。
ここで最初に確認すべきポイント。
全体のデザイン
色合い、フォント、レイアウトが自分のイメージに合ってるか。大体の場合、かなりいい感じに仕上がってます。私も最初見た時、「え、これ本当にAIが作ったの?」ってビックリしましたよ。
ページ構成
トップページ、会社概要、サービス紹介、お問い合わせなど、必要なページが揃ってるか確認。足りないページがあれば、後から追加できます。
文章の内容
AIが自動生成した文章をチェック。これは後から全部書き換えられるので、とりあえず流し読みでOK。
画像
AIが生成した画像、またはストック写真が配置されてます。これも後から差し替えできます。
ステップ6 → 基本的な編集方法
完成したサイトは、その場で編集できます。
編集方法は2つ。
方法1 → チャットで指示する
画面の左側とか右側に、チャット欄があります。ここに修正内容を書くだけ。
「トップページの背景色をもっと明るくして」 「この画像を笑顔の人の写真に変えて」 「フォントサイズを大きくして」
こんな感じで、普通に会話する感覚で指示すればOK。AIが理解して、サクッと修正してくれます。
方法2 → 直接クリックして編集
サイトの要素(文章、画像、ボタンなど)をクリックすると、編集メニューが出てきます。
テキストならその場で書き換え。画像なら、アップロードまたはAI生成で差し替え。色やサイズも、スライダーで直感的に変更できます。
ステップ7 → プレビュー機能
編集しながら、いつでもプレビューできます。
画面上部に「Desktop」「Tablet」「Mobile」みたいな切り替えボタンがあるので、デバイスごとの表示を確認しましょう。
特にスマホ表示は必ずチェックしてください。今の時代、スマホで見る人の方が多いですからね。PCでバッチリでも、スマホで見たら崩れてた、とかあるので。
ステップ8 → 保存と公開
編集が終わったら、保存します。
「Save」ボタンをクリック。これで下書き保存されます。
公開する準備ができたら、「Publish」ボタン。すると、URLが発行されます。
無料プランだと「yourproject.readdy.ai」みたいなURLになります。このURLを共有すれば、誰でもサイトを見られるようになります。
よくあるトラブルと対処法
最初に使う時、こんなトラブルがよくあります。
トラブル1 → クレジットがすぐなくなる
何度も修正してると、あっという間にクレジットを使い切っちゃいます。
対策 → 最初の生成段階で、できるだけ詳しくプロンプトを書く。「温かみのある雰囲気」「予約フォーム付き」「色は赤とベージュ」みたいに、具体的に。そうすれば、修正回数が減ります。
トラブル2 → 思ったデザインにならない
AIが生成したデザインが、イメージと違う...
対策 → プロンプトに「参考サイト」のURLを入れる。「〇〇.comみたいな雰囲気で」って書くと、かなり精度が上がります。
トラブル3 → 日本語がおかしい
AI生成の文章が、ちょっと不自然な日本語になることがあります。
対策 → プロンプトを日本語で書く。そして、生成後に手動で文章を修正。これは避けられないので、最初から修正前提で考えた方がいいですね。
実際にサイトを作ってみる → 超簡単な3ステップ
ここまで説明してきましたが、実際の流れをもう一度整理しますね。
本当に簡単なので、一緒にやってみましょう。
例 → カフェのサイトを作る場合
ステップ1 → プロンプトを書く
「東京・渋谷にあるカフェのウェブサイト。ナチュラルで温かみのある雰囲気。メニューページ、店舗情報、予約フォームが必要。色はベージュとブラウンを基調にして。写真はコーヒーとスイーツの美味しそうな雰囲気で」
これくらい詳しく書きます。
ステップ2 → 生成を待つ
「Generate」ボタンをクリックして、30秒〜1分待つ。その間にコーヒー飲んだり、スマホいじったり。
ステップ3 → 微調整して完成
出てきたサイトを確認。9割くらいはいい感じになってるはず。
あとは気になる部分だけ修正。
「このボタンの色を濃くして」 「メニューページの写真をもっと明るくして」
これで完成です。マジで10分あればできます。
もう少し複雑な例 → コンサルティング会社のサイト
プロンプトの例
「経営コンサルティング会社のコーポレートサイト。信頼感のあるプロフェッショナルな雰囲気。紺色と白を基調。トップページ、サービス紹介、会社概要、お問い合わせフォーム、ブログページが必要。写真はビジネスマンがミーティングしてるような雰囲気で」
こんな感じ。
出来上がったサイトは、そのまま名刺に印刷できるレベルです。本当に。
【ここから有料エリア】
この記事のライター
