UI 設計:如何提高審美能力?

2 評論 14651 瀏覽 61 收藏 26 分鐘

美學是 UI 設計的核心價值,要想讓產品體現出美學的力量,首要之務就是提高對美的認知能力與審美能力,進而踐行自己對美學的認知,將其體現在 UI 設計中。

UI 設計的核心價值是美學,這一篇就探討下“如何做到美”。最核心、最基礎的是,要先成為美的欣賞者。換句話說,要擁有較高的審美。

關于審美,會分成三個部分來探討,分別是:美是什么,審美來自哪里,如何提高審美。

01 美是什么?

分別從生活、學術的角度來探討下這個問題。

1. 生活角度的美

生活中有兩種美,分別是:自然之美、人造之美。

  • 所謂自然之美,是指大自然的鬼斧神工,比如山川湖海之美,比如包括人在內的各種生物之美。
  • 所謂人造之美,是指人類發明創造的各種物質和文化之美,比如建筑、詩歌、手機、書法之美,比如 UI 設計之美。

針對自然之美和人造之美,人類的審美有兩個特性,分別是:共性、差異性。

所謂審美的共性,是指人類在欣賞自然之美時,所表現出來的高度一致。

比如黃山的美是世界公認的,奧黛麗?赫本的美也是世界公認的,幼兒園里班花的美在小朋友當中也基本是公認的。

相應地,所謂審美的差異性,是指人類在欣賞人造之美時,所表現出來的差異。

比如一個關注流行與時尚的單身青年,過年回家的時候,很可能會被并不關心流行與時尚的父母這樣說:那啥,你姑準備給你介紹個對象……這身衣服不好看,上街買身好看的吧。

我們平常說的“審美”,更多是指人類在欣賞人造之美時所呈現出來的差異。這也是本文探討的“審美”。

2. 學術角度的美

從學術角度來看,美來自美感。而美感與好感緊密相連。

  • 能夠滿足人們主觀需求的客觀事物,會給人帶來快樂的感覺,這種快樂的感覺就是“好感”。
  • 這種客觀事物的形態特征也會給人帶來快樂的感覺,這種快樂的感覺被稱之為“美感”。

比如筆者喜歡匡威經典款帆布鞋(All Star 系列),那我就會對它有好感。當我在街上或商場里看到它的時候,精神上就會產生一絲愉悅的感覺,這種愉悅的感覺就是美感,我會覺得匡威經典款帆布鞋是美的。

一個喜歡奢侈品的女孩對 LV 的包包有好感,并且覺得它很美,也是類似的道理。

能夠滿足人們主觀需求的客觀事物,就是人的價值取向。通俗來講,可以說是人們喜歡的事物。

學術意義上的“好感”,還有一個重要的前提,就是人們感覺到自己的主觀需求被客觀事物滿足了。也就是說,當擁有喜歡的事物時,才會產生“好感”。

而我們平常說的“好感”,和是否擁有自己喜歡的事物沒有必然聯系。比如,不管我有沒有買匡威經典款帆布鞋,我都會對它有“好感”。但當我買它的時候,我對它的“好感”一定會達到一個巔峰——各位想象一下自己血拼完后的心情就知道了。

學術意義上的“美感”,則主要得益于喜歡的事物的外在形態。也就是說,當你看到自己喜歡的事物時,無須擁有它,美感和美就會產生。

所以,相對而言,“好感”偏物質化,“美感”和美偏精神化,也就是我們在上一篇所說的:美學是一種精神追求。

學術或者美學角度的美,可以分成兩類,分別是:視覺之美、精神之美。

  • 所謂視覺之美,是指外在形態之美或表現形式之美。比如企鵝胖墩墩、走起來一搖一擺的體態。
  • 所謂精神之美,是指視覺之美的精神內涵。比如企鵝胖墩墩、走起來一搖一擺的體態會讓人覺得憨厚、可愛。

再比如石墨文檔的 UI 設計,我們會覺得好看,有一種中式美學在里面,讓人覺得安靜、優雅。這里包含安靜、優雅在內的中式美學就屬于精神之美,石墨文檔的 UI 設計本身,則屬于視覺之美。

朱光潛先生在《談美》一書中提到:

“美之中要有人情也要有物理,二者缺一都不能見出美。再拿欣賞古松的例子來說,松的蒼翠勁直是物理,松的清風亮節是人情?!?。

“視覺之美”對應“物理”,“精神之美”對應“人情”。

喬治?桑塔耶納先生在《美感》一書中提到:

“我們可以從一切表現中區分出兩相來,第一相是實際呈現的對象,包括字詞、意象等具有表現力的東西。第二相是暗示出的對象,包括更深遠的思想、感情或者由此喚醒的意象等被表現出的東西”。

“視覺之美”對應“第一相”,“精神之美”對應“第二相”。

