把控這些細(xì)節(jié),你將會(huì)做出一個(gè)漂亮的網(wǎng)頁(yè)設(shè)計(jì)!

2015-10-01    分類(lèi): 網(wǎng)站建設(shè)

雖然我不承認(rèn)我了解架構(gòu),產(chǎn)品設(shè)計(jì)的另一個(gè)相同的共性是最容易忘記細(xì)節(jié)。但這些小事情,微小的細(xì)節(jié),最終促使美麗的產(chǎn)品,和漂亮的房子。當(dāng)然,我提到的產(chǎn)品設(shè)計(jì)中的“細(xì)節(jié)”,并非只是表面的設(shè)計(jì),如顏色、陰影或位置。相反我指在網(wǎng)頁(yè)設(shè)計(jì)中難以定義的、用戶(hù)體驗(yàn)和潛意識(shí)的模式,以及幫助用戶(hù)感覺(jué)更自在的交互。這些細(xì)節(jié)比如是可能是光標(biāo)的形式、“向下”風(fēng)格的按鈕、或一個(gè)有用的動(dòng)畫(huà)。
這些細(xì)節(jié)采取何種形式,我敢打賭,它不是在Photoshop里設(shè)計(jì)。注重細(xì)節(jié)是很難的事情,當(dāng)你構(gòu)建一個(gè)產(chǎn)品時(shí),需要花費(fèi)昂貴的時(shí)間和技術(shù)開(kāi)銷(xiāo),這一切都是為什么細(xì)節(jié)很難把控的原因。我花時(shí)間在這些細(xì)節(jié)的追求,我有兩個(gè)奢侈品,謝天謝地我能負(fù)擔(dān)得起。

首先,我有能力使用,改善和重復(fù)。我不只是談?wù)撽P(guān)于技術(shù)實(shí)現(xiàn)細(xì)節(jié)的能力,我也有時(shí)間這樣做。有時(shí)一個(gè)交互會(huì)帶我長(zhǎng)50%,僅僅是因?yàn)槲一藥讉€(gè)小時(shí)困擾的動(dòng)畫(huà)狀態(tài)發(fā)生在0.65秒的時(shí)間。這不是一個(gè)奢侈品,許多產(chǎn)品可以承受,或愿意建立范圍。這是可以理解的。

第二,我使用我的產(chǎn)品,如果有一個(gè)惱人的交互中存在不必要的長(zhǎng)篇?jiǎng)赢?huà)或一個(gè)愚蠢的用戶(hù)體驗(yàn),那么這個(gè)產(chǎn)品是留不住用戶(hù)的。網(wǎng)站建設(shè)也是一樣,做不出優(yōu)秀的網(wǎng)站同樣也沒(méi)有人愿意找這樣公司做網(wǎng)站。這里推薦專(zhuān)業(yè)建站網(wǎng)站創(chuàng)新互聯(lián)。

視覺(jué)確認(rèn)交互

很多網(wǎng)站中常常被忽視的細(xì)節(jié)就是——按鈕狀態(tài)。即使在快速網(wǎng)絡(luò)時(shí)代,也會(huì)有按一個(gè)按鈕后有可能會(huì)延遲,像一個(gè)新頁(yè)面加載圖像上傳,或某種類(lèi)型的事件。然而很少有網(wǎng)站把加載期間后臺(tái)發(fā)生的事情用視覺(jué)傳到給用戶(hù)。如果有,這將是一件新奇的事情。留給用戶(hù)掛在那里,沒(méi)有確認(rèn)他們的點(diǎn)擊改按鈕所形成的響應(yīng)。每當(dāng)這時(shí)用戶(hù)可能在考慮你的UI。

解決方案是考慮添加當(dāng)用戶(hù)點(diǎn)擊的按鈕樣式,然后另一個(gè)風(fēng)格或動(dòng)畫(huà)當(dāng)提交。每一個(gè)按鈕都有“下來(lái)”狀態(tài),和動(dòng)畫(huà)來(lái)確認(rèn)你的點(diǎn)擊。更好的是,如果操作可能需要一段時(shí)間,考慮實(shí)際告訴用戶(hù)發(fā)生了什么。如果你不能通過(guò)設(shè)計(jì)充分解釋,可以用文本形式寫(xiě)出來(lái)。
使用微妙的動(dòng)畫(huà)

