2017年快要結束了，2018年的網頁設計趨勢是什么呢？今天我們就來分享一些設計師的觀點和預測。

01、網絡動畫

“今年的動畫非常強大；數字創意機構的創意總監Mireia Lopez說：“他們真的被帶到下一個層次。”

我們看到了設計團隊的動畫、原型化和學習整齊的編碼，以使用更復雜的原型工具，比如Framer，以便將概念傳達給客戶，并向開發人員解釋數字旅程。設計師和開發者之間的界線開始變得模糊，我絕對認為我們將在未來的一年里看到快速的融合。

社交媒體管理平臺Lightful的高級數字設計師Bruno La Versa對此表示贊同。他說：“講故事和個性是新老品牌為了吸引用戶的注意力而進行的工作，動畫也開始在這方面發揮更大的作用。”

“動畫展示了并將繼續展示品牌在我們數字世界的力量，給品牌一個強大的個性，使它更少的靜態和更動態。”

作為這一趨勢的一部分，我們看到了GIF動畫的回歸。“似乎世界已經準備好了(而且確實迫切需要)動畫，不管它是喜劇圈的貓從桌子上掉下來，還是在你的電子郵件簽名中添加了一種有趣的標志，”領土項目的創始人和總監Lee法西斯說。

他補充道：“現在，基本的GIF動畫將會在這里停留，因為它幾乎可以閱讀任何東西。”現在，設計師們利用這種能力來激活HTML電子郵件、消息、網頁等等。一個精心設計的、精心制作和執行的GIF序列可以讓任何用戶注意到，而且在2018年將會有更多的時間。要了解這一趨勢，請查看我們的5個步驟，以掌握web動畫和10個精彩的web動畫，由Chris Gannon。

02、更冒險的顏色

“在過去的一年里，我們看到了在數字平臺上使用大膽色彩的增加，”Kagool的創意總監James Bearne說。一個很好的例子就是DesignStudio在2016 - 2017賽季的新品牌計劃。

“一個自信的離開了之前的身份，引人注目的視覺治療并沒有停留在網站或它的應用上；它以廣告牌、社交媒體等方式在球場上轟鳴。

Bearne預測，這不會在2018年放緩。“有了像khroma幫助我們這樣的新工具來尋找更有趣的色彩使用方法，我們很有可能會看到更多的設計師探索如何使用色彩來傳遞特殊的體驗。”

“有趣的是，顏色可以與定制和個性化一起使用，為消費者創造出真正獨特的體驗，讓他們同時打幾個盒子。”

03、排版

在爭奪眼球的斗爭中，印刷術是一種強大的武器，它在網絡上的使用今年已經擴大，99設計的內容策略高級經理Kelly Moor說。

印刷術很強大，而且越大越好。因此，雖然像Helvetica這樣的新風格的無襯線風格仍在流行，但設計師們卻在尋找各種各樣的字體。

她預測，2018年將會有大量的劇集回歸熒屏。“我們還會看到越來越多的網站使用對比的serif和sans - serif字體來創建用戶體驗的動態相似之處，比如GE的華麗網頁設計。”

事實上，設備分辨率越來越高，提高了可讀性的因素，也為定制字體的興起打開了方便之門。“設計師們選擇了大量的字體，不僅是為了強調，而且是為了美觀。”所有這一切，加上超大字體所帶來的戲劇性，表明2018年將不會都是微妙的，我們可以期待看到大膽的趨勢繼續發展。

另一種與打字相關的趨勢，是由Hyped Marketing的studio經理Gee Guntrip所發現的，是排版印刷技術。她說：“這項技術使用了一種顏色塊，通過清晰的字母來顯示靜止或移動的圖像。”選擇合適的字體和限制字母的數量是最重要的。

例如，丹伯里做得很好，它有一個明亮的文本，吸引用戶注意它的視頻。法國喜劇《法蘭西絲》使用了文字懸停的印刷效果。并通過字母來培養數字展示視頻。

04、數據講故事

Ito World高級數據可視化設計經理克雷格?泰勒(Craig Taylor)表示：“2017年是設計的好年份。”“我們見證了動畫可視化的蓬勃發展，以及從3D角度對數據表達的需求增加。”但是，如果不是可消化的，最終可用的話，這些數據，是漂亮的還是其他的呢?

輸入泰勒所說的信息故事講述者。他解釋說：“現在，人們非常注重通過設計來進行有效的敘事，將復雜的信息盡可能簡單地傳達給不同的觀眾。”“設計師們正在用新的、定制的作品來思考盒子之外的東西——老式的、柔和的調色板，支持充滿活力的色彩過渡，搭配極簡而大膽的版式。”

那么，信息設計的2018年是什么呢?泰勒相信，“更容易獲得新技術的人無疑將會看到，使用動畫作為一種講故事方式的設計師數量將會增加。”

