你需要知道的7種用戶界面設(shè)計趨勢

如果你想知道什么是最容易被忽視的方面的設(shè)計工藝,看起來沒有進一步的 - 它是用戶界面。是好還是壞,用戶界面是無處不在:在網(wǎng)站上,手機,電視機套,手腕上的手表,飛機和洗衣機。

一些用戶界面拿兩個人來操作。不是我的那杯茶。

每當有一個用戶,有用戶界面。同樣,每當有一個沮喪的用戶,通常情況下,拙劣的用戶界面。

作為圖形和網(wǎng)頁設(shè)計,我們的工作不僅創(chuàng)造了良好的尋找的東西 - 它是創(chuàng)造的東西,實際上是易于使用和創(chuàng)建用戶界面摩擦最小。換句話說,我們需要思考的人實際上是如何使用我們的網(wǎng)站或應(yīng)用程序,并盡最大努力使他們的生活更輕松。

如果你認為還是涉及到只有幾妥善安置的按鈕和鏈接,再想想 - 一些收入最高的項目99designs需要單獨的用戶界面設(shè)計,Web或移動應(yīng)用程序。它既是一門藝術(shù),一門科學,有極少數(shù)的明星在舞臺上(蘋果是其中之一)。

要開始,讓我們來看看目前的趨勢在用戶界面設(shè)計。

極簡主義

經(jīng)過多年的鐘聲和口哨聲中,用戶界面設(shè)計回到最基本的 - 至少根據(jù)一些大公司,包括谷歌和微軟僅舉幾例。有光澤的圖標被替換為簡單的一種顏色的版本或基于文本的按鈕,簡單的純色組合,豐富的梯度。

簡約的接口肯定。上圖:Windows 8的使用單色圖標和簡單的純色,它的新界面。下圖:Pinterest的用戶界面是最終的極簡-用戶內(nèi)容,除了極少數(shù)的東西在屏幕上占用空間。

對于廣大用戶來說,這種缺乏視覺細節(jié)驚人的好 - 這個接口很容易消化和它的元素沒有得到他們所要完成的任務(wù)的方式。

當使用它: 極簡主義是一個偉大的方式來設(shè)計專注于用戶生成內(nèi)容的Web應(yīng)用程序-如果做得好的話,用戶將很少抱怨。但是,請記住,許多客戶會發(fā)現(xiàn)這種方法過于簡單,他們的口味,所以你可能要檢查自己的喜好,然后再啟動您的項目。

Skeuomorphism

用戶界面設(shè)計Skeuomorphic推廣蘋果,然后通過很多其他的公司?;旧?,這種設(shè)計方法依賴于模仿傳統(tǒng)的和熟悉的物體的外觀和功能,使界面更直觀。例如,用木制書架,書籍涵蓋了代表的數(shù)字內(nèi)容在工作中是一個很好的例子skeuomorphism。

雖然每個用戶界面借鑒了現(xiàn)實世界中的細節(jié)(即按鈕就是一個現(xiàn)實世界的概念),有些人會反對借用整個貨架。

在用戶界面設(shè)計界的是否如高skeuomorphic設(shè)計的合理與否是一場戰(zhàn)斗。有人說,它實際上是壞的用戶體驗,因為現(xiàn)實世界的模仿對象,必然意味著模仿的限制,來與他們,有人說這是一個很好的權(quán)衡,skeuomorphic設(shè)計的友好和熟悉。

當使用它:在 設(shè)計移動應(yīng)用程序時,skeuomorphic的設(shè)計是非常受歡迎的,以及在社會接受。在某種程度上,由于這些設(shè)備的觸摸屏性質(zhì),觸摸真實世界中的物體給人的印象。對于Web應(yīng)用程序和項目,skeuomorphic設(shè)計通常不是最好走的路,雖然有些元素可以用來提高部分的接口。

激光焦點

激光聚焦后的用戶界面,在一個單一的視覺焦點,明顯的任務(wù),一旦用戶打開Web應(yīng)用程序,而不是提供一些同樣重要的選項。這種方法的主要優(yōu)點是簡單 - 用戶立即知道應(yīng)用程序和建議的行動是什么。

03-激光FOCUS1的

上圖:谷歌主頁是最好的例子,的激光聚焦Web應(yīng)用程序-搜索框的顯著位置,其他一切都被降級。下圖:空氣B'n'B  是一個激光重點接口的一個很好的例子。

當使用它:   激光聚焦是一個偉大的方式有一個單一的,最重要的功能,促進Web應(yīng)用程序和項目。在大多數(shù)情況下,這將是某種形式的搜索或瀏覽功能,但確保與客戶討論這個問題。

上下文敏感的導(dǎo)航

