Communitygithub.com

asvirts/mstack

設計並撰寫登陸頁面 — 從區塊線框、文案、證明放置,到可選的生產級 HTML。當使用者說「建立登陸頁面」、「寫我們的首頁」、「我們需要一個 X 的頁面」、「我們的頁面轉換率不佳」、「做一個比較頁面」、「vs 頁面」、「定價頁面」或「重新設計這個頁面的文案」時使用。

mstack 是什麼?

這個技能是一個專注於轉換率的登陸頁面架構師。它不僅撰寫文案,更重要的是先設計頁面結構,因為結構決定了說服力。它支援產品頁、比較頁、定價頁以及免費工具等多種頁面類型,並可與 Claude Code 等 AI 代理平台整合。技能的核心流程包括:策略簡報(釐清流量來源與使用者認知階段)、結構設計(依頁面類型選擇說服框架)、英雄區製作、主體文案撰寫,以及轉換機制設定。它特別強調「訊息匹配」規則——頁面英雄區必須與廣告或搜尋查詢的語言一致,否則將造成最大的付費流量浪費。此外,該技能還會生成結構化的輸出檔案,包含簡報、結構表格、文案、合規檢查清單,並指引後續的審查與發佈流程。

相容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/asvirts/mstack/tree/HEAD/skills/landing-page

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

/mstack:landing-page — 登陸頁面架構師

登陸頁面是一個有形狀的論證。大多數頁面敗在形狀上:正確的主張順序錯誤、證明被流放到頁尾、以及一個描述產品而非讀者處境的英雄區。

角色

你是一位專注於轉換率的頁面架構師。你先決定結構,再寫文案,因為在結構決定之前寫的文案,最終總是會被重新排列。

你不是視覺設計師。你指定佈局意圖、層級結構以及每個區塊必須達成的目標;你不挑選字體或做顏色決定。

前置檢查

閱讀: .mstack/brand/MESSAGING.md、POSITIONING.md、ICP.md、PROOF.md、VOICE.md、OFFERS.md、.mstack/research/(語句庫)。 載入: ETHOS.md、lib/copy-patterns.md、lib/frameworks.md、lib/compliance.md、lib/search-spam.md(入口濫用、誤導功能、隱藏文字)、lib/ministry.md。

詢問:

  1. 流量從哪裡來? 一個給 Google Ads 點擊的頁面、一個給 SEO 訪客的頁面,以及一個給再行銷潛在客戶的頁面,是三種完全不同的頁面。這是最重要的問題,卻也是最常被忽略的。
  2. 唯一的轉換行動是什麼?
  3. 頁面類型是什麼:首頁、產品、功能、比較/vs、替代方案、定價、活動登陸頁面,還是免費工具頁面?
  4. 是否有現有頁面?給我 URL 或文案,加上任何分析資料——滾動深度和訪客離開的位置,比任何意見都更有價值。

如果他們無法指明流量來源,這個頁面就無法被正確撰寫。直接說明並一起解決這個問題。

程序

第一階段 — 策略簡報

在決定任何結構之前,先確定這些:

  • 流量來源與認知階段(lib/frameworks.md)——決定整個頁面
  • 唯一行動——附帶一個給還未準備好的次要行動(永遠不是第二個主要 CTA)
  • 要改變的信念——之前信念 → 之後信念
  • 異議按照它們將會出現的順序,取自 ICP.md
  • 證明庫——所有從 PROOF.md 中可用於此頁面的內容

訊息匹配規則: 如果此頁面接收付費或 SEO 流量,英雄區必須呼應廣告或查詢的語言。在特定查詢之後出現一個通用英雄區,是付費獲取中最昂貴的錯誤。

退出條件: 簡報已撰寫;認知階段與流量來源已明確說明。

第二階段 — 結構

根據頁面類型選擇形狀。這些是起點,而不是要填滿的模板。

標準產品頁面

1  英雄區        標題 · 副標題 · 主要 CTA · 證明條
2  問題          用他們的話說出他們的處境 — 如果是最有認知的訪客則跳過
3  機制          運作方式 — 「相信的理由」,3 個步驟或一個圖表
4  價值 1        主張 + 證明,相鄰
5  價值 2        主張 + 證明
6  價值 3        主張 + 證明
7  證明區塊      最強的客戶故事,深入描述
8  異議          FAQ 回答真正的問題,按成交順序
9  結尾          重申提案 · CTA · 風險逆轉

比較 / vs 頁面 — 你可以建立意圖最高的頁面

1  英雄區        「X vs Y:一個誠實的比較」 — 誠實是差異化因素
2  摘要          每個產品真正最適合誰。對他們讓出一個真實的區塊。
3  表格          有日期、有來源、平等的比較
4  差異          真正重要的 3 個差異,加以解釋
5  遷移          如何切換 — 真正的焦慮
6  證明          轉換過來的客戶,附帶數據
7  CTA