“隨著AR和虛擬現實技術的進步，虛擬模型的模擬探索的前景，我們記住將信息和數據保存在我們所做的事情的核心是很重要的。”如果我們能做到這一點，數據科學和設計的重疊的領域將允許越來越多的信息、基礎和清晰的數據可視化的例子。

李·特拉尼同意，AR和VR有更多的東西可以提供。他說：“科技使我們能夠更容易地將現實世界與我們的屏幕世界結合起來。”“我們正從越來越多的愿望開始，將視頻添加到我們的數字體驗中；在不太久以前，用一種深度和豐富的方式來分層。

“喜憂參半的現實使我們堅定地進入了‘新’，大型科技公司致力于在AR領域進行創新，未來的設計將需要在所有四個方面考慮我們的世界。”我們看到在流行的游戲和更多的功能應用程序(如宜家)的混合現實的開始。

05、間距的標準化設計工具

在2017年，似乎沒有一天沒有新的應用程序、工具或功能，比如InVision、Adobe XD、Figma、Axure、Marvel、Vectr等。這包括草圖，它的開放文件格式更新，是一個真正的游戲規則改變者。

“讓我們這樣說，如果你還在使用Photoshop進行UI設計，你可能需要看看你的周圍，”布魯諾說。2017年是新設計工具的一年：Figma、Webflow、InVision Studio等。設計工具的爆炸凸顯了設計如何成為企業運作的核心要素。

然而，Bearne指出，這種趨勢對機構構成了特殊的挑戰。“2017年，有大量的工具出現，希望成為行業的‘選擇工具’，但同時，大量的產品也變得令人沮喪，因為所有人都聲稱實現了巨大的期望。”

“這為機構間的工作創造了一個問題，團隊有不同的流程，每個團隊都經過測試，以發現是否可以替換草圖。”反過來，市場已經充斥著各種選擇，但卻沒有多少關于如何提高效率的指導。

“InVision Studio的發布——定于2018年1月——將會很有趣，因為我們將會看到它是否能夠使用它的協同平臺，最終為設計過程帶來標準化。如果InVision和它看起來一樣好，會發生什么?Photoshop的生存之戰終于結束了嗎?

06、平面設計2.0

平坦的設計并沒有消亡，但在2018年，它肯定必須學會適應與之保持聯系。這種新的、所謂的平面2.0或半平面設計，依賴于在其之前的ascetic標識中添加細微差別和深度。它是怎么做到的?沉溺于一些設計禁忌：漸變和陰影。但別擔心，這只是適度的。

自2007年以來，漸變已經讓人想起了公司的Powerpoint演示文稿、20世紀的網頁標題和過時的logo設計。“但在2018年，它們又回來了，盡管進化了，”摩爾繼續說。“梯度現在是搖擺振動的，更新的顏色調色板和更柔和的，微妙的過渡。”他們在Instagram、Stripe、甚至蘋果的iOS圖標等品牌上引起了轟動。

多虧了web瀏覽器功能的進展，我們也看到了陰影的復活。和漸變一樣，陰影被擱置在極簡主義和二維設計中。現實主義和偏態仍然存在，但在2018年，設計師們將會越來越多地在他們的作品中不斷更新、軟化和風格化的陰影。

她以一個例子來提供規模網站。她解釋說：“界面的布局非常簡單，但特點是柔軟的，飽和的梯度，并大量使用基于陰影的微交互。”不僅有許多可點擊的按鈕被拉長的陰影所突出，陰影也強調了媒體和打破了頁面。深度有助于確定視覺層次結構，并可以指向用戶輸入字段，并在屏幕上調用操作。

平面設計完全背離了20世紀的偏態和超現實，但鐘擺擺得太遠了嗎?“在2018年，我們將繼續朝著世界上最好的局面發展，”摩爾相信，“在這種情況下，巧妙地重新引入陰影和漸變，可以增加功能和美感。”

07、有趣的插圖

2017年，我們在網站上看到了更多的插圖，這并不是巧合。摩爾說：“品牌想要脫穎而出，插圖是將個性注入網站的絕佳方式。”

“它們在視覺上吸引人，而不會妨礙功能和簡單；插圖有無限的形狀、大小、樣式，是一個動態的元素，可以在2018年及以后尋找。我們正在學習，不要因為簡單的用戶體驗而忽視好玩。

然而，這一趨勢并不僅僅是異想天開。插圖可以是展示或解釋信息的非常實用的方法。沒有人想要一個無聊的網站，而定制繪畫是一種人類的觸摸，可以為枯燥的內容注入活力。

“市場已經飽和，競爭激烈，而網頁設計需要在個性和功能之間找到平衡；插圖是展示你是誰的最佳方式，只要看看那些有趣的人就可以了。

08、人工智能的發展

