薰衣草森林 南投九九峰園區｜3D 園區地圖：把整座園區做成可以逛的首頁

專案背景

薰衣草森林南投九九峰園區位在南投縣草屯鎮藝術路 258 號，搭氦氣球升空可以眺望九九峰，園區裡有 Hi & High 高空氦氣球、香草餐桌與心之芳庭等餐廳、帶禮物回家與薰衣草森林 Select 等選物店，以及花園、15 度草原、櫻花林、空中步道與森林步道。官方網站的內容很完整，票價、營業時間、交通、搭乘須知、常見問題、課程、場地與婚禮都有，但分散在十多個頁面裡，園區地圖則是一張平面圖。

這是留白設計以九九峰園區為題的概念提案：如果園區的官網本身就是一張可以逛的地圖，訪客還沒出門，就已經先在園區裡走過一圈。

核心挑戰

到觀光園區官網的人，問題通常很具體：裡面有什麼、氦氣球在哪裡、餐廳幾點開、從停車場怎麼走、要不要先買票。這些答案在舊網站都找得到，卻要在不同頁面之間來回切換，而且常常是用手機，在出發前或在園區門口查。

園區方在意的則是另一件事：讓訪客願意多停留、多走幾個點，把氦氣球、餐廳與選物店都逛到。挑戰在於同一個畫面要同時回答實用問題，又要讓逛園區這件事本身變得有趣，而不是只把頁面換成 3D。

解決方案

提案的核心是：3D 園區地圖就是官網。進站先看到一頁像刊物一樣的首頁，用園區的實景照片說清楚這裡是什麼、今天幾點開，按下「開始探索」，鏡頭從高空俯衝到園區上空。之後所有內容都從地圖叫出來：點分區飛進去，點設施看介紹，選單裡是官網的全部內容。

首頁：用實景照片開場

首頁第一屏是一張滿版的實景照片，桌機是氦氣球飄在九九峰上空，手機直拿時換成一張直式的氦氣球照片。標題「走進九九峰的森林與天空」壓在照片下方，旁邊是「開始探索」與活動、票價與時間、線上預約、交通四個捷徑。往下捲動後，頂端出現一條細窄的列，只留字標與「開始探索」，隨時可以進地圖。

照片下方是一排數字：21 處設施、168 公尺的氦氣球、4.9 公頃森林，大字是數字，小字是說明。接著是編號 01 的「園區亮點」，四季花園、藍色小精靈空中步道、Hi & High 氦氣球、森林餐桌與帶禮物回家各用一張拱形框起的實景照片，桌機用左右箭頭一次移動一張，手機直接左右滑動。

編號 02 的「今日園區」是一份時刻表：09:00 開園、11:00 森林午餐、15:00 草原野餐、19:00 最後入園、20:00 閉園，右上角顯示現在的時間，已經過去的時段變淡，目前所在的時段標上「現在」。桌機橫排成一條時間軸，手機改成直列，一行一個時段。編號 03 的「三步看懂怎麼逛」以大號數字 01、02、03 排出 3D 園區地圖、找設施、開園與門票，下方註明園區資訊整理自官方網站，以官方公告為準。

頁面以一張插畫與「整座園區，都在地圖裡」收尾，再放一次「開始探索」。頁尾分成探索、參觀、關於三欄，每個連結都直接打開地圖裡對應的面板。

第一次進地圖：6 張導覽卡

第一次進入地圖的訪客，會看到 6 張插畫導覽卡：園區地圖、找設施、開園與門票、推薦行程、設施介紹、線上預約。可以略過，也可以之後從選單重看。

桌機與手機

桌機上，地圖佔滿視窗，左上是搜尋，中上是字標（點了回到全景），右上是聲音與選單，右下是「行程」與「預約」兩個常用按鈕，所有面板都從右側滑出。手機直拿時，搜尋移到下方拇指好按的位置，面板改成從下方拉起的抽屜，橫拿時再回到右側。

關鍵設計

五個分區，點了就飛進去

園區很大，一次標出所有設施只會讓畫面變亂。遠看時，地圖只標五個分區：入口廣場、餐廳區、花園草原、氣球區、森林步道。點一個分區，鏡頭飛進去，才顯示裡面的設施名稱與 logo，網址也同步帶上分區，可以直接分享給同行的朋友。分區是依設施位置分組的導覽分類，不是園區的官方劃分。

主角清楚，其餘退後

地圖的視覺刻意做成平行投影的桌上模型：圓潤的樹、素色牆面、柔和分層的光影，遠近一樣大，訪客一眼就能讀懂相對位置。標籤依重要程度分強弱，氦氣球與必訪的設施最明顯，官方編號的設施次之，其餘較淡，園區外的地點最淡。主角是 Hi & High 氦氣球，所以飛翔提案所的標籤用紫色，氦氣球的起降圈在地圖上也看得到。

設施頁：照片、介紹與怎麼來

點任何一個設施，面板打開設施頁：照片、logo、類別與官方編號，分成「介紹」與「怎麼來」兩個分頁，可以收藏、分享，餐廳另外接到訂位。內容整理自官網各設施的頁面，營業時間直接寫在第一行。

