【ReplitAgent】会社サイトを参考に、Webサイトを構築してもらった

はじめに

「このWebサイトかっこいいな。そのサイトっぽいイメージで自分のサイトも作れたらなぁ。」みたいなことありますよね。

そのサイト、ReplitAgentで作れます。

もしReplit Agentについてご存知ない方は、以下Replit Agentの内容をChatGPTに3行でまとめてもらいましたので、ご参照ください。
※1:Replit Agentとは？

Replit AgentのURL参照機能

Replit Agentでは、リンクURLを参考にした開発も可能です。
やり方は簡単、参考のURLをプロンプトに含めるだけです。

今回は、知り合いが「アロマサロンのお店のWebサイトを作りたいので、Web会社に頼もうとしている」と言っていたことを思い出したので、このサイトを作ってみます。

参考にするサイトは、弊社のサイトに設定してみます。
弊社サイト

プロンプトに、URLを入力しつつ、以下のような依頼をしました。

出来上がったサイト画面

少し手直しをプロンプトベースで依頼しまして、出来上がったサイトがこちらです。（アロマサロン名は架空の名称です）

Welcome to Serenity

メニュー紹介

セラピスト一覧

スクロールするたびに表示される仕様です。

料金表

予約画面

到達すると横からスライドしてされる仕様です。

問い合わせ画面

フッター

なんだかいい感じにできましたね。

元の画面との比較

元の画面と比較してみます。

最初の見栄え

・元のサイト

・今回構築したサイト

元のサイトと、今回のサイト雰囲気は似ていますが、今回のサイトはトグルボタンの位置が異なっています。
ただ左側には、会社名を入れているので、綺麗に見えるよう気を利かせた結果なのかもしれませんね。

横にスライドする画面

元の画面

今回の画面

ここは概ね一致していますね。

画面の動き

元の画面

今回の画面

写真だと分かりにくく恐縮ですが、
写真サイズがスクロールにつれて動的に動く仕様になっており、これを今回の画面でも踏襲しております。なかなか、こういう細部まで表現できるのはすごいですね。

おわりに　（＋余談）

いかがでしたでしょうか？
今後Webサイト開発の現場は、「このサイトと似ているものから、このサイトに似ているものに変更したい。最後にプロンプトで手直しする。」というような先人たちの知恵を借りる開発手法に転換していくかもしれませんね。ABテストのような形も、非常に動的に変わっていくような未来も見えてきます。

ぜひ、このURL参照機能を皆さんも使ってみてください。

※余談
今回Replit Agentが生成したアロマサロンの架空のスタッフをご紹介します。

佐藤美咲さんと、田中恵子さんです。

佐藤美咲さんは、大分童顔な、、、いや、年齢詐称してますかね。
田中恵子さんは、、、いかついですね、、、。