2017年流行界面設計趨勢回顧

2018,新一年到來,即將迎來新的挑戰和新的視野,我們想回顧一下,回顧這即將結束的一年是怎樣的。在這裏,我們收集了在2017年Web端和移動端界面贏得大獎的趨勢的集合,其中案例大部分爲Tubik團隊的設計。


功能極簡主義

相當多的移動應用程序和網站基於極簡主義的原則不斷髮展和設計解決方案。極簡主義界面的特點是對視覺元素的全面關注,不多,但總是傳遞一個特定的信息。

在極簡主義方面經常提到的主要特徵包括:

·簡單

·清晰

·富有表現力的視覺層次

·高度重視比例和構圖

·每個元素的功能

·大量的空餘空間

·對核心細節的高度關注

·字體設計是一個重要的設計元素

·消除非功能性裝飾元素

當然,這些原則可以繼續沿用,但即使是給定了風格,界面的簡約相對而言是一個用戶友好體驗的趨勢。好的應用,它會幫助用戶看到界面的核心元素,使用戶使用起來直觀而有目的。此外,極簡主義的界面通常外觀精巧整潔,帶來的美感也成爲理想的用戶體驗的因素之一。


粗獷

排版設計中的粗獷的趨勢去年開始飆升,2017年的表現更加明顯。它通常被描述爲旨在打破標準和可預見的設計技巧的風格。以這種方式創建的網站,是對精緻設計的反叛,它具有深思熟慮的對稱性和和諧性,集成的佈局和審美視覺表現力。相比之下,粗獷主義是基於簡單和原始的外觀,在大多數情況下不加載許多視覺細節,有時甚至接近一個純HTML頁面。它被用於特定的目標和受衆,具有高水平的獨創性,並賦予數字產品獨特的外觀。它可能被喜歡或不喜歡,但它從來沒有被忽視。

字體集成到圖像中

大膽和吸引人的排版也高度存在於Web和移動佈局中。今年,通過將標題關鍵字或標題融入在頁面上的視覺元素中,增強了佈局元素的和諧與完整性,使排版與界面中的所有內容緊密結合。

首焦Banner動畫

在網頁設計中,首焦Banner是在與網站互動的第一時間吸引用戶注意力的大圖。它們通常主題明確,突出關鍵內容並有效抓住用戶眼球。首焦Banner證明它們在設定情緒或傳遞信息方面非常有效。而且,除了網頁上的任何其他醒目的圖形外,它是一種內容豐富而又情感化的內容。突出的首焦Banner可以達到多個目的,例如:

·吸引用戶的注意

·直觀地傳遞消息

·支持一般的文體表達

·設定需要的主題、情緒或氛圍

·有效展示核心收益或項目

2017年,他們通常用原創動畫形象強化,讓設計更生動,使他們更具吸引力。

定製主題插圖

不同的風格和複雜程度的定製插圖,正積極地覆蓋越來越多的Web和移動用戶界面,增加了對信息的快速感知,爲創意打下堅實的基礎。Web和移動界面應用通過定製的吉祥物圖標插圖來增強頁面或屏幕的外觀,並提高可用性和直觀的導航。此外,圖像改善了用戶體驗設計的可訪問性,推動了對具有文本識別自然問題的用戶的感知極限,例如閱讀困難或未閱讀的學齡前兒童。

這裏最豐富的,可能是支持網站和應用程序的主題插圖。他們似乎進入了一個新的層次,變得更加精緻、更復雜、更時尚、更具隱喻性。

無邊框佈局

在今年的網頁界面中,經常觀察到沒有任何框架的大背景圖片或圖案。它讓用戶感覺到佈局更加通透寬敞,而背景圖像嵌入其中,又不會打破界限的感覺。

豐富的界面動畫

和2016一樣,2017年在界面動畫方面繼續深入。它不僅增加了交互過程中的趣味和手勢,而且大大提高了可用性。用戶體驗變得更加豐富和引人入勝,而交互元素的操作變得更加清晰,並以可理解的方式迴應用戶。所以,今年設計師在各種按鈕,標籤,圖表,預加載器和滾動動畫上運行良好。

UI-friendly branding

2017年可以說是品牌重塑的一年,大量的全球和本土公司、產品和品牌都將Logo的形式和細節進行簡化。隨着越來越多的企業爭奪更高的在線業務,這一趨勢的原因之一是爭取更好的可用性和品牌元素的導向力。所以,爲創建更友好的用戶界面(UI-friendly)而設計新的Logo或對已有Logo的再設計,並使a其在各種數碼設備和佈局上有效地感知互動。此外,動態Logo成爲一個趨勢,使品牌符號更具交互性,並強化品牌意識。

logo_animation

單色的用戶界面

爲了獲得最大的功能,對簡約設計的興趣日益濃厚,導致了大量單色UI解決方案的出現。這些佈局通常外觀時尚、和諧、使注意力集中。然而,設計師們必須投入大量的時間和精力,使之不枯燥,讓交互的核心元素則瞬間可見。

深色背景

使用深色背景的移動和Web界面不僅承載該有的信息,並且還突顯了它們的存在。特別是,它們通常應用於基於視覺效果而不是複製的數碼產品中。深色背景通常伴隨着沉穩和安全感,它們加深了對圖像的感知,並且可以使界面在不同環境下的對比度更爲明顯,更自然。此外,現在相當廣泛的目標受衆喜歡這種風格。