我可以幾天談?wù)搫?dòng)畫(huà)的重要性,以及它在幫助用戶(hù)理解一個(gè)接口——幸運(yùn)的是已經(jīng)有很多更好的資源。相反,我只涉及細(xì)節(jié)的重要性,幾乎看不見(jiàn)的動(dòng)畫(huà)。采取以下作為一個(gè)例子,拖動(dòng)圖像文件夾不需要反饋。所以一個(gè)小動(dòng)畫(huà),推斷成功就能減輕不確定性。
Click-Recognition
動(dòng)畫(huà)反饋

注意“X照片”號(hào)碼需要稍微長(zhǎng)的時(shí)間更新?這是實(shí)際的服務(wù)器響應(yīng)時(shí)間。在這種情況下,“筆名”動(dòng)畫(huà)幫助用戶(hù)繼續(xù)他們的業(yè)務(wù)。動(dòng)畫(huà)還可以幫助顯示上下文和視圖之間的過(guò)渡。而不是突然之間移動(dòng),冒著失去你的用戶(hù)的危險(xiǎn),動(dòng)畫(huà)可以幫助顯示的東西是從哪里來(lái)的。
Button-Colour-Change
優(yōu)化背景

任何產(chǎn)品包含數(shù)據(jù)、圖像或報(bào)告沒(méi)有屏幕會(huì)看起來(lái)是一樣的。然而在網(wǎng)站設(shè)計(jì)中,我們很好的優(yōu)化背景,把數(shù)字圖像完全為背景設(shè)計(jì)和優(yōu)化。很多網(wǎng)站中利于漂亮的圖片作為背景,是一種明智的選擇,有時(shí)候會(huì)出現(xiàn)視頻背景這也是非常不錯(cuò)的選擇。

基調(diào)錯(cuò)誤消息不是有益的。

為了解除和人類(lèi),我寫(xiě)了上面的消息顯示在罕見(jiàn)的場(chǎng)合,由于服務(wù)器錯(cuò)誤上傳失敗。當(dāng)用戶(hù)耐心等待他們的上傳過(guò)程中,應(yīng)用了一種毫無(wú)用處的和毫無(wú)悔意的反應(yīng)。如果我是一個(gè)用戶(hù)去客戶(hù)端演示,這將是不太理想。在此之前,我接到一個(gè)客戶(hù)的理由憤怒的電子郵件。當(dāng)然也有一些場(chǎng)合,可以有樂(lè)趣,和一點(diǎn)人性化的可以讓原本無(wú)聊的用戶(hù)體驗(yàn)增加價(jià)值。

細(xì)節(jié)是一個(gè)產(chǎn)品最后的1%。他們很難定義范圍,他們絕對(duì)沒(méi)有替代深入研究偉大的設(shè)計(jì)和巧妙的工程。細(xì)節(jié)將幫助你的產(chǎn)品感覺(jué)自然、有趣、直觀,甚至讓用戶(hù)感覺(jué)聰明。這是小事情,這是讓人容易忘記的1%,但它是讓人們愛(ài)上你的產(chǎn)品的關(guān)鍵。

當(dāng)前標(biāo)題:把控這些細(xì)節(jié),你將會(huì)做出一個(gè)漂亮的網(wǎng)頁(yè)設(shè)計(jì)!
轉(zhuǎn)載注明:http://www.muchs.cn/news2/32952.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供軟件開(kāi)發(fā)、關(guān)鍵詞優(yōu)化、云服務(wù)器、網(wǎng)站策劃、品牌網(wǎng)站建設(shè)、自適應(yīng)網(wǎng)站

廣告

聲明:本網(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)

h5響應(yīng)式網(wǎng)站建設(shè)