封面00 總覽01 網站架構02 目標客群03 客戶旅程04 結構探索05 視覺方向總覽06 設計流程07 接下來呢08
DESIGN PRESENTATION — 2026

鷹村工廠官網概念提案

Discovery Phase · 網站結構與視覺方向探索
PRESENTED BYKai-Ting Lin
DATE2026.08.25
PREPARED FOR鷹村工廠
SCROLL ↓
01

總覽

Overview — 這份提案在講什麼

這份提案分成以下幾個部分,可以照順序往下捲動看,也可以直接點下面跳到你想看的段落。

02Site Map網站頁面架構 03Persona目標客群輪廓 04Customer Journey種草到分享的完整客戶旅程 05Wireframe結構線框稿,先不管設計細節 06Visual Direction三個視覺風格方向 07Current Phase目前進度在哪裡 08What's Next接下來怎麼進行
02

網站架構

Site Map

首頁是用滾動敘事展現品牌形象的頁面,三條路徑從首頁分岔為三個獨立工具頁,最後全部匯流到同一個套餐體驗頁。

HOME品牌體驗・單一捲動頁,Scene 01–08
FIND MY BUILD幫我找套餐
SHOP THE BUILDS逛套餐
FIX MY RIDE修我的車
PACKAGE DETAIL套餐體驗・核心轉換頁
03

目標客群

Persona

理解「不同類型的客戶怎麼做改裝決策」,三種決策方式,對應三種不同的搜尋套餐體驗。

USER 01 — 阿凱

「我想把車弄帥一點,但你幫我選。」

24 歲|高雄 · 騎了 3 年
改裝知識★★☆☆☆
預算敏感度★★★★☆
「朋友的車都改得很帥,我也想改,但那些零件我真的看不懂。」

他是誰?

每天騎車,平常也會刷 IG、Reels、YouTube 看車。他可能不是很懂改裝,但很容易被「改完的效果」吸引。看到一台車:「這台很帥。」就會開始想:「我的車是不是也可以這樣?」

他在意

帥、個性、爽感、朋友怎麼看

他害怕

「我會不會亂買?」「這些東西到底差在哪?」

他喜歡

已經幫我配好的套餐。尤其「一個月只要 XXX」,會讓他覺得比較容易入手。

WEBSITE ENTRY FIND MY BUILD 幫我找到適合的套餐
USER 02 — 阿哲

「我知道我要什麼,直接給我看。」

30 歲|台中 · 騎了 8 年
改裝知識★★★★★
預算敏感度★★☆☆☆
「不用跟我解釋,我想直接看你們有哪些套餐。」

他是誰?

已經玩車一段時間。會追蹤改裝品牌、看車友分享,也會比較不同配置。他可能已經知道哪個系統想改、哪個品牌有興趣、大概預算多少,所以他進網站的目的很簡單:「把你們的套餐給我看。」

他在意

配置、規格、品牌、價格、完整度——而且「懂不懂」本身也是玩車文化的一部分。

他討厭

找不到分類。資訊藏太深。一直被迫回答 onboarding 問題。

WEBSITE ENTRY SHOP THE BUILDS 瀏覽全部套餐
USER 03 — 阿翔

「我知道哪裡不滿意,但不知道該改什麼。」

28 歲|高雄 · 騎了 6 年
改裝知識★★★☆☆
預算敏感度★★★☆☆
「我只知道過彎的時候怪怪的,但不知道我要改哪裡。」

他是誰?

不是新手,也不是重度玩家,就是騎久了開始有感覺。例如:「煞車好像不太夠。」「過彎有點軟。」「想讓車騎起來更舒服、更有感。」但他不知道這到底對應哪個零件?

他在意

改善真的有沒有感覺、值不值得、適不適合自己的車

他需要

鷹村的專業幫他把「感覺」翻譯成「改裝方案」。

WEBSITE ENTRY FIX MY RIDE 我的車,想改哪裡?
改裝知識 ↑
阿凱
「我想變帥,幫我選」
阿翔
「我知道哪裡不滿意,但不知道怎麼改」
阿哲
「我知道我要什麼」
決策自主程度 →
阿凱需要「幫我決定」
阿哲需要「讓我快速找到」
阿翔需要「告訴我為什麼這樣改」
04

