Easycamp.com - mobile version

Freelancer - Planner / Designer
2016. 01 - 2016. 02
我本身是個露營愛好者,平均每1~2個月就會全家與好友一起到野外體驗露營的樂趣。 有幸認識國內露營樂網站的團隊,於是合作開發mobile版的露營樂網站,讓露友可以利用行動手機更便利的瀏覽營區資訊與立即線上訂位。

1. 網站資訊架構

根據目前web板網站的架構,進行mobile的使用需求重新規劃,保留最重要的網頁資訊,以利之後針對行動網頁的行為進行設計規劃。

<網站資訊架構; tool:Xmind>

2. 首頁提案

觀察露營樂首頁行為分四種
明確目標搜尋:已經知道要搜尋明確營區,以最有效率方式輸入名稱,找到結果。
模糊目標探索:想搜尋中部有草坪與最多人推薦的營區,藉由一些條件篩選出有用的資訊。
啟發性內容 : 大部分是從FB粉絲頁某個有趣的議題吸引,引發使用者在網站繼續觀看相關議題。
其他捷徑:如功能性的會員中心,購物車和快速瀏覽整個網站架構,跳轉到其它頁面。

一開始希望創造easycamp是一個最大的露營入口網站的形象,因此以較大的當季露營圖片為背景與一個主要search bar為入口,讓使用者有最快速的方式搜尋到營地與完成訂位(如Airbnb的定位)。 考慮到目前露營樂網站知名度還不夠,主要以facebook粉絲頁的發文來導流量,一來較少使用者是直接從首頁開始瀏覽,二來此網站未來朝向露營商場的方向發展,除了提供最新露營資訊外,還提供營區訂位、食材直配與商品購買等服務,因此調整首頁能清楚展示此網站的商品/服務項目 (如Google play / App store 展示不同分類的app方式),且讓每一頁都是一個可向外繼續連結的首頁概念。


讓每一頁都成為首頁,創造循環的瀏覽體驗
讓每一頁,都能繼續向相關主題、營地與商品展開連結,持續的瀏覽黏著度。

3. 線上訂營區流程

4. 會員中心頁面

5. UI 元件定義

Multi-filter: 以最快速度篩選你要的條件

Expanded / Collapsed panels: 開啟/關閉你所需要的資訊

Check invision prototype

Visit Easycamp.com