“我們嘗試探索盡可能多的想法，看看我們能用新風(fēng)格做些什么”

上個(gè)月，我們發(fā)布了 Mac 應(yīng)用程序的第 70 版，這是對 macOS Big Sur 用戶界面的重大更新。雖然我們的設(shè)計(jì)團(tuán)隊(duì)花了很長時(shí)間來研究如何讓它在更新的操作系統(tǒng)中看起來更美觀，但他們還有另一個(gè)項(xiàng)目需要考慮——為 Mac 應(yīng)用程序設(shè)計(jì)一個(gè)新圖標(biāo)。

一個(gè) UI 可能需要數(shù)百個(gè)小時(shí)的工作才能達(dá)到像素完美，但重新設(shè)計(jì)一個(gè)可能整天都放在 Dock 中（在你眼前）的圖標(biāo)也不是一件小事。

本周，我們采訪了該項(xiàng)目的設(shè)計(jì)負(fù)責(zé)人，了解他如何想出重新設(shè)計(jì)新時(shí)代圖標(biāo)的方法，以及為什么它不僅僅是我們著名的鉆石圖標(biāo)的重新創(chuàng)作。

實(shí)驗(yàn)

重塑一個(gè)在整個(gè)行業(yè)中如此知名的標(biāo)志并非易事。對于我們來說，目標(biāo)是在嘗試創(chuàng)新的同時(shí)保留其精髓。

“我想我把我創(chuàng)作的第一份文件命名為‘絕對不是白盒子上的鉆石’sketch 圖標(biāo)，”他笑著說道?！拔覀儑L試探索盡可能多的想法和選擇，看看我們能用 Big Sur 的新風(fēng)格做些什么?！彼皇窃陂_玩笑。這個(gè)過程始于在 iPad 上使用 Apple Draw 繪制的近 50 個(gè)概念。

“我只是開始勾勒出腦海中浮現(xiàn)的一堆想法，無論它們有多么奇怪，”他解釋道?！澳繕?biāo)是將想法拋到墻上，看看哪些能堅(jiān)持下去，哪些不能，以及我們可以在哪些方面取得進(jìn)展。”接下來，他將這些圖紙帶進(jìn)來，開始探索保真度更高的不同方法。

在最初的草圖階段有一些有趣的想法可供探索：“并不是所有這些想法都能成為應(yīng)用程序圖標(biāo)，但我把我最喜歡的想法帶入了其中。

當(dāng)他在我們的內(nèi)部 Slack 頻道發(fā)布更新時(shí)，大家的興奮感開始高漲，他也從團(tuán)隊(duì)的其他設(shè)計(jì)師那里得到了大量有用的反饋。當(dāng)我們思考徹底重新制作應(yīng)用圖標(biāo)的利弊時(shí)，一些更“出眾”的設(shè)計(jì)確實(shí)引起了人們的興趣。

在探索了一些將矢量編輯和筆一起使用的方法之后，我發(fā)現(xiàn)隨著圖標(biāo)變小，想法變得混亂 - 此外，它不僅僅是一個(gè)矢量編輯器。

制作鉛筆之類的額外工具很有趣，但是這些想法太單一了。

“我們嘗試過放棄鉆石，但考慮到鉆石是我們品牌的重要組成部分，這似乎有點(diǎn)愚蠢，”他解釋道。“所以我們創(chuàng)造了許多新的鉆石形狀——有些有透視，有些沒有；有些刻面較多，有些刻面較少?！睆哪菚r(shí)起，問題就變成了哪種效果最好，以及如何將這些元素與不同的環(huán)境結(jié)合起來。

他開始想出使用鉆石的想法，但采用不同的方式。他通過采用舊的自上而下的替代圖標(biāo)，對其進(jìn)行了研究并對其進(jìn)行了調(diào)整，以適應(yīng)松鼠的形狀。

尋找平衡

在前景形狀和背景之間找到正確的平衡尤其困難?！拔覀兒芸彀l(fā)現(xiàn)圓角矩形背景和菱形之間經(jīng)常存在視覺沖突，”他說?！拔覀冎牢覀冃枰业揭环N方法讓它們相互補(bǔ)充，而不是爭奪觀眾的注意力?！?/p>

這是在圖標(biāo)中加入 UI 元素的最初想法。Plax 嘗試在圖標(biāo)中添加一些透明度 - 在菱形和側(cè)邊欄中。

隨著概念工作的進(jìn)展，窗戶和鉆石的隱喻仍然存在。平衡背景和鉆石被證明是一項(xiàng)挑戰(zhàn)，這導(dǎo)致背景略微簡化。

隨著工作的進(jìn)展，出現(xiàn)了兩個(gè)領(lǐng)先者，它們的背景相似——一個(gè)使用與我們現(xiàn)在的鉆石非常接近的東西，另一個(gè)則采用了更多的 3D 方法。

自從更新圖標(biāo)以來，我們還在開發(fā)新的 3D 鉆石版本。您會(huì)在本頁的所有其他模型中看到這種略微傾斜的變體。

然后，他使用 3D 渲染創(chuàng)建了一個(gè)粗略的 3D 渲染作為照明參考。

最終，經(jīng)過數(shù)周的內(nèi)部測試和來自公司各個(gè)團(tuán)隊(duì)的大量意見后，決定很明確：這將是我們的最終圖標(biāo)。

通過將圖標(biāo)的背景減少到其基本內(nèi)容，并在側(cè)邊欄添加微妙的透明度，我們認(rèn)為它達(dá)到了良好的平衡。

細(xì)節(jié)決定成敗

