
UI / UX デザイン
B2B SaaS ランディングページ ヒーローセクション
グラスモーフィズムカードやアナリティクス、信頼ロゴを備えた高CV率のB2B SaaSヒーロー画面を生成。製品名や見出し、数値を変更可能です。
b2b saasヒーローセクションui-uxデザインランディングページwebデザインfigmaモックアップ
プロンプト
{
"type": "モダンなB2B SaaSランディングページ ヒーローセクションのデザイン",
"brand": {
"name": "[Atlas GTM]",
"logo": "ダークネイビーの円形マークにホワイトの抽象的なコンパス/文字Aのアイコン",
"visual_style": "プレミアム、ミニマル、コンバージョン重視、淡いラベンダーとピーチのグラデーションが光るソフトホワイトの背景、繊細な等高線、角丸のグラスモーフィズムカード、ダークネイビーのタイポグラフィ、エレクトリックブルーのアクセントカラー"
},
"layout": {
"canvas": "デスクトップ用ワイドWebサイトスクリーンショット、アスペクト比16:9、ゆったりとしたホワイトスペース、洗練されたFigmaスタイルのWebデザイン",
"header": {
"position": "トップ",
"count": 6,
"items": [
"左側にロゴとAtlas GTMのワードマーク",
"What We Do",
"Who We Help",
"How It Works",
"Results",
"Resources"
],
"cta": "右矢印付き「Book a Strategy Call」、右上のダークネイビー角丸ピル型ボタン"
},
"hero_left": {
"position": "左半分",
"eyebrow": "MAP. MESSAGE. MEETINGS.",
"headline": "[We build the map from your product to your most valuable buyers.]",
"headline_treatment": "太字の大きなダークネイビーのサンセリフ体、「the map」の部分は鮮やかなブルーで強調",
"body": "[Atlas GTM gives B2B companies a precise, tested system to generate more pipeline, without guesswork or reliance on referrals.]",
"buttons": {
"count": 2,
"items": [
"「Book a Strategy Call」矢印付きダークネイビー塗りつぶしボタン",
"「See How It Works」小さなダイヤアイコン付き白枠線ボタン"
]
}
},
"hero_right": {
"position": "右半分",
"card_count": 4,
"cards": [
{
"description": "中央上部の大きな白いコアカレッジカード",
"text": "Know where you’re going. Move with precision.",
"badge": "Core Belief",
"graphic": "小さな丸いノードと青く塗りつぶされた終点を持つ点線の曲線パス"
},
{
"description": "右側カードの後ろに配置されたダークネイビーのマップパネル",
"icons_count": 3,
"icons": [
"ターゲット/十字アイコン",
"オーディエンス/グループアイコン",
"成長チャートアイコン"
],
"graphic": "繊細な等高線と点線ルート"
},
{
"description": "右下に前面配置されたホワイトのアナリティクスカード",
"metric": "2.4x",
"title": "Meetings Booked",
"subtitle": "(per 1,000 contacts)",
"caption": "Increase after 6 months with Atlas GTM",
"chart": "Month 1、Month 3、Month 6とラベルされた青色の上昇折れ線グラフ"
},
{
"description": "アナリティクスカード下の横長フィーチャーストリップ",
"feature_count": 4,
"features": [
"Territory Mapping",
"Message Testing",
"Reply Analysis",
"System Compounding"
]
}
]
},
"trust_bar": {
"position": "下部中央",
"heading": "TRUSTED BY B2B SAAS & CONSULTING COMPANIES",
"logo_count": 6,
"logos": [
"fuse",
"Nexora",
"Northline",
"Vectorly",
"Clariovue",
"Summit Labs"
]
}
},
"typography": {
"font": "InterやSatoshiに似たクリーンでモダンなサンセリフ体",
"colors": "ダークネイビー、くすんだスレートグレー、ブライトロイヤルブルー、ソフトラベンダー"
},
"rendering_instructions": "ブラウザ枠なしの高忠実度SaaS Webサイトランディングページモックアップを作成。文字をくっきりと読みやすく保ち、グリッドに合わせて正確に配置、柔らかな影、角丸、かすかなぼかし、プレミアムなスタートアップの美学を演出。"
}カスタマイズできる部分
生成する前に、プロンプトのこれらの部分を自分のテーマや文言に置き換えてください。
[Atlas GTM]プレースホルダー
プロンプトの詳細
- カテゴリ
- UI / UX デザイン
- モデル
- GPT IMAGE 2
- 1 枚あたりのコスト
- 1K:43 クレジット · 2K:86 クレジット · 4K:143 クレジット
- アスペクト比
- 16:9
- 追加日