見出し画像

【使ってみた】Create.xyzに初挑戦!【#CreateTokyo】

こんにちは!RUNO.です。

今回はこちらのイベントに参加し、初めてCreateを触ってみました。

イベント参加レポは、別途こちらの記事を書きました↓

それでは、【Create.xyzを触ってみた】スタート!

ノリだけで、ガンガン作れた

イベントで配られた伊右衛門茶が目の前にあったので、
手始めに、そのキャンペーンページを作ってみました。

左側が出来上がったサイト、右側がプロンプト(AIへの命令文)


すご。はや。

なんか日本茶を落ち着いた空間で楽しむイメージ画像が自動で入っている。

ここまでたった30秒(なぜなら何も考えず適当にプロンプト打ったので)。

せっかくなので、スタイリッシュにしてもらいましょう。

というわけで、「Appleのホームページ風に」というよくばりオーダー。
たった一行、付け足しただけ。

プロンプトをたった一行追加しただけでここまで変わった

おおお〜〜〜!!!

先ほどの落ち着いた雰囲気から一変!
スタイリッシュでかっこいい雰囲気になりました!!!

驚きポイント

実際の画面はこちらに公開しています。
(色々試した過程で、上のスクショと見た目が異なる部分があります)

今回打ったプロンプトは、たったこれだけ。

伊右衛門茶のホームページを作ってください

/ChatGPT
伊右衛門茶が夏にたくさん売れるように、幅広い年代に刺さるようなプロモーションを考えてください。

Appleのホームページを参考に、ダイナミックな印象にしてください

もしここに、「もっとこうしたい」というアイデアを乗っければ、
目的に沿ってカスタマイズしたサイトに進化させることが可能です。

例えば、

  • キャンペーンの内容をchatGPTに考えてもらうのではなく、こちらで指定する

  • Appleのどのページを参考にするか、URLで指定する

  • 「ダイナミック」をより具体的な言葉にする

  • ボタン押下後の遷移先のページを指定する

などなど。

逆に言えば、細かく指定しなくてもできるけれど、
そうすると、いわゆる「ガチャ」状態なんですよね。

どこを変えて、どこを変えないか。

そのあたりを丁寧に作り込んでいくと、ガチャ要素にハマらずに自分の理想に近い結果が得られやすいのではないかと思います。

Google Mapを埋め込んでみる

イベント参加時にチームで作ったアウトプットでは、
Google Mapを埋め込み、
「ユーザー自身の位置情報をブラウザから取得し、その近くにあるお土産屋さんを表示する」という内容に取り組みました。

実際の画面がこちら↓

実を言うと、15分の制限時間内では、適切にMapが表示されるところまではいけませんでした、、力不足、、

でも、逆に言うと、
何も決まっていない状態で「どんな内容のサイトにする?」という話し合いから始まり、たった15分でどこまでいけたのか?
はわかるかなと思います。

今回のプロンプトは下記になります。

## 制約
英語サイトにしてください

## 命令
ユーザーの位置情報を取得した上で、
その近くのお土産屋さんを検索し、
「ユーザーの位置」と「おすすめのお土産屋さんの位置」を赤いピンで表示されている地図をサイトに埋め込んでください。「Fined Souvenir」のボタンを押すとそこに飛ぶ形にしてください
/Googlemap

## pick up要素
今日から1週間以内に特別なイベントがある場合は、それをpick upに載せてください

## ビジュアル
(ここに、理想のイメージをした参考サイトの画像をコピペしました)

おわりに

まだまだ使いこなすまでには遠いですが、
簡単にサイト制作ができるようになった!ということは肌で感じることができました。

「どんなときにこのAIを使うと良いか?」というのが、
経験値ベースで使い分けができるようになると、
やりたいことの実現ハードルがグッと下がるなあ!と感じました!

逆に言えば、それができるようになるまでは、
「自分でやったほうが早いじゃん」という風になりがちなのかな?とも思ったり。

どっちの手段も取れると、幅が広がりますね!!

最後までお読みいただき、ありがとうございました!!!


この記事が参加している募集

この記事が気に入ったらサポートをしてみませんか?