Before/After 對比圖:美容、健身、裝潢必備的成果呈現
2026年4月24日· Howshin Wang
TL;DR
- Before/After 是對比圖 block,每項有 beforeImage + afterImage 兩張圖。
- 每項可加 label(項目總稱)、beforeLabel / afterLabel(兩張圖下方標籤)。
- 適合「前後差異可視覺化」的行業:美容、健身、醫美、髮型、牙科、裝潢。
- 拍攝關鍵:同位置、同光源、同角度——差一點就顯得造假。
Before/After 為什麼這麼強
訪客對「服務結果」的疑問,用文字說很難、用單張圖說只有一半、用兩張對比才能真的說服人。
三個有效的心理觸發點:
- 具體想像:訪客能把「before」代入自己現在的樣子,「after」投射成自己想要的樣子。
- 不可否認的證據:兩張圖放一起,差異無法用話術解釋掉。
- 可信度高:比純推薦語更難造假(拍攝條件必須精準)。
這就是為什麼美容、健身、醫美產業的廣告 90% 都是 Before/After——它就是有效。
編輯器欄位
- 標題(heading):例如「服務成果」、「課程前後」、「客戶案例」。
- 副標(subheading):補充。選填。
- 項目清單(items[]):每組:
- label:項目總稱。例:
30 天核心訓練、雷射除斑療程。 - beforeImage:服務前的照片。
- afterImage:服務後的照片。
- beforeLabel:前圖下方的小標(預設「Before」)。
- afterLabel:後圖下方的小標(預設「After」)。
- label:項目總稱。例:
- i18n 分頁:heading、subheading、label、beforeLabel、afterLabel 支援多語。
拍攝最關鍵的三件事
- 同位置:站同一位置、同一光源、同一背景。牆上有個插座?兩張都要有。
- 同姿勢、同表情:微笑 vs 嚴肅的差異會讓人以為是兩個人。兩張都維持一樣。
- 同裁切比例:After 拉近、Before 拉遠會顯得不誠實。用同樣的構圖。
專業做法:客戶第一次來時就拍標準化 Before 照(三角架固定位置、記下光線設定);服務結束或一段時間後同條件再拍 After。
勞倫次 Before 的誠實
Before/After 最常被質疑的是「是不是你挑對你有利的」。幾個方法提升誠實度:
- 標日期:beforeLabel 寫「2025/01」、afterLabel 寫「2025/06」,讓人知道間隔多長。
- 寫明做了什麼:用 label 寫清楚是哪個療程、哪個課程、多長時間。
- 配套推薦語:有客戶同意的話,在 Testimonials 放對應的主觀感受。
搭配建議
Before/After 常見位置:
- Services 之後:服務項目介紹完,用 Before/After 證明效果。
- Testimonials 上方:視覺證據 + 文字證據的雙重推進。
- 單獨
/gallery或/results頁:案例多時獨立頁展示更方便。
三個常見錯誤
- 用濾鏡或美圖軟體處理 After:客戶可能一開始沒發現,但一旦被 PTT / Dcard 抓到直接毀掉品牌信任。不要做。
- Before 刻意拍得差:用糟糕的光線、難看角度拍 Before 當對比——訪客看得出來,反感。兩張用同樣條件才有說服力。
- 沒取得客戶授權就放網路:肖像權問題非常嚴重。書面授權書保留是必要的。
寫在最後
Before/After 是最有說服力也最容易出醜的 block——用對是神器,用錯是地雷。核心原則永遠是:誠實、同條件、有授權。
登入 AHHA 後台 → 頁面管理 → 加入 Before/After block → 上傳成對對比圖(確認有拿到客戶授權),儲存即完成。
Before/After對比圖成果展示Block使用手冊
留言討論
只有會員能留言(防止垃圾訊息),留言顯示於此頁。
載入中...