🎬 シーンから引くUI表現
飲食店サイト・車のLPなど、作るサイトの業種・用途からふさわしいWebの表現テクニックを逆引き。AIへの指示プロンプトに使える語彙も併記します。
このページでわかること
- 飲食店・車LP・ヘルスケアなど、作るサイトの業種・用途から定番の表現テクニックを逆引きできる
- シーンごとに、合う印象・モチーフへの橋渡しも提示する
- 各表現には動くデモ・コード例・AIへの指示プロンプトテンプレを用意（タグページで順次公開）
- シーンタグは順次追加予定
シーンから引く、とは
「飲食店のサイトを作る」「車のLPを頼まれた」のように、起点が業種・用途であることも多い。このハブでは、シーンごとに定番の表現テクニックとその組み合わせを提示する。
シーンに合う印象・モチーフへの橋渡しもここで行う。
シーンタグ一覧
🍴 飲食店・料理サイト（準備中）
シズル感・温度・素材感で食欲を引き出す
🚙 車・モビリティLP（準備中）
疾走感・金属の質感・走りの演出を組み合わせる
🏥 ヘルスケア・医療（準備中）
清潔感・安心感・柔らかなトーンで信頼を伝える
💼 コーポレート（準備中）
誠実さ・先進性・整った構成で信頼を伝える
使い方ガイド
- シーンタグを選ぶ：作るサイトの業種・用途に近いタグページを開く
- 定番の表現と組み合わせを見る：シーンに合う表現テクニックと、関連する印象・モチーフをたどる
- AIプロンプトテンプレをコピーして使う：カード内のテンプレをCursorやClaude Codeに貼り、自分の文脈に合わせて調整する
ほかの軸から引く
よくある質問
「印象から引く」「モチーフから引く」との違いは？
印象（形容詞）・モチーフ（名詞）・シーン（用途）の3つの軸で同じ表現群を引けます。入口が違うだけで、行き着く表現テクニックは共通です。自分の頭にある言葉に近い軸から入るのがおすすめです。
自分の業種が一覧にない場合は？
近い業種のタグを参考にするか、「印象から引く」「モチーフから引く」の軸から入るのがおすすめです。たとえば整体院なら、ヘルスケアのタグと「癒し」の印象タグを組み合わせて考えられます。
複数の表現を組み合わせるコツは？
主役の演出を1つ決め、残りは控えめな補助に回すのが基本です。動きの強い表現を複数同時に使うと視覚的に疲れるため、「動き1つ＋色・質感1つ」程度の組み合わせから始めるのが安全です。
シーンタグは増えますか？
順次追加予定です。美容・教育・不動産・イベントLPなどを計画中です。
Zenn