設施圖鑑把 21 處設施依餐飲、香氛選物、伴手禮、體驗與景點分類列出，附 logo 與官方編號，點一下就飛到那個設施。

選單改成分組清單

選單延續首頁的刊物語言，從一整頁圖示改成像目錄一樣的分組清單。最上方一條深紫色的帶子放線上預約、餐廳訂位與活動三個最常用的動作，下面依序是「逛園區」（我的園區、設施圖鑑、推薦遊園順序、收藏、今日飛行狀況）、一張 Hi & High 高空氦氣球的搭乘須知提醒、「參觀資訊」（票價與時間、怎麼來、常見問題、聯絡我們）、「體驗與活動」（體驗課程、場地租借、婚禮）、「關於」，最後是白天夜晚、語言與重看導覽的設定。每一列都有圖示與箭頭，手機上一隻拇指就能從上滑到下。

官網的文字、價格、營業時間與照片都整理進這些面板，不需要跳到其他網站。票價與時間把全園營業時間、各設施時段與入園門票放在同一個面板。

交通與推薦遊園順序

「怎麼來」整理從停車場步行、開車走國道 6 號、推薦遊園順序與地址，地址旁有地圖導航按鈕，點了直接開啟導航，也可以複製地址。下方是官方園區地圖，以及北部南下、南部北上與客運路線。

點開車路線，地圖從交流道方向畫到入口旁的停車場，上方橫幅寫出轉彎順序，並標示約 900 公尺、約 3 分鐘車程。路線模式下，路線與終點清楚亮起，周邊只是退為淡色，不會讓整張地圖一起變灰。

「推薦遊園順序」從入口串起主要景點：飛翔提案所、15 度草原、花園、Select、空中步道、森彥、餐廳區，最後到帶禮物回家。路線以紫色畫在地圖上，上方橫幅寫出順序，並標示約 820 公尺、步行約 11 分鐘。橫幅也提醒：這是順序建議，實際步道請依園區指標。

聯絡與預約都在站內完成

聯絡我們直接給客服中心、團體預約、體驗課程、場地租借與婚宴試菜的電話與分機，點了就能撥。會員、LINE 官方帳號、Facebook 與 Instagram 以 QR code 卡片呈現，每張卡片都有「前往」按鈕與「複製連結」，用手機看的訪客不必再掃自己螢幕上的 QR code。線上預約在站內選好日期、票種與張數，最後一步才交給官方售票頁付款，餐廳訂位也是在站內選好餐廳，再交給餐廳的訂位系統。課程報名、團體預約、場地租借、婚宴諮詢與合作招商，則改用站內表單送到後台。

花瓣、徽章與收藏：把逛園區變成收集

為了讓訪客多看幾個點，提案加入一層輕量的遊戲：打開設施、收藏、照推薦路線走，都能收集花瓣，看完一個分區、全部看完再加分，並解鎖「初次見面」「心頭好」「照著走」「全園制霸」等徽章，拿到徽章時畫面上方會跳出提示。選單裡的「我的園區」顯示花瓣數、五個分區的進度與徽章。紀錄只存在訪客自己的裝置，不需要帳號。

白天、夜晚與搜尋

地圖有白天與夜晚：白天是四季花色、草地與停車場的車格，晚上則亮起步道燈與建築的洗牆光，氦氣球微微發亮。開場一律是白天。

不知道設施在哪個分區時，直接搜尋。輸入一個字就列出符合的設施，點了鏡頭飛過去並打開設施頁。

位置照實際校正，也誠實標示

園區的配置對照衛星影像校正過：氦氣球的起降圈與旁邊的小涼亭放在實際位置，園區道路與步道照實際的彎曲走向描繪，不存在的直線步道拿掉，入口補上售票口。花園、步道與空中步道等位置則依官方園區地圖繪製，網站上註明僅供參考，氦氣球也以示意高度呈現。緊急集合點因為還沒有經園區核准的疏散圖，提案中刻意不對外顯示。地圖做得再像，也不該讓訪客誤以為那是正式的安全資訊。

後台與維運

店家、公告、活動與表單資料都在內容後台管理。新的活動上檔、設施營業時間調整，在後台改完，地圖上的面板就會跟著更新。課程、團體、場地、婚宴與招商的表單送進後台的「詢問與報名」，園區人員可以在後台查看並更新處理狀態，表單本身有欄位驗證、送出次數限制與防機器人欄位。

成果

• 首頁改為實景照片開場的刊物式版面：拱形照片的園區亮點、標出現在時段的今日時刻表、三個編號步驟
• 「開始探索」直接帶進 3D 園區地圖，五個分區一點就飛進去，分區網址可以分享
• 21 處設施各有設施頁、介紹與怎麼來，另有設施圖鑑與搜尋
• 選單改為分組清單，官網的票價、營業時間、交通、聯絡與其他內容全部收進地圖面板
• 推薦遊園順序、開車與步行路線畫在地圖上，附距離與時間，交通可一鍵導航
• 聯絡我們的會員與社群卡片可直接前往，電話可直接撥打
• 園區配置對照衛星影像校正，位置資訊誠實標示
• 花瓣、徽章與收藏，讓訪客多逛幾個點
• 白天夜晚切換，手機直拿、橫拿各有對應的版面