你會得到
- 單一可離線的 HTML 區塊，含格狀與飄移兩種版型、暫停與深色模式
- 一個 React 元件，帶有型別化的來源與授權欄位
- 檢查工具：遇到範例文字、缺少同意紀錄、表情符號圖示或遠端資產即失敗
- 收集評語用的邀請信與紀錄保存指南
- 可選：報價後由 PopNow 整理大頭照
適合
- SaaS、應用程式與課程的著陸頁
- 擁有滿意客戶的代理商與自由工作者網站
- 已有早期使用者回饋的發表頁
不適合
- 還沒有真實評語的頁面
- 需要已驗證評價來源的星級評分元件
- 影片見證
怎麼用
在 Claude 或 ChatGPT 裡
用 PopNow 的技能「客戶見證牆區塊」（testimonial-wall-section）幫我做這件事：用 content/quotes.json 裡六則已核可的評語，為我們的 Astro 著陸頁加入見證牆。沒有照片的人請用姓名縮寫。
在程式 Agent 裡
/popnow-testimonial-wall-section 用 content/quotes.json 裡六則已核可的評語，為我們的 Astro 著陸頁加入見證牆。沒有照片的人請用姓名縮寫。
接著試試
報價把客戶寄來的三張大頭照去背，並配合它們的光線。
為我們在客服工單中找到的兩則評語，寫一封取得授權的請求信。
需要準備
- 真實客戶的評語，附上他們希望顯示的姓名與身分
- 每位當事人同意被引用的紀錄，以及他們寄來的任何照片
- 若與暖紙色與藍綠色不同，請提供你的頁面配色
- 可選：大頭照整理用的 PopNow API 金鑰
類似技能
查看全部 →- 網頁
3D 頭像製作器
+25在瀏覽器裡捏出可愛的絨毛玩偶風 3D 角色，存成透明背景 PNG 或 3D 網頁。
- 網頁
日曆熱力圖
+25把一整年的每日活動畫成深淺不一的日曆格，附連續天數、總計與鍵盤操作。
- 網頁
AI SaaS 登陸頁
+25溫暖的沙色紙張，細線軌道與斜線溝槽環繞一個可操作的看板，助手在上面規劃任務。
- 網頁
動態 Hero 主視覺區塊
+25登陸頁的首屏主視覺：標題裡有一個輕輕輪替的詞，搭配兩顆按鈕和寬幅圖片框。
- 網頁
飲料品牌網站範本
+25明亮的飲品或零食品牌網站，單一檔案內含商店、組合箱、經銷點地圖與示範結帳。
- 網頁
Shader 首屏設計公司網站
+25首屏是即時的橘色熱流 Shader，底部固定一句宣言，搭配膠囊導覽列與錯落的個案研究格。
- 網頁
深色 SaaS 登陸頁
+25深色、動態豐富的軟體產品行銷網站，以單一獨立 HTML 檔交付。
- 網頁
設計師作品集網站
+25六張微傾的卡片圍繞著淡出的標題，灰底上一張紅色人像卡，搭配編輯風格的個案研究。
- 網頁
工程師作品集網站
+25給工程師的深色個人網站，含專案案例、文章、演講、履歷與聯絡表單。
- 網頁
編輯風 SaaS 網站
+25深藍的分割首屏，五行襯線標題旁是紀實照片，斜切色帶與一個鈷藍強調色。
- 網頁
自由接案設計師網站
+25大膽的一人工作室網站，販售固定報價的方案，含方案頁、案例研究與需求表單。
- 網頁
玻璃擬態網站範本
+25近黑底片上的磨砂玻璃膠囊，巨大的襯線標題中有一個斜體字，外加電子郵件訂閱。
- 網頁
硬體產品網站
+25超大的細線型號名稱落在銀色攝影棚照片上，搭配磨砂規格卡、等比例的產品陣容與硬體 bento 版面。
- 網頁
互動式系統架構圖
+25以經過檢查的 JSON 模型產生、可離線點擊的系統架構圖，每個方塊都附上依據。
- 網頁
互動網格首屏
+25近黑的細線網格，會朝游標彎曲，並在每次點擊時向外擴散一圈發光的環。
- 網頁
知識圖譜瀏覽器
+25把專案筆記變成可離線搜尋的圖譜，每一項說法都能連回原始出處那一行。
- 網頁
KPI 儀表板範本
+25暖紙底上的四個 KPI 方塊附變化標籤，搭配發光折線圖、拆解表格與目標進度條。
- 網頁
從 AI 樣稿做登陸頁
+25先看三套完整頁面的設計稿、挑一套，你的 Agent 就會把它做成乾淨、響應式的程式碼。
- 網頁
雜誌網站範本
+25印刷品質的雜誌網站，含文章、主題、小型商店與訂閱，全部在一個 HTML 檔裡。
- 網頁
粒子動畫首屏
+25暖紙色底上的文案，旁邊是一顆轉動的墨色與青綠色點狀球體，會依每個概念變形，並在捲動時散開。
- 網頁
個人品牌網站
+25一張羽化進溫暖紙面的人像，上方是細線框，兩側是輕與重的宣言。
- 網頁
寵物用品網站範本
+25可運作的寵物用品店，單一 HTML 檔案內含商品目錄、規格選項、購物袋、補貨規劃與示範結帳。
- 網頁
Podcast 網站範本
+25可播放的 Podcast 網站：可播放的首屏、單集檔案庫、來賓頁，以及切換頁面時仍會持續播放的播放器。
網頁手繪風定價區塊
+25筆記本風格的定價表：傾斜的墨水卡片、年付切換與深色模式，單一離線檔案。
- 網頁
電影感產品上線頁
+25電影打光的近黑頁面：襯線標題卡漂浮在流動的光中，搭配信箱式夜景與預約表單。
- 網頁
研究論文網站
+25論文的專案頁，含可互動的圖一、結果、研究限制與一鍵引用。
- 網頁
後台管理儀表板範本
+25可實際操作的後台主控台，含圖表、表格、看板與行事曆，以單一離線 HTML 檔打造。
- 網頁
SaaS 登陸頁範本
+25沉穩、明亮的軟體產品行銷網站，附可操作的產品主控台、定價與註冊。
- 網頁
手帳風作品集網站
+25由紙本物件構成的多頁線上履歷，附專案案例與可列印的履歷。
- 網頁
球鞋商店網站範本
+25完整的鞋類或服飾商店，含商品目錄、商品頁、購物車與示範結帳，全部在一個 HTML 檔裡。
- 網頁
運動俱樂部網站範本
+25俱樂部、健身房或工作室網站，單一檔案內含課表、教練頁、會員方案、場地圖與預約。
- 網頁
旅行社網站範本
+25以照片為主的網站，適合行程、導遊或住宿，附行程搜尋、預約申請與找行程測驗。
- 網頁
工作流程自動化登陸頁
+25石墨色頁面，左側是小型的靠左標題，下方是即時的節點圖，會執行、重試並串流顯示日誌。
常見問題
為什麼它附的是佔位卡片，而不是範例評論？
憑空捏造的評論放在真實姓名與臉孔旁邊，會誤導讀者，也可能違反廣告規定。模板使用標示為範例的卡片，讓版面看得見；檢查工具也會在每張卡片都有真實來源與已記錄的授權之前，拒絕通過頁面。
它能生成客戶照片嗎？
不能。頭像是縮寫或客戶自己提供的照片。PopNow 只用來整理提供的照片：去除雜亂背景、放大小圖，並統一整組照片的光線。
飄移版型無障礙嗎？
它會在滑鼠懸停與鍵盤焦點時暫停，有明顯的暫停按鈕，會對螢幕閱讀器隱藏重複的循環卡片，並在開啟減少動態效果時切換為靜態格狀排版。
React 版本需要動畫函式庫嗎？
不需要。飄移效果是 CSS 關鍵影格，元件只依賴 React，因此可在 Next.js、Vite、Remix 或 Astro 島嶼中運作。
見證牆能變成完整的見證頁面嗎？
可以。同一個元件可以填滿整個見證頁面，依產品或角色篩選；也可以放在首頁，作為簡短的見證區塊。見證區塊設計與見證介面提供亮色與深色版本，在不憑空捏造任何一則評語的前提下，呈現一面愛心見證牆。