香港很多做顧問、教練、課程、專業服務的人，都會遇到同一個情況。

產品有、專業有、成果也有，但 marketing infrastructure 一直建立不起來。

例如：

• Landing Page 不知道如何設計
• 網站修改需要找 designer
• A/B Test 不會做
• SEO Lead Magnet 不知道如何建立
• 每一件事都需要手動完成

結果就是：

很多營銷工作其實都停留在「手動模式」。

現在 AI 的出現，讓這件事出現了一個新可能。

Google Antigravity 是一個 AI 編程工具，可以讓使用者用自然語言建立網站、工具和互動功能。

如果用對方式，它不只是幫你建立一個頁面，而是可以幫你建立一整條營銷流程。

這篇文章會拆解三個實際可應用的做法：

1. 建立高轉換 Landing Page
2. 建立 SEO 免費工具吸引搜尋流量
3. 使用 AI 做 Hero Section A/B Test 優化轉換率

同時附上可以直接使用的 Prompt Template。

方法一：用 Plan Mode 建立高轉換 Landing Page

Antigravity 一個非常重要的功能是 Plan Mode。

Plan Mode 不會立即生成 code，而是先生成一份 Implementation Plan。

計劃書通常會包含：

• 頁面結構
• Section 排列
• UI component
• 功能邏輯

當你確認計劃之後，AI 才會開始生成網站。

這一步能大幅減少重做的情況。

如果直接生成頁面，AI 有機會理解錯需求，導致：

• Layout 不理想
• CTA 位置不對
• Mobile 版本需要重新調整

透過 Plan Mode，通常只需要 30 秒 review 就能避免這些問題。

一個高轉換 Landing Page 的基本結構

Hero Section

Hero Section 是訪客進入頁面時第一眼看到的部分。

它需要快速回答三個問題：

• 這是什麼產品或服務
• 適合哪一類人
• 下一步應該做什麼

Curriculum 或 Program Structure

如果是課程、Bootcamp 或 Coaching 產品，

清楚的結構可以提升可信度。

例如：

Week 1 – Career Clarity
Week 2 – Skills Mapping
Week 3 – Strategy Design
Week 4 – Positioning
Week 5 – Execution
Week 6 – Career Transition Plan

Social Proof

見證可以增加信任。

通常包括：

• 使用者照片
• 簡短 quote
• 職位或身份

FAQ Section

FAQ 的作用是處理常見疑問。

例如：

• 是否適合未轉工人士
• 課程時間安排
• 是否需要相關背景

Final CTA Section

頁面底部需要一個清晰 CTA。

這個 section 通常會再次強調 transformation。

[IMAGE：Landing page wireframe showing hero, timeline, testimonial and CTA sections]

Landing Page Prompt Template

以下 Prompt 可以直接用於 Antigravity：

You are a senior conversion-focused web designer and front-end developer.

Help me build a high-converting landing page for a program called:

Career Reset Bootcamp

Target audience:
Hong Kong working professionals aged 30-45 who feel stuck in their career and want clarity and direction.

Business goal:
Generate sign-ups for a paid 6-week bootcamp.
Primary CTA: Book a Free 15-Min Career Consultation.

Requirements:

1. Full-screen Hero Section
  - Strong emotional headline
  - Supporting subheadline
  - Primary CTA button
  - Background gradient (deep navy to warm orange)

2. 6-week curriculum timeline section
  - Vertical or horizontal interactive timeline
  - Week 1 to Week 6 clearly structured
  - Each week with short outcome description

3. 3 testimonial cards
  - Placeholder image
  - Quote text
  - Name + job title

4. FAQ section
  - 6 common questions
  - Accordion expandable format

5. Final CTA section
  - Orange button
  - High contrast
  - Reinforce transformation promise

IMPORTANT:
First generate a detailed implementation plan outlining all sections, structure, UI components, and logic before writing any code.
Wait for my approval before building.


