一皇拣、五個(gè)層的簡介
戰(zhàn)略層
產(chǎn)品目標(biāo)和用戶需求嚣镜,即我們對(duì)自己產(chǎn)品的期望目標(biāo)(比如掙多少錢)和用戶的目標(biāo)(解決什么樣的痛點(diǎn))
范圍層
定義產(chǎn)品的功能和信息的內(nèi)容需求
結(jié)構(gòu)層
設(shè)計(jì)用戶如何到達(dá)某個(gè)頁面究飞,當(dāng)完成了這個(gè)頁面的任務(wù)以后嗡综,用戶又要去什么地方约炎。結(jié)構(gòu)層關(guān)注的內(nèi)容:產(chǎn)品的交互設(shè)計(jì)和信息架構(gòu)設(shè)計(jì)檬姥。
框架層
網(wǎng)頁中的圖片碎节,文字捧搞,按鈕,表格不是胡亂擺放在一起的狮荔,而是有一個(gè)組織結(jié)構(gòu)胎撇,有一個(gè)布局設(shè)計(jì),能達(dá)到這些元素之間的最大效果殖氏。例:在我需要看數(shù)據(jù)的時(shí)候有一個(gè)表格晚树,而不是文字或者其他的按鈕⊙挪桑框架層關(guān)注的內(nèi)容:信息設(shè)計(jì)爵憎、界面設(shè)計(jì)和導(dǎo)航設(shè)計(jì)。
表現(xiàn)層
表現(xiàn)層就用戶直接看到的東西婚瓜,用戶看得見摸得到(用鼠標(biāo))的東西宝鼓,像網(wǎng)頁上的圖片,文字等等巴刻。表現(xiàn)層需要關(guān)注的內(nèi)容:視覺設(shè)計(jì)愚铡。
二、層與層之間的關(guān)系
每個(gè)層面中我們可用的選擇胡陪,都受到下層面中所確定的議題的約束
在設(shè)計(jì)產(chǎn)品時(shí)需要做好計(jì)劃沥寥。我們常常可能會(huì)遇到需求的變更或者根據(jù)競爭對(duì)手或行業(yè)標(biāo)準(zhǔn)去做一些產(chǎn)品上的調(diào)整柠座。這樣就要求我們對(duì)產(chǎn)品的設(shè)計(jì)要足夠靈活邑雅。即范圍層進(jìn)行一些調(diào)整,不會(huì)導(dǎo)致結(jié)構(gòu)層完全無法承受愚隧。
三蒂阱、層詳解
1.戰(zhàn)略層
①產(chǎn)品目標(biāo)
商業(yè)目標(biāo)
不能太寬泛“賺錢、省錢”狂塘。不能太具體“為用戶提供一個(gè)實(shí)時(shí)的文本通訊工具”录煤。太具體和太寬泛之間平衡——確切了解產(chǎn)品的影響力。定義“成功的條件”而非“通向成功的路徑”
品牌識(shí)別
品牌形象和品牌管理荞胡。
成功的標(biāo)準(zhǔn)
一些可追蹤的指標(biāo)妈踊,在產(chǎn)品上線后用它來顯示是否滿足了我們自己的目標(biāo)和用戶的需求。如:PV泪漂、UV廊营、轉(zhuǎn)化率歪泳、付費(fèi)率、市場占有率等等
不是所有的成功的標(biāo)準(zhǔn)必須直接由網(wǎng)站內(nèi)部獲得露筒,也可以衡量對(duì)網(wǎng)站的間接影響呐伞。
用戶體驗(yàn)影響二次訪問率,可測量回訪數(shù)據(jù)慎式,但也要考慮是否受到特殊影響(如對(duì)手做活動(dòng)用戶都去對(duì)手那里了伶氢,或者自身做了很多補(bǔ)貼,用戶僅僅是因?yàn)檠a(bǔ)貼而來‘就像打車軟件補(bǔ)貼瘪吏,我就是一個(gè)坐公交需求的癣防,打車需求極低,補(bǔ)貼了讓我打車了掌眠,其實(shí)對(duì)企業(yè)沒太多的好處’)SO,要退一步蕾盯,看看內(nèi)外都發(fā)生了什么。
②用戶需求
用戶細(xì)分(定義誰才是我們的用戶)
將全部的用戶劃分成較小的蓝丙、有共同需求的小組级遭,以此來幫助我們更好地了解用戶的需求
可用性和用戶研究
創(chuàng)建人物角色(用戶畫像) ?可參見 絕密原型檔案
將用戶調(diào)查及用戶細(xì)分過程中得到的分散資料重新關(guān)聯(lián)起來,人物角色可以幫助你確保在整個(gè)設(shè)計(jì)過程期間把用戶始終放在心理
用戶畫像上的信息很大程度是編造的迅腔,我們希望人物角色與我們從用研中了解的雷榮保持一致装畅,但是為了使人物角色更加栩栩如生靠娱,他們的一些具體細(xì)節(jié)可以是虛構(gòu)的
2.范圍層
①定義需求
有時(shí)候人們說出來的沧烈、所期望的特性其實(shí)并不是他們想要的。
那些很少去想象產(chǎn)品新方向的人像云,恰恰是參與創(chuàng)建和設(shè)計(jì)產(chǎn)品最深入的人锌雀。(可匯集各個(gè)部門的人頭腦風(fēng)暴)
不管你設(shè)計(jì)的產(chǎn)品在什么樣的設(shè)備上使用,我們的需求序列必須要考慮到硬件需求迅诬,如有攝像頭嗎腋逆?有GPS嗎?等等侈贷。
可以把用戶畫像放到場景中惩歉,(一個(gè)場景是一個(gè)簡短的故事,簡單描述了一個(gè)人物角色會(huì)如何完成這些用戶需求)即“用例”
也可以從競品分析中獲得解決需求的辦法俏蛮,不是直接的競品也能提供潛在需求撑蚌。
②功能規(guī)格說明
功能規(guī)格說明不需要包含產(chǎn)品的每一個(gè)細(xì)節(jié)——只需要包含在設(shè)計(jì)或開發(fā)中出現(xiàn)有可能混淆的功能定義。
撰寫時(shí)的部分規(guī)則
樂觀搏屑。描述這個(gè)系統(tǒng)將要做什么事情去“防止”不好得情況發(fā)生争涌,而不是描述這個(gè)系統(tǒng)“不應(yīng)該”做什么不好的事
具體。盡可能詳細(xì)地解釋清楚狀況辣恋,避免如“最受歡迎的視頻要重點(diǎn)標(biāo)注”這樣模糊的定義
避免主觀的語氣亮垫。避免歧義保持明確模软,如這個(gè)“這個(gè)網(wǎng)站應(yīng)該是時(shí)尚的”,每個(gè)人的時(shí)尚定義不同饮潦,功能規(guī)格必須可驗(yàn)證——它必須能證明“這個(gè)需求沒有被滿足”燃异。應(yīng)該表明說出客觀界定的標(biāo)準(zhǔn)“網(wǎng)站應(yīng)符合企業(yè)的品牌指南文檔”。也可以量化的定義一些功能继蜡,如滿足1W人同時(shí)在線特铝,如果產(chǎn)品只支持1k,那這個(gè)需求就沒有被滿足
③內(nèi)容需求
內(nèi)容需求應(yīng)該提供每一個(gè)特性規(guī)模的大致預(yù)估:文本的字?jǐn)?shù)壹瘟、圖片的像素大小鲫剿、下載的文件字節(jié)等
更新頻率應(yīng)來自于你產(chǎn)品的戰(zhàn)略目標(biāo):從你的網(wǎng)站目標(biāo)來看,你希望用戶多長時(shí)間來訪一次稻轨?從你的用戶需求來看灵莲,他們希望多長時(shí)間更新一次信息?總之殴俱,在用戶期望值和有效資源之間的一個(gè)合理的中間值政冻。
如果你的網(wǎng)站是為各種擁有相異需求的用戶服務(wù)的,搞清楚那些用戶想要哪種內(nèi)容线欲,幫助你決定用什么方式來呈現(xiàn)這些內(nèi)容明场。
④確定需求優(yōu)先級(jí)
有時(shí)一個(gè)需求可以滿足多個(gè)戰(zhàn)略目標(biāo),一個(gè)戰(zhàn)略目標(biāo)也常常關(guān)系到多個(gè)不同的需求李丰。
評(píng)估需求是否能滿足我們的戰(zhàn)略目標(biāo)(產(chǎn)品目標(biāo)和用戶需求苦锨,還有實(shí)現(xiàn)這些需求的可行性)
影響可行性的有三個(gè)方面:①技術(shù)②資源③時(shí)間。時(shí)間有限趴泌,可以放到下個(gè)版本舟舒。
戰(zhàn)略目標(biāo)高于一切。分清需求的特性和戰(zhàn)略目標(biāo)嗜憔。將特性排除在戰(zhàn)略目標(biāo)之外秃励。
3、結(jié)構(gòu)層
①交互設(shè)計(jì)
概念模型(用戶心理模型)
人們在日常生活中會(huì)根據(jù)自己的經(jīng)驗(yàn)和習(xí)慣形成很多對(duì)事物的起因吉捶、機(jī)制和相互關(guān)系等似乎是理所當(dāng)然的看法夺鲜,這就是用戶的心理模型,或者叫概念模型呐舔。如電商中的購物車映射現(xiàn)實(shí)中的購物車币励。
打破一個(gè)概念模型也沒錯(cuò),但是要有充分的理由滋早,且準(zhǔn)備好另一個(gè)符合用戶需求且在情理之中的概念模型以備使用榄审。
概念模型是用于在交互設(shè)計(jì)的開發(fā)過程中保持使用方式的一致性。
不要將比喻從現(xiàn)實(shí)中一字不落地搬過來杆麸。
錯(cuò)誤處理
預(yù)防:防止問題的發(fā)生搁进,比如說警告等
改正:如搜狗的輸入法浪感,拼寫錯(cuò)誤會(huì)根據(jù)用戶輸入特性來判定用戶可能想要拼寫的字,然后修正(它用的是動(dòng)態(tài)性的數(shù)據(jù)處理)饼问。有時(shí)不恰當(dāng)?shù)母恼龝?huì)引起用戶反感影兽。
恢復(fù):比如撤銷。
②信息架構(gòu)
合理的信息架構(gòu)
需要使用靈活的信息架構(gòu)莱革。一個(gè)有效結(jié)構(gòu)的特點(diǎn)就是具備“容納成長和適應(yīng)變動(dòng)”的能力峻堰。當(dāng)有新的需求時(shí),不應(yīng)該導(dǎo)致重新考慮網(wǎng)站的整體結(jié)構(gòu)盅视。而是在現(xiàn)有的結(jié)構(gòu)中做一些調(diào)整就可以滿足需求捐名。
結(jié)構(gòu)方法
信息架構(gòu)的基本單位是節(jié)點(diǎn)(node)。節(jié)點(diǎn)可以對(duì)應(yīng)產(chǎn)品中的任意的信息片段或者組合闹击,例節(jié)點(diǎn)可以是商品的價(jià)格屬性镶蹋,也可以是呈現(xiàn)商品的頁面。然后節(jié)點(diǎn)通過不同的組織方式構(gòu)成不同的信息架構(gòu)赏半。以下為幾種節(jié)點(diǎn)構(gòu)成的信息架構(gòu)贺归。
層級(jí)結(jié)構(gòu):也成為樹狀結(jié)構(gòu),或中心輻射結(jié)構(gòu)断箫。節(jié)點(diǎn)和節(jié)點(diǎn)之間存在父級(jí)/子級(jí)的關(guān)系拂酣。
矩陣結(jié)構(gòu):允許用戶在節(jié)點(diǎn)與節(jié)點(diǎn)之間沿著兩個(gè)或更多的維度移動(dòng)。
自然結(jié)構(gòu):不會(huì)遵循任何一致的模式仲义。節(jié)點(diǎn)是逐一被連接起來的婶熬。這種結(jié)構(gòu)沒有太強(qiáng)的“分類”的概念。現(xiàn)在很少能看到這種結(jié)構(gòu)光坝。
線性結(jié)構(gòu):線性結(jié)構(gòu)經(jīng)常被見到于Web產(chǎn)品注冊流程或者網(wǎng)店商品購買流程之中尸诽。
組織原則
組織原則就是我們決定哪些節(jié)點(diǎn)要編成一組,哪些節(jié)點(diǎn)要保持獨(dú)立的標(biāo)準(zhǔn)盯另。不同的組織原則將被應(yīng)用在不同的區(qū)域和網(wǎng)站不同的層面。
我們的網(wǎng)站會(huì)按照時(shí)間或者熱度或者下載量對(duì)游戲進(jìn)行組織洲赵。這就是我們的組織原則鸳惯。不同的產(chǎn)品會(huì)使用不同的組織原則。微博在個(gè)人主頁是使用用戶發(fā)表的信息進(jìn)行組織叠萍,而QQ在個(gè)人主頁是使用用戶關(guān)系進(jìn)行組織芝发。
戰(zhàn)略層告訴我們“用戶的需求是什么”,范圍層告訴我們“什么樣的信息將滿足用戶的需求”苛谷,然后我們在結(jié)構(gòu)層就可以使用這些原則進(jìn)行節(jié)點(diǎn)之間的組織辅鲸。
使用通俗易懂的語言
受控詞典:“使用用戶的語言”并且“保持一致性”,讓用戶感到自然的命名原則系統(tǒng)腹殿。(因?yàn)槟阏J(rèn)為簡單的詞匯在對(duì)于用戶可能不一定理解或偏差)
元數(shù)據(jù):“關(guān)于信息的信息”独悴,即以一種結(jié)構(gòu)化的方式來描述內(nèi)容的信息例书。
架構(gòu)圖
不一定要寫明網(wǎng)站的每一頁的每一個(gè)鏈接,最重要的是記錄概念關(guān)系:哪些類別需要放在一起刻炒,而哪些需要保持獨(dú)立决采?在交互中那些步奏如何配合?
4.框架層
框架層的定義
通過“界面設(shè)計(jì)”坟奥,用戶可以接觸到在結(jié)構(gòu)層的交互設(shè)計(jì)中確定的具體功能树瞭。
通過“導(dǎo)航設(shè)計(jì)”,用戶可以看到我們網(wǎng)站的信息結(jié)構(gòu)中自由穿行爱谁。
“信息設(shè)計(jì)”晒喷,傳達(dá)給用戶的信息要素的排布
習(xí)慣和比喻(用戶心理模型)
具體不延展了,可以看交互方面的知識(shí)
①界面設(shè)計(jì)
即選擇真確的界面元素访敌,以此幫助用戶完成任務(wù)厨埋,還要通過適當(dāng)?shù)姆绞阶屗鼈內(nèi)菀桌斫夂褪褂谩#莻€(gè)功能在哪個(gè)界面上完成捐顷,是結(jié)構(gòu)層交互設(shè)計(jì)中決定的荡陷。這些功能在界面上如何被用戶認(rèn)知到,則是界面設(shè)計(jì))
②導(dǎo)航設(shè)計(jì)
三個(gè)目標(biāo)
①它必須給用戶一種在網(wǎng)站間跳轉(zhuǎn)的方法迅涮。(不是每個(gè)頁面都和別的頁面全部鏈接起來废赞,導(dǎo)航元素要選擇那些能夠促進(jìn)用戶行為的,或者所說引導(dǎo)用戶完成任務(wù)的)
②導(dǎo)航設(shè)計(jì)必須傳達(dá)出這些元素和他們所包含內(nèi)容之間的關(guān)系叮姑。(這些鏈接之間什么關(guān)系唉地?是否其中一些更重要?有什么差異传透?等等)
③導(dǎo)航設(shè)計(jì)必須傳達(dá)出它的內(nèi)容和用戶當(dāng)前瀏覽頁面之間的關(guān)系(這些傳達(dá)出的信息幫助用戶去理解“哪個(gè)有效的選擇會(huì)最好地支持他們的任務(wù)或想達(dá)到的目標(biāo)”)
幾種導(dǎo)航
全局導(dǎo)航:提供了覆蓋整個(gè)網(wǎng)站的通路(并非網(wǎng)站的每一個(gè)頁面)
局部導(dǎo)航:提供給用過在這個(gè)架構(gòu)中到“附近地點(diǎn)”的通路耘沼。在一個(gè)嚴(yán)格的層次結(jié)構(gòu)中,局部導(dǎo)航可能只提供一個(gè)頁面的父級(jí)朱盐、兄弟級(jí)和子級(jí)通路群嗤。——電商面包屑導(dǎo)航
輔助導(dǎo)航:提供了全局導(dǎo)航或局部導(dǎo)航不能快速到達(dá)相關(guān)內(nèi)容的快捷途徑兵琳】衩兀——淘寶導(dǎo)航中的快捷入口“購物車”
上下文導(dǎo)航:嵌入頁面自身內(nèi)容的一種導(dǎo)航,這種類型的導(dǎo)航“比如一個(gè)在頁面文章中的超級(jí)鏈接”
友好導(dǎo)航:提供給用戶他們通常不需要但它們是作為一種比例的途徑來使用的躯肌≌叽海——比如聯(lián)系信息,法律聲明等等
遠(yuǎn)程導(dǎo)航:網(wǎng)站地圖是一種常見的遠(yuǎn)程導(dǎo)航清女,網(wǎng)站地圖通常不會(huì)顯示超過兩個(gè)層級(jí)的導(dǎo)航钱烟。索引表比如通訊錄
③信息設(shè)計(jì)
信息設(shè)計(jì)變成決定如何呈現(xiàn)這些信息,使人們?nèi)菀资褂煤屠斫狻?/p>
有時(shí)信息設(shè)計(jì)是視覺上的,比如對(duì)用戶來說餅狀圖展示數(shù)據(jù)更好還是柱狀圖拴袭?
有時(shí)信息設(shè)計(jì)涉及“分組”或“整理”散亂的信息读第。
總之。最關(guān)鍵的是用一種能“反映用戶的思路”和“支持他們的任務(wù)和目標(biāo)”的方式來分類和排列這些信息元素稻扬。
指示標(biāo)識(shí):將信息設(shè)計(jì)和導(dǎo)航設(shè)計(jì)結(jié)合到一起卦方,幫助用戶理解“他們在哪”以及“他們能去哪”的系統(tǒng)。
線框圖
其它書比較詳細(xì)泰佳,不展開
5.表現(xiàn)層
表現(xiàn)層定義
解決并彌補(bǔ)“產(chǎn)品框架層的邏輯排布”的感知呈現(xiàn)問題盼砍。如通過關(guān)注視覺設(shè)計(jì),我們決定將信息設(shè)計(jì)的安排在視覺上如何呈現(xiàn)逝她。
忠于眼睛
評(píng)估視覺設(shè)計(jì)的簡單方法之一浇坐,“你的視線首先落在什么地方,那個(gè)設(shè)計(jì)要素在第一時(shí)間洗浴了用戶注意黔宛?他們對(duì)于戰(zhàn)略目標(biāo)來講是很重要的嗎?”
對(duì)比和一致性
對(duì)比強(qiáng)調(diào)和突出部分元素近刘,從而引導(dǎo)用戶視線,但是過度的對(duì)比也會(huì)顯得混亂臀晃。
一致性觉渴,比如不同頁面可能運(yùn)用到相同的模塊,一致性可以保障用戶更容易理解趨同性徽惋,但也要考慮不同環(huán)境的應(yīng)用案淋,有時(shí)可能會(huì)部分調(diào)整。