這篇文章將為接下來(lái)想要進(jìn)入U(xiǎn)I相關(guān)行業(yè)工作的人講解一些基礎(chǔ)只是以及總結(jié)在UI設(shè)計(jì)中需要注意的幾點(diǎn)。

目錄

1.UI的基礎(chǔ)知識(shí)

  1.1 UI不用戶(hù)的接觸點(diǎn)

  1.2 用戶(hù)看到的畫(huà)面全部是UI

  1.3 UI與UX的差異

2.UI設(shè)計(jì)的基本要點(diǎn)

   2.1事前準(zhǔn)備

2.2UI設(shè)計(jì)的4個(gè)要點(diǎn)

3.后記

UI的基礎(chǔ)知識(shí)

UI指的是與用戶(hù)之間的接觸點(diǎn)

UI是英語(yǔ)中UserInterface的縮寫(xiě)。Interface有「接點(diǎn)」以及「接觸面」的意思。在網(wǎng)絡(luò)營(yíng)銷(xiāo)中，也有用戶(hù)與服務(wù)的接點(diǎn)這一層意思。將想要傳達(dá)的東西傳達(dá)給用戶(hù)，促進(jìn)交流是提高網(wǎng)絡(luò)成果的必經(jīng)之路。正確的UI設(shè)計(jì)是不可或缺的，指的就是這里。

用戶(hù)的眼睛看到的東西全部都是UI

那么，UI具體到底是什么東西呢?以web網(wǎng)頁(yè)或APP來(lái)思考的話，用戶(hù)眼睛看到的東西全部都可以稱(chēng)之為UI。畫(huà)面與文本自不必多說(shuō)，字形、風(fēng)格、余白以及布局都可以稱(chēng)之為UI。但是通過(guò)這個(gè)說(shuō)法，在實(shí)際進(jìn)行設(shè)計(jì)時(shí)，很容易導(dǎo)致設(shè)置風(fēng)格僅偏向于視覺(jué)觀感，但是光好看是不行的，如何設(shè)計(jì)出最適合的UI才是關(guān)鍵勝負(fù)。

UI與UX的差異

一個(gè)與UI相似的單詞，被稱(chēng)之為UX。讓我們簡(jiǎn)單的看下這兩個(gè)單詞的差別。UI指的是和上面介紹的一樣，用戶(hù)比服務(wù)的接點(diǎn)。而UX則稍微有些不同，UX指的是根據(jù)服務(wù)讓用戶(hù)得到的體驗(yàn)。例如生活變得豐滿(mǎn)，獲得感動(dòng)，購(gòu)買(mǎi)手續(xù)變的方便等，這些可以統(tǒng)稱(chēng)為UX。總結(jié)來(lái)說(shuō)，就是為了提供良好的用戶(hù)體驗(yàn)(UX)，而通過(guò)用戶(hù)與服務(wù)(UI)的設(shè)定來(lái)完成，也可以說(shuō)UI是UX的一部分。

UI設(shè)計(jì)的基礎(chǔ)要點(diǎn)

接下來(lái)為大家講解，UI設(shè)計(jì)中需需要掌握的一些基礎(chǔ)要點(diǎn)。如果能為以后想要進(jìn)入U(xiǎn)I設(shè)計(jì)行業(yè)的人們，還在為UI設(shè)計(jì)煩惱的人提供參考的話就最好了。

事前準(zhǔn)備

明確目標(biāo)

在實(shí)際進(jìn)行UI設(shè)計(jì)之前，有一件必須要做的事。也就是明確目標(biāo)。根據(jù)目標(biāo)的不同，可以更好的在后面進(jìn)行UI的改善以及人性化設(shè)計(jì)。這里再重復(fù)一遍，UI指的是用戶(hù)與服務(wù)的接點(diǎn)。如果不了解作為對(duì)象的用戶(hù)，是無(wú)法了解到用戶(hù)對(duì)于各方面的需求的。UI設(shè)計(jì)的成敗與目標(biāo)有著非常重要的關(guān)系。

