>>>  小城故事吳儂軟語溫婉人心的力量  >>>

簡體     傳統

　　著手寫這篇文章時，正是七月伊始。想起九十五年前的七月，胡適先生發表了那篇在接下來的一個世紀都將遭受批判的文章——《多研究些問題，少談些主義》。其時的中國，正被各種社會問題所困擾，也引發了學界對于各種“主義”的主張。

　　針對這些主義，胡適闡明了自己的態度——現在輿論界大危險，就是偏向紙上的學說，不去實地考察中國今日的社會需要究竟是什么東西……某種社會，到了某時代，受了某種的影響，呈現某種不滿意的現狀。于是有一些有心人，以這種現象，想出某種救濟的法子。這是”主義’的原起。主義初起時，大都是一種救時的具體主張。后來這種主張傳播出去，傳播的人要圖簡便，使用一兩個字來代表這種具體的主張，所以叫他做‘“某某主義”。主張成了主義，便由具體的計劃，變成一個抽象的名詞。……“主義”的大危險，就是能使人心滿意足，自以為尋著包醫百病的“根本解決”，從此用不著費心力去研究這個那個具體問題的解決法了。

　　這里搬出這些文字，是想拋玉引磚，借真知來粉飾拙見，談一談眼下產品和設計業界里的“問題”與“主義”。

　　擬物主義 VS 扁平主義？

　　眾所周知，自微軟創造出Metro伊始，關于“skeuomorphic（擬物化）”和“flat（扁平化）”的的爭議就未曾間歇過。這一公案，在6月11日蘋果發布iOS7后，更是被推上一個新的高潮。至于這段公案的詳情這里就不再贅述，看官可隨意Google之。

　　這段公案，其核心便在于大眾和業界人士眼中所謂“Skeuomorphic（擬物化）”和“Flat（扁平化）”的對立。“擬物主義”和“扁平主義”各執一端，相持不下，征伐不已。而波及到現實工作中，也經常可以看到很多產品經理或設計師動輒便將“擬物化”和“扁平化”放在嘴邊——“這個太平了，沒什么質感，不上流”、“這是潮流，現在都追求扁平化”。孔子曰過：“攻乎異端，斯害也已”，對于到底是該繼續堅持擬物主義，還是該追隨扁平主義？下文就來妄談一下，供看官一笑。

　　首先，請評判一下，下圖中哪款設計是Skeuomorphic擬物設計？哪款又是Flat扁平設計？

　　答案看似是不言而喻的——左圖是Skeuomorphic擬物設計，右圖是Flat扁平設計。但是，真的是這樣嗎？這個問題其實是個陷阱，而前面的答案則是不準確的。因為，兩款設計都是Skeuomorphic擬物設計，而只有右圖是Flat扁平設計。

　　為什么這么說呢？首先我們來看Skeuomorphic擬物設計的概念。Dictionary.com上對Skeuomorph的定義為——Skeuomorph ：an ornament or design on an object copied from a form of the object when made from another material or by other試譯之——Skeuomorph是一種裝飾手段或設計手法，用于在某個對象上復制來自其他材料或方法所制成對象的形式。例如，在陶器把手上添加模仿金屬鉚釘造型的裝飾，使得原材料為黏土的器皿看起來像是用金屬制成。這一過程可由下圖表示：

　　其中，F不僅僅單指狹義的外觀樣式，更多的是指布局、方式、體裁等。回頭再看上面的例子，就會發現，兩圖都是對現實中的鐘表所做的模仿，并沒有跳出現實的框架而設計出某種全新的計時形式。不同的是，右圖沒有使用漸變、高光等額外的特效處理，左圖則僅在真實感的模擬上比右圖更近了一步。

　　可見，通常情況下，人們對Skeuomorphic擬物主義和Flat扁平主義的爭論焦點并未跳出表象，而更多是簡單地糾結于視覺層面的特效處理孰優孰劣上。這種爭論，往往將兩者簡單粗暴地置于對立面，卻忽視了Skeuomorphic和Flat問題的重點——視覺是服務于產品的，到底該使用Skeuomorphic還是Flat，這個問題應該站在產品層面來考慮。我把這種選擇比喻為漁網和釣線的選擇，用漁網的人指責釣線的簡單單一，用釣線的人指責漁網的復雜粗放，卻都忽視了兩者的目的、使用場景和使用者的差異所在。

　　因此，在做設計之前，要先明確好產品的定位，做有針對性的設計，用設計去解決切實的問題，而非僅僅停留在表象去爭論風格的好壞、主義的優劣。那么，什么才是有針對性的設計？

　　為解決問題而設計

　　探討上文的問題之前，先來看個例子——

　　給出的替代方案，是以機器人代替工人完成重物的遠距離搬送。

　　固然這個人形機器人看起來很酷，夠科技，也有人情味，但這是一個好的設計嗎？將設計作品等同于對現實的模擬，其實是一項膚淺而又耗費資源的工作。如果站在實際角度去解決切實的問題，可以得到一個更加扁平高效的方案如下。

　　那么是否就是說，這種扁平化的機器人設計解決方案就是正確的呢？再看下圖。

　　顯然，每一種設計風格都是有局限性的。當目的不同時，適用的設計解決方案是不同的，也無法認定一種風格是優于另一種風格的。在有針對性的設計中，設計要解決的問題是最重要的，至于采用哪種視覺語言，應當首先取決于產品要達到的目的，而非時下流行的設計風格。以iOS6和iOS7的“返回”為例——