方法二：建立 SEO 免費工具吸引搜尋流量

很多 Landing Page 最大問題不是設計，而是 沒有流量。

如果不打算一開始就投放廣告，一個有效的方法是建立 免費工具型 Lead Magnet。

原因是工具比普通文章更容易：

• 排上 Google
• 被分享
• 留住訪客
• 轉換 CTA

SEO 工具頁面常見結構

問卷或互動流程

例如：

10 條問題
每題 1–5 分

每一頁只顯示一條問題，可以提升完成率。

分數系統

結果需要清晰。

例如：

0–40 探索期
41–70 轉型期
71–100 加速期

AI 個人化建議

利用 AI 可以生成簡短建議。

這樣可以增加工具價值。

結果頁面

結果頁通常包括：

• 分數
• 類別
• 建議

同時可以引導下一步行動。

SEO 結構

工具頁同樣需要基本 SEO：

• Title Tag
• Meta Description
• FAQ Schema
• Keyword placement

免費工具 Prompt Template

You are a product designer and full-stack developer.

Help me build a web-based interactive tool called:

Career Clarity Score – Free Online Assessment Tool

Target audience:
Hong Kong professionals aged 28-45 who feel stuck in their career.

Tool Objective:
Generate organic search traffic and convert users into consultation bookings.

Functional Requirements:

1. Questionnaire UI
- 10 career satisfaction questions
- Each question scored from 1 to 5
- Slider input
- One question per screen

2. Scoring Logic
Total score range: 10–50
Convert to 100 scale

3. Classification
0–40 探索期
41–70 轉型期
71–100 加速期

4. AI Advice
Generate personalized career advice using Gemini API.

5. Results Screen
Show score, category and AI advice.

IMPORTANT:
First generate a full implementation plan including UI structure and logic before writing any code.
Wait for approval.


方法三：用 AI 做 Hero Section A/B Test

很多網站轉換率低的原因不是流量。

而是 頁面內容沒有優化。

例如如果 Landing Page conversion rate 只有 1.8%：

代表：

100 人進入
只有約 2 人點擊 CTA。

透過測試不同版本的內容，通常可以找到更有效的版本。

Hero Section 是最值得測試的位置

Hero Section 會影響：

• 第一印象
• 停留時間
• CTA 點擊率

常見 Hero 測試角度

Fear of Missing Out

香港職場正在變
你是跟著變，還是被淘汰？

Social Proof

450+ 香港專業人士成功轉型

Curiosity Gap

為什麼 MBA 已經不再足夠？

透過測試不同心理 trigger，可以找出最有效的版本。

Hero Section A/B Test Prompt

You are a senior CRO (Conversion Rate Optimization) strategist.

Context:
My landing page conversion rate is 1.8%.

Target audience:
Hong Kong professionals aged 30-45.

Goal:
Increase consultation booking rate.

Generate 3 Hero Section variations.

Psychological angles:

Version A: Fear of Missing Out
Version B: Social Proof
Version C: Curiosity Gap

Each version must include:
- Headline
- Subheadline
- CTA Button copy
- Psychological trigger explanation

After generating copy, also provide updated Hero HTML snippet.

Do NOT write full page.
Only Hero section.

First outline your strategy logic before generating the versions.


將三個元素組合成完整營銷流程

當這三個元素結合，就會形成一條完整流程：

Search Traffic
↓
免費工具
↓
Landing Page
↓
預約或報名

這樣的流程可以持續吸引流量，同時逐步提升轉換率。

如果你需要，我可以再幫你 進一步優化這篇文章三個關鍵地方：

1️⃣ 做 SEO版標題（更容易上 Google）
2️⃣ 設計 Content Upgrade Lead Magnet
3️⃣ 重寫 開頭 Hook（CTR 通常可提升 30-70%）

這三個優化通常可以讓整篇文章的 搜尋流量提升 2–4 倍。

‍