審美工程 · 9 / 12

生圖:構圖、光影、色彩的語言

生圖和生 UI 同一個道理:詞彙量決定產出。構圖、光影、色彩三件套,每樣記三個詞;先用三組真圖練眼力,再拼一段能直接用的生圖提示詞。

構圖光影色彩並排對比四選一驗收
出圖質素,卡在你的詞彙量上

你説「一張好看的咖啡海報」,AI 給你訓練數據的平均值;你説「三分法構圖、黃金時刻側逆光、低飽和莫蘭迪色調」,AI 立刻有了施工圖。攝影師練了一百年的語言現成擺在那裏,拿來就能用。審美三件套:構圖管主體站位,光影管立體感,色彩管情緒。每樣記住三個詞,夠用了。下面的練習都做成兩張並排,這是信息設計師 Tufte 的老辦法:對比產生情境,好壞擺在一起才看得出來。

動手 · 第一局:構圖
構圖:主體該站在哪 二選一
點你覺得更好的那張。
A燈塔海岸照片,燈塔死板居中,地平綫切在畫面正中
B同一處燈塔海岸,三分法構圖,燈塔位於右側交點,左側海面留白
同一處燈塔海岸,兩種構圖。圖:GPT Image 2 生成示意
三分法畫面橫豎各切三份,主體放在交點上,比居中耐看。
留白空出來的地方給主體讓位,畫面不用填滿。
視綫引導用海岸綫、道路這類綫條,把視綫牽到主體上。
動手 · 第二局:光影
光影:立體感從哪來 二選一
還是點更好的那張。
A陶瓷咖啡杯靜物,側逆光,杯沿有高光,影子拉長有形狀
B同一只陶瓷咖啡杯,正面平光,沒有影子,缺少立體感
同一只咖啡杯,兩種打光。圖:GPT Image 2 生成示意
側光光從側面來,立體感靠影子撐起來。
黃金時刻日出日落前後一小時,光又軟又有方向。
明暗對比亮部和暗部拉開,主體從背景裏跳出來。
動手 · 第三局:色彩
色彩:誰在打架,誰在説話 二選一
最後一局,點更好的那張。
A工作台場景,紅黃藍綠高飽和多色混雜,沒有統一色調
B同一個工作台場景,低飽和、色調統一
同一個工作台,兩種配色。圖:GPT Image 2 生成示意
色調統一全圖一個色系,雜色越少越耐看。
低飽和把顏色的音量調低,質感立刻上來。
點綴色留一處高飽和當視覺焦點,多了就打架。
二選一為什麼靈:Tufte 的兩條原則

信息設計的老前輩 Edward Tufte 在《The Visual Display of Quantitative Information》裏留了七條原則,About Face 4 第 17 章把它們搬進了介面設計。其中兩條正好解釋這一頁的玩法。

第一條,加強視覺對比,對比產生情境。單獨看一張燈塔照,你説不準構圖好壞;兩張並排,三分法和死板居中立刻分出高下。前面三局你答得那麼快,靠的就是對比把差異放大了。這也解釋了為什麼好構圖和好光影總是「一眼能看出來」:眼睛天生是台對比機器,缺的只是並排的機會。

第二條,在相鄰空間上並排顯示,優於按時間堆積。一張張翻着看,比較靠短時記憶,翻到第四張,第一張長什麼樣已經記不清了;並排擺開,比較靠眼睛。所以讓 AI 出候選圖,別看一張刪一張,攢齊了並排看。

讓 AI 出圖的正確姿勢:一次要四張,並排擺開再挑,別一張一張看完就忘。
動手 · 輪播和並排,比一場

唔信並排更快?攞前三局嗰六張圖試一場。任務:把「黃金時刻側逆光」那張找出來。先用輪播翻着找,再切並排看一遍,感受兩種看法的差距。

找出側逆光那張 0 / 2 種模式
兩種模式各找一次:輪播裏點「就選這張」,並排裏直接點圖。
第 1 / 6 張 輪播當前圖片
前三局出現過的六張圖。圖:GPT Image 2 生成示意
動手 · 驗收:四張候選選一張交稿

三局練完,上真實工作場景:你讓 AI 給咖啡品牌出了四張海報候選,客戶明天要。用剛學的三件套挑一張交稿。注意這裏的姿勢:四張並排擺開再挑,用的就是 Tufte 那招相鄰空間對比。

咖啡品牌海報驗收 四選一
點你會交畀客戶嗰張,點完逐張揭曉判詞。
候選 1咖啡海報候選一:咖啡壺貼近畫面邊緣,另一側大片空白沒有內容,構圖失衡
候選 2咖啡海報候選二:三分法構圖,側逆光有形狀,低飽和統一色調
候選 3咖啡海報候選三:正面平光,咖啡壺缺少立體感
候選 4咖啡海報候選四:多種高飽和顏色堆疊,色彩過載
咖啡品牌海報四張候選。圖:GPT Image 2 生成示意
動手 · 拼一段生圖提示詞

三件套各挑一塊,拼出來的就是能直接發給生圖模型的提示詞。主體描述換成你自己的場景就能用。

生圖提示詞積木 即時拼裝
三組各挑一塊,下方的提示詞跟着變,拼好直接複製去生圖。
構圖
光影
色彩
本節要點
✓

審美三件套指揮生圖:構圖管站位,光影管立體感,色彩管情緒,每樣記三個詞。

✓

挑圖和生圖吃同一套詞彙:説得出「三分法」「側逆光」「低飽和」,四選一就有依據,交稿不靠運氣。

✓

候選圖要並排看:對比產生情境,相鄰空間擺開優於一張張翻,Tufte 這兩條原則就是本頁方法論的底座。

✓

下次生圖把構圖、光影、色彩三行寫全再發;出圖不對時,按這三行逐項排查是哪行沒説清。

內容來源:小山學堂「審美工程」專題原創;本頁示意圖由 GPT Image 2 生成;部分設計原則整理自《About Face 4:交互設計精髓》第 17 章。