Skip to content
←INDEX / 提示詞庫
IMAGE/GPT Image 2/進階PRO

Landing Page Hero 區設計稿(標題層級+CTA 一眼到位)

網站首頁第一屏 Hero 區設計稿,主標、副標、CTA 按鈕、視覺區依層級排好,桌機寬版版型。

SakuyaPromptCraft 主筆 · 寫於 2026-06-26 03:39:41
AI 生圖GPT Image 2進階
Last reviewed2026-06-26 03:39:41Read~4 MIN

01PROMPT

【用途】產出一張桌機版網站首頁「第一屏 Hero 區」的高保真設計稿(design mockup),主題 [產品主題],風格 [設計風格]。

【版面骨架|先定結構再填字】
- 頂部導覽列:左側品牌名「[品牌名]」+ 右側 [導覽連結數] 個導覽連結 + 一顆次要按鈕。
- 主視覺區分左右兩欄(約 6:6 或 7:5):
  - 左欄文字:主標題(最大最粗)→ 副標說明 → 一顆主 CTA 按鈕 +一顆次要連結。
  - 右欄視覺:一塊產品示意圖或抽象插畫區。

[ 登入後可看完整內容 ]
LOGIN TO UNLOCK

這組是 Pro 內容。免費註冊可看站上數百組免費 prompt 的完整版;這一組需訂閱 Pro 或用點數解鎖。

GEN站內生圖 / GENERATE
站內生圖FLUX.2 / GPT Image 2 · 依檔位 2-8 點/張 · 失敗自動退點

登入即可直接用這段 prompt 生圖 — 不用開 Midjourney 或別的工具,在這裡就能生一張看效果。

02CONTEXT / 使用情境

要把一個產品或服務的首頁第一屏想法快速視覺化、用來提案或對齊團隊方向時用這條,適合 SaaS、品牌官網、活動頁、接案設計師。Hero 區的成敗全在「視覺層級」——使用者三秒內要看懂這是什麼、按哪裡,所以 prompt 一定要明寫層級順序(主標 → 副標 → CTA)並強調 CTA 最搶眼。實務提醒:一,主標題寫短一點(一句話、最多兩行)效果最好,太長字會縮小、層級就垮;二,明寫「桌機寬版、模擬瀏覽器、不要整台電腦」,否則它常給你一張筆電擺在桌上的情境照,那不能當設計稿用;三,這是視覺稿,按鈕和連結不是真的能點,導覽列文字也別塞太多(4-5 個最穩)。GPT Image 2 對英文品牌名+繁中內文的混排處理得不錯,但若副標較長、偶爾末尾會掉字,叫它「只重畫副標文字、其餘不動」即可。

FAQ · 常見問題

「Landing Page Hero 區設計稿(標題層級+CTA 一眼到位)」這組提示詞要怎麼用?

這組 prompt 專為 GPT Image 2 設計。把 prompt 內 8 個方括號 [變數] 換成你自己的內容,貼進 GPT Image 2 執行即可。難度中等,照變數說明填好後即可上手。

「Landing Page Hero 區設計稿(標題層級+CTA 一眼到位)」是免費的嗎?

這組是 Pro 會員內容。免費帳號可看預覽與使用情境;訂閱 Pro 後解鎖完整 prompt、變數表與工具參數。退款條件依退款政策處理。

用 GPT Image 2 依這組 prompt 生成的成果可以商用嗎?

prompt 文字本身你可自由使用與修改。但 AI 生成物(圖/音樂/影片/文字)的商用授權,取決於你在 GPT Image 2 使用的方案與其官方服務條款,請以該工具的授權規範為準。

RELATED你可能也需要

高階 3D 收藏玩具頭像PRO01
IMAGEGPT Image 2FEATURED
2026-06-26

高階 3D 收藏玩具頭像

Transform the input photo into a high-end stylized 3D collectible figure…

進階可站內生圖
Read

櫻花咖啡戶外人像PRO02
IMAGEGPT Image 2FEATURED
2026-06-26

櫻花咖啡戶外人像

Edit the provided image while preserving the same face identity, shape,…

高階可站內生圖
Read

潑灑抹茶街頭手機照片PRO03
IMAGEGPT Image 2FEATURED
2026-06-26

潑灑抹茶街頭手機照片

A realistic vertical smartphone photo of a spilled green iced drink on o…

高階可站內生圖
Read

古希臘三哲時間軸城市圖PRO04
IMAGEGPT Image 2FEATURED
2026-06-26

古希臘三哲時間軸城市圖

二千五百年前,柏拉圖,蘇格拉底, 亞力士多德,坐在雅典街頭聊天,聊出了世界文明史的源頭。 背景可以加上他們聊天內容,按時間軸的走向,重疊在古希臘…

入門可站內生圖
Read

PRO · 完整版解鎖

這組是 Pro 內容.

註冊免費看免費 prompt 跟所有教學;升 Pro 解鎖全部進階與條目使用說明。退款條件依退款政策處理。

不想註冊?

留個 email,下次有新 prompt 會寄一封簡短摘要給你。退訂一鍵、不轉賣。

每週一期,新上架提示詞 + 模型測試心得。每封信底部都有一鍵取消訂閱。

或訂 RSS feed(30 秒一次的人味選擇)

COMMENTS · 討論區0 則
登入 後可留言。還沒帳號?註冊
目前沒有留言。第一個說說你的經驗。
EMBED · 嵌入 blog / Note一行 iframe HTML、貼進文章即顯示此 prompt 卡片+

適合:部落格、Medium、Notion 公開頁、Substack — 任何支援 iframe / HTML 嵌入的地方。對方點「看完整」會回到本站、是 prompt 庫的免費 backlink。

<iframe src="https://prompt.luvai.net/embed/gpt-image-2-landing-hero-mockup" width="100%" height="380" frameborder="0" style="border:1px solid #e0dcd0;border-radius:4px;" loading="lazy" title="PromptCraft Embed"></iframe>
預覽 embed →380px tall · responsive width
發現這個 prompt 過時 / 跑不動 / 有錯字? 回報給我們 →