2022-5-21 純純
簡單講，新擬態(tài)是一種圖形樣式，其原理是為界面的UI元素賦予真實感。
其實他也是算擬物風格的一種，只不過表現(xiàn)形式不一樣，最早出現(xiàn)在追波上，從2020年慢慢被大家熟知，討論，重視起來。暫且不論是不是未來的必然趨勢之一，一個事物的興起多少是有些道理，我們持辯證的眼光去看到，去學習、去了解便好。
原生名詞有幾個叫法，Neumorphism / soft ui，翻譯過來叫新擬態(tài)或者是軟ui。其實按照我們國內(nèi)的翻譯應該叫，新擬物風格。Neumorphism，是New +Skeuomorphism的組合詞。
地球是圓的，很多事情總是輪回的，原理是不變的，只不過是換了一種表達方式出現(xiàn)在我們的面前，在了解新擬物之前，先簡單說下UI整個風格的發(fā)展歷史，
說起ui設計風格不得不說起我們喬老爺子了，在2007時候年最早的iphone手機的手機界面就是擬物風格的，那時候覺得怎么會有那么好看的界面，設置圖標的齒輪，閱讀器的書架，以前的youtube圖標還是一個小小的電視，從而掀起一波擬物圖標風格流行趨勢。
說起擬物風格，不得不提一下當年的擬物大神——MIke，當時在追波掀起一波轟動，在國內(nèi)也迎來一陣臨摹潮，我還記得那時候我還臨摹過下面那只鋼筆，還有那個馬卡龍蛋糕，都是滿滿的回憶。對于當時MIke大神作品，用現(xiàn)在話說，奈何沒文化，一句臥槽走天下... ...
到了2014年，蘋果對界面進行了“扁平化”處理，以使外觀更簡單，同時又使其用戶易于理解。一直到今天扁平化設計風格仍然是UI設計的標準。
其實最早最早將扁平化風格設計運用在產(chǎn)品中的公司是微軟。他在Windows 8系統(tǒng)使用扁平化設計語言，但是Windows 8一直飽受爭議，但是反響并沒有很好。
Window 8平面設計示例
還是從追波說起，這一切的開始是源于在2019年11月05日的在Dribbble-Alexander Plyuto發(fā)布的作品，獲得了26W+的瀏覽，4400個贊，以及1800個收藏。以后在Dribbble上便成為流行，在探索更多的可能性。
再說新擬態(tài)有什么特點之前，我們先看幾個比較典型代表的視覺作品，以便于更好的了解這一風格
我們看下上面的一些視覺作品，第一眼看到比較明顯的是，在一些可點擊區(qū)域做了一些“浮雕”效果，點擊狀態(tài)和非點擊狀態(tài)，在視覺處理上是未選中狀態(tài)是凸出來的，已經(jīng)選中狀態(tài)是凹進去的，但顯然凹凸之間是有很多質(zhì)感細節(jié)處理的，等下再實操組件部分會講解到。
左上角亮色投影，右下角深色投影（有且只有一個光源照射）
元素與背景對比度比較弱
常常用于按鈕組件和卡片
按鈕狀態(tài)，視覺上凸出代表未選中，凹進去表示已選中狀態(tài)
1.有且只有一個光源照射
那作者在追波上按鈕也好還是卡片處理也好，仔細觀察不難發(fā)現(xiàn)，它定了一個光源，是從左上向右下照射的，所以，越靠近光源的部分，越亮，遠離光源的越暗（素描的繪畫時常常用到）。因為新擬態(tài)的光源是唯一的，是從左上角照射的，所以就不難解釋，或者分析得到，左上角亮色投影，右下角深色投影。這一基礎規(guī)律，不單單適用于新擬態(tài)風格的按鈕，它還適用于所有新擬態(tài)風格表現(xiàn)手法的視覺組件。
可以看到下圖，卡片、轉(zhuǎn)盤、按鈕，他們的受光面都是在左上角。
這里就要講一下，另一個叫法了soft ui，即軟ui。軟，有柔和的意思。為什么這么命名呢？其實就是由于新擬態(tài)的組件與背景的對比度很弱，我把收集到的幾千張素材中，挑選一部分進行進行色值對比，可以發(fā)現(xiàn)無論是亮色模式下和暗色模式下對比度都是很低的。
按鈕、投影、背景之間的關系都處理的非常柔和，這是新擬態(tài)的特征之一
素材庫
基于這一點，其實我們只要建立好卡片的和按鈕的樣式組件，新擬態(tài)在設計層的表現(xiàn)就可以高效率的實現(xiàn)，可能稍微麻煩的就是，在一些質(zhì)感細節(jié)上做一些優(yōu)化，前面也說到，新擬態(tài)是一種無紋理的擬物風。所以想要表現(xiàn)卡片/按鈕的質(zhì)感，在光影、厚度細節(jié)上，需要做更多的細節(jié)處理。
比如卡片的厚度感細節(jié)的處理，為了體現(xiàn)銀行卡的厚度感，在卡片增加了一個對角漸變描邊，從漸變色塊可以看到，漸變的規(guī)律，也是遵循“有且有個光源”定義的，靠近光源的是純白，近暗色投影端是比投影更重的一點的描邊色。
這樣做的好處不單單是為了體現(xiàn)卡片的厚度，因為我們前面講到，新擬態(tài)是軟ui，是對比很弱的。風格柔和帶來的另個一個不太好的就是，界面清晰度不夠，很容易把視覺處理“糊掉”。所以，增加對角漸變描邊在一定程度上也起到了，讓界面的視覺層級更加清新的作用。在實操部分，將會一一拆解各種情況的一些處理方式。
在新擬態(tài)中，視覺上凸出代表未選中，凹進去表示已選中狀態(tài)。是大部分人的處理方式，在這一小節(jié)里，先討論大部分的，在實操部分在列舉其他的處理手法。
這里可以明顯感受到，按鈕狀態(tài)的區(qū)別，凸出/懸浮的是沒有選中狀態(tài)，凹陷下去的是選中狀態(tài)。
細節(jié)觀察，新擬態(tài)風格，在按鈕上面的元素是做了內(nèi)陰影處理的，看起來有一點點雕刻的感覺，
在選中狀態(tài)按鈕的處理，首先是在光源的處理上是統(tǒng)一的，加上光影的處理，就很容易做出來凹進去的感覺，想要是凹槽的厚度感、質(zhì)感看起來更加舒服，這里的處理方式和卡片的處理方式原理一樣，添加漸變描邊就可以解決。
這里影響新擬態(tài)界面的可見性，主要有兩個因素，一個是可見性，另一個就是視覺層級關系。
識別度
前面我們說到，新擬態(tài)的的一個設計風格特點，就是低對比，弱對比。帶來界面柔和一面的同時，在視覺層上，也會很容易出現(xiàn)界面”糊掉“的一些情況，這樣就非常不利于信息的傳遞。試想，一個頁面從色調(diào)、按鈕、布局、交互上都很好，但是，就是看不清哪跟哪兒（識別度），那設計出來的東西是沒辦法落地的，頂多是個好看的花瓶。
所以，在設計新擬態(tài)風格的時候，需要格外的注意界面的識別度。但同時也要注意，界面的投影不能太重，如果太重，界面就很容易顯得“臟”。
那么，前面講到的，卡片厚度的塑造方法（增加漸變外描邊）可以在一定程度上提高界面的識別度，提高信息的傳遞。
因為新擬態(tài)風格的基礎原理是依托光影關系來塑造的，那在很多樣式組件界面中，就會產(chǎn)生很多懸浮或者下凹的投影，那么在很多時候是很難區(qū)分視覺層級關系的，用戶在看到這樣的界面的時候，第一時間會覺得頁面很“滿”，用戶就無從下手。
所以在做新擬態(tài)設計風格時候，一定要學會“視覺降噪”，需要避免整個頁面都很滿，最重要的是克制。
那前面說到可見性和視覺層級，這兩點是易用性原則里面的基礎組成部分，如果基礎組成部分都沒有得到很好的解決的話，那產(chǎn)品的易用性就無從談起。能用、好用的產(chǎn)品是前提，美感是對產(chǎn)品易用性的補充，能用、好用才是核心。
所以在設計新擬態(tài)風格的時候，對頁面的信息層級細分要求更高，對這個頁面的節(jié)奏處理需要更細膩，對用戶體驗的理解需要更加徹底，在商業(yè)與交互層面的持衡中，需要考慮的層面有多一個比較關鍵維度的考量——可見性
那么當我們可以處理好頁面元素之間的關系，也滿足易用性基本原則的時候，新擬態(tài)帶來的局限性將會變得不那么重要。
針對前面我們說到新擬態(tài)的一些特點，一些局限，目前比較適合以下兩個大類產(chǎn)品。
工具類的APP內(nèi)容相對固定，不需要時時更新，這樣設計師在視覺風格方面的表達空間更大一些。在追波上，發(fā)現(xiàn)大部分的作品都是偏工具類的
和工具類APP一樣，這些類頁面上運營性質(zhì)的東西相對較少，內(nèi)容的形式相對可控。
那么，大家最關心的問題來了，新擬態(tài)到底是不是2020年即將要流行的設計風格？相信 大家最近這段時間多多少少也看過很多關于新擬態(tài)一些介紹，在趨勢文章里面或者在其他文章里面看到。
首先必須得中肯的說，像大多數(shù)設計趨勢一樣，新擬態(tài)是設計用戶界面的一種看起來視覺比較新穎的表現(xiàn)手法，讓產(chǎn)品界面看起來既柔軟又方便，但是它也存在一些局限，前面我們也提到一些，比如它實現(xiàn)起來還是有一點難度，也不夠靈活等等
但是我說一點不同的是，這也是我一直認為的一點，就是UI設計運營化，運營設計游戲化，這是未來的趨勢。
反觀我們APP的主要生力軍，90、00這一批人，其實他們就是互聯(lián)網(wǎng)的原住民，他們就是在這注重交互，注重游戲化體驗的大環(huán)境出生的，成長起來的，所以他們對這些東西是非常了解的，他們也能接受這種游戲ui，這種寫實的東西，包括現(xiàn)在的這種體驗。
當然，趨勢不是我們預測的，因為只要蘋果出一個新的設計風格，那個風格就會是成為新的設計趨勢，目前來看，這是必然的。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 原創(chuàng)：木七設設計坊
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍藍設計( www.bouu.cn )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數(shù)據(jù)可視化設計公司、UI交互設計公司、高端網(wǎng)站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司