審美工程 · 12 / 12

驗收清單:點頭之前過一遍

AI 出稿越來越快,把關的動作要跟上。收官這一節交付一份 15 項驗收清單,再回訪你在開篇投下的那一票,看看這一章有沒有把眼睛練出來。

驗收清單回訪投票全章回顧延伸閱讀
三分鐘驗收,怎麼算都不虧

AI 十分鐘能出一版稿,你花三分鐘驗收,這筆帳怎麼算都划算。難纏的對手是「差不多就行」:稿子第一眼過得去,手就想直接放行,糙的地方要到上線之後才扎眼。這份清單管住那隻手:十五項,每項一個動作,過一遍再點頭。勾選進度會存在本地,下次帶著新稿子回來接著用。清單裡幾條判據有出處,勾完往下翻,每條都配了說法和練手題。

動手 · 驗收清單:15 項過一遍
交稿驗收清單 0 / 15
層級 · 3 項
間距 · 3 項
剋制 · 4 項
一致性 · 2 項
細節 · 3 項
當前瀏覽器禁用了本地儲存(可能在隱私模式),勾選照常可用,但重新整理後進度不會儲存。
剋制組的新判據:存在就要有理由

剋制組新加的那一項有出處。《About Face 4:互動設計精髓》第 17 章的判據:每個元素的存在要有理由,每處差異的存在也要有理由,給不出理由,就刪掉元素、抹平差異。配套的手法叫刪減測試:把可疑元素去掉,看資訊受沒受損。書裡把話說得更狠:刪減東西,直到破壞了設計為止,再把最後去掉的那件加回來。做一道題練手。

AI 交來的到達頁,標題底下壓了一條漸變裝飾線,該怎麼處理? 單選
A留著,刪了顯得禿
B先刪掉看一遍,資訊和層級沒受損就不加回來
C換成一條更細的漸變線
D讓 AI 再加兩條呼應一下
快慢有三道門檻,秒錶說了算

細節組那條響應時間判據也有出處。介面舒不舒服,響應速度佔一大塊,而且門檻是公認的。《About Face 4》第 17 章引尼爾森的劃分:0.1 秒內響應,人感覺是即時的;1 秒內完成,思路不斷,給個細微線索就夠;接近 10 秒,必須給出正在執行的訊號,比如轉圈加預估;超過 10 秒,要解釋慢在哪、給進度更新,做完還要提示一聲。三個按鈕各踩一道門檻,親手點一遍感受一下。

響應時間體驗器 三檔延遲
從快到慢點一遍,感受門檻在哪裡
儲存一條設定這類輕操作,應該落在這一檔。
提交表單、切換視圖,多數落在這一檔。
匯出報表、生成圖片這類重活。點了要等真實的 10 秒,進度條會陪著你。
圖表不給數字的,打回

資料視覺化也在驗收範圍裡。Tufte 的原則:可量化的資料就要量化,圖表把趨勢畫出來,數字本身也要在場。《About Face 4》第 17 章舉了 Windows 磁碟屬性的例子:餅圖給大概印象,已用和可用的位元組數照樣列出來。AI 生成的報表頁尤其愛犯這個錯:曲線畫得漂亮,湊近一看一個數都沒有,彙報時還得回去翻原始資料。兩張週報卡,點更好的那張。

本週活躍週報卡 點選更好的一版
A · 只有趨勢
dash.weekly.cn
本週活躍
8 月 3 日至 8 月 9 日
一
二
三
四
五
六
日
B · 趨勢帶數字
dash.weekly.cn
本週活躍
8 月 3 日至 8 月 9 日
4,286環比 +12%
412一
526二
488三
654四
590五
802六
814日
回訪 · 開篇那道題,再投一次

開篇你憑直覺在三個方案裡投過一票。學完 12 節,同一道題,同樣三個方案的縮略版,再投一次。

你的第二票 全章回訪
點一個方案投票
smart-platform.ai
全新智慧平臺
賦能未來 · 無限可能
立即體驗免費註冊了解更多
A · AI 預設味
shiplist.app
Shiplist
每週該發的貨,一屏看完
自動彙總任務進度,生成發布清單
免費開始看演示
B · 剋制專業
tejia-mall.com
限時特惠 5 折起02:14:36
新人禮包 · 邀請返現 · 每日簽到
爆款專區
今日上新
會員專享
積分商城
馬上搶領優惠
C · 熱鬧模板
回顧 · 12 節串成三句話
識別美

開篇先憑直覺投一票,第 2~5 節把「好看」拆成四個著力點:層級、間距、顏色、細節。看到一張頁面,先找唯一主角,再量間距,然後數顏色,最後摳細節。

翻譯給 AI

第 6~9 節把看出來的變數寫進對話:把「高階一點」換成主色、圓角、密度這些能執行的詞,改稿時點名變數,AI 才知道往哪改。

參考與驗收

第 10 節拆參考按固定順序看進去,第 11 節餵參考用墊圖、描述、變數三種姿勢,本頁的 15 項清單守住出口:點頭之前過一遍。

延伸閱讀 · 順著這章往外走
書
《Refactoring UI》(Adam Wathan & Steve Schoger)
把設計規則寫成開發者能照做的操作,本章不少判據能在裡面找到出處。重點讀改稿前後的對比圖。
《寫給大家看的設計書》(Robin Williams)
親密性、對齊、重複、對比四條原則,入門框架就這一本,讀案例改稿部分。
《About Face 4:互動設計精髓》第 17 章(Alan Cooper 等)
本頁清單裡的多條判據出自這一章:瞇眼測試、層級兩問、響應時間門檻、「每個元素的存在都要有理由」。只讀第 17 章「整合視覺設計」也夠本。
原則
「少,但更好」的原始出處。拿十條對照你手上的頁面,看違反了哪條。
把心理學定律做成卡片。先讀 Hick's Law 和 Aesthetic-Usability Effect 兩張。
規範
讀 Layout 與 Typography 兩章,看大廠怎麼定間距和字號檔位。
讀 Color roles 一節:一套主色怎麼派生出整個系統,正是設計變數的工業版。
實踐
當閱讀材料看:一屏一個主角、留白當結構用,用第 10 節的四步現場拆一遍。
資訊密度高還能保持克制的範本,看它的層級安排和灰階分工。
本節要點
✓

能看出:層級、間距、顏色、細節四個著力點,按順序拆,告別遊客式圍觀。

✓

能說清:把感覺翻譯成變數和參考餵給 AI,形容詞留給朋友圈文案。

✓

能驗收:15 項清單守住出口。下次 AI 交稿,先跑清單,把沒過的那一項原話發回去改。

✓

判據有出處才站得住:存在要有理由、響應過三道門檻、可量化就量化,出處都在延伸閱讀裡,別人問起你答得上來。

內容來源:小山學堂「審美工程」專題原創;部分設計原則整理自《About Face 4:互動設計精髓》第 17 章(Alan Cooper 等著),響應時間門檻為該章轉引尼爾森,量化原則出自 Tufte。