回顧一下 2016 年的 UI 設計趨勢

回顧一下 2016 年的 UI 設計趨勢

2016年的UI設計趨勢總的來說就是創意的蒐集和進行部分實驗,但大部分都還是集中在探索針對可用性和最終的產品。毫無疑問,2017年這些趨勢不會消失,而是會更加得完善和並且一定會開創一些新的趨勢。

2016這一年過得很快,回顧每一天就像雪花一樣融化消失了。現在是時候回顧一下,看看什麼是值得記住的。毫無疑問,在這一年裡充滿了全球的動態、設計創意、新聞和事件。我們,Tublic工作室裡在不同項目和任務中的設計師們,準備把今年很出彩的網頁界面設計及app界面設計整理出來,一些設計作品還會詳細解釋一下它的亮點。那麼,讓我們開始吧。

扁平化設計
今年 扁平化設計 在UI設計和品牌設計中大幅增加而且更加多樣性。設計風格趨於簡約簡潔的視覺表達,這種風格有利於提高可用性並且使用戶界面更加和諧。最突出的影響了設計方向的一點是應用平面二維視覺細節,與之相反的是高度現實和詳細圖像。支撐扁平化設計在UI中保持穩定地位的特點包括:
* 簡單的形狀和元素
* 極簡主義
* 功能性
* 擁有高度可讀性的字體
* 明確嚴格的視覺層次
* 注重細節
* 設備支持多顏色和對比度,快速的視覺感知
* 避免紋理、漸變和複雜的樣式
* 使用網格、幾何和視覺平衡
 

 
Cafe Coupon App扁平化設計需要通過不同的界面元素經過深思熟慮的整合,包括圖標、插圖、按鈕、標籤等,這會讓UI更加有吸引力、清晰、直觀並且易於使用。
 

 
Toonie Alarm此外,今年扁平化在品牌、UI和數碼產品之間建立了強大的聯繫,互相支持。在這一趨勢領域中廣泛應用的是創建簡潔簡單的logo和應用程序圖標。這一趨勢本身不僅僅是應用於項目的品牌,也可以應用在網站、app、公司和產品的完善,包括根據扁平化設計的原則重新設計logo和企業視覺風格。
聊天界面
另一個廣泛討論的趨勢是聊天界面,包括討論演講和案例研究的對象和主題。基本上,「聊天界面」這個詞是指與系統的介面,允許用戶通過系統模仿直接與人交談。在絕大多數情況下,這種類型的UI包括語音交互操作和識別的部分。越來越多的產品具有這樣的功能:有些人只是因為流行趨勢是這個,而另一些人是真的為了找到更好的解決問題的方法。通常它是通過語音機器同用戶聊天。這種自動的對話可以根據產品的特點和風格適應目標用戶,聊天界面可以有效的涉及語言(語言)和非語言(表情符號、圖形等)進行溝通交流。
聊天界面的優勢其中一個經常提到的是一些基本的自動化和重複操作,可以幫助用戶完成更有創造性的複雜的任務。它可以提高產品的可用性,更加前瞻性,給用戶提示,提高他們與產品的交互。但仍然有產品上的問題,在標準的情況和問題中遇到不同類型的問題需要不同的解決方案。此外,目前並不是所有的用戶都準備以這種方式交流,所以這個方案需要基於用戶體驗設計的早期階段進行廣泛的用戶研究和測試。
聊天界面可以很容易的使用戶界面變得活潑起來。然而,如果不進行分析和測試,談話可以變成完全相反的效果,變成了破壞用戶體驗的糟糕的交互。無論如何,今年UI設計人員認為在新的視角特別是結合人工智慧技術的應用會話的用戶界面,這種趨勢在明年肯定會有更多有創造性的設計。聊天界面不只是一個時尚:這個趨勢提供了全部或部分交互設計中某些領域的變化,提供瞭解決問題的方法和決策過程。
極簡主義
今年給了大量的應用程序和網站設計的極簡主義原則。它們通過提供清晰簡單的界面,充分的空間,更加專註於內容和導航,為用戶提供積極有效的體驗。 極簡主義界面的特點是注重視覺元素,雖然東西不是很多,但總是傳輸特定的消息。極簡主義的界面,無論是對於網頁還是應用程序,支持即時瀏覽或忽略頁面/屏幕的內容,具有一定的排版和視覺層次結構。 此外,這類介面通常具有高水平的易讀性和可讀性。
 

