你會得到
- 一個 HTML 檔，字型與圖片都已內嵌，不發出任何網路請求
- Shader 首屏、客戶跑馬燈、工作室橫帶、錯落的作品格，以及可搜尋的作品索引
- 每個個案研究各有一頁，另有電子報、隱私權、服務條款與找不到頁面
- 服務分頁、附幣別切換的合作方案、報價、團隊、FAQ 與專案委託表單
- 可選：工作室、個案與團隊照片，以及個案卡循環，報價後以 PopNow 生成
適合
- 設計、品牌、網站、動態與 3D 工作室
- 有真實案例可展示的自由工作者與小型顧問公司
- 想要沉穩、高端作品集的建築與室內設計事務所
不適合
- 線上商店或以深色、霓虹為主的品牌
- 需要在標題後放照片或影片的頁面
- 沒有完成作品可展示的網站
怎麼用
在 Claude 或 ChatGPT 裡
用 PopNow 的技能「Shader 首屏設計公司網站」（creative-agency-website）幫我做這件事：為 Quarrow 製作網站，這是位於波爾圖的四人品牌與網站工作室。專案：一個陶瓷店的重新上線、一個渡輪時刻表應用，以及一個麵包店的品牌識別。合作方案：Sprint、Launch、Retainer。
在程式 Agent 裡
/popnow-creative-agency-website 為 Quarrow 製作網站，這是位於波爾圖的四人品牌與網站工作室。專案：一個陶瓷店的重新上線、一個渡輪時刻表應用，以及一個麵包店的品牌識別。合作方案：Sprint、Launch、Retainer。
接著試試
生成任何內容前，先報價三個個案研究的照片與團隊網格。
把渡輪個案卡從主視覺做成慢速影片循環，先告訴我價格。
需要準備
- 工作室名稱、一句話的定位、城市與聯絡資訊
- 兩到六個專案，附委託內容、你做了什麼與一個可衡量的結果
- 服務項目、客戶如何委託你，以及領導團隊的人
- 可選：PopNow API 金鑰，或你自己的工作室與專案照片
類似技能
查看全部 →3D 頭像製作器
+3在瀏覽器裡捏出可愛的絨毛玩偶風 3D 角色，存成透明背景 PNG 或 3D 網頁。
日曆熱力圖
+3把一整年的每日活動畫成深淺不一的日曆格，附連續天數、總計與鍵盤操作。
AI SaaS 登陸頁
+3溫暖的沙色紙張，細線軌道與斜線溝槽環繞一個可操作的看板，助手在上面規劃任務。
動態 Hero 主視覺區塊
+3登陸頁的首屏主視覺：標題裡有一個輕輕輪替的詞，搭配兩顆按鈕和寬幅圖片框。
深色 SaaS 登陸頁
+3深色、動態豐富的軟體產品行銷網站，以單一獨立 HTML 檔交付。
設計師作品集網站
+3六張微傾的卡片圍繞著淡出的標題，灰底上一張紅色人像卡，搭配編輯風格的個案研究。
工程師作品集網站
+3給工程師的深色個人網站，含專案案例、文章、演講、履歷與聯絡表單。
編輯風 SaaS 網站
+3深藍的分割首屏，五行襯線標題旁是紀實照片，斜切色帶與一個鈷藍強調色。
玻璃擬態網站範本
+3近黑底片上的磨砂玻璃膠囊，巨大的襯線標題中有一個斜體字，外加電子郵件訂閱。
硬體產品網站
+3超大的細線型號名稱落在銀色攝影棚照片上，搭配磨砂規格卡、等比例的產品陣容與硬體 bento 版面。
互動式系統架構圖
+3以經過檢查的 JSON 模型產生、可離線點擊的系統架構圖，每個方塊都附上依據。
互動網格首屏
+3近黑的細線網格，會朝游標彎曲，並在每次點擊時向外擴散一圈發光的環。
知識圖譜瀏覽器
+3把專案筆記變成可離線搜尋的圖譜，每一項說法都能連回原始出處那一行。
KPI 儀表板範本
+3暖紙底上的四個 KPI 方塊附變化標籤，搭配發光折線圖、拆解表格與目標進度條。
從 AI 樣稿做登陸頁
+3先看三套完整頁面的設計稿、挑一套，你的 Agent 就會把它做成乾淨、響應式的程式碼。
雜誌網站範本
+3印刷品質的雜誌網站，含文章、主題、小型商店與訂閱，全部在一個 HTML 檔裡。
粒子動畫首屏
+3暖紙色底上的文案，旁邊是一顆轉動的墨色與青綠色點狀球體，會依每個概念變形，並在捲動時散開。
個人品牌網站
+3一張羽化進溫暖紙面的人像，上方是細線框，兩側是輕與重的宣言。
電影感產品上線頁
+3電影打光的近黑頁面：襯線標題卡漂浮在流動的光中，搭配信箱式夜景與預約表單。
後台管理儀表板範本
+3可實際操作的後台主控台，含圖表、表格、看板與行事曆，以單一離線 HTML 檔打造。
SaaS 登陸頁範本
+3沉穩、明亮的軟體產品行銷網站，附可操作的產品主控台、定價與註冊。
手帳風作品集網站
+3由紙本物件構成的多頁線上履歷，附專案案例與可列印的履歷。
球鞋商店網站範本
+3完整的鞋類或服飾商店，含商品目錄、商品頁、購物車與示範結帳，全部在一個 HTML 檔裡。
工作流程自動化登陸頁
+3石墨色頁面，左側是小型的靠左標題，下方是即時的節點圖，會執行、重試並串流顯示日誌。
常見問題
Shader 會拖慢頁面嗎？
它會以降低的解析度渲染，並限制像素比；當首屏離開畫面或分頁被隱藏時會暫停；在減少動態效果的設定下，則只顯示一張靜態畫面。底下還有一個同樣風格的 CSS 版本，即使沒有 WebGL，頁面也看起來完整。
PopNow 在這裡會生成什麼？
工作室橫帶、每個個案研究與團隊的照片，全部採同一種藝術指導；另外還有選用的慢速循環，可以取代某一張個案卡的靜態圖。首屏本身是程式碼，不需要任何素材。每次執行都會以點數報價，你同意後才開始。
沒有 PopNow API 金鑰也能用嗎？
可以。內建的工作室照片可以保留為中性的替代圖，個案媒體可以改成各客戶配色的 CSS 面板，報價則使用姓名縮寫頭像。技能會列出仍需要真實照片的插槽。
可以更換橘色強調色嗎？
可以，透過少數幾個變數與 Shader 的配色預設即可。頁面只保留單一強調色，並避開紫色與紫羅蘭色調，這一點驗證工具會檢查；你專案中的品牌 DESIGN.md 會對應到這些變數。