人工智能不再是科幻小說的話題。人工智能已經通過像會話接口(聊天機器人)這樣的技術進入主流網頁設計。事實上，據eBay產品設計師伊萊恩·李(Elaine Lee)說，你可能已經在日常工作中使用人工智能了，甚至不知道它。

正如她在這篇文章中所解釋的那樣，所謂的“人工狹窄智能”已經很難在像谷歌Home和蘋果的Siri這樣的語音助手工作了。它還為亞馬遜(Amazon)、Spotify和Netflix等公司提供推薦技術，更不用說智能家居設備、自動駕駛汽車和聊天機器人了。

“隨著人們越來越習慣于與機器人互動，我們看到了在設計中使用對話界面的興起，”《宣言》的首席執行官兼創始人吉姆?鮑伊斯(Jim Bowes)說。“展望未來，機器學習和人工智能將被引入我們在未來幾年內與之互動的許多系統。”

“作為一種媒體，設計將以多種方式適應這種情況，”他預測道。“在某些情況下，它的目的是展示人工智能，有時設計會使人工智能看起來自然和不可見。”我想我們將會看到大量的設計，在實際情況下，試圖展示更多的智慧，而不是真正的人工智能。這通常是通過在數字旅行中更好地利用上下文來實現的。

09、不對稱布局

2010年的響應式設計運動已經徹底改變了網頁設計，并使設計者能夠在不同的設備之間無縫地進行設計。Bearne說：“今年，我們看到設計的增加，違背了響應性設計的限制，試圖變得更‘有創意’。”

你幾乎可以聽到客戶的反饋，說：“你能不能少些boxy”，設計師回答道。“新技術意味著，在2017年，傳統的網頁設計規則已經被打破了。”

但Bearne認為這一趨勢是謹慎的。他指出：“在2015年，那些推動不對稱的設計真的出現了。”在那一年，Spotify使用了一種不對稱的設計來實現“音樂年”。在這種情況下，它感覺良好，并增加了品牌的創造性和大膽的個性。不幸的是，它最基本的形式已經開始成為一種普通的方法，并已經進入了更多的網站，而不是為了更好的。

“2017年突出的是不斷差異化和脫離規則的動力。”好的設計師接受規則；他們喜歡他們，和他們一起工作。但他們也找到了推動它們的方法，并創造出新的展示內容的方式。這是我希望持續到2018年的事情。

10、充分利用手機

對于移動網絡來說，2017年是具有里程碑意義的一年，因為它的使用最終超過了桌面瀏覽。這意味著網絡設計師們將比以往任何時候都更加關注手機用戶。

“當我們進入2018年的時候，我希望創新能充分利用我們從未在桌面上看到的移動功能，”摩爾說。“2018年將繼續看到設計師們開發出巧妙的方法來完美地組織信息，并將其引向更復雜的用戶體驗，專注于微交互和手勢圖標和按鈕。”

簡單地說，直觀的導航站點轉換更好；g - star把這一切都做得很好。

洛佩茲提供了一個具體的例子，說明了手機優先是如何不只是一個通風的原則，而是需要在核心的設計過程中被烘焙的東西。正如我們前面提到的，動畫現在越來越多地出現在網頁設計中——“但是有時候，它太過了。”有過度使用的危險，依賴于運動來定義體驗。

“設計師需要考慮到，大型動畫和過渡將如何轉化為移動設備等瀏覽器和設備，在那里，沒有懸停狀態和內容需要適應縮小的屏幕尺寸。”

11、動能的電子郵件

阿德斯特拉(Adestra)的數字設計主管羅布?佩羅(Rob Pellow)表示：“今年，至少在英國，人們終于開始關注移動響應，并開始關注接下來會發生什么。”

“事實上，當我們還有些品牌想要讓他們的活動和模板移動響應時，幾乎所有人都在問這個問題：‘我們還能做什么?’”

他說，在第一年，阿德斯特拉經常使用“動態”電子郵件：使用CSS3和HTML在電子郵件中創建交互性。這一趨勢源于這樣一個事實，即用戶對移動應用程序和網站的UI語言非常滿意，他們很高興在其他地方看到它，包括電子郵件。

“有了這些新的機會，我們邁出了第一步，把單一的電子郵件活動當作一段旅程；百安居對待我們到另一個令人印象深刻的旋轉木馬，在比以往更多的電子郵件客戶端，石蕊給我們的能力有一個籃子過程在峰會上的電子郵件和叛軍(原名Rebelmail)現在是銷售的能力來完成整個檢查過程中的電子郵件——唯一的網頁你最后看到的是一個確認頁面。

“這開始改變電子郵件對人們的意義，因為，如果我們能在這里提供這些體驗，我們可以將這些東西與網站只能夢想的個性化程度結合起來。”誰說電子郵件已經死了?