再來看下,視覺之美和精神之美之間存在怎樣的關系:

朱光潛先生的觀點是,“二者缺一都不能見出美”;喬治?桑塔耶納先生的觀點是,“如果價值完全存在于第一相中,就不會有美的表現?!?/p>

也就是說,視覺之美和精神之美,要么同時存在,要么同時不存在。先有視覺之美,之后引出精神之美;如果引不出精神之美,視覺之美也不會成立。

人類的大腦,仿佛有一個龐大的數據庫,專門用來存放關于美的精神和意識,包括但不限于上文提到的憨厚、可愛、安靜、優雅等。我們姑且稱之為“美學數據庫”。

當視覺之美映入眼簾時,大腦就會馬上去這個“美學數據庫”索引。當索引到對應的精神和意識時,精神之美就會馬上出現,視覺之美也隨即成立;當索引不到對應的精神和意識時,精神之美就不會出現,視覺之美也不會成立。

精神之美還有兩樣很特殊的美,那就是真和善。如果把精神之美比做一座金字塔的話,真和善既在塔底,也在塔尖

之所以說真和善在塔尖,是因為人類擁有高級文明,贊美真和善、追求真和善,但是真假、善惡共存于人間,要想永遠保持真和善很難,要想做到至真至善更難。

之所以說真和善也在塔底,是因為一旦在真和善上有缺陷,其它精神之美就會跟著衰減,甚至會給人一種“金玉其外,敗絮其中”的感覺。而一旦在真和善上有嚴重缺陷,其它精神之美甚至會瞬間崩塌,個別名人因為丑聞而形象崩塌就是典型例子之一。

02? 審美來自哪里?

審美主要在后天形成,同時也受先天影響。

1. 后天形成

從前文我們知道,美有一個非常重要影響因素,那就是大腦中負責儲存“精神之美”的“美學數據庫”。“美學數據庫”主要形成于后天。

以上是學術角度,再來看看生活角度的情況。

據筆者觀察,有很多兄弟姐妹,小時候的生活環境完全一樣,讀的學校也一樣,但他們的審美卻有比較大的差異。一般到中學、甚至在小學的高年級階段,這種審美差異就會在各自挑選的衣服、鞋子等物品上表現出來。

審美主要在后天形成。無論是學術理論還是生活經驗,都說明了這一點。

2. 受先天影響

天生內向的人,成年后很大概率會喜歡內斂一點的設計風格。天生外向的人則相反。

認真、探索這些品質,有些孩子生下來就有。在幼年和童年時期,當語文課本、課外讀物、動畫影視劇等內容為所有孩子打開一扇精神世界的大門時,天生具備認真、探索品質的孩子,可能會更快熟悉這個精神世界,并更多吸收其中的養分。

這些精神養分,會包含之前提到的“美學數據庫”,所以對培養審美很有幫助。也就是說,一些天生好品質,有利于培養審美。

即便如此,我們也不必悲觀。因為絕大部分好品質,都可以通過后天培養出來。

03? UI 設計:如何提高審美?

既然審美主要在后天形成,那一定是可以培養和提高的。

對設計師而言,審美一般有三個步驟,分別是:入眼、入心、入腦。

對大眾而言,審美一般只有“入眼”、“入心”這兩個步驟。

  • 所謂入眼,是指看到“視覺之美”,或被“視覺之美”吸引;
  • 所謂入心,是內心感受到“視覺之美”的“精神之美”;
  • 所謂入腦,有點類似我們平常說的“職業病”——設計師可能會簡單拆解“視覺之美”和“精神之美”,并分析它們是怎么實現的。

結合審美三步驟,提高審美也可以分成三個階段,那就是:入心,入眼,入腦。

注意,這里是“入心”在前,”入眼“在后。初始階段,按照這個順序來,往往會事半功倍。到了中后期,則不必拘泥順序,交叉進行即可。

1. 先入心:先豐富心中的“精神之美”

我們常說,生活中不缺少美,而是缺少發現美的眼睛。

這句話可以有兩種理解:

  • 第一,確實沒有留意到生活中的“視覺之美”,也就沒有下文了;
  • 第二,看到了生活中的”視覺之美“,但是沒有引出”精神之美“,最終沒有出現美。

不管是哪種情況,其根本原因都是內心缺少對應的“精神之美”,也就是大腦中的“美學數據庫”比較貧乏。

所以,提高審美,最基礎也是最核心的,就是豐富大腦中的“美學數據庫”。因為“美學數據庫”將會直接決定,我們是否能感知到美,以及是否能輸出美。

如果“美學數據庫”比較貧乏,看再多優秀的設計作品,也很難吸收到其中的“精神之美”。沒有“精神之美”,美和好看就不會成立。