上下文敏感的導(dǎo)航附帶的動態(tài)用戶界面的崛起,是一個偉大的方式來declutter你的設(shè)計?;旧?,你需要問自己一個簡單的問題:導(dǎo)航元素顯示在屏幕上的所有的時間,僅能顯示在某些情況下(行動)?

Pinterest的使用簡單而有效的按鈕工具欄只出現(xiàn)在鼠標懸停動作。

例如,Pinterest的操作按鈕,只有當你將鼠標懸停針,如上面的圖片所示。只有當你選擇的消息,Gmail會顯示消息的操作按鈕。這樣一來,這些應(yīng)用程序在視覺上顯得比實際的要簡單得多。

當使用它:上下文敏感的導(dǎo)航可以用在幾乎任何項目。小心目標按鈕和小工具,可以隱藏,直到用戶執(zhí)行某一個動作,如一個鏈接懸停,選擇一個條目并等。

折疊的內(nèi)容

另一個偉大的方式來declutter你的用戶界面設(shè)計是隱藏在一個鏈接,將用戶的請求展開和折疊的非必要的選項和部件。

上圖:谷歌加使用“更多”按鈕顯示附加界。下圖:99designs顯示了各種的配置文件的相關(guān)選項,一旦你點擊你的用戶名在右上方corent的。

你可以做到這一點,即使在簡單的網(wǎng)站 - 而不是顯示在標題中大量的鏈接,可以考慮引入“更多”按鈕,將顯示一個下拉菜單,鏈接的網(wǎng)頁的用戶并不重要。

當使用它:與上下文敏感的導(dǎo)航,你可以使用這項技術(shù)幾乎在所有的項目中。這是特別有用的網(wǎng)頁,包含很多設(shè)置和選項的界面元素-這些看起來最嚇人的最終用戶,因此,隱藏不需要的組件使事情看起來簡單得多。

內(nèi)容分塊

內(nèi)容分塊是一種技術(shù),呈現(xiàn)出大量的內(nèi)容在更小的視覺塊,所以它更容易為人們閱讀和精神上消化。例如,分裂成幾個部分這篇文章的標題和相應(yīng)的圖片,使得它容易得多讀比較單調(diào)的文本流長。

蘋果網(wǎng)站的產(chǎn)品頁面上的內(nèi)容分塊的最佳范例之一-他們是一個混合的一口大小的文本塊,再加上漂亮的產(chǎn)品圖片。

重要的是要注意,內(nèi)容分塊始終圍繞。它的出現(xiàn)在互聯(lián)網(wǎng)時代,當人們開始花費大量的信息,需要一種方式來消化它更容易。在某種程度上,這是一個自發(fā)地發(fā)展的現(xiàn)象。

當使用它:最終,該技術(shù)的使用,最終取決于客戶端的東西。但是,您可以使用它在您的設(shè)計方案建議的內(nèi)容應(yīng)如何在網(wǎng)站上,解釋為什么它是有益的,目前它在特定的方式。

長頁面

一旦令人難以接受的客戶和設(shè)計師,長期需要大量的滾動,現(xiàn)在所有網(wǎng)站的網(wǎng)頁。一種解釋是,用戶習慣于垂直滾動鼠標滾輪的協(xié)助下,它實際上是更糟糕的是分裂單獨的頁面上的內(nèi)容 - 它需要更多的努力,從用戶找到它,達到它。

 

瘋狂的雞蛋網(wǎng)站是一個令人難以置信的長(但功能)的網(wǎng)頁。圖像的右側(cè)部分示出的一小部分的快照頁面內(nèi)容。

此作品出奇地好時,結(jié)合以前的內(nèi)容分塊技術(shù) - 用戶可以快速瀏覽內(nèi)容,找到一個感興趣的領(lǐng)域。一些非常成功的和著名的公司 - 包括蘋果 - 使用很長的頁面,以展示他們的產(chǎn)品,具有高程度的成功。

當使用它:   長頁面的工作非常好,當你介紹產(chǎn)品的功能和福利,或其它類似的內(nèi)容。如果內(nèi)容沒有直接關(guān)系(即菜譜列表),你應(yīng)該把它單獨的頁面上。

為了結(jié)束

設(shè)計良好的用戶界面在設(shè)計Web或移動網(wǎng)頁和應(yīng)用程序時,是最重要的 - 有時,這就是該項目是所有關(guān)于。

上述趨勢將幫助您開始,但你也應(yīng)該投入一些時間和閱讀博客,,如UX運動  和UX雜志出色的用戶界面。成為一個偉大的用戶界面設(shè)計師,你把你自己的,而精英設(shè)計公司-有大量的有才華的用戶界面設(shè)計。


每天更新,
全站高品質(zhì)素材免費下載!