關(guān)于明確目標(biāo)的方法，一般經(jīng)常使用的是一個(gè)叫作假面的方法。假面指的是：服務(wù)與產(chǎn)品的所提供給的理想人物。根據(jù)問(wèn)卷調(diào)查以及潛在用戶(hù)的分析為基礎(chǔ)的具體資料來(lái)設(shè)置假面。這樣還可以設(shè)計(jì)出更好的營(yíng)銷(xiāo)策略，并且可以讓團(tuán)隊(duì)內(nèi)有更好的共同意識(shí)。請(qǐng)務(wù)必嘗試這種做法。

想要傳達(dá)什么?

接下來(lái)，讓我們來(lái)決定想要給目標(biāo)傳達(dá)什么。找出用戶(hù)的需求，我們需要提供什么東西，自身的服務(wù)以及產(chǎn)品有什么特征，根據(jù)這些情報(bào)來(lái)推斷出提供給用戶(hù)查看的優(yōu)先度。

UI設(shè)計(jì)的4個(gè)要點(diǎn)

在完成準(zhǔn)備后，讓我們來(lái)看看在具體的UI設(shè)計(jì)中需要注意的幾點(diǎn)。在眾多要點(diǎn)中，選取最為重要的地方進(jìn)行解說(shuō)。

遵守設(shè)計(jì)的原則

在網(wǎng)頁(yè)設(shè)計(jì)中有著基礎(chǔ)的原則。「接近」、「整列」、「対比」、「反復(fù)」這四點(diǎn)，通過(guò)良好的遵守這四個(gè)原則，可以得到更加統(tǒng)一的設(shè)計(jì)感。UI也會(huì)變得更加好看。接下來(lái)讓我們一個(gè)個(gè)講解上面的4點(diǎn)。

「近接」指的是將關(guān)聯(lián)性較高的要素顯示在較勁的地方，而沒(méi)有關(guān)聯(lián)性的東西則配置在其他地方。根據(jù)這里可以讓文本以及圖像就算不知道是什么，也能一眼看出其中的關(guān)聯(lián)性。「整列」指的是整齊的分配要素的布局。被稱(chēng)之為contrast的對(duì)比指的是在顯示的情報(bào)中增加強(qiáng)弱要素。文本的字形(尺寸與顏色等)的改變。最后的反復(fù)則是重復(fù)信息的收集以及有節(jié)奏的重復(fù)，變得更加容易讀取信息。

減少情報(bào)良

在進(jìn)行UI的大減時(shí)，盡可能的減少情報(bào)量也是有必要的，如果情報(bào)量太多容易導(dǎo)致用戶(hù)不知道將目光放在哪里。這樣會(huì)導(dǎo)致用戶(hù)錯(cuò)過(guò)想要獲取的情報(bào)。所以在事前準(zhǔn)備時(shí)候可以對(duì)情報(bào)做一個(gè)優(yōu)先度的調(diào)整。根據(jù)優(yōu)先度來(lái)針對(duì)頁(yè)面內(nèi)內(nèi)容的表示。讓頁(yè)面更加簡(jiǎn)潔易懂。

根據(jù)用戶(hù)的目光來(lái)進(jìn)行配置

用戶(hù)在觀看web網(wǎng)頁(yè)時(shí)，一般會(huì)從左上開(kāi)始向右下移動(dòng)目光，這也是經(jīng)常提到的F法則。根據(jù)字母F書(shū)寫(xiě)的順序，從左上開(kāi)始向右上移動(dòng)，隨后伴隨頁(yè)面的滾動(dòng)來(lái)看向下方的內(nèi)容，因此我們從左上開(kāi)始對(duì)重要的要素進(jìn)行布局，讓用戶(hù)得到更光滑的閱覽體驗(yàn)。

對(duì)應(yīng)手機(jī)

在考慮UI的設(shè)計(jì)中，對(duì)于手機(jī)與平板電腦的對(duì)應(yīng)也是需要加入考慮范圍的。特別是手機(jī)上，只有一個(gè)手掌大的尺寸。有點(diǎn)擊以及滑動(dòng)的特有操作。使用與PC版不不同的布局以及字形或者制作手機(jī)版專(zhuān)用的要素是有必要的。

新聞標(biāo)題：ui設(shè)計(jì)基礎(chǔ)知識(shí)
當(dāng)前鏈接：http://www.js-pz168.com/news42/167092.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站排名、網(wǎng)站策劃、網(wǎng)站維護(hù)、外貿(mào)建站、微信小程序、關(guān)鍵詞優(yōu)化

廣告

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