基于網頁設計中UI界面的應用

文/樊鴻燁 關玉欣

隨著互聯網技術的發展，網絡已成為人們獲取信息的主要途徑，網絡信息傳播的載體是網站，而網站的特點，就是通過網站圖文信息、服務方式等將關鍵信息傳達給人們。在新媒體技術的影響下，網頁UI設計便成為了用戶瀏覽體驗的重要影響因素。對網頁設計中的UI界面應用問題進行探究，有助于互聯網技術的發展進步。

1 UI界面設計的設計原則

UI是用戶界面（User Interface）的簡稱，UI界面設計主要指的是軟件操作邏輯與界面美觀的整體設計。合理化的UI設計不僅可以展示出軟件的自身特色，也可以讓軟件操作過程呈現出舒適化、簡單化與自由化的特點，根據計算機技術的發展現狀，以下三點成為了UI界面的主要設計原則。

1.1 輕量感

輕量感可以讓用戶在處理嚴肅復雜的信息時，仍然有適當的輕松愉悅感受。例如，去除繁雜的樣式，使用更輕盈的轉場效果等。

1.2 指引性

人性化的指引能夠幫助用戶更加明確和深入的處理信息。例如輔助的名詞解釋，插圖輔助等。

1.3 可靠性

一個穩定的網頁界面能夠給用戶帶來可靠的感覺，例如，在顏色等視覺表現上提供給用戶穩定而又專業和可靠的感受。

2 UI界面在網頁設計中的視覺信息傳達

網頁設計是利用讓用戶感覺合理的字體樣式和色彩美化頁面設計的過程。網頁設計旨在讓用戶感受到完美的視覺體驗，在UI界面設計方面，以下兩點發揮著較為重要的作用。

2.1 UI界面文字應用

UI界面中的文字可以發揮出解釋網頁內容的作用。易讀性與可讀性是UI界面文字設計的基本要求。文字的易讀性，要求UI界面的文字設計可以讓用戶更容易獲取自己想要獲取的關鍵詞。文字可讀性與網頁界面視覺性有關，文字的排版、行距等內容均是文字可讀性的影響因素。

2.2 UI界面的圖片應用

UI界面的圖片應用，對圖片的質量和清晰度具有較為嚴格的要求。一般情況下，圖片的排版方式可以分為下張預覽、幻燈片展示和大圖平鋪等多種方式，圖片內容需要與網頁的宣傳內容相吻合。

3 UI界面在網頁設計中的用戶體驗與人機交互效果

3.1 網站的結構布局

網站的結構布局對一個網站是否被關注起著至關重要的作用。例如一個網站的首頁如果結構布局凌亂不堪，視覺感官令人厭煩，那么將會造成瀏覽者對其關注的吸引力下降。下圖所示的內容為優酷TV的結構布局。

根據圖中所示內容，網站結構布局具有簡潔化的特點。電影、電視劇、綜藝視頻等分區之間的界限較為清晰。用戶可以在第一時間了解網站所提供的視頻的主要類型，進而根據自己的需要，選擇視頻內容。

3.2 24色相環的配色原理

在網頁設計中，色彩永遠是最重要的一環。色彩是視覺信息傳達的要素。進入一個網頁的瞬間，首先進入視線的就是色彩，瀏覽者對網頁的整體感覺印象就會固定下來，如同人與人之間第一次見面。紅、黃、藍，我們稱它們為“三原色”，“三原色”是色相環的基礎原色。把三原色等量的進行混合，就可以得到三間色；綠色、紫色、橙色。通過間色等量混合的復色，便構成了24種顏色的環，即24色相環。 如圖2所示。

24色相環的配色原理分為：互補色，對比色，鄰近色。

3.2.1 互補色

即“色相環”上相對的顏色，設計中搭配使用互補色，會產生沖突、刺激的視覺效果，是一種非常奪目的配色方案。當然互補色不要直接用，要用中間色中和一下，中間色就是沒有感情色彩的顏色，如黑、白、灰。

3.2.2 對比色

即“色相環”上呈120°角的顏色，對比色設計方案雖然沒有互補色那么刺激眼球，但是會體現一種豪華和華麗，讓畫面更加生動和有生機。

3.2.3 鄰近色、同類色

鄰近色是“色相環”上呈90°角的顏色，同類色是“色相環”上呈60°角的顏色，使用鄰近色和同類色來做設計會使畫面顯得更加和諧、統一，給人舒適感。

圖1：優酷TV結構圖

圖2：二十四色相環

4 結論

在互聯網技術與新媒體技術的影響下，人工智能，虛擬現實等技術得到快速發展，人們在追求軟件的功能強大且可靠的情況下，也開始追求界面所帶的舒適視覺感。因此，UI設計開始從只重技術不重設計轉變為二者兼顧。一個網站，在能夠準確表達它要傳達的意思的同時，需要給使用者良好的視覺感受和用戶體驗。所以，只有將技術和設計、良好的互動體驗結合起來才能達到更好的效果，實現更合理的人機交互。而UI設計就是為了實現這些目的而服務的。因此，UI設計不僅是一種創意，更是科學技術與藝術設計相結合的產物。