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