電視機上盒介面

UI / UX 設計

MStar - 晨星半導體

screen

進階的設計

重新思考規劃產品 UI 及 UX

在和 MStar 合作上一個版本的機上盒介面後,也期望改善另一個較中高階的另一機上盒產品的 UI 及 UX ,不論是在操作流程、設計美感、動態轉場將重新演繹。

協同合作解決問題

與 MStar 協同開發環境建立、問題排除及硬體測試

MStar Settop box UI UX Design

Linux 開發環境建立

開發工具軟體及硬體主機板在 Liunx 平台建立與測試,解決多個版本發生的不同狀況。

MStar Settop box UI UX Design

硬體解析圖形問題

在畫面設計上要達到完美的展現也需硬體的支援,和 MStar 協同調整原始檔案處理。

MStar Settop box UI UX Design

測試訊號問題

設計到一個階段時在電視上實際測試,如沒有順利接到頻道測試訊號,很難完全知道使用狀況,所以反覆請 MStar 支援頻道輸出狀況。

MStar UI/UX Design Style 1

光影設計

Style 1

在使用電視選單時不想干擾用者,初始想法想利用半透明的方式,於是乎想到光和影,有了太陽照射的構圖,陽光的照射呈現出斜面,把放射狀的光影簡化為一塊塊的色塊利用色塊來堆疊陰影,相呼應光影照射的層次感。 包含 Icon 設計也別具巧思。

MStar UI/UX Design Style 1
MStar UI/UX Design Style 1

創新提案 1.

在這次的專案中,完成首次的改版,也再提出了三款如果整合了過場動態及改變操作形式的可能性。
在提案1 中採用3D卡片式的選單介面,凸顯前後層級的空間感。

MStar UI/UX Design Style 2
MStar UI/UX Design Style 2

創新提案 2.

提案2 利用斜面折角構成畫面元素,加入立體層次形成類 3D

MStar UI/UX Design Style 3
MStar UI/UX Design Style 3

創新提案 3.

提案3 的設計利用整個畫面移動,創造有深度的空間感,選單和頻道兩者交疊移動,呈現不同的動態美感。

MStar UI/UX Design Style 4
MStar UI/UX Design Style 4