Loading
產業類別
個人健身教練
專案類型
一頁式個人品牌網站
技術架構
Next.jsTailwind CSSRWD
服務範圍
品牌視覺定調網站設計前端開發RWD 響應式設計
Screens
網站實際畫面
桌機版PETER 個人教練網站首屏：教練形象、定位說明與體驗諮詢按鈕 
桌機版課程方案區塊：整理教學方式、方案內容與上課地點 
手機版手機版一頁式流程：由自我介紹依序帶到方案與聯絡方式
Overview
專案背景
PETER 是一位擁有多年教學經驗的個人健身教練。過去他的學員來源主要仰賴口碑轉介與社群經營，但社群版面難以完整呈現教學理念與服務內容，潛在學員往往需要來回私訊，才能拼湊出完整的資訊。
這個專案的目標，是為 PETER 打造一個像「數位名片＋招生簡章」的一頁式網站：讓陌生訪客在幾分鐘內認識他的教學風格、服務方案與學員回饋，並且能直接發起諮詢。
Challenge
需求與挑戰
從社群形象到品牌識別
既有素材多為隨手拍攝的社群照片，需要重新定調視覺風格，讓網站呈現一致、可信賴的專業感。
在單頁內完成信任建立到轉換
訪客從「不認識」到「願意諮詢」的心理路徑，必須在一個頁面內完整走完，內容的順序與節奏至關重要。
行動端是主要戰場
幾乎所有流量都來自社群個人檔案的連結點擊，手機版的瀏覽體驗直接決定成效。
Solution
解決方案
敘事式招生動線
版面依「理念 → 服務方案 → 客戶見證 → 諮詢」鋪排，模擬一場完整的初次諮詢對話，隨著捲動逐步累積信任。
個人品牌視覺定調
以教練本人的專業形象照為視覺主軸，搭配沉穩的色彩與大量留白，塑造可信賴的專業感。
明確的單一行動呼籲
全站聚焦「發起諮詢」這一個目標，每個段落自然收斂到諮詢入口，避免訪客在頁面中迷失。
Highlights
網站亮點
教練理念
用第一人稱敘事呈現教學哲學，讓訪客在見面之前先認識「人」。
服務方案
課程內容與方案差異一次說清楚，減少反覆詢問的溝通成本。
客戶見證
真實學員回饋佐證教學品質，加速信任建立。
諮詢導流
明確的行動呼籲與聯絡入口，讓有意願的訪客能立即發起諮詢。
進場動畫
細緻的捲動與進場動畫，提升瀏覽的質感與節奏。
RWD 響應式設計
以手機體驗為優先設計，社群導流進站即順暢。
Outcome
專案成果
- 建立可由社群與 Google 導流的正式網站入口，取代分散的貼文連結
- 服務方案、上課地點與收費方式在同一頁寫完，可直接分享給詢問者
- 完成手機版與桌面版響應式版面，並整合體驗諮詢的聯絡動線
對個人教練、顧問與自由工作者而言，一頁式網站就是最有效率的數位名片——這個專案完整示範了如何在一頁之內，把專業說清楚、把信任建立起來。