設計的初心

0 評論 17063 瀏覽 0 收藏 26 分鐘

最近很流行的“扁平化”界面不僅是一種設計趨勢,也表達了對設計本質的渴望——去除過度的視覺傳達以及一些冗余的設計。

技術的發展雖然創造了新的機會,有時也會導致某些領域的過剩。在19世紀,機械化大規模生產,讓裝飾品可以快速、低成本的印制出來,這也導致了商品 被過度的裝飾。類似的事情在最近幾年開始重現,排版和樣式設計工具給予設計師創造豐富視覺效果的發揮空間,出現了擬物化、樣式化這樣一些設計風格。

在回歸真實的驅使下,19世紀的現代設計運動讓過度裝飾的現象得到了抑制,使設計適應了大規模生產的時代。如今,“扁平化”設計趨勢也讓我們看到了同樣的對還原真實的追求:拒絕擬物化和視覺上過度運用效果,提倡簡潔、聚焦內容的設計。

現代設計的誕生

1908年,一個有影響力的奧地利建筑師阿道夫·洛斯(Adolf Loos),寫了一篇題目頗有煽動意味的文章——裝飾與罪惡(Ornament and Crime)。 他聲稱,現代的裝飾設計師是一個“文化落后或者病態的群體。在這三年之后,他本人被迫斷絕這份工作。因為他的產品對于現在有文化底蘊的人來說是難以忍受 的,對于其他人來說同樣也會有一點這樣的感覺?!甭逅股踔粮竽懙財嘌裕耙粋€人的標準越低,裝飾的效果就越奢華。對于有抱負的人來說,目標應該是在形式 中發現美,而不是依賴于裝飾?!?/p>

是什么引發了對裝飾設計這樣的攻擊?要理解這位現代設計先驅的思想,我們必須先對19世紀后期的設計形態有所了解。

蒸汽機的問世迎來了一個機械化批量生產的時代。正如藝術評論家弗蘭克·惠特福德(Frank Whitford)寫道,“蒸汽驅動的機器可以比人工手制更快更整齊地印刷、裁剪、塑造幾乎任何物品。機械化生產意味著更低的價格和更高的利潤。”

但是,當制造方法從手工轉換到機械,商品的樣式卻沒有跟隨發展。在文藝復興精神的影響下,大部分產品,從建筑和家具到紡織和餐具,都用華麗浮夸的裝飾來包裝。

在以往,手工裝飾的制作成本很昂貴,因此是財富和奢華的象 征。隨著機械化發展,這些同樣的裝飾可以又快又便宜的制作出來。制造商只想著抓住這個機會以較低的成本去復制這些復古樣式,而不是停下來想想什么樣的設計 將最適合于大批量生產。這樣的結果就是生產了大量扎眼、劣質的產品,這也是被阿道夫·洛斯和其他現代設計的先驅所抨擊的原因。

在今天的裝飾藝術里,著名建筑師勒柯布西耶(Le Corbusier)直截了當地斷言廢棄物都是被過度裝飾的,他還說到,“奢華的物品是制作精良,整潔干凈,純潔和健康的,從外表就能揭示它的制造質量。 是工業的發展導致了這樣一個顛倒的現象:一個裝飾華麗的鑄鐵爐成本要低于一個樸實的鑄鐵爐,因為起伏的葉紋掩蓋了制作的缺陷。”

蒙哥馬利斯凱勒(Montgomery Schuyler),一個有影響力的評論家和記者,譴責19世紀被重度裝飾的門面,說,“如果你把這些街道上的建筑物主體墻面都刮掉,你會發現你很簡單地就把它的建筑風格去掉了,而且這些建筑物和原來也沒有什么區別?!?/p>

10115983_316872哈羅德目前在倫敦的建筑,在1905年建成,由建筑師查爾斯·威廉·斯蒂芬斯(Charles William Stephens)設計。門面是典型的維多利亞式風格。 (圖:Michael Greifeneder)

被稱為“摩天大樓之父”的建筑師路易斯·沙利文(Louis Sullivan),為收斂裝飾呼吁說,“如果我們在幾年內收斂對裝飾的運用,讓我們的思想敏銳地集中在合理的組織建筑結構以及簡單優美的外形,這將極大 地提高我們的審美?!跋旅媸巧忱慕ㄖ浩渲幸粋€建筑的圖片。底層有經過精心修飾,但上面的部分對于一個19世紀的建筑來說卻采用了讓人驚訝的現代建筑風 格,特別是與哈羅德的建筑對比,會尤其明顯。

cps

路易斯·沙利文(Louis Sullivan)的Carson Pirie Scott店最初是為Schlesinger & Mayer百貨公司在1899年設計的。上面樓層的簡潔風格對于19世紀的建筑來說是個驚人的革新。