客戶旅程

Customer Journey

大部分人已經被 IG、朋友、車聚種草很久了,網站只是這段旅程中的一站,不是全部,這裡可以看到客人怎麼從「看到別人的車」走到「真的把車改下去」,網站又是在哪個 moment 接住他。

CUSTOMER JOURNEY · 種草到分享的完整循環
IG / Reels 朋友推薦・車友 車聚 Google 搜尋
鷹村網站品牌體驗+三個入口,內部動線詳見 02 網站架構 / 05 Wireframe
套餐 Package Detail看配置、看分期,決定要不要問
詢問 / 預約LINE、表單
安裝實體店完成交付
騎乘體驗「真的有差」
↻ 拍照、分享回 IG/車友圈 → 再次種草下一個人,回到最上面「看到別人的車」,形成循環。
STAGE BREAKDOWN · 八個階段

把上面的旅程拆成八個階段,看每個階段客人在想什麼、鷹村可以做什麼。

階段心理行為Touchpoint鷹村的機會
種草「這台好帥」看影片、滑限動IG / Reels建立品牌慾望
探索「我的車可以怎麼改?」搜尋Google / IG被找到
理解「鷹村到底在做什麼?」逛網站Homepage品牌 Storytelling
選擇「哪套適合我?」瀏覽/篩選套餐系統・三個入口對應不同決策方式,見 03 Persona
信任「真的適合我的車嗎?」看配置套餐 Detail把套餐內容解釋清楚
決策「好,就這套。」詢問LINE/表單降低轉換阻力
體驗「改完真的有差」安裝、騎乘實體店完成交付
分享「給你看我的車」拍照分享IG/車友圈再次種草,形成循環
三個 PERSONA,三個進站時機

同一個旅程,三個人會在不同 moment 進站——不是三個網站方向,是同一個旅程裡的三個切入點。

05

結構探索

Wireframe — 只是線框稿
HOME · BRAND EXPERIENCE

完整體驗:從首頁到套餐HOME → BUILD YOURS

進入鷹村 → 工廠 → 工藝 → 零件組裝 → 品牌理念 → Build Yours 分岔成下面這三條路徑。單獨看三個工具頁之前,先從這裡開始捲一遍。

查看完整首頁 →

三種探索套餐的方式,根據三種不同客戶輪廓從首頁分叉出去的三個入口。

FIND MY BUILD

幫我找到適合的套餐FIND MY BUILD

不知道該選哪一套?告訴我們你的車款、預算與需求。

對應 USER 01 · 阿凱
↓ 進入 onboarding →
SHOP THE BUILDS

瀏覽全部套餐SHOP THE BUILDS

已經知道自己想找什麼?直接從車款與分類開始探索。

對應 USER 02 · 阿哲
↓ 進入套餐 Catalog →
FIX MY RIDE

我的車想改善什麼?FIX MY RIDE

告訴我們你想改善的地方,找到適合你的改裝方案。

對應 USER 03 · 阿翔
↓ 進入 Problem → Recommendation →
+ 額外提案:Build Gallery 我想變成這樣 — 不在主要三條路徑內,是故事導向、以完成品啟發客人的另一種可能方向 →
06

視覺方向總覽

Visual Directions

三個不同視覺方向呈現出三種不同的品牌性格:情緒、影像語言、動態語言、Typography、UI 都不一樣。

TAKAMURA / FORM01
LIQUID
METAL
ENGINEERING AS ARTPREMIUM / FLUID
01

流動金屬

液態金屬、高反射鉻面、極簡留白——鷹村是一件作品。

往下看細節 ↓
TAKAMURA / PERFORMANCESYS.02
DIGITAL
MACHINE
LIVE SYSTEMDATA / GRID / SPEC
02

數位儀表

儀表板、數據、透明 UI——鷹村是一套系統。

往下看細節 ↓
TAKAMURA / CRAFTPART NO.03
MECHANICAL
CULTURE
HAND CRAFTEDMADE IN TAIWAN
03

