2017年結(jié)束，2018年將面臨更多挑戰(zhàn)和機(jī)遇。在本文中，我們將回顧2017年引起廣泛關(guān)注和贊譽(yù)的網(wǎng)絡(luò)和移動(dòng)界面設(shè)計(jì)解決方案。

　　功能性的極簡(jiǎn)主義

2017年，極簡(jiǎn)主義在APP和網(wǎng)頁(yè)界面設(shè)計(jì)中得到廣泛應(yīng)用。極簡(jiǎn)主義強(qiáng)調(diào)視覺(jué)元素，并認(rèn)為每個(gè)元素都應(yīng)該有目的地傳達(dá)信??息。極簡(jiǎn)主義的主要特征如下：

簡(jiǎn)單

清除

視覺(jué)水平是富有表現(xiàn)力的

高度重視的比例和成分

每個(gè)元素都是功能性的

大量空置區(qū)域

高度關(guān)注核心細(xì)節(jié)

注意字體設(shè)計(jì)

去除非功能性裝飾元素

極簡(jiǎn)主義的合理應(yīng)用有助于突出界面的核心內(nèi)容并引導(dǎo)用戶的視線。此外，極簡(jiǎn)主義通常認(rèn)為整潔和整潔可以帶來(lái)理想的用戶體驗(yàn)。

WineYard App

　　粗放主義

2017年，廣泛主義在互聯(lián)網(wǎng)產(chǎn)品中變得流行。擴(kuò)展主義旨在打破標(biāo)準(zhǔn)和可預(yù)測(cè)的設(shè)計(jì)風(fēng)格，帶來(lái)令人驚訝的用戶體驗(yàn)。以這種方式設(shè)計(jì)的網(wǎng)站是對(duì)抗對(duì)稱，和諧，復(fù)雜布局和視覺(jué)表達(dá)設(shè)計(jì)的反叛。

擴(kuò)展主義基于簡(jiǎn)單的原則和原始布局，在大多數(shù)情況下，不會(huì)添加更多的視覺(jué)細(xì)節(jié)，有時(shí)甚至接近純HTML頁(yè)面。從用戶體驗(yàn)和產(chǎn)品設(shè)計(jì)的角度來(lái)看，廣泛性提供了高水平的創(chuàng)造力和獨(dú)特的外觀，用戶可以對(duì)基于這種設(shè)計(jì)理念的產(chǎn)品留下深刻印象，無(wú)論他們喜歡與否。

　排版融入圖像

在Web和移動(dòng)界面設(shè)計(jì)中，粗體和對(duì)齊一直很常見(jiàn)。 2017年，在頁(yè)面上添加剪切或雕刻的標(biāo)題或關(guān)鍵字是一種新趨勢(shì)。這種方法增強(qiáng)了頁(yè)面中元素的完整性，允許界面中的布局，布局和圖像緊密耦合。

大城市指南

　　動(dòng)畫(huà)作為主banner

在瀏覽網(wǎng)頁(yè)時(shí)，主橫幅首先反映在用戶眼中，因此主橫幅承擔(dān)吸引用戶眼球的角色。此外，網(wǎng)站上的任何內(nèi)容都承擔(dān)著信息和情感傳遞的作用，主要旗幟也不例外，甚至在某些情況下，它在用戶體驗(yàn)中起著決定性的作用。主橫幅承擔(dān)多重責(zé)任，例如：

吸引用戶的注意力

直觀地提供信息

快遞網(wǎng)站風(fēng)格

為整體主題，心情或情緒設(shè)定基調(diào)

有效地展示產(chǎn)品的核心價(jià)值

2017年，動(dòng)畫(huà)廣泛應(yīng)用于主橫幅，原創(chuàng)動(dòng)畫(huà)形象使產(chǎn)品生動(dòng)，增強(qiáng)了產(chǎn)品的吸引力。

舞蹈學(xué)院登陸頁(yè)

　根據(jù)主題配置插畫(huà)

根據(jù)不同的頁(yè)面內(nèi)容，有針對(duì)性的自定義吉祥物，圖標(biāo)和插圖可以加速用戶對(duì)信息的感知，增強(qiáng)頁(yè)面的視覺(jué)張力，提高可用性，并優(yōu)化導(dǎo)航架構(gòu)。此外，直觀和清晰的圖片可以幫助解決諸如文本識(shí)別和有限的用戶感知之類的問(wèn)題，例如幼兒或患有閱讀障礙的人。設(shè)計(jì)師對(duì)插圖的使用似乎已進(jìn)入更高層次，不僅將插圖與信息和主題相結(jié)合，還增加了時(shí)尚和隱喻。

金融服務(wù)網(wǎng)站

　　無(wú)框架布局

2017年，許多網(wǎng)頁(yè)界面設(shè)計(jì)傾向于使用大背景和無(wú)框架模式。大背景圖像的有效使用不僅保持了頁(yè)面邊框和邊界的感覺(jué)，還擴(kuò)展了用戶的視覺(jué)邊距，使用戶感覺(jué)到更寬的界面。

大城市指南

動(dòng)畫(huà)界面

