【你發現了嗎】從Spotify介面更新談UI設計

撰文:余思朗
出版:更新:

在電話應用程式總是自動更新的年代,若沒有什麼大改動,你基本上不會發現它「更新」了什麼,例如是早幾天換了整套圖標設計的Spotify。

Sportify資深產品設計師Andrea Limjoco在網上撰文,公佈這全球最大串流音樂平台的設計改動。面世近十年,上一套圖標設計已沿用三年,團隊經歷四個月的研發程序,跟隨蘋果帶動的扁平式設計(Flat Design)風潮,設計出一系列共六百多個的全新圖標設計。

Andrea Limjoco指出,團隊在設計時希望保留原有圖標的大概形象,並能配合其他介面元素例如字體的設計特色。新的圖標和字體有著相近的棱角及弧度,使整體介面看起來有一致性。而在功能性上,設計必須能易於縮放大小,適合用於不同大小的電子產品,如電腦、電話,及平板電腦。

主要改動包括:1)線條寬度變成一致,2)簡潔設計,3)勾劃線條取代圖案,4)扁平式設計取代立體圖案(網上圖片)
新的圖標和字體有著相近的棱角及弧度,使整體介面看起來有一致性。(網上圖片)

從近年不同應用程式如Spotify和Instagram的圖標設計演變,可以看見由蘋果iOS7帶動的扁平式設計風潮仍然流行於UI(User Interface,用戶界面)設計界,即是追求完全平面的圖標,不再模仿實物凹凸,完全去除陰影,只保留單一線條形狀和顏色。

左圖:iOS7以前的UI設計,滑鈕圖案有強力陰影感。右圖:現在的iOS介面全面採用扁平式設計。(網上圖片)

如果單單從功能性上看,這種設計確實應能增加程式的易用性(Accessibilty):有研究指出,用家在接觸互動性的圖標時,往往是記住它的位置,而非它的形象。因此圖標的功能其實就是取代文字,以最少的空間成為有效的指標,而美感似乎不是重點。但設計界亦有聲音指出,扁平式設計雖然簡潔乾淨,卻欠缺特色,沒有了立體設計的細緻感,在未來似乎不能延續現有的趨勢。在兩者之間,還有半扁平式(Semi-Flat)的設計,其中Google便是這種設計的表表者,圖標維持輕盈的線條及顏色,但在某些滑動、按鈕的指標上,仍保留陰影設計,營造如實體裝置的立體感。

Google的新介面設計採用半扁平式設計,帶有輕盈陰影。(網上圖片)

其實除了圖標設計,顏色、空間、字體,甚至整個網站及應用程式的的樹形結構,都是UI設計的一部分,不但講求美感,更決定了用家使用網站的導向。在應用程式成為主流的年代,UI設計漸受重視,講求的不單單是從前平面設計的美學,或是工程學上的實用性,而是如何把兩者完美結合。講到明係User Interface,以用家經驗為主導,不妨打開手機看一看,開始留意UI設計師的心思,你又喜歡哪種設計呢?