Skip to main content

ツール利用風景

「HTMLテンプレートを手に入れたものの、AIにどう指示を出せばいいか分からない」 「AIに指示をしたら、デザインが崩れてしまった」 「毎回長い指示文(プロンプト)を書くのが面倒…」

そんなお悩みを解消するために、EYANCAの利用を想定した「AIプロンプトジェネレーター」を開発しました。

これは、フォームに必要な項目を入力していくだけで、EYANCAのカスタマイズに最適な「AIへの指示書」が自動で生成されるツールです。

本ツールは、有料noteをご購入いただいた方への限定特典(シークレットツール)として公開いたします。

 

🛠 何ができるツール?

image

難しい専門用語や、長い文章を考える必要はありません。画面に従って「選択」するだけで、プロのWebディレクターが書いたような精度の高い指示文が完成します。

1. 直感的な操作で「理想のデザイン」を指定

スクリーンショット

「サイト名」や「テーマカラー」はもちろん、「高級感」「ポップ」「ミニマル」といったデザインの雰囲気もプルダウンから選ぶだけ。さらに、「テンプレートの原型をどれくらい残すか(踏襲度)」もスライダーで調整可能です。「原型を維持したい」「大胆に変えたい」といった微妙なニュアンスもAIに正確に伝わります。

2. 技術的な「守るべきルール」を自動記述

AIに任せると、勝手に構造を壊したり、余計なフレームワークを使ったりしてしまうことがあります。

このツールは、EYANCAを安全に動かすための技術的な制約を自動でプロンプトに含めます。これにより、エラーや崩れのリスクが大幅に減ります。

3. 「企画相談」モードも搭載

スクリーンショット

「そもそも、どんなサイトにすればいいか決まっていない…」 そんな時のために、カスタマイズ指示だけでなく「AIディレクターへの壁打ち依頼」プロンプトも作成できます。「おしゃれなカフェサイトを作りたいけど、何から始めればいい?」といった相談をAIにするための叩き台も、このツールで作れます。

 

✨ 使い方は3ステップ

プロンプトジェネレーター

  • ツールにアクセス(IDとパスワードを入力)
  • 作りたいサイトの情報をフォームに入力
  • 「コピー」ボタンを押して、GeminiやChatGPTに貼り付ける

これだけで、あなただけのオリジナルサイト構築がスタートします。

🎁 アクセス方法

本ツールは、EYANCA有料版(note)をご購入いただいた方のみが利用できる限定ページです。以下の記事購入後のエリアに、URLとアクセスパスワードを追記しました。

noteはこちら

これからEYANCAでサイト制作を始める方も、すでにお持ちの方も、ぜひこのツールを使って「AIとの共創」をよりスムーズに楽しんでください。

→ 無料HTMLテンプレート「EYANCA」ダウンロードページ

 

【AI×HTMLでWeb制作を効率化】無料Webテンプレート「EYANCA」は、商用・個人を問わず自由にご利用いただけます。デザインのベース構築や、AIを用いたコーディング学習の素材として、ぜひお役立てください。また、本記事の内容に共感いただけましたら、SNS等でのシェアやWebサイトでのご紹介も大歓迎です。

EYANCA(無料テンプレート)の詳細


トミナガハルキ

グラフィックデザイナー/AMIX 代表。独学でデザインを学び、パッケージメーカー→美容系ベンチャー→家庭用品メーカーでのデザイン・広報運営を経て独立。現在は小さな事務所を拠点にASOBOAD等のサービスを運営し、ロゴ・パッケージ・広告物を中心に制作しています。著書『#ズボラPhotoshop 知識いらずの絶品3分デザイン』は各カテゴリでベストセラーを獲得。2020年Adobe Creative Residency選出。ブログでは、10年以上の実務から学んだことや働き方のヒントを等身大の視点で発信しています。