20世紀20年代,在德國出現了一個稱為Sachlichkeit的新興運動,主張的理念是“合理”,“實用”,“客 觀”。NEUE Sachlichkeit運動在設計領域中主張尋求純粹的實用。德國建筑師赫爾曼·穆特修斯(Hermann Muthesius)解釋如何將這種實用的理念應用到設計樣式中,來創造他稱之為Maschinenstil的或“機械風格”。在他的話中,我們可以看到 這種樣式應用在“鐵路車站,展覽館,橋梁,輪船等。這里我們看到的是一個嚴格的,幾乎是科學性的Sachlichkeit,收斂所有外在的裝飾,外形完全 取決于他們服務對象的目的?!?/p>

其他現代設計的先驅們不再對過度裝飾發起批評,而是開始關注如何提升功能性。在1934年,現代派建筑師菲利普·約翰遜 (Philip Johnson)在紐約的現代藝術博物館舉辦了一個主題為機械藝術的展覽,展出了各種機械設備零件,如飛機螺旋槳和工業絕緣體。當時的想法是通過物品純粹 的功能來突出形式組織上的美。對于現代設計運動的理念來說,裝飾是沒有必要的,美麗和優雅是源自內容本身的設計,而不是通過表面華麗的裝飾來體現。

61d18bd6ea253ee2a006f2ecb208d22f

這個茶壺是由Naum Slutzky,一位金匠、工業設計師、魏瑪包豪斯(Weimarer Bauhaus)的工藝大師。簡潔、功能性的設計有沒有一絲裝飾 – 幾乎是一個以數學為依據的設計方案。

雖然現代主義運動的推動花費了20世紀前半段時間之久,但 最終還是超越了傳統的設計樣式和技巧。在喬納森·伍德姆(Jonathan Woodham)所著一書《二十世紀設計》(《Twentieth-Century Design》)中提到,現代審美的特點是“干凈,幾何形狀,使用鍍鉻鋼和玻璃等現代材料,通過光影明暗來表現平滑的表面。色彩的運用往往是很簡單的,主 要采用白色,灰白色,灰色,和黑色這幾種顏色。”現代設計已擺脫其華麗裝飾的外衣,取而代之的是尋求在形式與功能融合下的和諧美感。

數字化裝飾

如果我們把現代設計的歷史與歷程還很短的軟件和網頁設計的歷史對比,可以看到相似的地 方。和機械化大規模生產導致的過度裝飾一樣,顯示屏和版式技術的發展也導致了軟件界面和網頁中裝飾的重度使用。特別是在早年的網頁設計中,設計師使用動畫 和聲音和圖片結合在一起,來營造豐富的效果,卻讓人感覺花哨。

早期的操作系統不管是從外觀還給用戶的感覺上,帶有圖形的用戶界面仍然是相當基本的。 當然,現實世界的隱喻是可以采用的,比如用文件夾的圖形來表示文件目錄和按鈕,讓用戶知道他們可以點擊。但整體美感是相當平面化和收斂的,無論設計師是否 想提供一個豐富的視覺體驗,但黑白顯示屏的低分辨率限制了他們的發揮。

ad3587ffd055490458032b3d142778f0

最初的Mac OS圖形界面只有兩種顏色,蘋果通過對深度,紋理,按鈕和圖標的控制,來模仿現實生活中的物體。界面的美觀很大程度上受制于技術,而不是設計師。

隨著技術的發展,設計師們在界面的視覺設計上獲得更大的自由。微軟在Windows XP里推出了豐富多彩的風格并貫穿始終,運用了大量的高亮,陰影和漸變這些物理性特征。

蘋 果則走得更遠,在發布的Mac OS X界面中運用了有光澤的塑料氣泡樣式,拉絲鋁和逼真的圖標。隨著時間的推移,操作系統的視覺樣式愈發增強。微軟在Windows系統中預置有光澤透明玻璃 般的主題,而蘋果公司在桌面和移動系統中采用更加材質感和擬物化設計,如日歷應用程序中的皮革紋理,并在其電子書閱讀器中使用逼真的翻頁效果。

fe66dc6127897c29c304d67c4145b11f

Windows Vista界面的Aero主題,窗口的邊緣富有光澤,像玻璃一樣。

模仿現實生活中的對象和紋理的樣式,被稱為“擬物化 (skeuomorphs)” ——也就是說,借用來自真實世界的符號作為設計元素的唯一目的就是讓用戶對界面更熟悉、易學。最近,設計師們開始質疑把記事本應用程序設計成一個紙墊的樣 式,或者在日歷應用程序中加入皮革和翻頁效果的邏輯。這些效果提升了視覺的趣味性,但是這些是另外一個時代的象征,用這種象征把界面和現實生活中的物品關 聯起來,與數字化界面的流動性、敏捷反應是矛盾的。

ios

