
效果預覽
相似的 Skills
查看所有 Skills你將獲得
- 22 個彼此連結的頁面:首頁、作品索引、四個案例研究、服務頁與三個詳情頁、關於、經歷、含四篇文章的日誌、聯絡、FAQ、電子報、隱私權與 404
- 塗鴉風格:Young Serif 標題、Figtree 內文、Kalam 手寫註記、淡紫色人像色塊、膠帶、箭頭,以及會自己畫出來一次的底線
- 實際可用的功能:報價試算、可搜尋與排序的作品篩選、案例研究預覽分頁、推薦輪播、FAQ 分頁與具驗證的表單,全部收在一個離線檔案裡
適合
- 想要一份有個性的作品集、而不是深色範本的前端開發者與產品設計師
- 能把作品對應到案例研究、服務與筆記的小型工作室、插畫家與獨立產品創作者
- 想先公開價格與流程、吸引更精準詢問的接案者
不適合
- 企業或正式風格的品牌;手寫註記與粉彩舞台刻意走輕鬆活潑路線
- 真正寄送訊息:聯絡與電子報表單只會在頁面上顯示確認,需要你自己的後端才能寄出
- 沒有人物可主打的網站;Hero 是圍繞人像與名牌設計的
品牌設計與視覺規範網頁設計與數位體驗建置作品集網站風格鎖定成果可編輯塗鴉 Hero手寫便條身分便條肖像舞台
關於此 Skill

把你的作品變成一本像素描簿的作品集:暖米色底上的巨大鈷藍襯線標題、剪成淡紫色色塊並貼著膠帶名牌的人像,還有融入版面的手繪箭頭、小花與底線。範例網站共有 22 個彼此連結的頁面,整合成單一檔案,任何瀏覽器都能離線開啟。

你會得到
- 首頁包含關於、服務、精選作品、經歷、工作流程、工具箱、推薦、筆記與結尾 CTA
- 案例研究附桌機、手機與元件分頁的手繪產品預覽,另有可篩選、搜尋與排序的作品索引
- 服務頁有固定價格卡片,以及會隨選擇即時更新價格區間的報價試算
- 關於、經歷、含完整文章的日誌、FAQ、電子報、隱私權、聯絡頁,以及精心設計的 404
- Young Serif、Figtree、Kalam 與 Geist Mono 字型連同所有圖片都已內嵌,頁面不發出任何網路請求

使用方式
- 提供你的姓名、職稱、專案、服務與聯絡方式,有人像照的話也一併附上。
- Skill 會填滿每一頁,缺少的內容先以合理的暫代文案補上,並列出清單讓你確認。
- 開啟檔案,試試報價試算、篩選與表單,再用白話說出想修改的地方。

你沒有提供的照片與插圖,會由你的 Agent 圖像工具生成,該工具可能另有使用費用。
開始前需要準備什麼
- 你需要提供
- 你的姓名、職稱、所在地與簡短自我介紹,有人像照的話也一併提供 · 二到六個專案的需求簡介、關鍵決策與成果,以及你提供的服務與價格 · 選填:經歷、工具箱、推薦、文章與聯絡方式
- 相依項目
- Agent 所在電腦需安裝 Node.js 18 以上版本,用來執行內建腳本產生單一離線檔案 · 產生檔案時需要網路連線,以便下載一次字型並內嵌 · Agent 需具備圖像工具,用於生成人像、工作室與情境照片及日誌插圖;若自行提供則可省略
- 外部費用
- 你沒有提供的照片與插圖會用 Agent 本身的圖像工具生成,可能產生該工具的使用費用。產品預覽以程式碼繪製,完成的頁面不發出任何網路請求。瀏覽範例完全免費。
- 最近實測
- v1.0.2 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
使用者評價
正在載入評價…









