- 相關(guān)推薦
網(wǎng)頁設(shè)計(jì)中交互設(shè)計(jì)的流行趨勢(shì)
是根據(jù)企業(yè)希望向?yàn)g覽者傳遞的信息，進(jìn)行網(wǎng)站功能策劃，然后進(jìn)行的頁面設(shè)計(jì)美化工作，下面小編為大家介紹網(wǎng)頁設(shè)計(jì)中交互設(shè)計(jì)的流行趨勢(shì)吧！
一、響應(yīng)式設(shè)計(jì)日益成熟
就在幾年前，提起“響應(yīng)式網(wǎng)站”，還意味著它的適配平臺(tái)僅限于桌面，平板和智能手機(jī)等客戶端。隨著智能手表，智能電視和其他智能家用設(shè)備的迅猛增長(zhǎng)，響應(yīng)式設(shè)計(jì)的定義也得到了極大的擴(kuò)展。
很多大公司近幾年著重推進(jìn)響應(yīng)設(shè)計(jì)的研發(fā)進(jìn)程。如google前些時(shí)間推出的moto 360，以及蘋果推出的iwatch，三星、LG、華為都推出了自家的智能手表。這標(biāo)志著未來在智能可穿戴設(shè)備將超過手機(jī)發(fā)展勢(shì)頭，隨之而來的就是全面革新的響應(yīng)式設(shè)計(jì)闖入生活，未來的生活方式將更加有趣。
二、幽靈按鈕
幽靈按鈕就是隱藏形式的按鈕，不破壞整體的畫面感，保持了畫面簡(jiǎn)潔，統(tǒng)一，但又不失功能性�？梢哉f是未來在流行簡(jiǎn)約、背景大圖的一大必然趨勢(shì)。
三、更強(qiáng)調(diào)字體
出現(xiàn)這一趨勢(shì)主要有兩個(gè)方面。首先傳統(tǒng)的一些Web字體價(jià)格昂貴，意味著網(wǎng)站排版需要更多的預(yù)算。如今，這種情況在改變，設(shè)計(jì)師只要更少的預(yù)算甚至免費(fèi)的字體就能在網(wǎng)頁上自由設(shè)計(jì)。另外，在流行的簡(jiǎn)約風(fēng)格下，背景基本都是缺少故意裝飾的圖案，部分網(wǎng)頁只有背景和文字，有時(shí)會(huì)缺乏整體的設(shè)計(jì)感，所以更大的標(biāo)題文字能使畫面更具沖擊力，主次分明，使人印象深刻的同時(shí)又不使畫面顯得凌亂。
四、滾動(dòng)主導(dǎo)點(diǎn)擊
移動(dòng)互聯(lián)的不斷發(fā)展，刷新了移動(dòng)終端的使用頻率，人們?cè)绞且蕾囀謾C(jī)等設(shè)備就是越是促進(jìn)移動(dòng)交互的設(shè)計(jì)，所以，更加方便的滾動(dòng)逐漸主導(dǎo)點(diǎn)擊，成為移動(dòng)交互的新寵兒。
五、卡片式設(shè)計(jì)繼續(xù)
隨著信息處理能力的增強(qiáng)，部分以堆加信息的設(shè)計(jì)邏輯依然能存活。這里就有典型例子，卡片式設(shè)計(jì)。不同于其它走簡(jiǎn)約的信息分類，它直接醒目的將各個(gè)內(nèi)容圖片鋪開放在一起，這樣做的好處是，用戶篩選信息快速、方便，不用進(jìn)入下一級(jí)就可以基本全部了解信息。例如，微博和視覺中國(guó)的圖文信息排版。
六、扁平化繼續(xù)(或者M(jìn)aterial Design設(shè)計(jì)語言崛起)
扁平化是google最新推出的設(shè)計(jì)方向，它的另一個(gè)名字是材料設(shè)計(jì)(Material Design)。之所以這么稱呼，其實(shí)在于google的設(shè)計(jì)師想追求一種原始干凈的設(shè)計(jì)思路，把三維的空間簡(jiǎn)單化，把二維的空間復(fù)雜化，使畫面具有扁平的動(dòng)勢(shì)。拋開影響人深度思考的慣性邏輯，使UI、圖片簡(jiǎn)單并且具有物體的動(dòng)態(tài)象征性。
這一設(shè)計(jì)語言有種靈氣，簡(jiǎn)單脫俗。在層次感和動(dòng)畫上保存真實(shí)的動(dòng)態(tài)有型的世界，同時(shí)簡(jiǎn)化了物體的體積的造型感。
這樣靈動(dòng)的設(shè)計(jì)氣質(zhì)，使的很多大公司爭(zhēng)相研究，如蘋果從ios7，谷歌原生UI，微軟win8界面。扁平化在大公司開疆帶領(lǐng)下必將在未來風(fēng)光無限。
當(dāng)然，扁平化不僅僅是停留在UI設(shè)計(jì)層面上，很多網(wǎng)站都運(yùn)用了這一設(shè)計(jì)語言，如蘋果官網(wǎng)，字體靈動(dòng)但是毫無體積感。
除了審美上的需求外，扁平化也是技術(shù)上的突破。它的到來使圖片和文字的壓縮量減少，帶來的就是更加流暢的用戶體驗(yàn)。這樣零點(diǎn)幾秒的體驗(yàn)提升，帶來的是用戶不自覺的接受并且慢慢成為習(xí)慣，直到最后難以折回。視覺和功能上的完美體驗(yàn)，如同每次打開的都像是卡通畫，精致耐看。
七、微交互
微交互就是一個(gè)小小的智能系統(tǒng)，例如，你在打開天貓或者京東等購物網(wǎng)站的時(shí)候，網(wǎng)站通過你個(gè)人經(jīng)常瀏覽的信息進(jìn)行處理，彈出一個(gè)你想買的東西的窗口。這種交互方式使人感覺網(wǎng)頁十分只智能、親近。雖然小小改變足使人感到貼心，所以它會(huì)是將來發(fā)展比較好得交互方式。
八、交互式故事
比起長(zhǎng)篇累牘的文字介紹，放一篇生動(dòng)的故事更能捉住讀者的眼球。在未來，這樣貼近生活的交互模式下，泛濫成災(zāi)的長(zhǎng)篇文字早已超出人們閱讀的耐心，所以微博才會(huì)限制字?jǐn)?shù)在140字以內(nèi)，多數(shù)網(wǎng)站如特斯拉，蘋果等更喜歡用簡(jiǎn)短的文字講故事或者干脆放上精彩的廣告視頻，這樣既節(jié)約了讀者的時(shí)間，也在瞬間取得關(guān)注。
九、愈大愈佳的圖片
文字越來越大是因?yàn)閺?qiáng)調(diào)主題，穩(wěn)固整體結(jié)構(gòu)。那么越來越大的圖片就表明了，科技進(jìn)步帶來的信息產(chǎn)業(yè)飛速發(fā)展，之前因?yàn)閹捿^低，大圖基本不可能出現(xiàn)在網(wǎng)頁上，而今不同，大圖標(biāo)志著更具簡(jiǎn)約時(shí)尚，是一個(gè)成熟網(wǎng)站設(shè)計(jì)的標(biāo)志之一。
大圖不僅方便取材，更方便設(shè)計(jì)師的加工和修改。通過色彩濾鏡和模糊透鏡，劃分層次，降低圖片背景的關(guān)注度，強(qiáng)調(diào)題目文字，使得文字有一種懸浮于背景之上的新的視覺觀感。
除此之外大圖還有個(gè)好處就是，可以很好的結(jié)合之前所提到的如垂直滾動(dòng)、扁平化、幽靈按鈕、故事內(nèi)容等等交互模式相結(jié)合，打造出多層次、多體驗(yàn)感受、多視覺沖擊的全新交互設(shè)計(jì)。
這里依然拿蘋果做例子，因?yàn)樗菬o數(shù)設(shè)計(jì)師的榜樣產(chǎn)品，無論是工業(yè)設(shè)計(jì)，廣告設(shè)計(jì)，UI設(shè)計(jì)，系統(tǒng)設(shè)計(jì)等等都是最好的，我認(rèn)為沒有之一，是綜合實(shí)力最強(qiáng)的。在瀏覽它的官網(wǎng)可以看出，蘋果一直在不斷的完善自己的設(shè)計(jì)風(fēng)格，一直在追求極致的簡(jiǎn)單、大氣、精致的品牌和設(shè)計(jì)理念。我覺得這是一種幾乎變態(tài)的追求完美，雖然設(shè)計(jì)是具有時(shí)效性的，但是蘋果的每個(gè)產(chǎn)品都是那個(gè)時(shí)期最優(yōu)秀的，就算過時(shí)依舊精致。這個(gè)傳奇的企業(yè)嫻熟的掌握各種設(shè)計(jì)語言，其中的大圖模式僅僅是他們冰山一角。
十、更為自由的排版方式
網(wǎng)頁設(shè)計(jì)的排版方式一直是設(shè)計(jì)師們討論的話題，自2006年以來，固定網(wǎng)頁文字格式的排版已經(jīng)在慢慢變化了，設(shè)計(jì)師的思維早就想把枯燥的文字格式重新設(shè)計(jì)，但是由于當(dāng)時(shí)綜合技術(shù)層面上的原因沒有成功。但是現(xiàn)在不一樣了，響應(yīng)式交互使得排版方式不得不發(fā)生改變，更自由的排版方式更能博得讀者的好奇心和關(guān)注度。
網(wǎng)頁設(shè)計(jì)中，影響讀者文字閱讀體驗(yàn)的三個(gè)重要因素是：1.字體大小2.列寬3.行間距傳統(tǒng)web瀏覽中，較大的字題和適當(dāng)?shù)男芯嗫梢悦黠@提高閱讀感受。但是，多互聯(lián)響應(yīng)式的到來，移動(dòng)終端的閱讀瀏覽量已經(jīng)遠(yuǎn)大于PC，所以新的排版不見得就是運(yùn)用原來的方法。手機(jī)和平板使用的距離較近，有時(shí)并不需要較大的字體用于凸顯，相反在小屏幕上營(yíng)造空間感才是新的排版方向。
十一、網(wǎng)頁圖表迎來新曙光
人作為視覺性動(dòng)物，對(duì)于圖片信息的接受能力遠(yuǎn)大于文字信息，所以在碰到需要大量數(shù)據(jù)做案例的文段時(shí)，圖表的優(yōu)勢(shì)就很明顯的體現(xiàn)出來了。圖表不僅能使人快速理清邏輯、數(shù)據(jù)等信息，還能使大腦有長(zhǎng)期而清晰地記憶點(diǎn)。更重要的是，結(jié)合多種動(dòng)畫設(shè)計(jì)，圖表會(huì)更加生動(dòng)，更有說服力。
現(xiàn)在網(wǎng)頁圖表已經(jīng)慢慢流行，相比普通圖表，它具有互動(dòng)性，他可根據(jù)網(wǎng)絡(luò)數(shù)據(jù)的變化而隨時(shí)變化，加上鮮明的色彩、簡(jiǎn)單的樣式以及多層次的動(dòng)畫，使的他更具有關(guān)注點(diǎn)。數(shù)據(jù)舉例不再冰冷，更多的網(wǎng)頁喜歡拿可靠、生動(dòng)的數(shù)據(jù)說話了。
未來網(wǎng)頁設(shè)計(jì)將是各個(gè)設(shè)計(jì)門類的綜合體，所以我們更應(yīng)該將平面設(shè)計(jì)知識(shí)運(yùn)用在網(wǎng)頁設(shè)計(jì)中去，設(shè)計(jì)師應(yīng)該是具有智慧的工匠人。
【網(wǎng)頁設(shè)計(jì)中交互設(shè)計(jì)的流行趨勢(shì)】相關(guān)文章：
網(wǎng)頁設(shè)計(jì)流行趨勢(shì)03-15
網(wǎng)頁設(shè)計(jì)中的滾動(dòng)交互新技巧07-10
2017網(wǎng)頁設(shè)計(jì)流行趨勢(shì)08-09
網(wǎng)頁設(shè)計(jì)5大流行趨勢(shì)06-25
網(wǎng)頁設(shè)計(jì)常見的交互設(shè)計(jì)錯(cuò)誤04-09
網(wǎng)頁設(shè)計(jì)中常見的交互設(shè)計(jì)錯(cuò)誤02-24