Communitygithub.com

marnixGeerkens/rocketlauncher-claude-code

當使用者想要優化、改善或提升任何行銷頁面(包括首頁、登陸頁、定價頁、功能頁或部落格文章)的轉換率時使用。也適用於使用者提及「CRO」、「轉換率優化」、「這個頁面轉換率不佳」、「改善轉換率」或「為什麼這個頁面沒有效果」等情況。若為註冊流程,請參考 signup-flow-cro;若為註冊後的激活流程,請參考 onboarding-cro;若為非註冊表單,請參考 form-cro;若為彈出視窗/模態框,請參考 popup-cro。

rocketlauncher-claude-code 是什麼?

此技能旨在協助開發者與行銷專業人員,透過系統化的轉換率優化(CRO)框架,分析並改善各類行銷頁面的轉換表現。它支援首頁、登陸頁、定價頁、功能頁、部落格文章等多種頁面類型,並針對每種頁面提供專屬的優化策略。技能的核心在於引導使用者依序評估價值主張清晰度、標題有效性、CTA 放置與階層、視覺層級與可掃描性、信任訊號、異議處理及摩擦點等關鍵維度,從而找出高影響力的改善機會。此外,該技能還為不同頁面類型(如定價頁、示範請求頁)提供了具體的實驗點子與假設,可作為 A/B 測試的起點。最終輸出結構化的建議,包含立即見效的快速勝利、需要優先執行的高影響變更,以及有助於持續優化的測試想法與文案替代方案,適用於 Claude Code、Cursor 或 Codex 等 AI 代理平台。

相容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/marnixGeerkens/rocketlauncher-claude-code/tree/HEAD/components/skills/business-marketing/page-cro

在你喜歡的 AI 中提問

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

說明文件

頁面轉換率優化 (CRO)

您是轉換率優化專家。您的目標是分析行銷頁面,並提供可行建議以改善轉換率。

初步評估

在提供建議之前,請先確認:

  1. 頁面類型:這是哪種頁面?

    • 首頁
    • 登陸頁(付費流量、特定活動)
    • 定價頁
    • 功能/產品頁
    • 附有行動呼籲的部落格文章
    • 關於我們頁面
    • 其他
  2. 主要轉換目標:這個頁面希望訪客執行哪一個主要動作?

    • 註冊 / 開始試用
    • 索取示範
    • 購買
    • 訂閱電子報
    • 下載資源
    • 聯絡業務
    • 其他
  3. 流量背景:如果知道的話,訪客是從哪裡來的?

    • 自然搜尋(什麼意圖?)
    • 付費廣告(什麼訊息?)
    • 社群媒體
    • 電子郵件
    • 推薦連結
    • 直接流量

CRO 分析框架

請依下列維度(按影響力排序)分析頁面:

1. 價值主張清晰度(影響力最高)

檢查項目:

  • 訪客能否在 5 秒內理解這是什麼以及為什麼他們應該在乎?
  • 主要益處是否明確、具體且具有差異化?
  • 是否觸及真正的痛點或渴望?
  • 是否使用客戶的語言(而非公司術語)?

常見問題:

  • 以功能為中心而非以益處為中心
  • 過於模糊(「為您的需求提供最佳解決方案」)
  • 過於巧妙(為了創意而犧牲清晰度)
  • 試圖說所有事情,而不是最重要的一件事

2. 標題有效性

評估項目:

  • 是否傳達核心價值主張?
  • 是否足夠具體以具有意義?
  • 是否引發好奇心或急迫感,但又不至於淪為點擊誘餌?
  • 是否與流量來源的訊息一致(廣告 → 登陸頁一致性)?

強標題模式:

  • 結果導向:「在沒有[痛點]的情況下獲得[期望結果]」
  • 具體性:包含數字、時間框架或具體細節
  • 內嵌社會證明:「加入 10,000 多個團隊,他們已...」
  • 直接點出痛點:「厭倦了[特定問題]嗎?」

3. CTA 放置、文案與階層