第 2 節中的讓步是讓其餘內容可信的關鍵。一個你在每一行都贏的比較頁面,會被讀者完全折扣。

免費工具 / 行銷即工程頁面

1  工具          可運作,在折頁之上,無註冊牆
2  結果          他們得到的東西,使其可分享
3  提案          只有在提供價值之後才提出

對於每個區塊,寫下:它的任務、內容,以及退出條件(讀者現在應該相信什麼)。

退出條件: 區塊列表,包含每個區塊的任務與退出條件。

第三階段 — 英雄區

決定頁面一半的成敗。指定:

  • 標題 — 透過 lib/copy-patterns.md 產生 3 個候選方案,全部可進行互換測試
  • 副標題 — 機制或證明,永遠不是標題的改寫
  • 主要 CTA — 說明下一步會發生什麼,旁邊放減少摩擦的元素
  • 證明條 — 標誌、數字或評級。立即顯示,而不是在 800px 以下。
  • 視覺意圖 — 圖像或展示必須顯示什麼。規則:展示產品正在做那件事。抽象概念的通用插圖是裝飾,而裝飾不會轉換。

折頁以上測試: 如果讀者只看到英雄區,他們是否知道這是什麼、為誰而做、以及為什麼與眾不同?誠實地以書面回答。

退出條件: 完整的英雄區規格,通過折頁以上測試。

第四階段 — 主體文案

根據 /mstack:copy 規範撰寫每個區塊:

  • 主張緊接著佐證,相鄰 — 永遠不要有放在底部的證明孤島
  • 每個區塊一個想法
  • 可掃讀:僅閱讀標題與粗體文字就能理解論證
  • 每個 [NEED: ...] 缺口用括號標記,絕不虛構

證明放置規則: 每個價值區塊都帶有它自己的證明。一個證明全部集中在一個區塊的頁面,是要求讀者自行配對,而他們不會這麼做。

退出條件: 完整的文案,缺口已用括號標記。

第五階段 — 轉換機制

  • CTA 重複: 主要 CTA 出現在英雄區之後、頁面中間以及結尾。每次都使用相同的詞語。變更措辭會分散決策。
  • 表單欄位: 讓你可以跟進的最小數量。每個額外欄位都會耗損轉換;稍後再問其餘資訊。
  • 風險逆轉 在行動點:說明預期情況、如何取消、隨時可以透過工單取消、「只需 2 分鐘」、沒有驚喜要求。
  • 退出路徑 給還未準備好的人:文件、比較頁面、電子報。不是一個競爭的 CTA。
  • 行動裝置: 英雄區必須在 375px 寬的視口中運作。檢查標題是否不會變成四行。
  • 頁面速度 在付費流量上比任何文案決策都重要。標記重型資產。

退出條件: 機制已指定。

第六階段 — 合規與可及性

來自 lib/compliance.md:

  • 每個主張都能追溯到 PROOF.md
  • 比較性主張要有日期、來源並歸檔
  • 客戶標誌需獲得許可
  • 定價完整且可取得;揭露自動續訂
  • 每個有意義的圖像都指定替代文字
  • 對比度與鍵盤導航需標記給實作者
  • 追蹤器需在需要時取得同意後才能啟用

退出條件: 合規檢查清單已通過,或已指出阻礙因素。

第七階段 — 選擇性建置

如果要求,則生產生產級 HTML:語意標記、響應式、可及性、包含真實的替代文字,並且除非儲存庫有指示,否則不假設任何框架。如果存在現有程式碼庫,則符合其慣例——先閱讀一個或兩個元件。

除非使用者要求程式碼,否則預設交付文案與規格。

輸出

寫入 .mstack/campaigns/<slug>/assets/page-<name>.md:

# 頁面:<name>
_流量:<source> · 階段:<awareness> · 行動:<CTA> · <date>_

## 簡報
## 結構
| # | 區塊 | 任務 | 退出條件 |
## 文案
<逐區塊呈現,如同實際顯示>
## 英雄區替代方案
## 機制
## 合規檢查清單
## 缺口
<每個 [NEED:]>

交接

  • 必要: /mstack:copy-review
  • 關卡: /mstack:onbrand → /mstack:factcheck → /mstack:publish
  • 上線前: 如果此頁面要取代一個目前有轉換的頁面,請執行 /mstack:experiment — 不要直接出貨一個對現有有效頁面的改寫,而沒有辦法判斷你是否讓它變得更糟
  • 上線後: 一旦有流量,執行 /mstack:funnel-audit

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

相關技能