暢談?dòng)脩趔w驗(yàn)

1、暢談?dòng)脩趔w驗(yàn),試著去了解用戶,網(wǎng)站風(fēng)格和品牌形象,“實(shí)用”與“美觀”的平衡點(diǎn),3,網(wǎng)站的視覺元素,網(wǎng)站的易用性,5,1,2,4,試著去了解用戶,在去了解用戶之前不妨先去思考幾個(gè)問題： 誰是目標(biāo)用戶？ 目標(biāo)用戶具有什么特點(diǎn)？ 網(wǎng)站運(yùn)營目標(biāo)是什么？ 如何讓你的設(shè)計(jì)真正為傳遞網(wǎng)站內(nèi)容和產(chǎn)品價(jià)值而服務(wù)？ 你的設(shè)計(jì)能否給目標(biāo)用戶帶來更好的體驗(yàn)？,試著去了解用戶,如何了解用戶,我們面對(duì)兩類用戶：一是企業(yè)客戶本身，一是企業(yè)客戶所 面對(duì)的客戶，即網(wǎng)站的訪問者。如何滿足這兩類用戶的需 求，則需要通過以下方法來達(dá)成： a.加強(qiáng)與企業(yè)客戶的溝通，了解客戶建立網(wǎng)站的商業(yè)目標(biāo)； b.站在網(wǎng)站訪問者的角度考慮問題，把注意

2、力集中在潛在 客戶需求和目標(biāo)上，而不是依靠企業(yè)管理者的憑空想象 來進(jìn)行設(shè)計(jì)。,試著去了解用戶,如何了解用戶, 用戶具有學(xué)習(xí)能力 產(chǎn)品要易于學(xué)習(xí)，這樣用戶才能快速掌握； 用戶具有適應(yīng)能力 用戶能適應(yīng)一個(gè)新產(chǎn)品，但也有不能適應(yīng)而離開的； 用戶有習(xí)慣依賴 不要試圖挑戰(zhàn)用戶的習(xí)慣，那樣會(huì)趕走他們， 要平滑過度用戶的使用習(xí)慣； 用戶可以被引導(dǎo) 為達(dá)到推廣、盈利等目的，需要有意引導(dǎo)用戶； 用戶的經(jīng)驗(yàn)不同 相關(guān)經(jīng)驗(yàn)豐富的用戶需要高級(jí)的產(chǎn)品， 相關(guān)經(jīng)驗(yàn)貧乏的用戶需要低級(jí)的產(chǎn)品,用戶本身的特性,深圳市艾派應(yīng)用系統(tǒng)有限公司 shenzhen ipi application system co.,ltd.,試著去了

3、解用戶,網(wǎng)站風(fēng)格和品牌形象,“實(shí)用”與“美觀”的平衡點(diǎn),3,網(wǎng)站的視覺元素,網(wǎng)站的易用性,5,1,2,4,網(wǎng)站風(fēng)格和品牌形象,網(wǎng)站的整體風(fēng)格是網(wǎng)站外觀設(shè)計(jì)的指導(dǎo)思想。視覺元素、 css、布局方式、瀏覽器兼容性等視覺表現(xiàn)形式都要服從 于網(wǎng)站的整體風(fēng)格。 確立網(wǎng)站整體風(fēng)格有助于品牌形象的塑造，而網(wǎng)站的品牌 理念對(duì)網(wǎng)站的整體風(fēng)格也有著重要的影響。,網(wǎng)站風(fēng)格和品牌形象,網(wǎng)站的品牌形象不僅是現(xiàn)有的品牌在網(wǎng)上的延伸，還能給用 戶帶來更多的符合期望的品牌體驗(yàn)?？傮w上，網(wǎng)站風(fēng)格設(shè)計(jì) 要契合以下幾方面： a.理解網(wǎng)站要傳達(dá)的品牌理念 b.網(wǎng)站vi主色調(diào)與企業(yè)vi識(shí)別一致 c.在頁面頭部的醒目位置放logo，并配