與2016年相比，2017年是動(dòng)畫(huà)界面的又一步。它不僅增加了交互過(guò)程的真實(shí)性和動(dòng)態(tài)性，而且顯著提高了交互的可用性。交互模式的優(yōu)化降低了操作的復(fù)雜性，允許用戶專注于頁(yè)面信息，感覺(jué)頁(yè)面是智能和活躍的，并幫助用戶更好地體驗(yàn)產(chǎn)品和理解信息內(nèi)容。 2017年，互動(dòng)設(shè)計(jì)師為按鈕，標(biāo)簽，表格，加載動(dòng)畫(huà)和滾動(dòng)動(dòng)畫(huà)做出了杰出貢獻(xiàn)。

澆水追蹤器應(yīng)用程序

　通過(guò)友好的界面設(shè)計(jì)重塑品牌形象

2017年是品牌重塑的一年：大量全球公司，本地公司，產(chǎn)品和品牌重新設(shè)計(jì)了帶有簡(jiǎn)化元素和動(dòng)畫(huà)徽標(biāo)的品牌標(biāo)識(shí)。這種趨勢(shì)的原因之一是，隨著越來(lái)越多的品牌脫機(jī)，他們更關(guān)注品牌和互聯(lián)網(wǎng)的結(jié)合，以及品牌在年輕人中的聲譽(yù)。因此，新的Logo設(shè)計(jì)旨在提高產(chǎn)品的品牌知名度。此外，動(dòng)畫(huà)徽標(biāo)也成為一種新趨勢(shì)，增強(qiáng)了互動(dòng)性，增強(qiáng)了用戶對(duì)品牌的認(rèn)知。

Whizzly Logo動(dòng)畫(huà)

單色調(diào)的界面設(shè)計(jì)

使用深色背景Web和移動(dòng)界面設(shè)計(jì)不僅保持了風(fēng)格的獨(dú)立性，還增強(qiáng)了產(chǎn)品的存在。深色讓人聯(lián)想到優(yōu)雅，優(yōu)雅和聲望。深色增強(qiáng)了人們對(duì)圖像的感知，使得界面在不同環(huán)境中更小，更自然。這種設(shè)計(jì)風(fēng)格受到相當(dāng)多用戶的高度尊重。

珠寶電子商務(wù)應(yīng)用程序

　深色背景的使用

使用深色背景Web和移動(dòng)界面設(shè)計(jì)不僅保持了風(fēng)格的獨(dú)立性，還增強(qiáng)了產(chǎn)品的存在。深色讓人聯(lián)想到優(yōu)雅，優(yōu)雅和聲望。深色增強(qiáng)了人們對(duì)圖像的感知，使得界面在不同環(huán)境中更小，更自然。這種設(shè)計(jì)風(fēng)格受到相當(dāng)多用戶的高度尊重。

電影應(yīng)用

　　加強(qiáng)顏色對(duì)比度

設(shè)計(jì)師使用深色和淺色的組合將淺色背景應(yīng)用于黑暗主題的核心信息區(qū)域，增強(qiáng)色彩對(duì)比度和視覺(jué)表現(xiàn)力。這種方法可以提高核心信息的可讀性，但由于色彩對(duì)比度強(qiáng)，因此也存在爭(zhēng)議。

澆水追蹤器應(yīng)用程序

　多種字體的組合使用

隨著大量新字體的出現(xiàn)，設(shè)計(jì)師們開(kāi)創(chuàng)了一個(gè)創(chuàng)新實(shí)驗(yàn)的新世界。今天，文本不僅是一種交流手段，也是設(shè)計(jì)理念的重要組成部分。因此，設(shè)計(jì)師非常注重字體的選擇和組合。 2017年，出現(xiàn)了大量新的襯線字體和無(wú)襯線字體，并且有效地組合了各種字體以增加視覺(jué)效果的分層。

美食網(wǎng)站

　著陸頁(yè)的創(chuàng)新

毫無(wú)疑問(wèn)，2017年，我們目睹了著陸頁(yè)的創(chuàng)新和多樣性。企業(yè)或社交組織需要登陸頁(yè)面來(lái)吸引用戶，增加銷(xiāo)售額并促進(jìn)轉(zhuǎn)化;在移動(dòng)端，登陸頁(yè)面也是提高產(chǎn)品升級(jí)覆蓋率的重要渠道。用戶測(cè)試和市場(chǎng)調(diào)查結(jié)果表明，用戶對(duì)目標(biāo)網(wǎng)頁(yè)有很高的期望，并希望目標(biāo)網(wǎng)頁(yè)能夠以清晰可用的方式提供必要的信息，從而節(jié)省用戶的時(shí)間。

數(shù)字代理登陸頁(yè)面

　宣傳視頻

