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