網(wǎng)站中設(shè)計師經(jīng)常使用圖片來擴(kuò)大網(wǎng)站的表現(xiàn)力，創(chuàng)造出色的UI界面，拉近與訪客之間的互動。不過近年來越來越多的設(shè)計師開始傾向于使用插圖，這是因為插圖在所有的圖片之中是最有表現(xiàn)意味的。在網(wǎng)站中使用插圖可以使枯燥的文本更加有趣，可以讓UI界面更有畫面感、激發(fā)訪客的興趣。與此同時，網(wǎng)站信息內(nèi)容的闡述與傳遞也更加直觀、生動，有利于提升用戶體驗。在今天這篇文章中，小編將向大家介紹一下什么是插圖以及如何應(yīng)用插圖做好UI界面設(shè)計。插圖其實是插畫的俗稱，原指我們平時看的報紙、雜志、報刊的文字中所添加的圖畫，現(xiàn)已成為現(xiàn)代設(shè)計中一種重要的視覺傳達(dá)方式，廣泛應(yīng)用于多個領(lǐng)域之中，如商業(yè)活動、網(wǎng)站設(shè)計、文化事業(yè)等。插圖用英語來說是illustration，這其實是由拉丁文illustraio演變而來，意指照亮，也就是說插圖可以使文字更加明確清晰。除此以外，它還能夠增加文字的趣味性，讓文字給用戶留下更生動的印象，增強(qiáng)藝術(shù)的感染力。在網(wǎng)頁設(shè)計之中，插圖正成為一個功能性的元素。它作為設(shè)計師與用戶交流溝通的工具，正通過視覺元素有效率地闡述、傳遞信息。如果說文字可以告知訪客某種信息，那么插圖就能將這些信息展示給訪客看。不過如果想要充分發(fā)揮插圖的功能，我們在使用時還必須遵循兩個準(zhǔn)則：一是插圖要易于辨認(rèn);二是插圖可以為不同語境、不同文化的訪客所解讀，不出現(xiàn)歧義等現(xiàn)象。那么在網(wǎng)站中該如何合理使用插圖增強(qiáng)用戶互動呢?以下是小編總結(jié)的網(wǎng)站中插圖的不同使用情境，并分析了一些完成度比較高的例子，希望大家可以借鑒并有所收獲。1、在主頁上使用插圖優(yōu)秀的網(wǎng)頁設(shè)計常常需要給訪客或者說潛在用戶留下深刻的印象，這是因為人們總是基于網(wǎng)站的質(zhì)量來評判一個公司的好壞。主頁是一個網(wǎng)站的門面，決定著訪客對網(wǎng)站的第一印象，而第一印象往往是是視覺上的，因此不少網(wǎng)站在主頁上使用插圖。在網(wǎng)站的主頁使用插圖能夠給整個網(wǎng)站帶來更多的藝術(shù)美感、讓主頁更加生動活潑。這些主頁插圖還能夠激發(fā)用戶的想象力，在用戶和網(wǎng)站之間建立一定的聯(lián)系。除此之外，獨一無二的插圖還可以將你的網(wǎng)站與一眾競爭對手區(qū)別開來，形成更強(qiáng)的品牌號召力。Intercom就是一個典型的例子。在它的首頁，如果僅靠"Communicating with customers shouldn't be this hard"和"With Intercom it's simple，personal， and fun for everyone"這兩句話無法形成強(qiáng)烈的對比，難以激起訪客的興趣。因此，Intercom使用了插圖，模擬"你"和用戶的溝通方式，老方法和新方法之間的優(yōu)劣一目了然，直觀的展示了自己產(chǎn)品的優(yōu)勢所在。這種貼心的講解更有利于吸引訪客，將訪客轉(zhuǎn)化成用戶。2、在不同頁面上使用插圖如吉祥物吉祥物是插圖的一種，它常作為商品標(biāo)志和企業(yè)形象的代表。在網(wǎng)站中使用吉祥物可以帶來很多好處。吉祥物以其強(qiáng)大的親和力和趣味性能夠很快贏得訪客們的信任，建立訪客與網(wǎng)站之間的情感紐帶;可以讓交互過程更生動，更能維持用戶的注意力。而且，對于訪客來說這種圖形元素絕對是鮮活的，是能夠給他們贏下深刻印象的。使用吉祥物提升用戶體驗最出名的一個網(wǎng)站就是Mailchimp。Mailchimp是一家提供電子郵箱營銷服務(wù)的網(wǎng)站，它的吉祥物一只叫做Freddie的可愛猩猩。一方面，F(xiàn)reddie身背郵差包，肩負(fù)傳統(tǒng)郵遞員的重責(zé)，突出了網(wǎng)站的主題，與品牌形象相吻合;另一方面，F(xiàn)reddie這個吉祥物可大可小，能出現(xiàn)在網(wǎng)站的不同頁面上，充分發(fā)揮各種作用，比如引導(dǎo)訪客前往某個區(qū)塊或是僅僅娛樂訪客，讓用戶體驗更加愉悅。3、在教程上使用插圖插圖很大的一個特征就是在于讓枯燥的文字富有生機(jī)，用簡單的圖片解釋復(fù)雜的概念。這一點對于網(wǎng)站中的一些教程或是指導(dǎo)手冊來說簡直就是福音。網(wǎng)站中的教程和指導(dǎo)手冊通常都是長篇大論、乏味無趣的，而增加插圖可以極大的化解這個問題，提供給訪客更多的視覺信息，減輕閱讀負(fù)擔(dān)，讓他們更有了解詳情的欲望，這樣的用戶界面看起來也會更加賞心悅目。如果你并沒有合適的插圖可以用來講解教程，動畫效果也是比較好的選擇。當(dāng)插圖和極小的用戶界面(如手機(jī)界面)結(jié)合起來優(yōu)勢更加明顯，插圖既能傳遞一定的視覺信息，又不會侵占其他元素發(fā)揮的空間。4、在獎勵界面使用插圖獎勵界面可能在游戲軟件中最為常見，幾乎所有的游戲都設(shè)有一定的關(guān)卡，當(dāng)你通過一定數(shù)量的關(guān)卡，就能夠獲得某種成就或獎項。而不少設(shè)計師就在獎勵頁面使用一些插圖，注重引起用戶情感上的互動。比如Foursquare在獎勵頁面使用了一個市長勛章。這能給用戶很大的鼓勵，同時營造一種感覺，讓他們覺得手機(jī)屏幕的那一端并不是機(jī)器，而是活生生的人。另外，這種插圖可以帶來積極情緒，當(dāng)訪客受到這種情緒的影響時，常常會忽略網(wǎng)站上的一些缺點。在網(wǎng)站中我們同樣可以使用插圖鼓勵用戶。比如，當(dāng)用戶完成注冊登錄時，可以獲得一份禮包或者是其他獎勵等等，幫助營造用戶的積極情緒，或是在用戶完成購買后贈送積分或抽獎環(huán)節(jié)，不少商城網(wǎng)站早已在使用這一技巧了。插圖是提升用戶體驗，讓用戶界面更具吸引力一項強(qiáng)有力的工具。插圖一定要有價值。只有這樣，插圖才能發(fā)揮自己在網(wǎng)站中的益處，讓用戶對公司產(chǎn)品或品牌產(chǎn)生深刻的認(rèn)識。

本文名稱：巧用插圖做好UI界面設(shè)計
網(wǎng)址分享：http://jinyejixie.com/news/43450.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供標(biāo)簽優(yōu)化、網(wǎng)站內(nèi)鏈、面包屑導(dǎo)航、外貿(mào)建站、響應(yīng)式網(wǎng)站、自適應(yīng)網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)