在網(wǎng)站和應(yīng)用上使用各種宣傳視頻。當(dāng)然，視頻確實(shí)帶來(lái)了更好的用戶體驗(yàn)，同時(shí)加深了用戶對(duì)品牌和產(chǎn)品的印象，這也就不足為奇了。有創(chuàng)意，有趣的視頻是吸引用戶注意力，同時(shí)快速，清晰地傳遞信息的絕佳方式。用戶每天都被大量信息所淹沒(méi)，使用新產(chǎn)品的學(xué)習(xí)成本對(duì)許多用戶來(lái)說(shuō)是令人生畏的，特別是當(dāng)新產(chǎn)品尚未形成用戶的聲譽(yù)時(shí)。在這種情況下，視頻充當(dāng)動(dòng)態(tài)，有趣和有吸引力的表達(dá)，激活用戶的聽(tīng)覺(jué)和視覺(jué)神經(jīng)。當(dāng)然，視頻的使用可能會(huì)導(dǎo)致頁(yè)面加載速度慢，播放等問(wèn)題，應(yīng)在使用前進(jìn)行全面測(cè)試。

　　用戶體驗(yàn)游戲化

2017年，許多產(chǎn)品采用游戲化界面設(shè)計(jì)，不僅僅是一些娛樂(lè)產(chǎn)品，還有很多政府和企業(yè)門(mén)戶網(wǎng)站的例子。在科技界，“游戲化”意味著玩游戲機(jī)制，而不僅僅是游戲功能：挑戰(zhàn)，獎(jiǎng)勵(lì)，積分，徽章，排行榜等，所有這些都是“游戲化”，使用得當(dāng)，可以激勵(lì)用戶，提高留存率和轉(zhuǎn)換。

上層應(yīng)用程序

　　方框和卡片式的布局

框和卡在豐富視覺(jué)層次結(jié)構(gòu)和傳遞信息方面發(fā)揮著重要作用，并有助于保持頁(yè)面的完整性和一致性。

StarDust Biker網(wǎng)站

引入幾何元素

各種或簡(jiǎn)單或復(fù)雜的形狀，圖案，線條，曲線，無(wú)論是以傳統(tǒng)方式使用還是以創(chuàng)新組合方式使用，都將在2017年廣泛使用。

婚禮主題

　嘗試豐富的色彩組合

豐富多彩的界面設(shè)計(jì)從未消失，2017年，還有更多創(chuàng)意色彩組合。色彩是增強(qiáng)界面感知和傳達(dá)情感的最有效方式。有效和創(chuàng)新地使用顏色不僅取決于創(chuàng)造力，還取決于色彩理論，色彩心理學(xué)，用戶體驗(yàn)設(shè)計(jì)和界面設(shè)計(jì)。

預(yù)訂交換應(yīng)用

　　產(chǎn)品設(shè)計(jì)階段，使用真實(shí)內(nèi)容

2017仍然重視內(nèi)容質(zhì)量和產(chǎn)品體驗(yàn)。在用戶體驗(yàn)中，內(nèi)容和設(shè)計(jì)是相關(guān)的：設(shè)計(jì)人員必須確保內(nèi)容和設(shè)計(jì)相互支持，而不是相互競(jìng)爭(zhēng)。這就是為什么即使在產(chǎn)品設(shè)計(jì)的早期階段，設(shè)計(jì)師也喜歡使用真實(shí)內(nèi)容進(jìn)行設(shè)計(jì)，而不是“XXX”或其他什么。真實(shí)內(nèi)容使設(shè)計(jì)師，測(cè)試人員和內(nèi)容操作員更接近產(chǎn)品的真實(shí)體驗(yàn)。

約會(huì)應(yīng)用登陸頁(yè)面

毫無(wú)疑問(wèn)，2017年是多元化界面設(shè)計(jì)和一年用戶體驗(yàn)的一年。網(wǎng)站和應(yīng)用已成為人們生活的一部分，用戶有不同的品味，興趣和不同的風(fēng)格。用戶面臨著各種產(chǎn)品選擇，這些產(chǎn)品的外觀和功能相似或不同，但用戶總能找到符合心理預(yù)期的產(chǎn)品。無(wú)論如何，變化總是一樣的?；谶^(guò)去的設(shè)計(jì)趨勢(shì)，尋找產(chǎn)品設(shè)計(jì)中的新趨勢(shì)和新想法對(duì)設(shè)計(jì)師來(lái)說(shuō)是一個(gè)永恒的挑戰(zhàn)。

作者：。 Tubik Studio我們是一家綜合性數(shù)字機(jī)構(gòu)，專門(mén)從事UI/UX設(shè)計(jì)和網(wǎng)站和移動(dòng)應(yīng)用程序開(kāi)發(fā)，動(dòng)畫(huà)，平面設(shè)計(jì)和品牌推廣

原始地址：https://uxplanet.org/review-of-popular-interface-design-trends-in-2017-5acf29187d35

譯者：李曉新

本文是大家的產(chǎn)品經(jīng)理翻譯團(tuán)隊(duì)@李小新翻譯發(fā)布，未經(jīng)本網(wǎng)站許可，禁止轉(zhuǎn)載。

該地圖來(lái)自u(píng)nsplash，基于CC0協(xié)議

« Apple更新了過(guò)時(shí)的產(chǎn)品和已停產(chǎn)的產(chǎn)品列表中的iPhone 5！ | 蘋(píng)果新iPad發(fā)布：頂級(jí)版售價(jià)高達(dá)15299元！你會(huì)支付賬單嗎？ »