你會得到
- 一份可離線開啟的 HTML 網站，含首頁、服務、定價、方案頁、作品、案例研究、關於、流程、聯絡、條款與 404
- 方案格，含一個精選方案、比較表與可選的季付方式
- 以 HTML 製作的手機與瀏覽器畫面案例研究，而非截圖
- 檢查路由、資料完整性、無障礙與殘留範例的驗證工具
- 可選：報價後由 PopNow 製作的人像去背與專案圖片
適合
- 自由接案的 UI、UX、品牌與網頁設計師
- 販售套裝的獨立開發者、插畫師與攝影師
- 提供固定範圍服務的顧問與教練
不適合
- 有團隊與多項服務線的設計代理商
- 販售實體商品的線上商店
- 以安靜影像為主的作品集
怎麼用
在 Claude 或 ChatGPT 裡
用 PopNow 的技能「自由接案設計師網站」（freelance-designer-website）幫我做這件事：幫我做網站。我是 Dana Oyelowo，在里茲的產品設計師。方案：Audit 1,200 英鎊（1 週）、Sprint 4,800 英鎊（3 週）、Retainer 每月 3,500 英鎊。專案資料在 notes/projects.md。
在程式 Agent 裡
/popnow-freelance-designer-website 幫我做網站。我是 Dana Oyelowo，在里茲的產品設計師。方案：Audit 1,200 英鎊（1 週）、Sprint 4,800 英鎊（3 週）、Retainer 每月 3,500 英鎊。專案資料在 notes/projects.md。
接著試試
報價把 photos/me.jpg 裡的我去背，放到首屏。
兩個專案沒有照片。請為它們報價，做同一系列的圖片。
需要準備
- 你的服務，以及兩到四個附真實價格與時程的方案
- 兩個以上的專案，包含問題、決策與成果
- 一張素色背景的半身自拍，以及你作品的照片
- 可選：一支 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超大的細線型號名稱落在銀色攝影棚照片上，搭配磨砂規格卡、等比例的產品陣容與硬體 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以照片為主的網站，適合行程、導遊或住宿，附行程搜尋、預約申請與找行程測驗。
- 網頁
工作流程自動化登陸頁
+25石墨色頁面，左側是小型的靠左標題，下方是即時的節點圖，會執行、重試並串流顯示日誌。
常見問題
用我自己的照片做首屏人像要怎麼運作？
請寄一張素色背景的半身照。PopNow 的背景移除工具會把它去背成透明圖，頁面中的 SVG 濾鏡會在亮色模式下將它調成淡藍色，在深色模式下則保持正確，因此任何照片都能配合設計。
沒有結帳系統也能賣方案嗎？
可以。每個方案都有自己的頁面，包含時程、交付內容、適合對象與常見問題；按鈕會帶到已預選該方案的需求表單。正式上線時，請把表單接到你的信箱或表單服務。
我的專案沒有好的照片怎麼辦？
PopNow 可以在一個一致的系列中，為每個專案生成一張材質或擺放研究圖，報價後才執行。這些圖明確是情境圖，絕不會被當作已交付作品的照片；案例研究畫面則以 HTML 製作。
適合插畫師或顧問嗎？
可以。作品可以變成只有圖片的專案作品集；對顧問而言，服務會變成提案，方案則變成套裝，案例頁以問題、做法與成果來敘述。
這是自由平面設計作品集，還是銷售網站？
兩者皆是。案例研究展示你的自由平面設計作品集，而方案頁與需求表單則把訪客變成付費專案。它也適合作為自由網頁設計師作品集：換掉作品範例，保留方案即可。