4、以品牌口號(hào)，貫通 全站每個(gè)頁面 d.同一級(jí)別的頁面在設(shè)計(jì)上保持一致性,試著去了解用戶,網(wǎng)站風(fēng)格和品牌形象,“實(shí)用”與“美觀”的平衡點(diǎn),3,網(wǎng)站的視覺元素,網(wǎng)站的易用性,5,1,2,4,“實(shí)用”與“美觀”的平衡點(diǎn),少點(diǎn)花俏，多些實(shí)用,用戶到網(wǎng)站是為了獲取希望了解的信息，設(shè)計(jì)繁雜的網(wǎng)頁對(duì) 于用戶快速獲取信息是一種阻礙，網(wǎng)站設(shè)計(jì)應(yīng)少點(diǎn)花俏，多 些實(shí)用，著重于整體風(fēng)格的形成和實(shí)用信息的傳遞。 可以通過以下方法來平衡網(wǎng)站頁面的美觀與實(shí)用性： a.一個(gè)屏幕區(qū)間，單一圖片占地不宜超過1/2的版面 b.減少花俏、巨大的背景圖片運(yùn)用 c.頁面上采用大量的flash和動(dòng)畫圖片的時(shí)候，應(yīng)考慮到頁 面的打開速度 d.

5、使用大圖片時(shí)，盡量在圖片中通過文字傳遞更多實(shí)用信息,“實(shí)用”與“美觀”的平衡點(diǎn),少點(diǎn)花俏，多些實(shí)用,外觀設(shè)計(jì)的藝術(shù)性,大部分用戶打開一個(gè)網(wǎng)站首先形成的印象是來自于網(wǎng)頁外觀 設(shè)計(jì)，因此外觀設(shè)計(jì)的美觀、藝術(shù)性也是網(wǎng)站易用性建設(shè)的 基礎(chǔ)。要兼顧“實(shí)用性”基礎(chǔ)上的美觀和藝術(shù)性，通常在于對(duì) 細(xì)節(jié)設(shè)計(jì)的用心。 讓頁面看起來富有藝術(shù)性的美觀效果，需要注重以下方面： a.主體色彩與輔助色彩搭配的協(xié)調(diào)性 b.網(wǎng)站選用的配圖個(gè)性鮮明，并與頁面背景協(xié)調(diào) c.根據(jù)網(wǎng)站內(nèi)容采用合理的分欄結(jié)構(gòu)來進(jìn)行疏密有致的頁面 布局 d.注重細(xì)節(jié)設(shè)計(jì)的完美,試著去了解用戶,網(wǎng)站風(fēng)格和品牌形象,“實(shí)用”與“美觀”的平衡點(diǎn),3,網(wǎng)站的視覺

6、元素,網(wǎng)站的易用性,5,1,2,4,網(wǎng)站的視覺元素,網(wǎng)站的視覺元素,文字易辯識(shí),字體是幫助用戶獲得與網(wǎng)站的信息交互的重要手段，因而 文字的易讀性和易辨認(rèn)性是設(shè)計(jì)網(wǎng)站頁面時(shí)的重點(diǎn)。不同 的字體會(huì)營造出不同的氛圍，同時(shí)不同的字體大小和顏色 也對(duì)網(wǎng)站的內(nèi)容起到強(qiáng)調(diào)或者提示的作用。 正確的文字和配色方案是好的視覺設(shè)計(jì)的基礎(chǔ)。網(wǎng)站上的 文字受屏幕分辨率和瀏覽器的限制，但是仍有通用的一些 準(zhǔn)則：文字必須清晰可讀，大小合適，文字的顏色和背景 色有較為強(qiáng)烈的對(duì)比度，文字周圍的設(shè)計(jì)元素不能對(duì)文字 造成干擾。 在進(jìn)行網(wǎng)站的頁面文字排版時(shí)要做到以下幾點(diǎn)： a.避免字體過于黯淡導(dǎo)致閱讀困難 b.字體色與背景色對(duì)比明顯