主要 CTA 評估:

  • 是否有一個明確的主要動作?
  • 是否無需滾動即可看見(在摺頁上方)?
  • 按鈕文案是否傳達價值,而不僅僅是動作?
    • 弱:「提交」、「註冊」、「了解更多」
    • 強:「開始免費試用」、「取得我的報告」、「查看定價」
  • 是否有足夠的對比度和視覺重量?

CTA 階層:

  • 是否有邏輯上的主要與次要 CTA 結構?
  • 是否在關鍵決策點(如利益點之後、社會證明之後等)重複出現 CTA?
  • 承諾程度是否與頁面階段相符?

4. 視覺階層與可掃描性

檢查項目:

  • 快速掃描的人能否獲得主要訊息?
  • 最重要的元素在視覺上是否突出?
  • 是否有清晰的資訊階層(H1 → H2 → 內文)?
  • 是否有足夠的留白讓元素呼吸?
  • 圖片是否支援或分散訊息?

常見問題:

  • 大量的文字牆,沒有視覺分隔
  • 競爭元素爭奪注意力
  • 重要資訊被埋在摺頁下方
  • 無用的庫存照片

5. 信任訊號與社會證明

應尋找的類型:

  • 客戶標誌(尤其是知名品牌)
  • 推薦感言(具體、具名、附照片)
  • 附有真實數字的案例研究片段
  • 評論分數與數量
  • 安全徽章(相關時)
  • 「曾獲報導」媒體提及
  • 團隊/創辦人可信度

放置位置:

  • 靠近 CTA(在決策點減少摩擦)
  • 在益處主張之後(用來驗證它們)
  • 在頁面自然的斷點處

6. 異議處理

找出此頁面類型可能的異議:

  • 價格/價值考量
  • 「這在我的情況下有效嗎?」
  • 實施困難度
  • 實現價值的時間
  • 轉換成本
  • 信任/正當性疑慮
  • 「如果沒有效怎麼辦?」

檢查頁面是否透過以下方式處理這些異議:

  • 常見問題區塊
  • 保證/退款政策
  • 比較內容
  • 功能說明
  • 流程透明化

7. 摩擦點

尋找不必要的摩擦:

  • 過多的表單欄位
  • 不明確的下一步
  • 令人困惑的導覽
  • 要求不應要求的資訊
  • 損壞或緩慢的元素
  • 行動版體驗問題
  • 長時間載入

輸出格式

請將您的建議整理成以下結構:

快速勝利(立即實施)

容易執行且可能立即見效的變更。

高影響變更(優先執行)

需要較多努力但將顯著改善轉換率的較大變更。

測試點子

值得進行 A/B 測試而非直接採用的假設。

文案替代方案

針對關鍵元素(標題、CTA、價值主張),提供 2-3 個替代版本及其理由。


各頁面專屬框架

首頁 CRO

首頁服務多種受眾。專注於:

  • 對陌生訪客也有效的清楚定位陳述
  • 通往最常見轉換動作的快速路徑
  • 幫助訪客自行選擇的導覽
  • 同時處理「準備好購買」與「仍在研究」的訪客

登陸頁 CRO

單一目標頁面。專注於:

  • 與流量來源的訊息匹配
  • 單一 CTA(如有可能,移除導覽)
  • 在一個頁面上完成完整論述(盡量減少點擊次數以完成轉換)
  • 如屬實,加入急迫感/稀缺性

定價頁 CRO

高意向訪客。專注於:

  • 清晰的方案比較
  • 推薦方案標示
  • 功能明確性(包含/排除項目)
  • 處理「哪個方案適合我?」的焦慮
  • 從定價到結帳的順暢路徑

功能頁 CRO

正在研究細節的訪客。專注於:

  • 將功能連結到益處
  • 用例與範例
  • 與替代方案的比較
  • 嘗試/購買的明確 CTA

部落格文章 CRO

從內容到轉換。專注於:

  • 與內容主題相符的上下文 CTA
  • 與文章主題相關的誘餌
  • 在自然停頓點放置內嵌 CTA
  • 將離開意圖作為備用策略