舞蹈最重要的是感染力,這是易烊千璽在《這就是街舞》里說過的一句話。設計最重要的,也是感染力。

當我們的“美學數據庫”比較豐富,同時我們能夠嫻熟運用里面的“精神之美”時,我們的設計才有可能充滿感染力。

如何豐富“美學數據庫”?

最基礎的方法就是提升人文素養,因為人文領域有豐富的“精神之美”。最便捷的方式就是借助書影音,這個在《交互設計:如何做到品質?》一文中有詳述,此處不再贅述。

這里做個補充,就是要吸收什么樣的“精神之美”?

首先,是關于廣度。

這個世界上有大量普世的“精神之美”,比如簡潔、活力、安靜、干凈、利落、帥、酷、歡樂、可愛、溫潤、知性、力量、專業,等等。設計從業者(設計師和設計決策者)需要廣泛吸收普世的“精神之美”,涉獵越廣越好。

涉獵廣有兩個必要:

  • 第一,不管以后做什么風格的設計,這些普世的“精神之美”都是基礎素材庫,屬于“原始積累”。比如 B 站和抖音的設計風格相去甚遠,但它們都會通過大圓角和肉乎乎的圖標,來營造“可愛”和“親切”的感覺。
  • 第二,只有涉獵廣泛,我們才有可能欣賞并學習各種各樣的設計、各種各樣的美。

其次,是關于深度。

關于“精神之美”,每個設計師、乃至每個人,都會有自己的偏好。每個設計師都應該盡早找到自己的審美偏好,并通過深耕的方式盡可能成為這個風格領域的專家。

最后,是關于流行趨勢和時代審美。

流行趨勢,可以結合實際情況來參考,但是沒必要一味的盲目的追隨。

既要關注流行趨勢,更要把握時代審美,這里有兩個原因:

  • 第一,一定程度上,是“鐵打的時代審美,流水的流行趨勢”;
  • 第二,當我們討論流行趨勢時,更多是在討論表現形式,而時代審美會讓人更多聯想到內容和內涵,形式服務內容,流行趨勢服務時代審美。

時代審美是個大話題,筆者希望能夠拋磚引玉。大概因為在全球化進程中我們還是一個發展中國家,所以不管是 UI 設計還是服裝設計等其它設計,歐美日韓審美仍然占據絕對優勢,此其一;其二,我們生活在一個信息爆炸,同時物質豐富、誘惑豐富、焦慮豐富的時代,在這樣的背景下,我們也會向以中式和日式為代表、并具備古雅詩意特色的東方美學尋求精神慰藉。

由于日本設計和經濟在全球的影響力,再加上中國傳統文化的深厚底蘊及其在全球的影響力,以及中國在經濟上的崛起,東方美學不只在中國、日本,在全球都占據一席之地。

整體而言,時代審美的主旋律就是:簡潔、東西方美學融合、東方美學小規模復興。

蘋果的設計,本身就是東西方美學融合的典型代表。蘋果的設計作為歐美審美的典型代表,因受喬布斯審美影響,本身也包含禪文化、日式美學這些東方美學的元素。前文提到的石墨文檔的設計,乃至李子柒的視頻,本身都是東方美學小規模復興的典型代表。

其實不止 UI 設計,華語樂壇的例子也是極其類似:

一方面,中國風這種東方審美一直占一定的市場份額,比如周杰倫的曲風。

另一方面,東西融合也出現在越來越多的音樂和對應的專輯封面等視覺設計中,比如李宇春的《流行》這張專輯:《流行》這首歌融合了歐美的電子音樂和中式竹笛;專輯封面里熱情、利落、帶有批判思維(流行二字反著寫,反“流行”)、并具備一定科技感和未來感的紅色字體偏向西方美學,功夫服裝和復古破舊教室則偏向東方美學。

最后,關于東方美學中的中國傳統文化之美,推薦大家去看李澤厚先生的《美的歷程》。

2. 再入眼:再多看優秀作品

當大腦中的“美學數據庫”比較豐富時,就可以進行較大規模的“入眼”練習——多看優秀作品。

優秀作品可以分成三類,分別是:設計作品、旅行見聞、日常見聞。

先說設計作品:

設計師應該多看不同類別的設計,包括但不限于平面、UI、網頁、插畫、攝影、動效設計、字體設計、工業設計、空間設計,等等。

最核心的有三大類,分別是:平面、UI 和網頁、插畫和攝影。因為平面是一切的基礎,UI 和網頁是我們的基礎工作,插畫和攝影有著非常豐富的“精神之美”。

途徑主要分上線作品和線上作品,線上作品這塊推薦站酷、Dribbble、Behance、500px、花瓣、Pinterest 等。

每個設計從業者都應該盡早找到自己的審美偏好,并在這個偏好范圍內去尋找最優秀的設計作品和設計師。