　　iOS6的返回在視覺上更像一個“按”鈕，通過使用更接近真實物理世界觀的陰影、高光和漸變對返回操作區域進行闡釋，給予人一種可以點觸的視覺觀感。這一設計所帶來的好處是，通過具有強烈操作暗示（局部范圍的點觸感）和方向暗示（箭頭造型和被箭頭包裹的文字）的擬物手法，降低使用者的學習成本，并提升使用者對操作結果預判的準確度。

　　這種設計手段在iPhone尚未淪為街機的那些年頭是非常有價值的，能夠以友好的姿態，使具備任何認知程度的使用者都能快速上手，有利于發展iOS的用戶群體。iOS7的返回，則通過扁平化的處理，在視覺上擺脫了“按”這一動作隱喻，并主要強調一種與整個屏幕更加一體化的方向感。這種改變并非僅僅為了服從整體設計風格的變化，而更多可以解讀為一種適應產品現狀的進化——

　　1、從普通屏到retina屏的升級，使原先擬物化的設計需要占用更多的系統資源。屏幕的增大意味著切圖尺寸的增加，切圖尺寸的增加勢必帶來占用系統空間的增長。而在特定尺寸下，需要大量視覺細節的擬物化設計必然會使用到更多的顏色，從而使切圖的數據量成倍增加。這一點在屏幕尺寸分化中所帶來的影響是極為嚴重的。而由于扁平化的設計對細節元素的使用更為克制，能夠較好地解決在不同分辨率下的適配問題，而不需要耗費太多的資源（包括系統資源和人力投入資源）。如下圖所模擬的結果，iOS6按鈕切圖的數據量在三種尺寸下成倍增加，而iOS7按鈕切圖的數據量增加并不多。

　　2、從3.5英寸屏幕到4英寸屏幕的升級，使得手指完成屏幕左上角點觸操作所需的路徑增長。同時，在iOS6的返回按鈕設計上，實際的點觸響應區域要大于視覺限定的區域，手指即使未能精確點觸到視覺上的按鈕區域，也會觸發返回的動作。

　　結合這兩點考慮，顯然在大屏幕上，有明確觸控范圍的點觸樣式不再是一個理想的視覺展現形式，過于強調點觸區域的精確度會在一定程度上增加用戶心理上的疲勞感。反之，iOS7的返回則規避了這一問題，對點觸區域的模糊化處理在一定程度上釋放了用戶的操作壓力。

　　3、iOS7對手勢操作和頭部感應操作的支持，可以讓返回操作不再像iOS6一樣只能依賴于點觸動作。這一點使得強調點觸行為的按鈕樣式失去了存在的價值，取而代之的是在表現方向感上更加純粹的扁平化設計。

　　可見，iOS7的“返回”并非因為要拋棄擬物主義才成為現在的樣子，而是使用這種更扁平的設計手法切實解決了產品的實際問題。這一點可以用Jonathan Ive曾說過的一段話加以印證——

If we’re thinking about a lunchbox, we’d be really careful about not having the word box already, to give you a bunch of ideas that could be quite narrow. Because you think of a box as being square and like a cube. So we’re quite careful with the words that you use, because those can be narrow and can determine the path that you go down.

　　大意是：如果要設計一個lunchbox，最好先把“box”這個字眼拋開，因為”box”這個字眼會決定你接下來的思路，將你的想象力限定在某種立方體造型上。（注: a box is a square or rectangular container with hard or stiff sides.）

　　因此，在做設計的時候，要先放空自己對事物的既有認知，再從根本上去考慮最適合的設計形式。這便是一種從設計的原本目的出發，拋棄一切外在影響，針對產品本身給出解決方案的設計方法。

　　現在再看前文的問題，什么是有針對性的設計？有針對性的設計就是——拋開不論是擬物主義還是扁平主義或是XX主義的干擾，為產品中遇到的問題提供最合適的設計解決方案。那些為了貫徹擬物主義理念或追隨扁平主義潮流，強行在視覺上將產品擬物化或扁平化，甚至以不惜犧牲產品體驗為代價的膚淺做法，可以休矣。

　　四個衡量維度

　　空談誤國，即使有道理的話說濫了也便成了空洞的XX主義。證完“擬物主義VS扁平主義”是一個偽命題后，還得回到實際問題上——在為產品而設計時，如何判斷這個產品是適用更接近真實的擬物化的設計，還是適用更加扁平化的設計？通常我會采用基于存在環境、自身價值、用戶關系及進化趨勢等四個衡量維度來對產品進行簡單的判斷，初步確定所適用的設計風格。

　　適應性：你的產品是否需要在多個平臺具備一致性展現？

　　呈現性：你的產品是否以大塊的信息內容展現為主？

　　易用性：你的產品是否具有便于理解的操作隱喻（包括對層級結構和交互行為的暗示）？

　　趨勢性：你的產品是否依賴于流行文化的認同？針對以上四個維度的答案如果為“是”，則請傾向選擇更加扁平化的設計方案。然而，任何衡量方法都是死板的，在進行具體設計工作時，建立在大量經驗基礎上的直覺和判斷力更值得信賴。

　　總之，多研究產品存在的現實問題，針對產品的現實問題找到最佳的視覺解決方案；而不要受某某設計主義的干擾，為迎合所謂潮流趨勢而影響了產品的體驗——這才是吾輩產品設計者們對產品的真正價值

作者: 大川 來源: 騰訊CDC 2013-12-19 19:31:41