
效果預覽
相似的 Skills
查看所有 Skills你將獲得
- 以虛構品牌 Askel Cycles 為例的 35 個路由:六款車、四個分類、配件、比較、專欄、試乘、關於、聯絡、FAQ、配送、法律、購物袋、結帳與 404。
- 實際可用的購物流程:電池與車架尺寸規格選項、迷你購物車抽屜、可輸入優惠碼的購物袋、具驗證的示範結帳,以及絕不收款的訂單確認。
- 首頁工具(Hero 輪播、零件探索區、續航計算器、車店搜尋),另附風格指南、圖像規劃、照片配對腳本與內建檢查。
適合
- 想要具備真實商品細節的高質感商店前台的電動自行車、滑板車、貨運三輪車或輕型機車品牌。
- 擁有合作車店或展示間、提供試乘並需要預約與車店搜尋功能的品牌。
- 想在串接金流前,先檢視可運作的規格選項、購物袋、比較與結帳畫面的團隊。
不適合
- 接受真實訂單:結帳頁會清楚說明付款功能已關閉,在你串接自己的電商後端之前不會收取任何費用。
- 需要庫存同步或內容管理系統的大型商品目錄。
- 柔和粉彩或極簡風格的品牌;這套外觀仰賴飽和的橘色、窄體大寫字與深色面板。
品牌設計與視覺規範網頁設計與數位體驗建置網路商店風格鎖定成果可編輯單車分類單車控制單車 Hero資料輪播
關於此 Skill

帶上你的車款陣容,Skill 就會打造完整的商店前台:橘色棚拍 Hero、粗體窄字標題、深色分類卡片,以及出自同一套協調照片的石色調商品卡片,購物流程也真的能用。完整範例是虛構品牌 Askel Cycles,共有 35 個彼此連結的路由。預設成果是一個自足檔案,任何瀏覽器都能離線開啟。

你會得到
- 首頁包含 Hero 輪播、分類卡片、車款陣容、零件探索區、續航計算器、評價、試乘據點搜尋、專欄與 FAQ
- 商品頁具圖庫、電池與尺寸規格選項、依身高推薦的尺寸小幫手、規格表與相關商品
- 購物袋、含配送選項與訂單確認的示範結帳,另有比較、配件、配送、法律與聯絡頁
- Anton、Archivo 與 Geist Mono 字型內嵌於檔案中,不會從網路載入任何內容

使用方式
- 提供你的車款、價格、規格、分類、市場設定(幣別、稅務、郵遞區號),以及任何合作車店。
- 你的 Agent 會填入商品目錄、生成風格一致的照片,並檢查每個路由與連結。
- 在桌機與手機上點過規格選項、購物袋、結帳與試乘預約,再提出修改。

生成新的商品照片可能產生你圖像工具的使用費用。結帳與預約只會誠實顯示示範用確認畫面,在串接真實服務之前不會送出任何內容。
開始前需要準備什麼
- 你需要提供
- 品牌名稱、四個字以內的標語,以及你的市場設定(幣別、稅務、郵遞區號) · 含價格、規格、規格選項與分類的車款,若有販售配件也一併提供 · 合作車店或展示間、聯絡方式,以及你擁有的任何商品照片
- 相依項目
- Agent 所在電腦需安裝 Node.js 18 以上版本,用來執行內建腳本產生單一離線檔案 · 產生檔案時需要網路連線,以便下載一次字型並內嵌 · 需要具備 NumPy 與 Pillow 的 Python,用於裁切與配對商品照片的腳本 · Agent 需具備圖像生成工具,用於生成新的自行車與生活情境照片
- 外部費用
- 用 Agent 的圖像工具生成自行車與生活情境照片,可能產生該工具的使用費用。圖像規劃包含適合小預算的最低配置,部分配件與特寫圖片也可重複使用。
- 最近實測
- v1.0.2 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
使用者評價
正在載入評價…