再說旅行見聞:

好的設計需要靈感,而旅行見聞,可能會提供豐富的靈感素材。旅行之美大致可以分成三類:自然風光、建筑特色、人文特色。比如蒼山洱海的蒼茫與嫻靜,比如浦東圖書館“透明”(全玻璃幕墻,陽光全部灑進來)與“自然”(木質家具、木質環廊,以及外圍的綠化帶)的設計理念,比如重慶那種將山水與煙火氣息、文藝氣息和江湖氣息糅合在一起的獨特魅力。

這些旅行見聞之美,當放下雜務放空自己,帶著欣賞的心態身臨其境時,會留下深刻印象。日后也會在需要靈感的時候,很自然的從腦海里蹦出來。

最后說日常見聞:

日常見聞,就是在街上、商場、公園或看影視、視頻時看到的關于美的一切。比如公園里很吸引你的一件衣服,商場里讓你眼前一亮的一個品牌 logo,電視劇中深得你心的一款眼鏡。日常見聞之美會比較繁雜,而且也不如旅行見聞之美那么印象深刻,但它就像吃飯睡覺一樣構成了我們審美的日常練習,而且也是感知流行感知美、以及積累靈感素材的重要途徑。

看設計作品,始終都是主動尋找、主動吸收。

欣賞旅行見聞之美和日常見聞之美,一開始可以是主動尋找。等到大腦中的“美學數據庫”足夠豐富時,這種主動尋找就會變成被動接收,就會變成一件很自然的事情,這也是最理想的狀態。

3. 后入腦:最后多做動腦與動手并重的練習

對于美的欣賞能力和鑒賞能力是基本功,有了一定的基本功,就可以通過作品來表達美。世人常說,設計師要靠作品說話。作品既用來表達美,也用來證明設計師的審美。

用作品去表達美,除了練習,別無他法。

練習時會涉及到 UI 設計中的“科學”,這個在下一篇會詳細論述。此處先用兩個建議預熱一下。

首先,把表達美里的“表達”拆成兩個步驟:第一步是精確描述,動腦多一些;第二步才是作品,動腦與動手并重

精確描述是通過語言和參考作品對設計風格進行盡可能精確的描述。這個精確是指考慮周全、范圍清晰、邏輯合理且自洽。描述越精確,最終呈現的設計風格就會越合適、越和諧。

術業有專攻,很多時候,“精確描述”只能靠設計師去主導和推動。現實中,設計師可能會急于動手開工,也可能會迫于需求方急于看到設計成果的壓力,或者囿于業務能力、話語權等各種因素,最終沒有在“精確描述”上下足功夫。這種情況,就像是去參加一個高手如云的歌舞類選秀節目,自己卻沒有在唱歌方面做好準備。

所以,設計師一定要增強這方面的意識,并精進這方面的業務能力。

其次,練習無大小。不管是工作上的實際項目,還是業余時間大大小小的練習,只要認真對待,每一個細節,比如留白多少、圖標多大,都有很多學問,所以都可以做的很專業,最終都會收獲良多。

結語

生活中有自然之美和人造之美。欣賞自然之美時,人們會表現出高度一致;欣賞人造之美時,人們會表現出差異。我們平常說的“審美”,更多是指這種差異。

人們會對自己喜歡的事物抱有“好感”,這些事物的外在形態會給人帶來“美感”。

美可以分為“視覺之美”和“精神之美”。“精神之美”出現時,“視覺之美”會隨即成立;“精神之美”沒有出現,“視覺之美”也不會成立。

從根本上說,審美取決于大腦中儲存“精神之美”的“美學數據庫”?!懊缹W數據庫”主要成形于后天,所以審美主要來自后天。

設計師提高審美,最好的方法是先從根本入手,具體如下:

  1. 先豐富心中的“精神之美”,也即大腦中的“美學數據庫”,因為這是審美的根本所在;
  2. 再多看優秀作品,有了“美學數據庫”作基礎,映入眼簾的“視覺之美”會引出“精神之美”,此時美就會出現;
  3. 最后多做動腦與動手并重的練習,因為設計師的審美最終要靠作品說話。

也就是說:先入心,再入眼,后入腦。

相關文章

UI 設計的本質與價值

#專欄作家#

Leeo,微信公眾號:SnowDesignStudio,人人都是產品經理專欄作家。產品設計師,專注用戶體驗研究與設計。

本文原創發布于人人都是產品經理,未經許可,禁止轉載。

題圖來自Unsplash, 基于CC0協議

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 某看懂,內容太多,重點不突出

    來自北京 回復
    1. 內容多,我贊同。沒看懂那應該是個人問題吧。1、是什么。2、提高三個方向,定義與解釋。很清楚,怎么會沒看懂呢~~

      來自福建 回復