機械工藝

螺絲、油污、工業標籤——鷹村是一門工藝。

往下看細節 ↓
屬性01 流動金屬02 數位儀表03 機械工藝
感覺高級、未來科技、性能真實、機械
核心Form 造型Performance 性能Craft 工藝
材質Chrome / Liquid 鉻面/液態Glass / Digital 玻璃/數位Steel / Aluminium 鋼/鋁
UI
Motion 動態流動數據拆解/組裝
情緒WOW 驚豔POWER 力量TRUST 信任
品牌印象Premium 高級Advanced 先進Authentic 真實

三個方向對應三個不同的「鷹村」:「你希望客戶怎麼理解鷹村這個品牌?」

06.1

流動金屬

Liquid Metal — 鷹村是一件作品

液態金屬、高反射鉻面、黑色背景——像一個高級的汽車/時尚/科技品牌。核心是工程即藝術。改裝,是一種美學。

DEMO / 01OPEN ↗
LIQUID
METAL
查看氛圍 Demo →FORM / FLUID
LIQUID CHROME FLUID PRECISION PREMIUM
液態金屬 hero 參考 液態金屬參考 液態金屬參考 液態金屬海報設計參考 金屬流體形狀參考 液態金屬動態參考 鉻面作品集版面參考
7 個參考素材,持續收集中。
06.2

數位儀表

Digital Machine — 鷹村是一套系統

把「性能」視覺化——用技術圖稿與編輯註解疊加的視覺語言:真實照片疊上座標、規格、測量線、細字標註,讓客人感覺自己在看一份精密的技術文件,不是型錄。改裝,是一種性能工程。

DEMO / 02OPEN ↗
DIGITAL
MACHINE
查看氛圍 Demo →DATA / SPEC
DATA SYSTEM DIGITAL GRID TECHNICAL OVERLAY PERFORMANCE
數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考 數位儀表參考
18 個參考素材,持續收集中。
06.3

機械工藝

Mechanical Culture — 鷹村是一門工藝

拉回真實/觸感/機械——有人在工作的改裝工廠:金屬桌、工具、螺絲、焊接、油污、手。用 PART NO. 001、ASSEMBLY SYSTEM、MADE IN TAIWAN 這類工業編號和標籤說故事。改裝,是一種製造與手藝。

DEMO / 03OPEN ↗
MECHANICAL
CULTURE
查看氛圍 Demo →CRAFT / RAW
RAW GARAGE CRAFT INDUSTRIAL TACTILE AUTHENTIC
機械工藝參考 機械工藝參考 機械工藝參考 機械工藝參考 機械工藝參考 機械工藝參考 機械工藝參考 機械工藝參考 機械工藝參考 機械工藝參考 機械工藝參考 機械工藝參考 機械工藝參考
14 個參考素材,持續收集中。
07

設計流程

Where We Are — Design Process

目前在「結構探索/草稿 Sketch」階段,先給多個方向比較。等討論、對齊之後,會定下一個方向繼續往下做,不一定要三選一,也可以把喜歡的元素拼接在一起,後面會根據回饋持續迭代。

01
探索
Discovery
訪談需求、拆解漏斗與定價策略
02
結構探索
Wireframe
三個 wireframe,探索資訊架構
03
草稿
Sketch
三個視覺方向,參考圖牆(你現在在這裡)
04
對齊
Align
收斂成比較明確的結構與視覺方向
05
原型
Prototype
高擬真原型,逐一設計
06
迭代
Iterate
收集回饋,需要的話再發散幾個方向,反覆收斂到定案

接下來呢?What's Next

接下來可以一起討論,把喜歡的結構、喜歡的視覺元素兜在一起,或者可以丟出新的想法,收斂成下一階段要做的版本。

STEP 1

留下回饋

有什麼想法、建議或問題,直接寫進 Google Doc——章節已經幫你分好,對應這份提案的編號。

留下回饋 →
STEP 2

討論收斂

等你們內部討論好了,可以約我做線上 Meeting,把喜歡的結構跟視覺元素兜起來,或丟出新想法,收斂成下一階段要做的版本。

預約線上 Meeting →