[譯文] 去形式化——移動(dòng)設(shè)計(jì)新趨勢

我們已經(jīng)住在一個(gè)“干凈極簡”的世界有一段時(shí)間了珍昨,那么接下來呢?

在過去的幾個(gè)月句喷,一些創(chuàng)新設(shè)計(jì)的業(yè)界領(lǐng)袖已經(jīng)將“極簡設(shè)計(jì)”推向另一個(gè)境界镣典。 Facebook 、 Airbnb 和 Apple 已經(jīng)跟隨一個(gè)相類似的藍(lán)圖來簡化主要產(chǎn)品唾琼,這種方式就反映出了移動(dòng)設(shè)計(jì)“去形式化”的新趨勢兄春。

究竟什么是去形式化?

你說從沒聽說“去形式化”父叙?好吧神郊,這是因?yàn)槲覄偘堰@個(gè)術(shù)語杜撰出來。最近我注意到區(qū)別于扁平設(shè)計(jì)趾唱、極簡設(shè)計(jì)以及流程簡化的新趨勢涌乳。有些人可能認(rèn)為這只不過是極簡設(shè)計(jì)運(yùn)用于移動(dòng)領(lǐng)域的下一階段,但是我卻要說這個(gè)東西可能更加不同一點(diǎn)甜癞。一些特別的共同點(diǎn)和特征點(diǎn)能夠定義這個(gè)新趨勢夕晓。所以我覺得為它取名。我可以這么干悠咱,對吧蒸辆?

這些橫掃硅谷的熱門新趨勢的定義特征是:

1. 更大更粗的標(biāo)題

2. 更簡單更通用的圖標(biāo)

3. 色彩抽取

結(jié)果呢征炼?一些我們最喜歡的應(yīng)用的界面開始看起來越來越像是他們可能都來自同一個(gè)品牌。

證據(jù)

我最開始注意到這個(gè)趨勢是在五月初(2016) Instagram 發(fā)布他們重新設(shè)計(jì)的界面時(shí)躬贡。

Instagram 的新界面

這次重新設(shè)計(jì)的一些變化包括:去掉了很多在這個(gè)應(yīng)用中多次出現(xiàn)的藍(lán)色和深灰谆奥、加粗標(biāo)題以及簡化底部導(dǎo)航和圖標(biāo)。留下的是黑白的界面和搭配加粗的標(biāo)題拂玻,這樣一來內(nèi)容就讓內(nèi)容明顯而且功能更加清晰了酸些。我欣賞這種不那么雜亂的界面,它讓我想起了一個(gè)我已經(jīng)欽佩了很久的平臺(tái)—— Medium 檐蚜。 Medium 從2012年就開始使用這種黑白形式魄懂,并且每次重新設(shè)計(jì)都會(huì)減少一些雜亂;顯然 Medium 就是一個(gè)去形式化的領(lǐng)軍者闯第。恭喜 Medium 市栗!

就在 FB 的人揭露出 Instagram 的樣子后,很快我打開 Airbnb 并且被他們之間的相似度驚訝到了咳短。這是他們在四月(2016)發(fā)布了新設(shè)計(jì)后我第一次看這個(gè)應(yīng)用填帽,然而我卻感覺早就看過了。

Airbnb 的新界面

Airbnb 重新設(shè)計(jì)的界面甚至沒有得到一個(gè)月后 Instagram 新設(shè)計(jì)得到的媒體關(guān)注(可能一部分原因是這個(gè)新界面沒有搭配上一個(gè)漂亮的新應(yīng)用圖標(biāo))诲泌,但是它的確是遵從了很多相似的去形式化的策略盲赊。

這個(gè)移動(dòng)新設(shè)計(jì)帶來更大更粗的標(biāo)題,去掉了不必要的圖片和色彩并且簡化了他們的圖標(biāo)使其看起來更具普遍的識(shí)別性敷扫。留下來的是非黑即白的界面,讓內(nèi)容更加明顯并且功能更加清晰诚卸。

