2019年UI設計趨勢
2019年的UI設計趨勢，從最近半年的Dribbble和Behance作品中可以窺得一斑，本文從三個大的方面，設計元素：顏色、形狀、版式、介面層次的使用，到不同設計種類：動效、微互動、3D、插畫、影片的運用，再到前沿科技領域的介面設計等來進行分析。
設計元素趨勢
1，色彩趨勢
潘通色彩研究所針對過去一年甚至更長時間維度上的文化和色彩趨勢進行廣泛分析之後，選出了這款 Living Coral —— 「活力珊瑚橙」 作為2019年的潘通年度流行色。
2，大膽的用色，更加生動的漸變
從去年開始，漸變設計就越來越流行，扁平化之後所進化出來的“微妙漸變”已經無法滿足需求，設計師在漸變的色彩梯度和縱深上，更加大膽了。
（1）Project： Grabient 2。0 | Author： Eddie Lobanovskiy；（2）Project：Valley Illustration | Author： J。HUA for Tunan；（3）Project：crypto app | Author： uixNinja
3，幾何流體、非對稱的形狀
混合了大膽的配色與強烈漸變的幾何流體、非對稱形狀是2019年必不可少的設計趨勢。
（1）Project： Dribbble Posts 2018 | Author： Lucas Berghoef；（2）Project： OXY | Author： Illia Nesterov ；（3）Project： LuxuryClean UI/UX iOS App | Author： Mariusz Mitkow
4，負空間
少即是多，近年來幾乎在所有的設計領域都可以看到負空間的運用，並且這樣的例子越來越多，在UI設計中使用也是一個不錯的創意。
Project： ZIPL v 3。0 | Author： Alexander Plyuto
Project： CAT Logo | Author： Yoga Perdana
5，柵格化和重疊元素
在過去的幾年裡，網頁設計中的重疊元素已經存在，結合柵格化可以建立獨特的創意佈局，不過在設計時要始終牢記移動端體驗。
（1）Project： Meaww | Author： Abhishek Biswas；（2）Project： Aero-Airline Flight Booking UI/UX| Author： Daniel Tan；（3）Project： FRASH Canada| Author： Slava Kornilov；（4）Project： The D。FY you know| Author： Soongyu Gwon；（5）Project：Citta|Furniture website concept| Author：Ovik Mooshlyan；（6）
6，粗體代替圖片
排版方面，很多大廠如蘋果，都在嘗試選擇透過獨特的字型排版風格來強調品牌感。
（1）Project： Yi Shi Portfolio | Author： Yi Shi；（2）Project： Bornfight-Digital Innovation Company | Author： Hrvoje Grubisic
7，深度扁平
扁平化的 UI 設計，在過去的幾年中一直是主流。最近扁平化UI設計，在視覺深度上開始發生明顯的變化，透過縱深的層次感區分標題、內容和背景，讓介面資訊層級更明確，而扁平依然是核心的特徵。
Project：Cards 3D transition | Author：Gleb Kuznetsov
設計種類應用趨勢
1，動效
近兩年來動畫效果持續升溫。瀏覽器和硬體的效能提升，使得動畫效果幾乎無處不在。可是，現在新的問題出現了，那就是設計師不僅要讓元素動起來，而且要更加合理地運動。
Author：Yup Nguyen
動效設計是一個典型的多學科交叉之後的產物，設計師不僅要懂得物體運動的物理規則，而且要懂得在 UI 和網頁中使用動效的心理學效應。設計師需要透過學習來了解如何合理、正確、有效地呈現動畫，傳遞資訊，確保體驗，還不會讓人厭倦。
Project：the_furrow_final | Author： Motion Design School
動效讓使用者更深層地參與到 UI介面當中，UI介面中每個元素的運動和變化都應該是有意義的。
Project：hero-motio | Author： Pitch
2，微互動
微互動效果是移動端上，常用於建立微妙視覺效果的小動畫，今年，我們比以往任何時候都要更關注這些微觀互動。
Project：Create New Document Tab Bar | Author：Hoang Nguyen
Project：Navigation Interactioon | Author：Mauricio Bucardo
3，3D和等距檢視
3D 和 CG技術的結合讓使用者在視覺上感覺彷彿是在和真實內容進行互動。
Project：ARTA / Art Gallery | Author： Mike
Project：3D flip menu | Author： Minh Pham
還有一種偽3D的處理方式，就是使用AE這樣的傳統工具，在二維平面上模擬物體的3D運動方式。
Project：Astronaut | Author： Markus Magnusson
雖然在過去的幾年中，我們已經看到了很多2。5D、C4D風格的設計，但隨著AR/VR/MR等這類真實世界三維空間的設計概念引入，以及插畫風格的大量運用，在2019年這類視覺效果將迎來最盛大的一年。
（1）Project：McDonald&；#39；s Monopoly | Author：MORPHINE Motion Graphics； （2）Project：10012 | Author：Igor Kozak；Rocketboy Studio； （3）Project：Increment Magissue | Author：Cristian Malagon Garcia，Nuria Madrid
4，真實圖片和扁平介面的混搭
真實圖片往往非常具有表現力，和扁平介面的混搭是2019的一大趨勢，簡單又高效的視覺傳達。
（1）Project： Puma sneaker shop。 | Author： Anton Mikhaltsov；（2）Project： Adidas - Online Store | Author： Luke Pachytel；（3）Project： Fish UI | Author： Vladimir Biondic
5，插畫設計
雖然今年插畫就已經很火了，但2019年的插畫設計應該會上升到一個新的高度，根據最近統計資料，插畫對使用者的視覺效果要比普通攝影照片好7倍之多。品牌們也越來越趨向於尋找充滿活力和風格的插畫作品來體現自己的品牌調性了，獨特的插畫和大膽的色彩一定會讓你在一眾素材拼貼大師中脫穎而出~
這些風格獨樹一幟的UI插畫的目的：尋求差異化，讓視覺和內容保持新鮮。
Project：How to stay scrappy。 | Author：ustin Tran for Dropbox Design
Project：Scooter| Author：Gal Shir
Project：cut-out-illustration | Author： Michael
6，有趣的吉祥物
有趣的小怪獸，經典或者原創的卡通人物，只存在於傳說和想象中的生物，從來都不會在 Dribbble 上缺席。利用有趣的吉祥物做出情感化設計，讓使用者印象深刻。
Project：Funtyx | Author： Mike
7，影片背景
研究表明，網站上的影片可以提高轉化率，2018年手機上的短影片也很火。影片相較於文字與圖片，可以在幾秒內傳達更多更清晰的內容，同時也能持續的吸引使用者的注意力。
Project：Vacances Air Canada | Digital Experience | Author：Agency lg2
新技術帶來的介面設計趨勢
1，仍然是移動端第一
隨著谷歌首先實現在移動端使用響應式網頁技術後，移動端現在已成為產品優先考慮的設計因素。移動端第一，首先是為移動使用者設計網站，然後再建立一個也適用於桌面使用者的版本。
（1）Project：Etopium UI/UX | Author：Milo Themes； （2）Project：Budapest Park website redesign | Author：fps ecosystem； （3）Project：Logistics Corporate website | Author：Nikita Resh
2，語音使用者介面
近年來，語音助手類產品越來越成熟，對於語音互動的要求越來越高。語音介面設計和資料緊密關聯，令人印象深刻的語音使用者介面在處理自然語言邏輯上有著突出的表現，為數不多的需要視覺化呈現的地方，大多是報告和列表頁，以及動效。
Author： Michał Sambora
Project： Vehicle Audio | Author： Lindsay
3，AR設計
增強現實類的技術，已經開始出現在網頁和APP設計中，許多平臺開發者也嘗試將增強現實技術納入其開發工具裡面，可預期的這類應用會越來越多。
（1）Project： MANIFACTORY | Author： Clemence Gouy；（2）Project： Mon Papi | Author：Manon Louart
Project： CarLens Website
4，實時反饋
為使用者提供實時反饋，在載入內容的時候展示頁面的資訊結構，給使用者心理預期，減輕等待的焦慮感。
（1）Project： Facebook Loading | Author： Facebook；（2）Project： Google Drive Loading | Author： Google；（3）Project： Linkedin Loading | Author： Linkedin
5，基於手勢的操作
2017年iPhoneX的出現開啟了一個手機螢幕無按鈕時代，谷歌在2018年也釋出了Pixel 3和Pixel 3XL手機，再次確認了去掉Home鍵是手機設計的趨勢。
為了節省更多的螢幕空間，蘋果和谷歌決定採用基於手勢的操作。手勢驅動的互動意味著隱藏按鈕，使用者可能會感到疑惑，對UX設計師來說要重新思考使用者和手機的互動方式，這在2019年是個很大的變化和挑戰。
（1）Project： Profile Interactions - Shopping Interactions - Start Screen Animations | Author： UI8；（2）Project： Calendar - Bitcoin send flow Interaction | Author： Johny vino™
這篇文章最初發表在“彩虹BOOK”，一個專注於UI/UX設計的公眾號，目前已發表多篇設計筆記，精選外文翻譯，更多幹貨歡迎關注哦！你的關注是我持續產出更多好文的動力~
