brackets
brackets
TheGreatTipsy
TheGreatTipsy

微醺大飯店

為沈浸式體驗快閃店打造活動網站

微醺大飯店
為沈浸式體驗快閃店打造活動網站
Tag
Client
驚喜製造 Surprise Lab.
Role
Front-End / Motion
Date
Dec.2018

《微醺大飯店 The Great Tipsy》為驚喜製造 Surprise Lab. 團隊繼《無光晚餐 Dining In The Dark》與《table for ONE 一人餐桌》後,推出的第四項沉浸式體驗作品。

不同於以往,在《微醺大飯店 The Great Tipsy》中,驚喜製造打破了以食為中心的設計型式,改以「故事」為軸心,結合飯店場域、表演、調酒與食物設計,並將故事的發展方向交予參與者 -「你所做的選擇,將決定你所看到的故事」,期待帶給參與者一場由外在感官刺激到內在心靈的體驗。

專案目標

微醺大飯店是一個視覺風格強烈的 SPA (Single Page Application) 網站,透過沈浸式的氣氛營造及大量的 Motion Graphic 吸引使用者體驗整個網站,希望能藉著被視覺吸引 → 閱讀故事 → 引發好奇,觸發訪客產生期待並衝動購買票券前往體驗。

結果:售票邁入第七季,售出 14000 餘張票

精緻的動態細節,增加訪客吸引力

主視覺使用漣漪及滾動視差效果,模擬微醺時視線模糊的氛圍。我們在很多區塊上精心安排許多動態細節,吸引訪客注意,增加在網站停留的時間。

 

功能引導區塊,貼心指引使用者不迷路

介面上運用許多微互動反饋,在不影響版面瀏覽的情況下適時提供使用者有意義的訊息,鼓勵他們做進一步的操作,並透過前端技術在錨點選單上即時顯示目前所在位置,幫助使用者在瀏覽上增加對網站的掌握度。

購票呼籲按鈕

網站中為 3 個不同的瀏覽情境安排了行動呼籲的「我要訂房」按鈕,鼓勵使用者在對微醺大飯店產生好奇的當下,能夠迅速導流到購票的頁面。分別是:

  1. 閱讀完飯店導覽故事 → 引發好奇想要體驗的訪客
  2. 查看體驗時程表 → 抓住有興趣但仍在猶豫的訪客
  3. 閱讀完常見問答、預售規則、更改及退費事項 → 對未知體驗信任感提升的訪客

即時售票狀況

串接貝殼集器,讓使用者能夠隨時觀望目前售票進度,除了可以讓訪客知道活動非常受歡迎,吸引他們跟風購買體驗,也用倒數計時器的方式提示猶豫不絕的訪客在有限的時間內做出購票決定。

精美的劃位介面,給予顧客一致的視覺體驗

提供給已購票顧客使用的劃位系統,為打造與主網站一致的視覺體驗,我們擺脫傳統制式表單,與介面設計師不斷討論客製表單的可能性,希望讓整體配色及樣式能夠符合主視覺的風格,讓劃位的良好體驗也能成為整個微醺大飯店重要的一環。

Credits

Front-End/Motion:謝馥羽 Fay Hsieh、許家程 Robin Hsiu

Back-End/Development:Randy Hsieh

UI/UX/Motion:周妙音 Jhane Chou (Deerlight Design Studio)

Illustration:馮議徹 Yiche Feng

手機版展示

RWD響應式設計,完美重現設計師原稿,讓手機用戶也能擁有很好的使用體驗。

喜歡我們的作品?
欲知更多合作細節
歡迎來信與我們聯繫:)

聯絡我們