對于 來說，正是這些小細(xì)節(jié)讓我們的新圖標(biāo)變得與眾不同?！拔蚁矚g它的微妙之處，”他說?！坝幸恍┘?xì)節(jié)和迭代更新了以前的圖標(biāo)，但并不一定偏離圖標(biāo)成為圖標(biāo)的初衷?！钡诋嬃诉@么多古怪的草圖之后，他是否對我們最終的設(shè)計(jì)感到熟悉感到失望？

“不，經(jīng)過我們所有的探索，這才是正確的選擇，”他解釋道?！岸椅蚁矚g一些微妙的細(xì)節(jié)。圓角矩形背景實(shí)際上是 Big Sur UI 的簡化表示，左側(cè)的背景具有透明度，這意味著它將始終略微呈現(xiàn)壁紙的背景顏色?！便@石本身也得到了一些喜愛—— 從頭開始??重新繪制它并重新著色以提高對比度并使其稍微更鮮艷。此外，新的深色色調(diào)讓它感覺就像真的漂浮在 UI 前面。

表示，他受到了 Big Sur 新設(shè)計(jì)的啟發(fā)，以及蘋果自己的圖標(biāo)——他是蘋果的忠實(shí)粉絲?！拔蚁矚g這個(gè)新方向sketch 圖標(biāo)，”他說。“將圖標(biāo)限制為圓角矩形肯定會(huì)鼓勵(lì)人們更有創(chuàng)意地利用空間。”

回顧重新制作如此知名圖標(biāo)的過程， 承認(rèn)他感到肩上的責(zé)任重大。“一開始有點(diǎn)不真實(shí)，因?yàn)槲业恼麄€(gè)職業(yè)生涯基本上都在仰望以前的圖標(biāo)設(shè)計(jì)師，”他解釋道?！埃ㄎ覀兊氖紫O(shè)計(jì)官 Sá）和（我們的設(shè)計(jì)總監(jiān)）委托我探索和創(chuàng)建應(yīng)用程序圖標(biāo)的下一個(gè)版本，感覺很棒。但這非常有壓力！”他笑著說。

電影宇宙

如果重新設(shè)計(jì)您每天在 Dock 中看到的圖標(biāo)還不夠有挑戰(zhàn)性，那么這并不是旅程的終點(diǎn)??。除了您使用的 Mac 應(yīng)用版本外，我們還維護(hù)多個(gè)測試版本，每個(gè)版本都處于不同的開發(fā)階段。從 QA 團(tuán)隊(duì)的調(diào)試版本和早期實(shí)驗(yàn)版本，一直到我們的私人和公開測試版本，我們?yōu)槊總€(gè)版本使用不同的圖標(biāo)，以便清楚地了解誰在測試哪些功能以及何時(shí)測試。

以前，每個(gè)版本都有不同顏色的菱形。頂行：、Beta 和。底行：內(nèi)部、實(shí)驗(yàn)和調(diào)試。

以前，我們只是用不同顏色的菱形來代表不同的版本。但對于 Big Sur，我們決定玩點(diǎn)花樣。“我想到了一些想法，從‘Xcode build’圖標(biāo)一直到公開發(fā)布圖標(biāo)，都有一種視覺上的進(jìn)展，它們有點(diǎn)像在講述一個(gè)故事，”他解釋道。“但這只對我們內(nèi)部有意義，感覺不是正確的方法?！?/p>

最終，我們得到了六個(gè)完全獨(dú)特的圖標(biāo)，每個(gè)圖標(biāo)都有自己的配色方案和風(fēng)格。對于 來說，這是一個(gè)將一些早期的、更古怪的想法變成現(xiàn)實(shí)的機(jī)會(huì)。

這個(gè)靈感十足的設(shè)計(jì)差點(diǎn)就成為了 Debug 版的圖標(biāo)，最終團(tuán)隊(duì)決定采用更接近 Xcode 的藍(lán)色 macOS 圖標(biāo)的設(shè)計(jì)。

“我們的實(shí)驗(yàn)性構(gòu)建總是包含我們正在研究的最新功能，而格倫（設(shè)計(jì)團(tuán)隊(duì)的另一名成員）則想嘗試一些東西來表明它確實(shí)‘存在’。那么為什么不把鉆石放入太空呢？”

實(shí)驗(yàn)版圖標(biāo)。在這種情況下，它確實(shí)名副其實(shí)。

那么圖標(biāo)背后的故事呢？“這很有趣。我們想為任天堂預(yù)告一個(gè)新圖標(biāo)，所以我花了一天的大部分時(shí)間畫畫布，只為這個(gè)預(yù)告片，”他笑著說?！敖?jīng)過所有這些工作，我意識(shí)到我們實(shí)際上可以將其用作我們的私人測試版圖標(biāo)。所以這為我節(jié)省了一些時(shí)間！”

“我被明確告知不要在這上面花太多時(shí)間，因?yàn)樗菫榱耸褂枚O(shè)的，而且我還需要對圖標(biāo)做更多的工作，”他笑著說。

對于 來說，挑戰(zhàn)在于賦予每個(gè)圖標(biāo)自己的身份，并確保它能夠傳達(dá)人們對該版本的期望。他對結(jié)果很滿意。而且可以說，這些圖標(biāo)在團(tuán)隊(duì)中也很受歡迎。

整個(gè)團(tuán)隊(duì)集合。上排： 、Beta 和 。下排：內(nèi)部、實(shí)驗(yàn)和調(diào)試

“我猜有些人看到這些后會(huì)想把它們當(dāng)作自己的主要圖標(biāo)，”他笑著說?！昂?，我只能說：我們正在招人——快來加入我們吧！”

020/12/02/我們?nèi)绾纬蔀榇筇K爾的偶像/

如有侵權(quán)請聯(lián)系刪除！