Björn自定義圖形
各種創意是體現在UI設計領域的各種圖形設計中。越來越多的界面應用自定義的吉祥物,圖標和插圖,實現了多個目標:增加了創意的視覺設計理念,提高了可用性,根據其性質和功能加強了導航和強調的內容。在可用性和可訪問的產品中,圖形的細節扮演重要的角色。即使是輕微的變化也可以帶來顯著的效果,可以加快視覺感知和理解界面元素或轉換。視覺感知是最有效、快速的特點是,通過它人們可以獲取信息然後大腦進行處理。它會影響生活的許多方面,在為用戶創建產品時忽視這個問題將是非常不明智的。這就是為什麼很長時間以來,在全球設計主題社區中高功能性的方面運用視覺元素等的圖標和他們對產品的總體效率已經有很大的影響。此外,圖像對感知自然文字識別有障礙的用戶等問題,例如,讀寫困難的學齡前兒童。
至於自定義插圖或圖標,創建特定的產品,根據特定的目標用戶的偏好和需求,設定特定的業務目標,它們能夠使產品更有效地解決用戶的問題,滿足需求。也許,這是在2016年一個受歡迎趨勢的原因,使用自定義圖形的不同風格和特點呈現出有趣的界面。
 

Weather App這一趨勢發展的另一面的是桌面壁紙和移動設備的關於各種主題的作品。它還可以作為用戶友好的特點讓用戶選擇,自我表達,滿足個人的審美需要。
動效交互
界面動效 是今年熱門並且有爭議的話題。雖然有很多人使用動效添加了不必要的功能而導致頁面載入變慢,但大多數用戶期望動效作為交互體驗的一個組成部分。 因此,設計師和開發人員工作的越來越複雜,讓動效看起來有趣並且解決存在的問題。在UI添加動效的常用方法之一是動畫展示細節。動效為用戶提供快速反饋,讓積極高效的導航簡單且直觀。動效按鈕、開關、切換和其他交互元素暗示用戶會激活他們的潛在的視覺感知。
 

Tab Bar  interaction正如我們在 前一篇文章 提到,動效在介面中可以建立愉快的感覺,接近自然與物理對象的交互往往不需要太多的認知過程。例如,你拉動一個對象,按下它,離開選項,動效會變得自然而然。大多數用戶無法看到通過設計者得這些複雜的工作:他們會認為是理所當然的,事實上他們感到友好自然是對設計方案的最大的讚美。
滾動動畫
滾動動畫也得到了新的讚同和藝術實現。在網頁滾動時,佈局元素的思考運動顯著地增強了用戶體驗,並且創建了一個整合的平滑交互的諧調感覺,而不是感知頁面的幾個單獨的部分或塊。此外,這種交互在美學上是令人愉快並且吸引人的。今年,充滿了新的設計工具和軟體的更新,表明了滾動動畫的複雜工作的實踐。
 

Organic landing page動畫教程
教程是大多數移動應用程序用戶的重要組成部分。當然,應用各種各樣的手段和技術使其清楚,參與和信息,因為這是使用戶進一步與產品進行交互的重要要素。設計師將傳統技術與新的流行發現結合在一起:特別是,定製插圖和動效為應用教程帶來了新的氛圍,使其更具活力,增加更多信息。
等待頁的多樣性
等待頁面 的發展和多樣性又新增了一些,越來越多的企業和社會項目利用它們有效地展示需要關注用戶注意的特殊服務,銷售,優惠或問題。等待頁基於用戶和市場研究測試也在網路中增長,廣泛使用等待頁也可以被看作是另一個用戶友好的趨勢,以清晰和可訪問的方式為用戶提供必要的信息和交互,節省他們的時間和精力。從商業角度來看,他們也很好地為企業提供了靈活的工具,用於原創和有效的演示。
 

Coffee Wings landing page粗野主義
今年粗野主義的趨勢在數字設計中已飆升,越來越多的表達式和多樣性。這通常被認為是一種旨在打破標準和可預測的設計技術的設計風格。以這種方式創建的網站是一種反叛、對稱與和諧,複雜的設計,複雜的佈局和不同的審美視覺表現。相反,粗野主義是基於簡單的和原始的外觀,在大多數情況下不含有許多的視覺細節,有時甚至接近普通的HTML頁面。使用得當的話可以擁有適當的目標和受眾,這種方法可以給網站帶來高水平的創意,讓它真正脫穎而出的人群。
 

