UI的本意是用戶界面,是英文User Interface的縮寫。在揚州網景(Yzonline.com)8年的網站建設商務實踐中,網景認為:就網站建設而言,UI設計通常指對網站的頁面布局、操作邏輯、界面美觀的設計,是網頁設計的前奏。很多客戶也把UI作為網站正式設計前的草稿。恰到好處的UI設計,不但能深刻挖掘客戶的需求,將客戶需要表現的內容充分展示,為瀏覽者提供舒適、友好、簡單的訪問體驗,進而留住用戶,還能結合SEO(搜索引擎優化),提升網站的搜索引擎排名。就如同蓋房子要有圖紙一樣,網站建設也要有先于頁面設計的草圖,這就是頁面UI的簡單定義。
在網站建設的過程中,UI設計可以起到很好的鋪墊作用。通?蛻魧ψ约旱木W站定位都有大致的思路,但如何以互聯網通用的方式呈現在網頁上,就可能會比較模糊。根據客戶的思路,網站策劃會提供一套足以表現網站整體架構和布局的UI作為細節溝通的基礎。通過UI這種直觀、清晰的描述,客戶在未見到設計稿之前,就能對網站布局、結構和流程有充分的把握,有任何異議,都可以迅速協商反饋,這樣逐步的溝通協調最終達到客戶最滿意的網站雛形。
這種描述了網站整體和細節構想的頁面草圖,在后續的流程中,就是網頁設計的范本。使用UI來直觀展示頁面主題,體現層級關系,并對關鍵的問題點進行預處理,可以幫助設計師快速了解網站需要表達的東西,樹立對整個網站的初步印象,從而在設計的過程中抓住重點,該突出的突出,該修飾的修飾,該淡化的淡化,把UI中所要表達的主題發揮出來。
UI也是網頁設計的外框。有了布局、風格的大體界定,才能保證頁面的風格設計在限定的范圍內,而不會偏離主題天馬行空。對于急切希望看到網站效果的客戶,快速有效的實現網站建設是很關鍵的,由此可見UI的重要作用。
另外,有了UI的指導,設計師可以更專注于對頁面效果的考量,專注于用最恰當的形式表現內容,而不用分心考慮頁面的布局、元素和內容這些基礎的東西。如同專業的廚師只需要考慮菜式的色、香、味,而不必費心摘、洗、切這些工序了,術業有專工,這樣才能出精品。
下面列舉一個網景網站項目的產品首頁作為示例。在這個產品首頁,UI里頁面的布局為左右結構,左側為產品的分類列表,每小分類默認狀態下都為打開狀態。中間部分是產品的大類列表,如圖一所示。
圖一 UI視圖
在最終的網頁設計中,設計師用和網站產品相關的金屬的銀灰色,定義了網站的色彩,再配以體現產品特性的圖片,讓瀏覽者一看便知該客戶所生產銷售產品的類別,如圖二所示。同時設計師對UI里列表展示產品分類的形式進行發揮,設計了風格簡潔、操作直接的鏈接形式,為網站頁面添色不少。
圖二 網頁設計效果
如果您有任何疑問或者建站需求,歡迎聯系我們,揚州網景愿為您提供高品質的建站服務。