7、，亦不能反差太強(qiáng)刺眼,網(wǎng)站的視覺元素,文字易辯識(shí),c.字體顏色不要太雜 d.有鏈接的字體要有所提示 e.標(biāo)題和正文所用的文字大小有所區(qū)別 f.作為內(nèi)容的文字字體大小最好能做大一點(diǎn) g.英文和數(shù)字選用與中文字體和諧的的字體,網(wǎng)站的視覺元素,文字易辯識(shí),圖片更合理,頁面上圖片也是版式的重要組成，正確的運(yùn)用圖片，可以 幫助用戶對(duì)信息加深印象，引導(dǎo)用戶的行為，與網(wǎng)站整體 風(fēng)格協(xié)調(diào)的圖片，能幫助網(wǎng)站營造獨(dú)特的品牌氛圍，加深 瀏覽者的印象。 在網(wǎng)站引用圖片時(shí)應(yīng)注意以下幾點(diǎn)： a.出現(xiàn)的位置和尺寸合理，不對(duì)信息獲取產(chǎn)生干擾， 喧賓奪主 b.考慮瀏覽者的網(wǎng)速，圖片文件不宜過大 c.有節(jié)制的使用flash和動(dòng)畫

8、圖片 d.產(chǎn)品圖片的alt標(biāo)簽加上注釋名稱,網(wǎng)站的視覺元素,文字易辯識(shí),圖片更合理,表單更易用,用戶在填寫網(wǎng)站表單的時(shí)候，是顧客轉(zhuǎn)化的關(guān)鍵環(huán)節(jié)，重要 性不言而喻。表單涉及到較復(fù)雜的在線交互行為，與流程息 息相關(guān)，當(dāng)一個(gè)交互過程需要分成很多個(gè)步驟完成的時(shí)候， 更重視對(duì)用戶一步一步的引導(dǎo)，每一次點(diǎn)擊都合理有效，接 近并最終達(dá)成任務(wù)目標(biāo)。好的表單設(shè)計(jì)可以提升用戶體驗(yàn)。 就設(shè)計(jì)上而言，表單設(shè)計(jì)容易犯的幾個(gè)錯(cuò)誤包括以下幾點(diǎn)： 過于冗長的表單和繁多的填寫項(xiàng) 不知所以的單選框和復(fù)選框 填寫出錯(cuò)后才出現(xiàn)說明和幫助 提交按鈕不易發(fā)現(xiàn),網(wǎng)站的視覺元素,文字易辯識(shí),圖片更合理,表單更易用,網(wǎng)站可以通過以下幾點(diǎn)來提高

9、表單的易用性： a.控制輸入框的大小、恰當(dāng)對(duì)齊，使之符合內(nèi)容版式的需要 b.根據(jù)表單元素的相關(guān)性進(jìn)行合理分組和排序 c.有下拉選擇區(qū)域的下拉列表，將初始狀態(tài)默認(rèn)為全部區(qū)域 d.下拉列表過長時(shí)，可橫向排列 e.對(duì)填寫內(nèi)容提供必要的幫助提示 f.避免一頁表單必填項(xiàng)堆積過多，通過分頁或收縮方式實(shí)現(xiàn) 分步式表單形式 g.提交按鈕醒目，位置符合習(xí)慣,深圳市艾派應(yīng)用系統(tǒng)有限公司 shenzhen ipi application system co.,ltd.,暢談?dòng)脩趔w驗(yàn),網(wǎng)站的視覺元素,文字易辯識(shí),圖片更合理,表單更易用,按扭更易點(diǎn)擊,按鈕是網(wǎng)站界面中伴隨著用戶的點(diǎn)擊行為的特殊圖片，由于 按鈕點(diǎn)擊行為是

10、將用戶引向顧客轉(zhuǎn)化的重要步驟，因此按鈕 在設(shè)計(jì)上有較高的要求。 按鈕設(shè)計(jì)的基本要求是要達(dá)到“點(diǎn)擊暗示”效果，凹凸感、陰 影效果、水晶效果等均是這一原則的體現(xiàn)。同時(shí)，按鈕中的 可點(diǎn)擊范圍最好是整個(gè)按鈕，而不僅限于按鈕圖片上的文本 區(qū)。 如圖：三大c2c網(wǎng)站的購買按鈕設(shè)計(jì),網(wǎng)站的視覺元素,文字易辯識(shí),圖片更合理,表單更易用,按扭更易點(diǎn)擊,點(diǎn)評(píng)：圖形、文字、感嘆號(hào)、水晶效果、立體效果統(tǒng)統(tǒng)用 上，而相比之下，淘寶按鈕在整體效果上更勝一籌。 可以通過以下幾點(diǎn)來設(shè)計(jì)按鈕，讓它更易被點(diǎn)擊。 a.按鈕顏色與背景顏色有一定的對(duì)比度 b.按鈕有浮起感 c.按鈕文字提示明確，如果沒有文字，確信所使用的圖形按 鈕是約

