蘋果設計 APP Icon 看得出來細節藏在魔鬼裡

蘋果設計 APP Icon 看得出來細節藏在魔鬼裡

iPhone 產品與介面一向是設計師極愛參考的範例,對於普通人而言,實在不太了解為什麼大家都說蘋果的設計比谷歌還要優秀,看起來都差不多不是嗎?。今天我們就來看看應用程式 APP Icon 的設計範例,了解為什麼蘋果設計優異的地方。

在 iPhone 或 iPad 上的 APP Icon 是使用者第一步接觸的視覺介面,看起來像是圓角正方形的圖示,實際上比較像是「介於正方形與圓形中間」的圖示。比較起圓角正方形的R角(圓),Icon 不是一個正圓角,根據圖示展現出一個不連續R角的型態,跟正常的圓角正方形呈現圓角左右都有比較突出的部分。(雖然只有一小點)

以前的 APP Icon 其實就是以正圓角來做設計,但人類視覺會把圓角逐漸平坦的部分看成有點下陷,簡單來說就是圓角會特別突兀,變成四角特別「尖」的感覺。不過這個細節在 iOS 7 更新後修正,現在看起來一貫性更強,也更加洗練。硬是要說的話,蘋果對於這類型的小細節都不會放過,經過仔細的視覺修正成不連續R角,讓整體視覺更加一致。

此外,蘋果的硬體設計也有不連續R角的細節,重要的思考邏輯是避免「曲面與直線的接角」,產品設計徹底避免「接角」所造成的視覺與手感的不連續性,專業術語稱為「曲率連續性」。另外一個圖示可以看到 MacBook Pro 的設計也有不連續的曲面,不連續性要求的模具品質比一般正常R角更高,也很挑戰模具工程的技術。比較起廉價的產品來說,有著不連續曲面的蘋果產品就是貴上一番,這就是細節所在。

細節造就了蘋果美學。特別的是,不連續曲面並非蘋果專利,其他企業只要掌握到技巧也可以做出來,但是卻很少有產品能夠精確使用到此技術,原因則在於模具或是機構工程師是否能理解不連續曲面所造成的視覺使用性優勢,還是覺得用傳統R角就可以解決問題,為什麼還要這麼複雜挑戰量產品質?或者設計師手繪畫出來的曲線,無法轉化成為連續曲面圖形等等,要實現蘋果不連續曲面的設計比想像中還要困難。

人總說魔鬼藏在細節裡,從設計裡看來,細節不只是魔鬼,更是所有靈感來源。

Apple’s Icons Have That Shape for a Very Good Reason

如果你喜歡這篇文章,或許可以請我喝杯咖啡