[[87095]]

iOS 7讓開(kāi)發(fā)者徹底重新思考自己app的外觀和體驗(yàn)，對(duì)其中一些設(shè)計(jì)師來(lái)說(shuō)，這是一股透露著清新的設(shè)計(jì)風(fēng)潮，但對(duì)另一些設(shè)計(jì)師卻并非如此。比如現(xiàn)在 Dribbble上充滿了各種看起來(lái)更加明亮更加扁平化的設(shè)計(jì)，但其中有一些是設(shè)計(jì)師被迫做出的改變--為了適應(yīng)iOS 7而放棄原本更加合適的擬物化設(shè)計(jì)。

回想一年前，你在Dribbble上扒拉各種木材和紋理設(shè)計(jì)。雖然當(dāng)時(shí)也有一些app透露著iOS 7的設(shè)計(jì)風(fēng)格，但只是少數(shù)?，F(xiàn)在不少app因?yàn)閕OS 7半透明的導(dǎo)航欄設(shè)計(jì)而不得不舍棄我們此前喜愛(ài)的擬物化設(shè)計(jì)。

那么設(shè)計(jì)師可能會(huì)想知道擬物化和扁平化之間能不能達(dá)到和諧的平衡？

我們?nèi)砸袷靥O(píng)果的HIG，但這不意味著我們必須完全拋棄曾給予app品質(zhì)和個(gè)性的擬物化設(shè)計(jì)。我相信擬物化和扁平化之間存在著某種平衡。

以Tapity博客中奉行擬物化設(shè)計(jì)的app--Grades為例。

最初，漂亮的木質(zhì)紋理導(dǎo)航欄賦予了這款app獨(dú)特的個(gè)性和鮮明的特征，我們知道這個(gè)設(shè)計(jì)在iOS 7中并不適合，但是我們必須完全剝離掉這些擬物化設(shè)計(jì)才能很好地與iOS 7中其他app和諧共處嗎？我們?cè)鴦?chuàng)建過(guò)一個(gè)白色的表格，并添加了輸入欄，我們稱(chēng)之為“更新”。這種設(shè)計(jì)看起來(lái)跟其他app非常合拍，但是我們不得不思考 一些不同的方法來(lái)與iOS 7達(dá)成“妥協(xié)”。

在下邊幾幅圖中，你可以看到三個(gè)不同的導(dǎo)航欄。我們讓導(dǎo)航欄逐漸擺脫了光澤設(shè)計(jì)，并使用更自然的細(xì)微紋理。如果我們決定跟從iOS 7扁平化的設(shè)計(jì)趨勢(shì)，并逐漸剝離Grades所具有的個(gè)性和特色，那么***的效果就是第三個(gè)導(dǎo)航欄。

我想擬物化和扁平化設(shè)計(jì)之間應(yīng)該有一個(gè)中間點(diǎn)，在此這兩者可以很好地融合。

我明白陰影、內(nèi)陰影、粗重的筆畫(huà)以及關(guān)澤效果會(huì)讓app在iOS 7看起來(lái)非常沉重，Grades 3當(dāng)前使用了所有這個(gè)圖層樣式。打開(kāi)app后，這些元素會(huì)讓人覺(jué)得非常不自在。

如果我們完全剔除掉光澤效果、陰影以及內(nèi)陰影，那么app看起來(lái)會(huì)是什么樣子呢？現(xiàn)在我們把筆畫(huà)降低至大約1 pixel，可以看到app整體上減輕了很多。

那么木質(zhì)紋理設(shè)計(jì)呢？從Grades面世以來(lái)，就一直具有這個(gè)特征。我們覺(jué)得應(yīng)該有一個(gè)更好的解決方法，而不是完全摒棄它。我們?cè)囍x擇了色彩更淺的木質(zhì)紋理效果，并減少了木質(zhì)紋理的顆粒。

下圖是按照上述方法整改過(guò)的效果：

保留Grades最初的重要元素讓它在iOS 7中感覺(jué)更自在舒適，這并不是一項(xiàng)容易的任務(wù)，我們可能仍與理想的解決方案相差甚遠(yuǎn)，但是此類(lèi)挑戰(zhàn)能讓我們對(duì)工作更加興奮。