Meridian 行銷登陸頁v1.0.3
使用這個 Skill：建置網頁。
人氣上升
5.032 次下載0 個喜歡0 次收藏
$4.99
購買這個 Skill 可以得到什麼？打造高質感的 SaaS 行銷網站：白色與鋅灰頁面、單一青綠強調色，以及促銷 Banner 下方的深色膠囊導覽列。Hero 下方的即時產品 Dashboard 會在捲動時從透視傾斜彈回平面，接著是由可運作的迷你產品畫面組成的深色 Bento 區塊、客戶故事、使用者評價、可切換月付與年付的定價、資安、FAQ 與深色 CTA 區塊。另附註冊、登入、預約展示、更新日誌、案例研究與法律頁面，全部收在單一獨立檔案中。
更新於 2026年10月3日
效果預覽
相似的 Skills
查看所有 Skills
你將獲得
- 一個完成的範例網站，主角是虛構的配送分析產品 Parcelo：登陸頁加上註冊、登入、預約展示、更新日誌、案例研究、資安、隱私權、服務條款與 404 頁面。
- 以你產品用語呈現的即時產品 UI：可切換區間與滑過圖表的 Dashboard、Bento 中的迷你畫面、步驟 Tab、會把方案帶進註冊流程的計費切換，以及附驗證的表單。
- 你的網站收在單一離線檔案中，內嵌 Onest 與 JetBrains Mono 字型，另附 Agent 建構時依循的風格指南、圖片規劃、動態規則與檢查清單。
適合
- 推出 SaaS 產品、想要沉穩可信且以產品為主角之頁面的創辦人與行銷人員。
- 最好的證明就是產品本身的分析、營運或開發者工具。
- 需要定價、資安、更新日誌與註冊頁面，而不只是一個 Hero 的團隊。
不適合
- App 原型或由 CMS 驅動的網站：它建構的是內頁固定的行銷網站，而不是可運作的產品。
- 想要繽紛配色或深色模式切換的品牌；meridian 是淺色主調，搭配深色區塊與單一青綠強調色。
- 真正的註冊、付款或數據分析：在你串接後端之前，表單只會在頁面上驗證並顯示確認。
新品上市與 App 成長網頁設計與數位體驗建置網頁建置 Landing Page風格鎖定成果可編輯轉換導向暗色膠囊導覽明暗節奏透視樣機青綠點綴極簡
關於此 Skill
描述你的產品，就能得到一個沉穩、以產品為主角的 SaaS 網站：白色頁面搭配單一青綠強調色、深色膠囊導覽列，以及一個以透視角度向後傾、捲動時彈回平面的即時 Dashboard。範例是 Parcelo，一款虛構的配送分析工具，能在客戶詢問前就標記出延遲的包裹。
你會得到
- 一個登陸頁，包含 Banner、膠囊導覽列、Hero Dashboard、深色功能 Bento、設定步驟、客戶故事、使用者評價、定價、資安、FAQ 與深色 CTA 區塊
- 註冊、登入、預約展示、更新日誌、案例研究、資安、隱私權與服務條款頁面，外加一個精心設計的 404
- Bento 中的迷你產品畫面呈現你自己的產品物件，而不是素材庫截圖
- 月付與年付定價切換、具錯誤與成功狀態的表單，以及可篩選與搜尋的更新日誌
- 字型與照片都已內嵌的單一檔案，任何瀏覽器都能離線開啟
使用方式
- 提供產品名稱、產品用途、功能、方案，以及 Dashboard 要顯示的內容；粗略的筆記就夠了。
- 你的 Agent 會把所有 Dashboard 標籤改成你產品的物件名稱，填好每個區塊與頁面，並在桌面與手機上檢查。
- 打開這個單一檔案，逐頁點擊瀏覽，再用日常語言提出修改需求。
用 Agent 的生圖工具製作照片可能會產生該工具的使用費用；若沒有生圖工具，則以著色色塊與字母頭像代替。
開始前需要準備什麼
- 你需要提供
- 產品名稱、一句話承諾與目標受眾 · 功能、含月付與年付價格的方案，以及 Dashboard 要顯示的內容 · 選填：客戶故事、評價引言、FAQ 解答、資安說明與更新日誌項目
- 相依項目
- Agent 所在電腦需安裝 Node.js 18 以上版本，用來執行內建腳本產生單一離線檔案 · 產生檔案時需要網路連線，以便下載一次字型並內嵌 · Agent 內建的生圖工具，用於故事、團隊與頭像照片（選用；沒有時改用著色色塊與字母頭像）
- 外部費用
- 故事、案例研究、團隊與頭像照片會在可用時由你的 Agent 自帶的生圖工具生成，可能產生該工具的使用費用。若沒有圖片來源，則改用著色色塊與字母頭像。
- 最近實測
- v1.0.3 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
使用者評價
正在載入評價…