Contact List Concept自定義網格
根據 互聯網生活 統計,在萬維網有超過10億個網站。該里程碑首次達到是在2014年9月,是經NetCraft Web伺服器在其2014年10月的調查,在互聯網生活首先宣佈了統計數據。後來數量下降,回到了低於10億波動數月,穩定高於10億是從2016年3月開始。隨著越來越多的網站開始開發,設計師必須擁有越來越多的創意,不僅使其具有吸引力也給他們一個感覺獨特和外觀美好的產品。這是為什麼網格列表的實驗中也贏得了設計趨勢的一席之地的其中一個原因。自定義網格的方式保存和諧且更高層次的佈局和位置元素的靈活性和獨創性。然而,這個實驗需要深入研究,在許多情況下,最終結果是通過若干次迭代測試和分析的可用性和視覺感知。
 

Slopes Website大膽和引人注目的排版
2016年也是全球設計界排版重要的一年,世界各地出現新的漂亮的字體與特定的目標或產品的視圖。排版繼續作為高效網站和應用程序設計的關鍵之一,這個領域的趨勢之一是應用大膽和優秀的排版,捕捉用戶的注意力和即時通知他們的核心消息。特別地,這種方法在等待頁中得到了發展,其中向用戶快速和動態地呈現核心數據對轉換率具有很大影響。
 

Vinny's Bakery大主題圖像
在界面的各種設計中經常發現的另一個趨勢是應用醒目的圖像,照片或插圖,作為一般構圖的中心視覺元素。重要的是,圖像從不只是一個漂亮的外觀的佔位符:它提供了一個強大的方法來加強頁面或屏幕的信息潛力,立即設置主題,並將用戶的注意力集中在重要的細節。
 

Healthy Food App手寫字體
自定義手寫字體也流行設計趨勢,通常用於標出重要的細節和圖像以原始的方式。特殊字體由專業設計師設計的清新獨特,使網頁有更好的視覺表現。另一方面,被應用在UI設計中,它需要額外進行佈局,手寫字體看起來不錯,但是不能有效地和其他元素的結合。
真實內容
網站中的內容,質量和性能日益受到重視。在用戶界面中,內容和設計以及相互連接的部件應該成功地相互支持,而不是爭取用戶的注意。這使得越來越多的設計師喜歡應用真實的內容,即使在創意階段或設計概念的演示的情況下。它使設計師,客戶和用戶更接近真實的體驗和更自然的互動的感覺。
 

Website on cooking seafood視頻解釋或展示產品
由於容易獲得通過YouTube視頻的審核,社交網路和其他平台上的產品演示、視頻講解員很快確立了自己作為一個流行趨勢。自然,它不會是邏輯忽視這樣一個強大的連接與客戶和用戶的來源,所以2016帶來了各種各樣的視頻展示產品、公司和服務,解釋他們的福利和特別優惠,顯示流的交互和連接。他們接管了責任的圖片抵得上一千字:視頻講解員快速展示產品的最重要的功能,首先讓用戶知道值得他們的注意力的地方。
 

https://youtu.be/FSiL2vpK7-s視頻的例子是:講解由 Tubik工作室 設計的Toonie。
 

https://youtu.be/2uoahCYXv-4促銷年回顧視頻由Tubik工作室設計的歌劇。
顏色色板
顏色是一個影響UI設計最強大的因素,這不是一個秘密了。今年的名單中UI設計的一個趨勢是設計師選擇應用程序和網站的各種各樣的色板。多樣性的新字體和字體以及可用性研究允許超出標準的研究和嘗試新的組合利用不同顏色,它不會缺乏可用性。越來越多的創意人員發現新視野,將傳統工藝與創新方法處理顏色。
 

Recipe App 

magic.co landing page總之,我們當然可以說,2016年的UI設計趨勢總的來說就是創意的蒐集和進行部分實驗,但大部分都還是集中在探索針對可用性和最終的產品。毫無疑問,2017年這些趨勢不會消失,而是會更加得完善和並且一定會開創一些新的趨勢。


原文地址: https://uxplanet.org/review-of-popular-design-trends-for-interfaces-in-2016-f09bb0711ee7#.vw3p28khz
作者地址: https://uxplanet.org/@tubikstudio

Category

GogoShark 給你最好的網頁設計

無論您的事業才剛起步、漸上軌道,或計劃向大中華區拓展市場,GogoShark 團隊將提供全方位的服務,為您量身打造數位品牌形象。