當前版本的OS X的日歷采用縫制的皮革質地和紙紋撕邊,看起來像是一個真實的日歷。

隨著最近Windows 8的發布,微軟勇敢的采取了摒棄這些多余的視覺效果的策略,試圖讓其操作系統完全呈現數字化,用他們的話說,“真實”的風格。最新的界面是建立在微軟之前開發的移動版本的設計規范上,呈現給用戶的是簡潔的內容和幾乎看不到模擬現實物體的圖片。

相反,Windows8依賴排版、間距和顏色來有序、優雅 地展現模塊?,F實感的效果和多余的樣式都被去除,剩下的就是簡單的內容本身。正如穆特修斯( Muthesius)曾經常以火車站作為機械風格(Maschinenstil)的例子,微軟的設計師指出新的Windows界面就是以火車站標志為靈感 的,以前被稱為“Metro”。

win8

Windows 8的開機屏幕打破了以往的桌面設計,由平面的多彩生動的方塊組成,而不是圖標。這些方塊不僅是一種風格上的選擇:他們讓有用的信息,以儀表板的方式在啟動頁面上展示出來了。

在網上已經看到了多年來類似的轉變。早期基于表格和Flash的設計讓開發者在像素級上控制自己的界面,所以設計師毫不 猶豫地為網頁內容創造視覺豐富的容器。當我們開始掌握動態的新媒體,使用CSS取替超鏈接,網頁設計受到更多方面的限制。高度裝飾的容器不能方便地改變寬 度和位置,所以設計師減少了圖形的使用,更多地依靠簡單的CSS樣式,使他們的布局適應性更強,更易于維護。

最近演變出來的響應式設計(就是一個頁面會根據場景進行相應的改變,以適應不同的屏幕尺寸和設備)以及設計師慢慢轉變為 直接跳過可視化編輯器(如Photoshop),通過編碼開始工作,這使我們進一步走向一個簡單的以內容為中心的Web設計理念,設計之美,是源自排版, 間距和顏色,而不是一個強烈的質感和裝飾性的圖片。

最近一段時間,擬物化風格(skeuomorphism)的領導者——蘋果,在最新版本的移動操作系統iOS7中也邁出了數字真實化的第一步??p制的皮革紋理和撕開的紙張邊緣這些已經看不到了,取而代之的是由鮮艷的簡化圖標和半透明表面構成的一個極簡扁平化界面。

jsj

蘋果iOS7是告別擬物化風格后的一個華麗轉變。左邊是舊版本的iOS里計算器應用程序的設計,右邊是iOS7里的設計。木紋質感的斜面按鈕和閃亮的玻璃風格都摒棄了,取而代之的是更平面,突出功能的界面。

真實的設計

現代設計運動與現在軟件網頁設計轉變之間的共同點就是對本真的渴望。這股力量讓一百多年前的設計師們刮去了他們作品的浮夸裝飾,也讓今天的數字話設計朝著更簡潔,更注重功能性的美學風格。但究竟是什么讓設計回歸“真實”呢?

真實的設計旨在洞察無意義的設計,去除冗余的元素。真實的 設計是使用材質來展示產品的亮點,而不是用夸張的紋理來試圖隱藏缺點。真實的設計包含的元素不應該只是讓產品看起來好看,而沒有其他的價值和目的。真實的 設計最優的方式是展示功能,以提升效率作為設計是否優雅的標準。真實的設計是形式服務于內容。

在這樣的設計理念中,風格并不是說不重要,但不提倡純粹用 來裝飾。相反,美的形式取決于內容,而樣式只是一個創造性解決方案的自然產出物。對標志性的Anglepoise燈具的設計, Deyan Sudjic評論說,“這個燈看起來怎么樣 – 特別是燈的形狀 – 是事后才去思考的。但這也是其吸引大家的一部分。它自然的形狀給予人單純、回歸本質的遐想,就像早期的路虎在技術上巧妙的構思,而不是挖空心思去創造一個 誘惑消費者的產品,反而讓顧客產生了信任感?!?/p>

16a5803ce4d5b8931961153719eef17d

燈具Anglepoise的設計巧妙地解決一個現實問題。但設計出來的形式,不僅是一種有效的解決方案,也具備它自己獨特的美學魅力。

在數字化設計中,真實性大致可以概括為以下幾點:

擁有數字化的外觀。

我們沒有在計算機顯示器上,模仿如金屬,木材和皮革的紋理。他們不是數字界面的組成元素,所以仿造這種質感是沒有意義的。這并不意味著設計應該只有純平面的背景顏色 ,而是我們不應該試圖模仿或受限于現實世界中的紋理。

摒棄擬物化