11、定俗成、容易為用戶理解的圖片 d.對(duì)顧客轉(zhuǎn)化起重要作用的按鈕用色突出一點(diǎn)，尺寸大一點(diǎn) e.可點(diǎn)擊范圍夠大，包括整個(gè)按鈕,試著去了解用戶,網(wǎng)站風(fēng)格和品牌形象,“實(shí)用”與“美觀”的平衡點(diǎn),3,網(wǎng)站的視覺元素,網(wǎng)站的易用性,5,1,2,4,網(wǎng)站的易用性,網(wǎng)站的易用性是什么,網(wǎng)站易用性是網(wǎng)站的一種品質(zhì)屬性，評(píng)估網(wǎng)站訪問者在網(wǎng) 站內(nèi)能否方便地實(shí)現(xiàn)訪問任務(wù)，包括獲取網(wǎng)站信息、使用 網(wǎng)站操作界面與任務(wù)流程。網(wǎng)站易用性的思想核心是以用 戶為中心的網(wǎng)絡(luò)營銷思想的體現(xiàn)，具體體現(xiàn)于網(wǎng)站導(dǎo)航、 網(wǎng)站內(nèi)容、網(wǎng)站功能、網(wǎng)站服務(wù)、任務(wù)流程、外觀設(shè)計(jì)、 可信性等網(wǎng)站建設(shè)的方方面面。,網(wǎng)站的易用性,網(wǎng)站的易用性是什么,網(wǎng)站的易

12、用性的重要意義,對(duì)于網(wǎng)站來說，網(wǎng)站易用性是網(wǎng)站生存和運(yùn)營成功的必要條 件。如果網(wǎng)站很難用，用戶就會(huì)離開；如果網(wǎng)站不能清楚地 呈現(xiàn)公司的主要業(yè)務(wù)，用戶也會(huì)離開；如果用戶在網(wǎng)站中迷 路了，他們也可能會(huì)離開；如果網(wǎng)站的信息很不方便閱讀或 者不能解答用戶關(guān)心的問題，用戶也會(huì)離開總之，在這 個(gè)信息膨脹的年代，用戶不會(huì)花很多時(shí)間耐心研究這個(gè)網(wǎng)站 怎么用，因?yàn)檫€有很多其它類似的網(wǎng)站，離開是解決困難的 首選。由此可見，網(wǎng)站易用性是網(wǎng)站將潛在客戶轉(zhuǎn)化為真正 客戶的重要因素，做好易用性建設(shè)，就能大大提高用戶的粘 性并為顧客轉(zhuǎn)化作好鋪墊。,網(wǎng)站的易用性,網(wǎng)站的易用性是什么,網(wǎng)站的易用性的重要意義,網(wǎng)站的易用性的品質(zhì)

13、要素,人們通常認(rèn)為網(wǎng)站易用性有五大品質(zhì)要素： a.易懂/易學(xué)：用戶首次進(jìn)入網(wǎng)站并完成該網(wǎng)站基本任務(wù)的 容易程度； b.高效：當(dāng)用戶熟練使用網(wǎng)站后，完成任務(wù)需要的時(shí)間長 短？ c.易記：當(dāng)用戶中斷使用網(wǎng)站一段時(shí)間后，再次回到網(wǎng)站 時(shí)，能否再次熟練上手？ d.出錯(cuò)率：用戶在使用網(wǎng)站時(shí)出現(xiàn)多少錯(cuò)誤？這些錯(cuò)誤有 多嚴(yán)重？出錯(cuò)后能否輕易修正？ e.滿意度：用戶對(duì)于網(wǎng)站使用的整體滿意程度？,網(wǎng)站的易用性,網(wǎng)站的易用性是什么,網(wǎng)站的易用性的重要意義,網(wǎng)站的易用性的品質(zhì)要素,當(dāng)然，還有很多其它重要的品質(zhì)屬性，其中最基本的前提是 網(wǎng)站對(duì)用戶“有用”，即“實(shí)用性”。即網(wǎng)站能否為用戶提供有 價(jià)值的信息、功能等，以滿