蘋果是最后一個(gè)設(shè)計(jì)師們開始著迷于去形式化運(yùn)動(dòng)的例子葵第。這個(gè)月初(2016),在蘋果全球開發(fā)者大會(huì)上合溺,這個(gè)科技巨人宣布了一系列令人興奮的消息讓消費(fèi)者們翹首期盼卒密,包括發(fā)布了 iOS 10 ,對此他們的配音是“史上最大的 iOS 發(fā)布棠赛!”(或者至少是自從 iOS 8 以來因?yàn)樗脖环Q為“史上最大的 iOS 發(fā)布哮奇!”)。

Apple Music 的新界面

有一條公告特別吸引我的目光睛约,那就是 Apple Music 的重新設(shè)計(jì)鼎俘。雖然最終要的幾個(gè)設(shè)計(jì)點(diǎn)是體驗(yàn)提升和功能新增,視覺方面卻是我注意到的第一件事辩涝。 Macworld 的作者 Caitlin McGarry 將這個(gè)視覺更新描述得很好:“這是一個(gè)全新的樣貌贸伐,巨大的卡片、粗大的文字和清晰的白色背景都讓專輯藝術(shù)更加注目怔揩∽叫希”

聽起來是不是很相似脯丝?這個(gè)設(shè)計(jì)與 Instagram 和 Airbnb 的藍(lán)圖有些微的區(qū)別 (他們用的都是空心圖標(biāo)! Apple 你腫么了7ァ)但是關(guān)鍵元素還在這里:大而粗的標(biāo)題宠进,黑和白的界面。

那這又意味著什么藐翎?

就像我先前提到過的材蹬,這意味著原來越多的你喜歡的應(yīng)用將會(huì)看起來更相似。為什么阱高?就像那句話一樣赚导,技術(shù)就是一個(gè)抄襲傳奇。那些得到廣泛正面評價(jià)的新設(shè)計(jì)(有些人在抱怨哪些新的黑白界面缺乏個(gè)性但是他們很快就會(huì)放棄的赤惊,你打開一個(gè)應(yīng)用是為了它的功能而不是個(gè)性)所以我期待新老應(yīng)用都開始跳入這個(gè)去形式化的潮流來吼旧。

這意味著你的 iPhone 主屏幕將會(huì)只是一個(gè)將你送往歡樂谷的彩色魔方大門。

去形式化的界面設(shè)計(jì)

現(xiàn)在未舟,不論你贊同還是反對這種單色時(shí)尚圈暗,這已經(jīng)毋庸置疑地成為了一個(gè)進(jìn)步的信號(hào)。產(chǎn)品設(shè)計(jì)的進(jìn)程正在從老舊的鼓勵(lì)累贅設(shè)計(jì)的分隔手法發(fā)展并進(jìn)化到了真正關(guān)注用戶總進(jìn)程上裕膀。在老的產(chǎn)品設(shè)計(jì)過程中一個(gè)界面設(shè)計(jì)師可能在設(shè)計(jì)框架時(shí)被體驗(yàn)和產(chǎn)品以“讓它更漂亮”的指令束縛员串。這樣設(shè)計(jì)師就會(huì)花費(fèi)很多時(shí)間來增加顏色、去除顏色昼扛、修改顏色寸齐,然而最好的解決方式可能早就擺在他們面前……那就是線框圖!在如今相互交融的設(shè)計(jì)過程中抄谐,體驗(yàn)和界面設(shè)計(jì)師之間的界限愈來愈模糊渺鹦,設(shè)計(jì)師們變得不那么擔(dān)心他們的特殊職責(zé)(像是讓它更漂亮)并且關(guān)注與為用戶創(chuàng)造最好的產(chǎn)品這個(gè)終極的目標(biāo)上【譯者:難道不是賺錢創(chuàng)造價(jià)值嗎 → v → ?】蛹含。

去形式化的終極指南

那么你對去形式化已經(jīng)足夠確信并且準(zhǔn)備好跳入這一潮流了嗎毅厚?很好,跟隨這些指南浦箱,你立即就能創(chuàng)造出能夠得獎(jiǎng)的應(yīng)用吸耿。

