2021.06-2021.07
類型 Redesign | 擔任角色 UI/UX設計
麥卡貝網路電視 重新詮釋多元平台之優勢
透過修正用戶介面，同時整合品牌形象，以加強使用者黏著度及順暢觀影為主要設計目標。
專案背景
麥卡貝網路電視（Camerabay）為網路電視頻道，2013年9月2日開播。
提供遊戲軟體資訊、實況主對談、電競、新聞評論、音樂與綜藝娛樂等節目，另外亦有網路運動平台，轉播國內外各項運動賽事，並有運動專欄分析賽事資訊，整體平台項目可謂十分多元。
於2016即開始上線專屬APP，但APP使用流程不甚順暢，也有許多舊式的Icon及介面設計，導致使用者體驗並不佳。
設計目標
◆ 以麥卡貝網路電視APP作為基礎進行Redesign重製，分類整理並重新設計各區架構。
◆ 期望改善原先未足夠融合品牌的整 體設計及順暢搜尋觀影體驗為主要目標。
評價反饋
在正式優化之前，我們想先看看用戶們對於麥卡貝的評價反應，來找找核心問題及修改方向。
『 真的很喜歡麥卡貝，但使用上卻總是讓人有點挫折』
網路明明都正常，看直播卻一直卡住轉圈圈...只能放棄轉看VOD。
沒辦法使用Chromecast投放到電視上，無法與家人同樂實在很可惜。
為了木曜才來載APP，但畫質跟訊號不佳很容易卡圈，系統不夠穩定，常常會卡住，重新整理後又要看廣告...。
我們觀察到絕大多數使用者對於能夠即時觀賞Live直播以及豐富有趣內容都給予了相當高的評價，只是可能礙於系統上的設定或後端處理等各類問題，導致使用者在觀賞上產生許多情緒甚至轉換其他平台。
雖然APP多數評價都是技術不穩之問題，但身為現實也是麥卡貝粉絲的使用者之一，同時也想起自己奉為圭臬的
Ken Chang 先生的兒童新樂園改造專案裡說過的一句話：『總不能到了荒原什麼都不做就登出了』
我們還是必須來看看到底實際上有什麼地方能改善。
調整架構
透過整理後發現原本APP架構整體層級並不多，也沒有多餘元件被隱藏或找不到。
除了在一些小細節上偶爾出現讓人有點困惑的頁面以外，其餘部分簡潔易懂。
Wireframe
01
首頁展示
原版APP首頁並無登入選項，而是直接進入直播及最新影片的觀看頁面。後續若要使用其他功能才會跳出登入視窗
將首頁優化過後，一樣將直播Live重點置於最上方，並新增方便觀看的直播重播節目表。
Before
After
Dark Mode
原版APP為深色模式，這裡嘗試改換為淺色/深色模式互相切換
一方面讓使用者自行選擇舒適的模式，一方面則是希望重新打造簡潔俐落的品牌形象。
02
Live直播
原版直播畫面下方的留言區塊容易讓使用者感到困惑，像是不知道實際作用是什麼的圖案
改版嘗試將Icon圖案重新設計並整合，同時將品牌色系帶入，希望將畫面達到一致性。
Before
After
03
頻道頁面
原版的頻道列表並未顯示出各類頻道簡介，猜測可能是想讓觀眾一進來就看到最新影片，而相關的社群平台則是顯示於右上方。改版後將每個頻道細分出來簡介，並設計各社群按鈕及開啟直播通知(小鈴鐺)的功能。將原本頁面上的“最新影片”整合至各頻道分類中，後續會有更詳細的頁面說明。
Before
After
將頻道細分其一原因是，希望能藉由圖片+簡介方式，讓初來乍到的新朋友能夠更快了解每個頻道內容
甚至能透過各頻道主圖片，讓大家記憶點更深。
04
影片分類
原版頁面並沒有區分正片或剪輯，也因為影片命名及封面圖無法看出時間及集數，經常發生看了第一集往下滑卻找不太到第二集的窘境，或是中間卡了許多精華片段未分類。改版後將最新影片(正片VOD)及精華短片做分類，並整合命名，同時新增播放清單的選項，讓使用者在茫茫影片海中能馬上翻回歷程影片。
4/13 正片VOD
精華剪輯
精華剪輯
4/6 正片VOD
從右圖原版設計觀察到，原版影片頁面排序沒有區隔好分類，容易讓使用者觀看時有點混亂
中間兩部精華剪輯也不屬於上下(4/13、4/6)兩部VOD之內容
05
周邊商城
重新規畫周邊商城頁面，原版商城設計為單一大圖，雖清楚但缺乏搜尋及分類，若想購買單一頻道周邊
卻一直滑 不到相關商品容易感到挫折。除非點入商品另開網頁才有搜尋系統。
而改版則將周邊及結帳部分通通歸納到APP上執行，新增搜尋、加入最愛及各頻道分類按鈕。
核心樣式
包含品牌色彩計畫、Icon重新繪製...等樣式設計。
挑戰與反思
# 對於不同模式的使用族群該如何應對選擇
一開始面對原版APP為深色模式時，自己曾經非常猶豫是否要照著原版一樣使用深色。面對突然深轉淺的明顯改變，很容易讓使用者不適應甚至厭惡的可能。但後來研究到該品牌三種顏色各自意義，其中一項黑色即代表著同中求異。
我想也許能夠嘗試深淺色轉換，一方面深色讓使用者安心，另一方面淺色則用來凸顯品牌形象。
能不能有更好的表現方式？或是若堅持使用深色模式的話，又該如何創新甚至融合品牌呢？
# 觀影平台的重點取捨
製作過程不停反覆觀察原版APP及其他影片平台，大家都是希望使用者一進入頁面就能觀看影片(連我自己看影片也是這樣)，這也讓我一直思考著，會不會是因為這個原因，所以原版才要把影片不停地做往下滑而不進行分類？
或是排除首頁先登入的繁雜過程，只是為了讓使用者更快速觀影？非到必要條件才得進行登入動作？
對我來說最大的反思是『把影片各別分類出來』到底是對或不對。一部分的我認為分類對使用者是友善的，但站在商業角度上這麼做是否容易讓部分族群減少觀看某些影片的機會呢？
做了幾次Redesign，很多問題總是卡在心裡，每一次的重造或新產都是使用者角度或商業面不停拉扯，也許很多問題沒有最正確的解答，只能做中學、學中做並不放棄思考，我想這就是學習 UI/UX 最棒的挑戰之一。