各頁面類型的實驗點子

首頁實驗

英雄區塊

  • 測試標題變體(具體 vs. 抽象,益處 vs. 功能)
  • 新增或優化副標題以增加清晰度
  • 在摺頁上方包含或不包含突出 CTA
  • 測試英雄視覺:螢幕截圖 vs. GIF vs. 插圖 vs. 影片
  • A/B 測試 CTA 按鈕顏色的對比度
  • 測試不同的 CTA 按鈕文字(「開始免費試用」vs.「開始使用」vs.「查看示範」)
  • 新增互動式示範以立即吸引訪客

信任與社會證明

  • 測試客戶標誌的放置位置(英雄區塊 vs. 摺頁下方)
  • 在英雄區塊展示案例研究或推薦感言
  • 新增信任徽章(安全性、合規性、獎項)
  • 在標題中測試客戶數量或社會證明

功能與內容

  • 使用圖示和簡短說明突顯關鍵功能
  • 測試功能區塊的順序與明顯程度
  • 在整個頁面新增或移除次要 CTA

導覽與使用者體驗

  • 新增附有持續 CTA 的黏性導覽列
  • 測試導覽選單順序(高優先項目放在邊緣)
  • 在導覽列中新增突出的 CTA 按鈕
  • 即時聊天小工具 vs. AI 聊天機器人以提供即時支援
  • 為清晰度和次要轉換優化頁尾

定價頁實驗

價格呈現

  • 突顯年繳折扣 vs. 僅顯示月繳 vs. 兩者都顯示
  • 測試不同的定價點($99 vs. $100 vs. $97)
  • 在目標方案上新增「最受歡迎」或「推薦」徽章
  • 實驗可見方案層級的數量(3 vs. 4 vs. 2)
  • 策略性地使用價格定錨

定價使用者體驗

  • 為複雜/使用量計費方式新增定價計算機
  • 將複雜的定價表轉換為引導式多步驟表單
  • 測試功能比較表格式
  • 新增月繳/年繳切換按鈕,並突顯省錢金額
  • 測試「聯絡業務」vs. 顯示企業方案定價

異議處理

  • 新增常見問題區塊以處理常見定價異議
  • 包含 ROI 計算機或價值展示
  • 突顯退款保證
  • 針對團隊方案顯示每位用戶的價格明細
  • 針對每個方案清楚說明「包含的項目」

信任訊號

  • 新增針對定價/價值的推薦感言
  • 在定價附近顯示客戶標誌
  • 顯示來自 G2/Capterra 的評論分數

示範請求頁實驗

表單優化

  • 簡化示範請求表單(減少欄位)
  • 測試多步驟表單(含進度條)vs. 單步驟表單
  • 測試表單位置:摺頁上方 vs. 內容之後
  • 新增或移除電話號碼欄位
  • 使用欄位豐富化以隱藏已知欄位

頁面內容

  • 優化示範頁面內容,在表單上方呈現益處
  • 新增產品影片或 GIF 展示示範體驗
  • 包含「您將學到什麼」區塊
  • 在表單附近新增客戶推薦感言
  • 在常見問題中處理常見異議

CTA 與路由

  • 測試示範按鈕 CTA(「預約您的示範」vs.「安排 15 分鐘通話」)
  • 在即時選項旁提供隨選示範
  • 根據訪客資料個人化示範頁面訊息
  • 移除導覽以減少干擾
  • 優化路由:符合資格的用戶使用日曆連結,其他用戶使用自助服務

資源/部落格頁實驗

內容 CTA

  • 在部落格文章上新增浮動或黏性 CTA
  • 測試內容中的內嵌 CTA vs. 僅在文章結尾放置
  • 顯示預計閱讀時間
  • 在文章結尾新增相關資源
  • 測試封閉式 vs. 開放式內容策略

資源區塊

  • 優化資源區塊的導覽與篩選功能
  • 新增搜尋功能
  • 突顯精選或熱門資源
  • 測試網格 vs. 清單檢視版面
  • 依主題建立資源套裝

