前言
首先定義下所謂行業。美柚是一個工具，但也不僅僅只是一個工具。我們致力于為女性提供一種新的生活方式，提供包含健康管理、問題解決、娛樂交流、電商購物等服務。
從功能上進行拆解，把美柚可以劃分為工具、社交、電商、母嬰四個大類。
在這四大領域中，我們從易觀千帆、艾瑞指數、七麥數據、蟬大師等相關指數平臺，篩選相關行業的主流應用進行分析，總結出2021年美柚相關行業設計趨勢。
所選應用應該也是我們日常生活中大家比較常用的，工具類所含的「健康醫美」也是近年來比較受關注的一點。
整體分析將從視覺表現以及人文關懷兩方面展開。7:3的內容比例，以下分析案例包含但不僅限于上述20個應用。
第一章 · 視覺表現
1.1 明亮飽和的主色
互聯網行業發展日趨成熟，早已進入爭奪用戶時間的階段。不計其數的應用，多元的信息，都在促使我們需要一開始就吸引用戶。
對于品牌色的選擇，并不只取決于應用本身，還有「競爭」，如何在成山成海的應用列表中一開始吸引用戶，給用戶留下深刻的印象，是定義品牌色時需要思考的。
這幾年，有許多應用對其品牌色進行調整。強如國民級應用-「支付寶」和「淘寶」，也需要在被追趕的壓力下不斷調整策略。大多調整方式，是輕微變動其色相外，提升色彩的飽和度與明度，讓產品本身更跳躍。
將拾色器劃分為9宮格，通過對所選應用主色在拾色器中的觀察，可以發現大部分APP主色的趨勢為：高明度、高飽和度的色彩。即拾色器的右上角區域。
母嬰孕育類產品的主色選擇則更偏向中度飽和。顏色飽和度更多偏向中右區域，這與品類本身柔和的氣質息息相關。
從趨勢上來說，更加明亮飽和的色彩能在一定程度上更加吸引用戶的注意力。當然，并非一味的高明度、高飽和度色彩就是最好的，仍然需要根據產品特性及方向進行正確的決策。
1.2 大圓角卡片
日常生活中，如果一件物體過于鋒利，就顯得不夠安全，比如我們常見的錘子，剪刀，給人的感覺都很尖銳。圓角矩形在生活中也是非常常見的，如電腦、平板、桌子等等。巴羅神經學研究所關于“角”的研究發現：角的突顯性感知與角的度數的線性變化，銳角比鈍角產生更強的虛幻的突顯性，因而圓角的設計比直角更具有溫度感。
蘋果新系統（Big Sur），窗口四角從以前的10px增加到20px，控制中心也沿用了ios14的卡片設計風格和布局。微軟win10的概念稿中也出現了圓角。我們可以確信，圓角矩形將會在未來一段時間內繼續風行。
· 邊距卡片布局
卡片設計的本質是將信息整合，建立更清晰的頁面結構，同時擁有更強的交互能力。 從以下截圖中可以看到不論什么行業，卡片布局對于框架結構的承載都是極其優秀的。
· 懸浮卡片
iOS 13開始，模態面板采用新的卡片形式。模態面板在操作時會有一個縱深的效果，適用于單手操作。在Apple自帶應用中，模態面板得到了廣泛應用。
懸浮卡片在各大應用中的運用率極高，不止在于模態面板，也可以作為模塊區分。模態面板一般懸浮卡片有吸頂操作，而僅作模塊區分的懸浮卡片會跟隨內容移動。
· 大圓角
既然這個趨勢點命名為「大圓角卡片」，那么大圓角是必不可少的。
基于移動端屏幕質量的進化，能更好的呈現圓角的質感，圓角開始被廣泛使用。從蘋果手機的進化，我們也能明顯感受到其圓角的變化。隨著全面屏時代的來臨，圓角的弧度也越來越大。
可以感知到現在各大應用中的圓角相較于以往都是成倍數的增長。
圓角卡片會成為一個趨勢，主要在于兩點：一個是技術升級，現在的設備都能更好的對圓角進行渲染；
二是我們視網膜中視覺最敏銳的區域叫中央凹，它在處理運行時最快，圓角矩形在視覺識別過程更容易。
1.3 輕量漸變
過渡柔和的輕量漸變越來越受歡迎，其簡約兼顧美感的同時，也可以創造輕松、溫暖的氛圍?；仡欉^去一年，關于色彩的運用，在漸變色的使用上越來越理性和克制。
觀賞下追波上幾個輕量漸變的作品，可以在展示時作為背景使用，也可以在頁面背景上直接使用，都擁有不錯的視覺效果。
實際案例中，考拉、淘寶和小紅書的幾個頁面背景都使用的輕量漸變的效果。我們常常使用的視頻軟件 騰訊和優酷 也開始在頁面背景中使用輕量漸變進行氛圍烘托。
除了頁面背景，在單獨卡片背景我們也可以看到越來愈多使用輕量漸變的效果。這個位置漸變的使用會更加克制一些。
1.4 磨砂玻璃
磨砂玻璃主要基于「背景模糊」的效果。與過去的毛玻璃有所不同的是，磨砂玻璃模擬現實玻璃的效果，具有更強的通透感和層次感，帶有柔光的感覺。
一樣磨砂玻璃的技法，不同的色彩與透明度，所表現的效果是有區別的。
實際運用中，圖標和圖片都可以做磨砂效果。
玻璃效果的圖標層次感更好，有效提升視覺表現力。不過如果大片運用的話可能會引起視覺疲勞，能否成為一個成量級使用的趨勢還有待時間的考證。
彩色背景或圖像經過玻璃效果的疊加顯示更加柔和，同時不影響前置文本的可讀性。這一點我覺得未來可能會運用的更多。
1.5 溫和彩色系圖標
這里需要著重強調下「系列」，是一整組的彩色圖標。
過度的使用高飽和色彩會引起視覺疲勞，在同一場景下，一整套多彩圖標偏向使用更加溫和的彩能傳遞平靜且更加柔軟的情緒。
大部分彩色系圖標處理方式有這幾種方式：
- 同色系疊加-圖形帶透明度產生疊加的視覺效果；
- 飽和相對較低的單色或同色微漸變；
- 微漸變主體+同色淺色底板
它們的統一特性就是成系列的彩色圖標，飽和低不高，視覺感受輕松柔和。
1.6 圖形三維化
手機屏幕進入高分辨率時代，屏幕色彩也更加的準確，現代的前端框架可以承載更加精細的畫面以及減少頁面的加載時長。三維可以創造更多元的設計感官，在UI中開始變得越來越受歡迎。毋庸置疑，3D在2021年會變的更加流行。
3D可以塑造更強的空間感。在UI運用中的3D效果不追求過分逼真和完全擬物的光澤感，以簡約的造型和豐富明快的顏色提升設計感。
視覺三維化以更加立體、更具視覺沖擊力的形象強化用戶對內容的感知。IP形象三維化可以給用戶建立更加立體的品牌認知。也可以運用在運營圖中增加圖片的沖擊感。
圖標三維化，在立體感上可以再稍微弱化。Big Sur系統采用擬態圖標，既是一個新嘗試也是開始。我們可以大膽預測，未來將會在更多設計中看到輕擬物圖標。我們可以大膽預測，未來將會在更多設計中看到輕擬物圖標。
在時刻需要掠奪用戶注意力的時代，極簡扁平的視覺已到了極限。但全局擬物的設計勢必影響信息獲取效率，因而輕擬物圖標一般運用在關鍵功能入口上，不適宜大面積使用。
1.7 數據可視化
大數據時代，數據的展示是必不可少的，借助圖形化手段，更加清晰有效的傳達信息。讓美學和功能齊頭并進，整合稀疏而又復雜的數據集，這就是我們常說的數據可視化。
也可以理解為我們常說的圖表，看下實際案例中，不同行業有關數據的展示都進行了可視化表達。
第二章 · 人文關懷
2.1 關注隱私保護
大數據時代加快科技、社會發展的速度，同時也讓網絡時代下隱私保護的倫理問題進一步演化。互聯網便利的同時也滋生科技隱私的信任危機。
隱私保護技術不完善、法律不健全、意識不充分；國內尚在制定中的《個人信息保護法》無一不在提示我們應當關注隱私保護。
投射到應用中，我們如何能做的讓用戶感知自己隱私得到保護呢？
- 支付寶-多窗口模糊處理、付款二維碼界面截圖時會做模糊處理并在文字上進一步提示，是對金融資產的保護；
- 餓了么-電話呼出，使用加密虛擬號碼，這也是近年來幾乎都會使用的對通訊隱私的保護方式；
- 百度-無痕瀏覽是對搜索信息的保護
2.2 智能化
在互聯網、大數據的支持下，應當具有滿足人的各種需求的屬性。一般來說，智能化我們都在說某一個系統或者設備，其實APP應用也可以通過細枝末節的展示給予用戶智能化的感覺。
· 記住用戶的選擇
餓了么提交訂單頁面，當你選擇以后都需要餐具，后續每一次訂單都會默認「需要餐具」。記住用戶的選擇，不要讓用戶總是重復同一個選擇，提升操作效率。
· 告知用戶進度
keep進入「我學過的課程」會顯示上次學習時間，在相關課程詳情頁幫助用戶記錄訓練次數。告知用戶進度，不會疑惑當前事項是否曾經操作過。
2.3 生活化
我們說了很多年的情感化設計，今天來說說更加生活的情感化，我在這里稱它為「生活化」。在更加浮躁的網絡時代，以更加生活化的情感來貼近用戶，引起共鳴。
薄荷健康首頁每天都會出現不同的壁紙，上面都附有很詩意的句子，如“你做三四月的事，在八九月自有答案”，“要有大大小小的期待，生活才不會百無聊賴”。看著是雞湯了一點，但是感覺陽光燦爛的一點呢。
丁香醫生下拉刷新隨機出現的文案也是非常生活化，“耳屎不用掏的太干凈”“口水消毒不靠譜”“腳臭的不一定有腳氣”，諸如此類，既貼近生活又帶點小科普，非常符合健康應用的調性。
結語
趨勢具有周期性且永不止息。我們無法預知未來什么樣的設計會脫引而出引領潮流。我們能做的是先行感知可能成為趨勢的設計，在變革到來之前擁抱變化。
流行是量級，趨勢是方向，一個流行的設計是否成為趨勢要在一個周期內的量來判斷。蘋果作為硬件乃至互聯網行業的先驅者，他們的每一次設計變革較大概率上都預示著視覺的革新。
原文地址：站酷
作者：草莓設計說
團隊：美柚用戶體驗設計中心
轉載請注明：學UI網》實例解析2021年UI設計流行趨勢 — 美柚UED
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( m.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務