14、足用戶的訪問需求，在這個(gè)基礎(chǔ) 上，才能談網(wǎng)站易用性，否則一個(gè)再好用的網(wǎng)站功能，如果 對(duì)于用戶來說沒多大價(jià)值，那也沒有意義。,附錄一：用戶對(duì)網(wǎng)站的體驗(yàn)步驟,用戶對(duì)網(wǎng)站的體驗(yàn)步驟,視覺體驗(yàn),是用戶對(duì)界面設(shè)計(jì)的第一感官體驗(yàn)。它是完全是用戶幾乎沒 有經(jīng)過思考前的一種視覺感受，視覺體驗(yàn)直接影響到用戶是 否停留在此頁面進(jìn)行一下步的表達(dá)理解。 注意：任何一種讓用戶感官視覺不適的界面都可能導(dǎo)致用戶 產(chǎn)生怨言和流失。,用戶對(duì)網(wǎng)站的體驗(yàn)步驟,視覺體驗(yàn),表達(dá)體驗(yàn),是用戶在視覺體驗(yàn)的基礎(chǔ)上對(duì)界面內(nèi)容的理解，界面內(nèi)容可 能是文字，也可能是圖案，這些內(nèi)容是引導(dǎo)用戶進(jìn)行操作的 “提示或說明”；表達(dá)體驗(yàn)直接影響到用戶下一步的

15、操作行為 是否合理。 注意：任何一種讓用戶產(chǎn)生誤解的表達(dá)都可能導(dǎo)致用戶產(chǎn)生 怨言和流失。,用戶對(duì)網(wǎng)站的體驗(yàn)步驟,視覺體驗(yàn),表達(dá)體驗(yàn),操作體驗(yàn),是用戶通過對(duì)表達(dá)內(nèi)容的理解后做出行為動(dòng)作的體驗(yàn)過程。 功能邏輯是操作體驗(yàn)的直接影響因素，盡可能考慮到用戶可 能出現(xiàn)的任何一種行為方式，才能保證用戶進(jìn)行正確的愉悅 的操作過程；操作體驗(yàn)直接影響到用戶下一步的內(nèi)容體驗(yàn)。 注意：任何一種繁瑣和復(fù)雜的操作邏輯都可能導(dǎo)致用戶產(chǎn)生 怨言和流失。,用戶對(duì)網(wǎng)站的體驗(yàn)步驟,視覺體驗(yàn),表達(dá)體驗(yàn),操作體驗(yàn),結(jié)果體驗(yàn),是用戶通過操作行為獲得的行為結(jié)果的一種體驗(yàn)過程。用戶 的任何一種操作可能出現(xiàn)的任何一個(gè)行為結(jié)果都直接影響到 用戶結(jié)果體驗(yàn)。 注意：任何一種不能滿足用戶需求的操作結(jié)果都可能導(dǎo)致用 戶產(chǎn)生怨言和流失。,附錄二：用戶體驗(yàn)的要素,迄今為止，對(duì)易用性建設(shè)、用戶體驗(yàn)的研究與實(shí)踐仍然更多地局限于ui設(shè)計(jì)師、開發(fā)者 和產(chǎn)品經(jīng)理群體中，似乎用戶體驗(yàn)是一個(gè)ui問題，或者技術(shù)問題，而沒有上升到運(yùn)營的 高度；較普遍的問題也隨之而來：沒有分析用戶特征和用戶需求，以企業(yè)領(lǐng)導(dǎo)的喜好或 設(shè)計(jì)師個(gè)人喜好來作為設(shè)計(jì)的依據(jù)；或者過分強(qiáng)調(diào)外觀設(shè)計(jì)而忽