
效果預覽
相似的 Skills
查看所有 Skills你將獲得
- 已完成的 Fernwell Pharmacy 範例商店,共 31 個路由、14 項商品與 29 張圖片:首頁、商品目錄、商品頁、購物車、結帳、帳戶、說明、法律頁面與經過設計的 404。
- 可實際操作的藥局流程:處方箋上傳、可選藥師與時段的諮詢預約、Fernwell Card 會員制、配送區域選擇器、迷你購物車、優惠碼與示範結帳。
- 你的商店打包成單一離線檔案,內嵌 Bricolage Grotesque、Geist 與 Geist Mono,並附上 Agent 據以建置的風格規則、含提示詞的圖片規劃與檢查清單。
適合
- 想開設可處理處方箋與藥師諮詢之網路商店的獨立藥局與藥妝店。
- 需要資訊密集、親切且有優惠活動商品目錄的保健、營養補充品與健康宅配商店。
- 只販售少量商品、希望預約與會員頁面使用同一套視覺系統的診所。
不適合
- 接收真實訂單或付款:在接上後端之前,結帳、預約、上傳與登入都只是示範。
- 醫療功效宣稱:商品文案僅限於標籤式的事實,也絕不會捏造登記或認證資訊。
- 想要深色或低彩度風格的品牌;這套設計以萊姆綠、海軍藍與粉彩色磚為主。
電商上架與轉換網頁設計與數位體驗建置網頁建置網路商店風格鎖定成果可編輯森林頁尾帶灰色產品卡片萊姆 Hero 外框海軍藍膠囊按鈕粉彩磁磚
關於此 Skill

開一間第一眼就讓人信賴的明亮線上藥局:萊姆綠 Hero 框中是海軍藍標題 Get well.,藥師從底部探出身,旁邊是白色的上傳處方箋卡片。範例是 Fernwell Pharmacy,一家位於 Port Alder 的虛構社區藥局,共有 31 個相互連結的頁面與 29 張圖片。

你會得到
- 首頁包含粉彩分類磚、優惠、雙服務區、品牌、熱門分頁、促銷磚、使用者評價、配送追蹤、FAQ 與 App 推廣橫幅
- 附篩選、排序與搜尋的商品目錄,含包裝規格與口味的商品頁、迷你購物車側欄,以及示範用結帳流程
- 處方箋上傳、可選藥師、日期與時段的諮詢預約、Fernwell Card 會員制,以及配送區域選擇器
- 帳戶、說明、關於我們、聯絡、配送、隱私權與服務條款頁面,另有經過設計的 404
- 單一檔案,字型與圖片皆已嵌入,任何瀏覽器都能離線開啟

使用方式
- 提供藥局名稱、城市、配送區域、商品與價格,以及你提供的服務。
- Agent 會生成或放入商品照與人像,依你的商品清單填滿每個頁面,並在桌機與手機上檢查店面。
- 開啟檔案,把商品加入購物袋、試著預約,再用一般說法提出修改。

結帳、預約與上傳都會清楚標示不會收費、儲存或送出任何資料。用 Agent 圖像工具製作的新圖片可能產生該工具的使用費用。
開始前需要準備什麼
- 你需要提供
- 藥局名稱、城市、配送區域與營業時間 · 商品及其分類、價格、包裝規格與任何折扣 · 你提供的服務(處方箋、諮詢、會員制)與藥師資訊
- 相依項目
- Agent 所在電腦需安裝 Node.js 18 以上版本,用來執行內建腳本產生單一離線檔案 · 產生檔案時需要網路連線,以便下載一次字型並內嵌 · Agent 中的圖像生成工具,用於商品照與人像,或你自己的商品與員工照片
- 外部費用
- 商品照、分類磚與藥師人像由你的 Agent 自有圖像工具生成,可能產生該工具的使用費用。也可以改用你自己的商品與員工照片。
- 最近實測
- v1.0.2 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
使用者評價
正在載入評價…