一本電子書不需要模仿物理紙張翻頁,一個記筆記的應用程序 也不需要看起來像一個現實的本子,有皮革的封面,撕裂的邊緣和手寫風格的字體。擬物化并不總是不好的,但它會導致界面一些不必要的限制。例如,一個擬真本 子的設計是靜態的而且只有一個尺寸,界面的尺寸是多樣的;但是如果界面使用的是這種擬真設計,那就只能適應一種尺寸了。

以內容為中心的風格

聚焦在內容上,而不是它的樣式和裝飾。你可能會認為這點是 老生常談,但你見過有多少個網站會用現有的主題?大多數主題是根據虛構的內容建立的,所以可以推斷出,網站最終的內容和樣式肯定會有所變化。設計主題模板 會讓設計師過于聚焦在如何設計很炫的效果,從而忽略了如何去合理呈現內容,因為也還沒有內容提供給他們。只有在真實的場景下,你才能做到為功能而設計。

這不等同于極簡風格

依賴于功能的美學設計與極簡設計不是同一個東西。前者,設計者旨在去除多余的設計,以使產品更容易理解,提高易用性。后者旨在創建一個極簡美學,營造一種非常簡潔的氛圍。一個是設計的基本原則,另一個是一種設計樣式的選擇。

e1dd60ae242c0336f356f5c265dafd46

由Designmodo設計的扁平化UI組件,這是向真實設計轉變的一種外在表現。但作為設計風格,“扁平化”只是其中一種方式,不是真實設計的必然表現。

將簡化設計生硬地應用在界面上以求達到簡潔和趨于數字化是不正確的。舉個例子,無情地消除視覺效果,如陰影,顏色和不同的背景樣式不一定會讓界面更易用。在某些情況下,這樣反而會破壞那些通過恰當的陰影和背景顏色突顯出來的層次和聚焦效果。

111

為了適應Windows 8的現代主題,Outlook 2003的界面進行了更新。新界面都進行了扁平化處理,所有的內容和菜單都融入在一個白色面板上,結果看起來更加雜亂了。

在《簡單法則(The Laws of Simplicity)》中,John Maeda寫到,“達到簡單的最簡單方法,就是用心割舍。如果拿不定主意,就拿掉它??。但是要用心去注意你拿掉了什么?!白詈蟮奶嵝押苤档梦覀兯伎肌D?掉功能往往能達到簡化的效果,因為用戶需要處理的任務減少了。但是,消除可以幫助用戶在感知上了解界面的視覺元素(如區分按鈕和標簽、突出要素的圖形組 件),可能會增加用戶學習的成本。因此,指導設計的不是設計風格而應該是設計原則。

為什么本真的設計很重要?

一款名為Rise的app是數字化本真設計的典型例子。鬧鐘的設計是一個已經解決了的問題,但Simplebots開啟了一個新的概念,設計了一個純粹的數字化背景。

222

在Rise這個app中,用戶通過創新的全屏幕滑塊這種方式來設置時間,相應的,背景顏色會對應天空的顏色發生變化。

Rise的界面中有一個全屏幕的滑塊,根據你設定的時間, 背景顏色會變為相應的天空顏色。界面完全沒有模仿一個現實的鬧鐘或者擬真的滑動條和質感。相反,設計師完全利用了手機的觸摸屏幕,創造出一種從地面升起的 體驗。這個創新性的設計不僅極大的提升了用戶體驗,也讓這款app在其他同類app中脫穎而出。

只有充分的利用數字屏幕的創造性而不是照搬現實生活中的樣 式才能設計出像Rise這樣的界面。電子屏可以實現抽象的形式、動畫、鮮艷的色彩和色調均勻。而不用局限于僅有的幾種色調、靜態展示和擬物化的形式。通過 柵格來規劃頁面內容,我們可以得出更好,更簡單的解決方案,設計出創新的界面,讓用戶有賓至如歸的感覺。

最近流行的“扁平化”的設計風格也許會是一個趨勢,也體現 了在設計上追求還原本真,摒棄多余的裝飾,并專注于內容本身的愿望。技術的發展有時會導致一些無意義的設計,就像在19世紀機械化批量生產引起的過度裝 飾,以及在早年的網頁和軟件設計中的樣式設計。隨著時間的推移,現代主義的一些先驅看到了功能設計中的美,從而使得浮夸的裝飾行為得到遏制。同樣的,今天 軟件中的過度設計也會隨著對本真設計意識的蘇醒而逐漸被淘汰的。

參考

  • Bauhaus, Frank Whitford?(2010: Thames & Hudson)
  • Twentieth-Century Design, Jonathan M. Woodham?(1997: Oxford University Press)
  • Pioneers of Modern Design, Nikolaus Pevsner?(1991: Penguin Books)
  • The Language of Things, Deyan Sudjic?(2009: Penguin Books)
  • The Laws of Simplicity, John Maeda?(2006: MIT Press)

    原文來自:淘寶UED

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發揮!