複製留白

另一個趨勢在基於深色背景方案的界面上特別流行,它還提供了一個適當的可讀性的方法,設計師爲突顯核心數據塊採用淺色背景的區域或空間,使其在屏幕或頁面上形成對比。

字體的選擇和對比

隨着衆多新字體的出現,用戶界面設計師有了一個創造性實驗的廣闊領域。今天,文字不僅被視爲溝通的手段和向用戶傳達信息,而且是所有設計理念的組成部分。因此,專業人士非常重視字體的選擇和組合。今年,我們採用了襯線和無襯線字體設置對比的新方法,使其具有強大的視覺層次和界面吸引力。

網格實驗

隨着超十億網站發揮作用,設計師們必須越來越努力,使它們既有吸引力又有創意。因此,網格也在今年的總體設計趨勢列表中佔據了一席之地。自定義網格是一種以保存自適應佈局並以更高層次的靈活性和獨創性放置元素的方式。然而,這種創造力需要更透徹的研究,而有效的結果往往是通過多次迭代測試和對可用性和視覺感知的分析。

登陸頁面

毫無疑問,今年的登陸頁面見證了新的發展和多樣性。企業和社會項目往往會定期使用這些服務來有效地提供定製服務、銷售、報價或吸引用戶注意力的問題。登陸頁也被證明是本地移動應用推廣的有效方法。基於用戶和市場調查以及測試,可以將其定義爲用戶友好的趨勢之一,以清晰易用的方式提供必要的信息和交互,從而節省用戶的時間和精力。從業務的角度來看,他們也很好的配合靈活的工具進行有效的溝通。

創造性的視差

隨着更多的可移動和運動工具的設計,滾動動畫保存了它在Web和移動領域中廣泛應用的技術的位置,創造性和原始視差增強了滾動體驗,使人眼更加自然,併爲這樣的基本操作增添了優雅。

網絡營銷視頻

更多不同類型的營銷視頻出現在屏幕和頁面上。他們有效地爲市場目標服務,提高品牌知名度。一個富有創意和吸引人的視頻是吸引客戶注意力的一種好方法,也是快速而直接地告知顧客的有效方法。一個視頻可以激活多個感知通道——聽力、視覺,並通過講故事的力量來強化它們。所有這些因素都傾向於通過視頻進行呈現,特別是基於高質量的圖形設計和動畫。人們每天都會被各種各樣的信息所淹沒,所以大多數人沒有很多時間去學習產品或服務,尤其是新產品或服務。在這種情況下,視頻成爲了一種動態的、信息性的、吸引人的交流方式。

遊戲化機制的交互

近年,人們對各種界面的遊戲化趨勢越來越感興趣,不僅僅是娛樂,還有公用事業和商業產品。在科技世界裏,“遊戲化”這個詞代表了將遊戲機制運用到非遊戲環境中,如網站和移動應用程序。挑戰、獎勵、積分、徽章、排行榜和其他這類的東西,幫助設計師思考有效的用戶激勵和留住用戶的方式。

作爲佈局元素的框和卡片

2017年UX設計的另一個趨勢是移動網絡和移動設備中卡片和盒子的多樣性。他們在設定視覺層次和快速掃描信息方面發揮了重要作用。此外,他們成功地爲頁面或屏幕的整體諧調性起到了作用。

幾何元素作爲風格的一部分

沿續以前的趨勢,今年在幾個界面上幾何的共鳴。各種簡單而複雜的形狀、圖案、線條和曲線,在傳統和創新組合的衆多設計解決方案中經常看到。

實驗性調色板組合

色彩探索的趨勢並未消失,帶出了新的原始組合。畢竟,顏色是將快速感知的信息和情緒添加到界面以及使其外觀具有獨特性和吸引力的最有效方式之一。無論如何,有效的色彩嘗試不僅僅是純粹的創造力:即使是最有創造力和令人驚訝的組合,也是基於色彩理論知識、色彩心理學、用戶界面設計技巧。

沒有Lorem Ipsum

今年對內容質量和性能的關注度不斷提高。在用戶界面中,內容和設計相互關聯:創作者必須使他們成功地互相支持,而不是爭奪用戶的注意力。這就是爲什麼現在越來越多的設計師更喜歡真正的內容,而不是衆所周知的Lorem Ipsum,在設計概念初始構思的情況下,它讓設計師,客戶和內容製作者更接近真實的體驗和自然的互動感受。

毫無疑問,2017年是界面設計多元化的一年 , 也是最受用戶歡迎的趨勢之一。每天有數以百萬計的用戶,使用或簡單或複雜的應用程序和網站作爲日常的一部分,他們有着不同的口味和喜好,喜歡各種不同的風格和特點。未來將會設計更多不同的外觀和功能,這些更廣泛的多樣化選擇將使無窮無盡的全球技術用戶羣體能夠找到適合他們特定需求和願望。無論如何,我們很快就會看到下一年將會發生什麼,以及爲計師們帶來新的創造性挑戰。

原文:Tubik           翻譯:TaaCoo糖炒

原文鏈接

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章