1. 去掉色彩。OK酷窥,你可以有一個(gè)顏色咽安,但是非常謹(jǐn)慎地使用它來指示行動(dòng)。一切最好都是黑色和白色竖幔。讓應(yīng)用的內(nèi)容本身帶來色彩板乙。

2. 更大、更粗、更黑的標(biāo)題募逞。你看到這里的標(biāo)題了嗎蛋铆?用 20 到 30 像素來讓它看起來更大。

3. 簡單放接、纖細(xì)刺啦、可識(shí)別的圖標(biāo)。你的圖標(biāo)最好是能夠通用并且沒有顏色限制纠脾。并且如果你想要通過從左到右的排序來傳達(dá)含義可以這樣做:首頁玛瘸、搜索、主操作苟蹈、副操作糊渊、信息。

4. 兩倍慧脱,不渺绒,三倍增加空白區(qū)域。也許甚至是四倍菱鸥。這么做一定不會(huì)錯(cuò)宗兼。

5. 讓你的應(yīng)用圖標(biāo)更加明亮。如果你想要補(bǔ)償性地設(shè)計(jì)一點(diǎn)閃亮鮮艷的東西氮采,那么就放在應(yīng)用圖標(biāo)里吧殷绍。這才是展示個(gè)性和品牌的地方,讓它更加與眾不同鹊漠!


未經(jīng)允許請勿轉(zhuǎn)載

原文:Michael Horton 的 Complexion Reduction: A New Trend In Mobile Design


最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末主到,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子躯概,更是在濱河造成了極大的恐慌镰烧,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,406評論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件楞陷,死亡現(xiàn)場離奇詭異,居然都是意外死亡茉唉,警方通過查閱死者的電腦和手機(jī)固蛾,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,732評論 3 393
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來度陆,“玉大人艾凯,你說我怎么就攤上這事《” “怎么了趾诗?”我有些...
    開封第一講書人閱讀 163,711評論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經(jīng)常有香客問我恃泪,道長郑兴,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,380評論 1 293
  • 正文 為了忘掉前任贝乎,我火速辦了婚禮情连,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘览效。我一直安慰自己却舀,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,432評論 6 392
  • 文/花漫 我一把揭開白布锤灿。 她就那樣靜靜地躺著挽拔,像睡著了一般。 火紅的嫁衣襯著肌膚如雪但校。 梳的紋絲不亂的頭發(fā)上螃诅,一...
    開封第一講書人閱讀 51,301評論 1 301
  • 那天,我揣著相機(jī)與錄音始腾,去河邊找鬼州刽。 笑死,一個(gè)胖子當(dāng)著我的面吹牛浪箭,可吹牛的內(nèi)容都是我干的穗椅。 我是一名探鬼主播,決...
    沈念sama閱讀 40,145評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼奶栖,長吁一口氣:“原來是場噩夢啊……” “哼匹表!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起宣鄙,我...
    開封第一講書人閱讀 39,008評論 0 276
  • 序言:老撾萬榮一對情侶失蹤袍镀,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后冻晤,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體苇羡,經(jīng)...
    沈念sama閱讀 45,443評論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,649評論 3 334
  • 正文 我和宋清朗相戀三年鼻弧,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了设江。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,795評論 1 347
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡攘轩,死狀恐怖叉存,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情度帮,我是刑警寧澤歼捏,帶...
    沈念sama閱讀 35,501評論 5 345
  • 正文 年R本政府宣布,位于F島的核電站,受9級(jí)特大地震影響瞳秽,放射性物質(zhì)發(fā)生泄漏瓣履。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,119評論 3 328
  • 文/蒙蒙 一寂诱、第九天 我趴在偏房一處隱蔽的房頂上張望拂苹。 院中可真熱鬧,春花似錦痰洒、人聲如沸瓢棒。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,731評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽脯宿。三九已至,卻和暖如春泉粉,著一層夾襖步出監(jiān)牢的瞬間连霉,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,865評論 1 269
  • 我被黑心中介騙來泰國打工嗡靡, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留跺撼,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 47,899評論 2 370
  • 正文 我出身青樓讨彼,卻偏偏與公主長得像歉井,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個(gè)殘疾皇子哈误,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,724評論 2 354

推薦閱讀更多精彩內(nèi)容