【設計方法論】翻譯:原子設計&創意

如果你有維護過產品線的Guideline,就不會對原子設計這個概念陌生。況且原子設計這個概念已經不新了,並且已經不新到廣告圈已經有人用這個概念酒瓶裝新酒解釋方法論了。但是前段時間看到這篇文章還是很積極的翻譯出來了,因為這篇文章在解釋原子設計這個概念的時候,對設計這個概念有自己的解讀與價值觀。最近或者說一直UX&UI圈的營銷號們都在說市場飽和要失業,看了這篇也許會少一點焦慮與迷茫。

最近團隊有些內部工具的項目在前端框架上選了第三方的組件作為基礎,所以在設計上也會基於一定的組件庫去設計。其實在此之前也會基於項目沉澱規範與組件庫,之後進行復用與規範維護,但沒有這樣直接用過第三方的組件庫。而且內部項目對視覺的要求也不高,需求可能直接是我要個什麼樣什麼樣的,一個不小心搬磚感就會油然而生。怎麼破?但其實也許只是你在想法上先入為主了。

而且作者用了個很妙且少見的比喻——音樂。現在見面就你有freestyle嗎?看完這篇還順帶手給你普及了下啥叫flow,啥叫beats。很適合不經意間裝個逼呢。

以下正文

到現在為止,我(文章原作者)已經在設計項目中用了兩年的原子設計了。我忍不住經常去和周圍的人談起關於原子設計的話題。

小貼士:原子設計是一種設計方法,是Brad Frost創造的,基於的想法是在界面設計中,經常會用一些界面上最小的元素(原子)去搭建其他組件。

然而當我去試圖說服我周圍的朋友去使用這個方法的時候,我發現一些人(大部分是我認為真的很有創意的人)會擔心這個方法過於 「工業性」。

「這將終結我的創意!」

「我們將會變成設計組件的機器。」

不幸的是,當我們討論 「工業化」 與 「復用」 的時候,很多人就理解為 「標準化」 與 「限制創意」。我不同意這一點。

當你真的發現你明白了如何使用原子設計的時候,你恰恰可以決定在哪裡以及在什麼時候給創意發揮的空間。

當命名方式不同的時候會怎樣

當我開始使用原子設計的時候,我讀了很多相關的文章去了解其他人是怎麼來使用這個方法的,項目以及團隊大小會有怎樣不同的影響。

不同的設計團隊在原子設計方法論中使用的隱喻是不同的。這樣閱讀體驗很糟糕,經常會讓我產生困惑。舉個例子,分子(molecules)和組織(organisms)的區別是?或者模板(templates)和頁面(pages)的區別是?

而且說實話,化學和生物學的隱喻對於一個非理科生(當然也包括我)來說是很 「恐怖」 的。

我決定嘗試一些不用的隱喻去傳達相同的概念——開始先從一些最小的部分開始,然後在此基礎上構建出其他東西。我會選擇更吸引人的隱喻方式。

隱喻1:Lego

這是我發現的第一個有趣的隱喻,也是在解釋組件系統時,最常用的方式。

我擁有不同形狀、不同大小以及不同顏色的積木塊:

用這些積木塊,我可以創造出不同的元素出來:

通過把這些元素紙盒在一起,你可以得到一個最終的結果,當然他甚至也可能是另一個更大的東西的一部分。

Lego最妙的地方在於你可以擴展這個隱喻:設計規範(style guide)在這裡面就類似於一盒子的Lego積木可以如何使用的一個規則(建立原則):

這個隱喻要比原子有趣的多,特別是我的團隊很喜歡,尤其是開發人員們。

但是,這個隱喻依然對我們設計師的工作缺少一些重視。。。

如何去傳達一個概念——當我們設計一個產品的時候,我們不止是在組合一些積木塊,我們是再給用戶傳達一些東西

隱喻2:音樂

最近,在我服務的設計公司Backelite,我將原子設計方法論介紹給我們其中一個客戶,我很幸運的和天才的藝術指導Florian Cordier合作。

使用原子設計不是他自己的選擇, 而且他覺得這個Lego的隱喻不是很恰當,因此他決定自己來尋找一個隱喻,之後他找到一個我認為超贊的比喻方式。

這個想法來源於音樂都是由7個音符和一些節奏符號構成的。

我們可以把他們組成和弦:

我們將這些和弦可以在組成主歌部分:

有了這些元素就可以創造出一個完整的音樂作品,甚至是一個宏大的歌劇作品。

然而我對這個隱喻最感興趣的點在於他帶來了3個新的概念,這些概念在設計產品的時候是很重要的:和聲旋律節奏

和聲

他是正確組織各部分的方式,他決定了最後的結果是不是和諧與平衡的。

旋律

這是我們想講給用戶的故事,是這個流程的整體感受,有時這個流需要快一點,有時需要緩一點。

節奏

最後一點同樣重要,節奏是在用戶在使用產品感受到的情感,包括動效設計、插圖風格、文案寫作等等。

感謝這個隱喻,讓我可以在講述關於設計系統的時候可以加入時常缺少的情感以及創造力的部分。

優秀的作曲家和優秀的表演者

令人喜歡且長盛不衰的音樂需要好的作曲家也需要好的表演者。只是簡單執行完一個作品,即時技術再好也不足以打動觀眾。同樣,一個豐富的組件庫也不足以創造出好的用戶體驗。

我們需要

  • 優秀的作曲家去創造獨特的可以復用的音樂庫。
  • 優秀的演奏家去按照自己的方式去演繹,為作品帶來生命。

而有些時候,我們需要打破規則為作品添加驚喜或者情感。

那是需要創新?還是不需要?

對於我來說,這個問題顯而易見:當我們使用設計系統和原子設計的方法論的時候,依然可以保持創新。

那麼下一個問題一定是:

「我們什麼時候需要創新,什麼時候又需要一致性?」

我們需要區分在什麼地方我們需要很強的一致性,而什麼地方需要為用戶帶來驚喜和情感,或是去展示品牌的獨特性。

  • 如果我們想保證很高的一致性和復用率,就基於比較具體和複雜的組件進行設計(比如模板和組織)。
  • 如果我們更想讓設計師多一點創新的可能,就提供一些基本的原子或是分子,讓他們自己創建新的組件出來,同時保證了整個設計系統的相似性。

永遠不要忘記:一致,但不死板。

我們節省的時間用來做什麼?

工業化可以幫設計師避免重複勞動和無用的,並且對設計師沒有價值的工作,從而節省時間。比如:在15個不同的頁面上進行同樣的調整工作,創建20次同一個組件或者替換10次同樣文字。

然後我們應該用這些新獲得時間關注對用戶或是客戶更重要的部分:正確的用戶流程,品牌特性,用戶反饋的分析,創新與相關的解決方案,情感化設計等等。

如果你對如何開始根據原子設計的方法設計一個組件系統有興趣,你可以閱讀一下:"原子設計:如何設計一個組件系統"。


推薦閱讀:

如何構建系統化交互設計自查體系?
怎樣做一個優秀的交互設計作品集(自己經驗+他人經驗總結)
7個步驟讓你成為UI&UX設計師
UI 設計進階 0:目錄(已更新到 2-1)
UI設計必背英語|sketch 上篇

TAG:用戶體驗 | 交互設計 |