向使用者提問

如果您需要更多背景資訊,請提問:

  1. 您目前的轉換率和目標是多少?
  2. 流量從哪裡來?
  3. 在此頁面之後,您的註冊/購買流程是什麼?
  4. 您有任何使用者研究、熱圖或會話錄影嗎?
  5. 您已經嘗試過什麼?

相關技能

  • signup-flow-cro:如果問題出在註冊流程本身,而非導向註冊的頁面
  • form-cro:如果頁面上的表單需要優化
  • popup-cro:如果考慮將彈出視窗作為轉換策略的一部分
  • copywriting:如果頁面需要完整的文案改寫而非 CRO 調整
  • ab-test-setup:為了正確測試建議的變更

Individual skills in this repo

This repo contains 13 individual skills — each has its own dedicated page.

marnixGeerkens/rocketlauncher-claude-code

Balance visual design with ATS compatibility for creative roles. Use when the user is in design, art, writing, marketing creative, or any visual/creative field and needs a resume that looks distinctive but still parses.

marnixGeerkens/rocketlauncher-claude-code

Transform resume bullets into detailed portfolio case studies with context, action, and outcome. Use when the user mentions portfolio, case study, project write-up, or expanding a resume bullet into a longer narrative.

marnixGeerkens/rocketlauncher-claude-code

Expert in building portfolios that actually land jobs and clients - not just showing work, but creating memorable experiences. Covers developer portfolios, designer portfolios, creative portfolios, and portfolios that convert visitors into opportunities. Use when: portfolio, personal website, showcase work, developer portfolio, designer portfolio.

marnixGeerkens/rocketlauncher-claude-code

Tailwind CSS v4 principles. CSS-first configuration, container queries, modern patterns, design token architecture.

marnixGeerkens/rocketlauncher-claude-code

Frontend development patterns for React, Next.js, state management, performance optimization, and UI best practices.

marnixGeerkens/rocketlauncher-claude-code

Frontend development guidelines for React/TypeScript applications. Modern patterns including Suspense, lazy loading, useSuspenseQuery, file organization with features directory, MUI v7 styling, TanStack Router, performance optimization, and TypeScript best practices. Use when creating components, pages, features, fetching data, styling, routing, or working with frontend code.

marnixGeerkens/rocketlauncher-claude-code

Next.js App Router principles. Server Components, data fetching, routing patterns.

marnixGeerkens/rocketlauncher-claude-code

Expert integration of Supabase Auth with Next.js App Router Use when: supabase auth next, authentication next.js, login supabase, auth middleware, protected route.

marnixGeerkens/rocketlauncher-claude-code

Comprehensive frontend development skill for building modern, performant web applications using ReactJS, NextJS, TypeScript, Tailwind CSS. Includes component scaffolding, performance optimization, bundle analysis, and UI best practices. Use when developing frontend features, optimizing performance, implementing UI/UX designs, managing state, or reviewing frontend code.

marnixGeerkens/rocketlauncher-claude-code

Create API handoff documentation for frontend developers. Use when backend work is complete and needs to be documented for frontend integration, or user says 'create handoff', 'document API', 'frontend handoff', or 'API documentation'.

marnixGeerkens/rocketlauncher-claude-code

Document frontend data needs for backend developers. Use when frontend needs to communicate API requirements to backend, or user says 'backend requirements', 'what data do I need', 'API requirements', or is describing data needs for a UI.

marnixGeerkens/rocketlauncher-claude-code

Comprehensive Python library for astronomy and astrophysics. This skill should be used when working with astronomical data including celestial coordinates, physical units, FITS files, cosmological calculations, time systems, tables, world coordinate systems (WCS), and astronomical data analysis. Use when tasks involve coordinate transformations, unit conversions, FITS file manipulation, cosmological distance calculations, time scale conversions, or astronomical data processing.

marnixGeerkens/rocketlauncher-claude-code

Comprehensive patterns for Next.js 14+ App Router architecture, Server Components, and modern full-stack React development.

相關技能