最近有設(shè)計小伙伴咨詢,怎么樣的交互說明才是最好的,是大家都喜歡的。最近他寫的交互說明文檔提交給需求評審會的成員審核時,大家都建議他再寫的合理些,這讓他傷透了腦筋。 第一、崗位對象不同:沒有一份十全十美的交互說明可以打動所有人,讓所有人為之驚嘆。畢竟,由于閱讀交互說明文檔的對象不同,他們會對交互說明文檔有不同的要求,這是崗位屬性導(dǎo)致的結(jié)果。例如前端開發(fā)希望詳細到字段、初始默認值、數(shù)據(jù)調(diào)取接口等,而領(lǐng)導(dǎo)只要看保證業(yè)務(wù)方向沒有錯誤的大交互鏈路。 第二、同崗位不同認知:同一崗位不同成員的認知、從業(yè)經(jīng)歷、個人喜好、性格脾性等也會導(dǎo)致不可能有完美適配所有人的交互說明文檔。例如在一個行業(yè)已經(jīng)深耕多年的前端工程師,即使你的交互說明文檔寫的沒有那么詳細,他也可以從你現(xiàn)有的文字中推敲出其他方面,同時還能幫你補充完善;而針對剛?cè)胄械那岸斯こ處?,你要是寫的不詳細,他就會抓狂,項目時間緊急的時候還會自己腦補交互細節(jié)。之后你走查時候也會抓狂,但是沒用呀,誰讓自己沒有寫明白交互細節(jié),遺漏了呢。 第三、使用場合不同:不同場合需要的交互說明文檔也不同。例如與對方面對面溝通,交互說明文檔可以少寫點;但是通過線上工具與對方溝通,就需要寫的盡可能詳細;如果是會議型的評審,那就要方方面面都做足功課了。簡單來說就像準備一份ppt:針對同一個主題的ppt,在外部演講和在公司內(nèi)部演講,同一份ppt會需要設(shè)計兩個版本,一個是內(nèi)部版,一個是外部版,原因在于使用場合不同。 第四、產(chǎn)品階段不同:交互說明文檔闡述的是一個產(chǎn)品的交互,而不是闡述其他的。如果產(chǎn)品所處階段為成熟期,那往往產(chǎn)品的交互文檔已經(jīng)沉淀了很多通用法則,可以被復(fù)用,那么現(xiàn)在的交互說明文檔少寫點,問題也不大;但產(chǎn)品處于探索期或成長期,通常來說可復(fù)用性的交互資產(chǎn)是不存在的,那交互說明文檔就需要準備的相對完善。
有些設(shè)計小伙伴就說了,既然不可能滿足所有人,那我就按照自己的想法隨意寫好了。這可不行哦,畢竟我們的主要工作有一部分是撰寫交互說明文檔,這就必須要有認真、嚴謹、專業(yè)的工作態(tài)度,把這部分工作做好。那我們來看看,編寫一份友好的交互說明文檔要注意哪些。
交互說明文檔是用來告訴參與產(chǎn)品研發(fā)的團隊成員頁面交互相關(guān)細節(jié)的一個說明文檔,包括頁面間的邏輯跳轉(zhuǎn)、頁面內(nèi)模塊的交互、頁面功能的狀態(tài)等。交互說明文檔寫的越詳細越有利于參與產(chǎn)品研發(fā)各方的正確執(zhí)行。
我匯總了一些日常工作中有待改進的交互說明文檔形式,看看都存在哪些問題。 幾乎所有剛初入職場的設(shè)計師,在編寫交互文檔時,會怕自己寫少了別人覺得自己不專業(yè),怕寫的不全沒辦法表達頁面細節(jié),導(dǎo)致交互文檔密密麻麻都是文字,這讓閱讀者幾乎無法閱讀,找不到視覺落腳點。
有幾年工作經(jīng)驗的設(shè)計師,由于很多通用交互法則已了然于心,他們在編寫交互說明文檔時就比較簡單,一些交互就沒有寫在文檔上,這導(dǎo)致開發(fā)在開發(fā)時,忽略了某些交互。
交互稿數(shù)據(jù)沒有邏輯,是很多設(shè)計師經(jīng)常會出現(xiàn)的問題,一部分原因可能在于產(chǎn)品經(jīng)理沒有理順產(chǎn)品邏輯和細節(jié)就提交設(shè)計師畫圖了,另一部分原因可能在于設(shè)計時間緊張,來不及對交互稿中所有的數(shù)據(jù)都做到邏輯合理。 曾經(jīng)遇到過的情況有,關(guān)聯(lián)數(shù)值關(guān)聯(lián)不上,表格中字段對應(yīng)的值對不上,表單填寫的數(shù)據(jù)和實際情況不符。 建議大家在時間允許或有條件反推產(chǎn)品經(jīng)理協(xié)助完善數(shù)據(jù)的情況下,盡量數(shù)據(jù)展現(xiàn)的真實與符合邏輯,如此有助于開發(fā)及相關(guān)閱讀者高效理解。
有幾次我注意到設(shè)計師提交上來的交互說明會標注“見圖X"這樣的文字。也就是一段說明讀完了,還得去頁面的某個角落尋找對應(yīng)的圖,這種體驗非常不好。 在交互設(shè)計原則中有一項為“足不出戶”?!白悴怀鰬簟钡囊馑际侵改茉诋斍绊撁娼鉀Q的事情,不要去其他頁面;能在就近完成的事情,不要距離過遠。頻繁的切換和跳轉(zhuǎn)會導(dǎo)致用戶心流被打斷,容易引起用戶思緒中斷、思考不劉暢,甚至可能對產(chǎn)品產(chǎn)生反感。 同理,我們交互說明文檔中的圖文也應(yīng)盡量相鄰,通過一眼文字一眼圖,讓用戶看的順暢、舒適,理解的快速。
東一句西一句是指交互說明文檔中本該成為一體去描述的文字,被分成了好幾個部分去闡述,這對看文檔的人來說簡直是災(zāi)難,他需要自己重新梳理交互思路,將交互規(guī)則串聯(lián)起來。
我們自己在編寫交互說明文檔時,盡量規(guī)避上述常見的問題。
對于什么是好的交互說明文檔,網(wǎng)上一搜一大把,這里我根據(jù)自己的經(jīng)驗,和大家分享下什么是好的交互說明文檔。 首先我們來明確下,什么是好,有了好的標準以后,再來談?wù)勅绾巫龅胶谩?nbsp;通常情況下,交互文檔會給產(chǎn)品經(jīng)理看,用來評審設(shè)計方案是否滿足需求;給視覺設(shè)計師看,用來指導(dǎo)視覺方案的呈現(xiàn);給前后端開發(fā)人員看,用來指導(dǎo)開發(fā)邏輯;給測試工程師看,用來協(xié)助測試編寫測試用例?;诖?,好的交互說明文檔關(guān)系著設(shè)計方案是否可被最大程度的實現(xiàn)。并且如果交互文檔文字冗長、邏輯不清晰,不僅看的人吃力,還會需要增加額外的時間來和開發(fā)工程師溝通。好的交互文檔,我認為至少需要具備以下7點: 為了讓大家一邊學(xué)習(xí)一遍實踐,我使用“表單校驗”的交互案例給大家進行講解。 能協(xié)助項目成員通過文檔更順利地完成工作任務(wù),能幫助用戶解決問題,能達成產(chǎn)品目標,則是好的交互說明文檔。文檔對各方有價值,是一份好的交互說明文檔的起點。那么,如何編寫才能達到上述結(jié)果呢? 一方面是將此次文檔的價值寫清楚,包括寫明此次交互設(shè)計的背景與需求來源、需求清單,標明交互設(shè)計的理論依據(jù),可以給用戶帶來的價值等。另一方面要和成員宣導(dǎo)這些內(nèi)容,讓成員感受自己要做的工作是有價值的。
拋開文檔閱讀對象等相關(guān)影響因素,通常來說交互需要考慮到以下幾方面: 整體交互流程是指產(chǎn)品頁面與頁面之間的交互邏輯。 頁面模塊交互說明是指模塊自身的交互說明,或同頁面內(nèi)獨立模塊之間的交互邏輯,或不同頁面模塊之間的交互邏輯。例如點擊導(dǎo)航樹節(jié)點會聯(lián)動右側(cè)表格內(nèi)容刷新;點擊banner跳轉(zhuǎn)到對應(yīng)的商品詳情頁,且定位到頁面1/2位置。 頁面功能交互說明是指單個功能的各種情況闡述。例如搜索框內(nèi)輸入文字,通過enter觸發(fā)對應(yīng)頁面跳轉(zhuǎn)。 雖然是交互說明,我們也盡量做到模擬真實數(shù)據(jù),否則很容易讓閱讀者產(chǎn)生錯誤判斷。并不是所有人都會一字一句的去閱讀文檔,因此,盡量真實的數(shù)據(jù),有利于閱讀者更有效的了解。 很多情況下,會因為某些原因出現(xiàn)極端交互情況,此時也需要補充完整。 建議交互團隊為產(chǎn)品建立通用型交互說明庫,遇到類似的情況,直接調(diào)取即可。 實際上我們在編寫交互說明的時候,不太會分得那么細,很多說明是混合在一起表達的。 通俗易懂是指要讓文字、語言、圖片等做到讓受眾易于理解和感知,從而在信息傳遞過程中盡量少的出現(xiàn)損耗,這一點同時也與人類的理解能力有關(guān)。 “理解能力是指一個人對事物乃至對知識的理解的一種記憶能力。 低級水平的理解是指:知覺水平的理解,就是能辨認和識別對象,并且能對對象命名,知道它“是什么”; 中級水平的理解是:在知覺水平理解的基礎(chǔ)上,對事物的本質(zhì)與內(nèi)在聯(lián)系的揭露,主要表現(xiàn)為能夠理解概念、原理和法則的內(nèi)涵,知道它是“怎么樣”; 高級水平的理解屬于間接理解,是指:在概念理解的基礎(chǔ)上,進一步達到系統(tǒng)化和具體化,重新建立或者調(diào)整認知結(jié)構(gòu),達到知識的融會貫通,并使知識得到廣泛的遷移,知道它是“為什么”?!?nbsp;當我們了解了人類的理解能力水平是參差不齊后,我們就要盡量在工作中將專業(yè)知識化繁為簡(也可以針對人群化繁為簡),增強溝通效果,最終達到完成團隊目標的結(jié)果。 交互文檔盡量做到講人話,不要講一堆專業(yè)術(shù)語。記得之前有個交互設(shè)計師在會議上闡述自己的交互方案時,提到用了“提供邀請”原則。由于與會成員是開發(fā)工程師和產(chǎn)品經(jīng)理,他們問到什么是“提供邀請”原則,并且在這個問題上大家討論了很久。
交互說明文檔除了要表達通俗易懂外,還需要結(jié)構(gòu)清晰。 結(jié)構(gòu)清晰的內(nèi)容不僅使閱讀者一目了然、理解成本低,還可以讓閱讀者了解撰寫者的意圖。要做到文檔結(jié)構(gòu)清晰,除了需要遵守一些規(guī)則外,也不能脫離當前文檔的實際情況。 “表單校驗”上場(把文字進行分段處理,并取出關(guān)鍵詞): 圖片和文字相得益彰可以加深閱讀者對文字的理解,同時避免閱讀者去想象文字對應(yīng)的結(jié)果。由于人們對同一段文字的理解不完全相同,因此建議設(shè)計師盡量安排交互說明對應(yīng)圖解。 僅此一份是說交付給團隊交互說明文檔的時候不要多份。之前我們的前端小伙伴拿到了兩份交互文檔,一份是純原型交互文檔,一份是視覺稿交互文檔,兩者描述的信息大同小異。此時,建議交互文檔的信息做合并,只提交一份完整的給前端小伙伴,讓前端小伙伴能專心致志理解一份。
建議交互說明文檔留存修訂記錄,一方面可以了解交互文檔的變更歷史,另一方面有利于回溯和查找信息。修訂記錄一般包括修訂人、修訂時間和修訂內(nèi)容。
由于項目進度、業(yè)務(wù)復(fù)雜程度等不同,我們不可能每次都能寫出一份最好的交互說明文檔,但我們可以想辦法寫出一份相對可讀性高、可理解性高的友好的交互說明文檔。我們常說自己是做用戶體驗的,那交互說明文檔就是體現(xiàn)我們交互能力一個方面。 除了完成交互說明文檔,想要讓開發(fā)小伙伴真正理解交互說明,還需親自和開發(fā)溝通,千萬不要認為我寫的很詳細了,他怎么還是實現(xiàn)的有偏差。事實上,就如開篇所說:同一崗位不同人的認知理解、從業(yè)經(jīng)歷、個人喜好、性格脾性等也會導(dǎo)致理解不同。特別是對于一些我們非常創(chuàng)新的、特殊的交互點,需要重點和開發(fā)說明。 并且,交互說明文檔基于業(yè)務(wù)的發(fā)展,也會不斷的迭代,我們要抱著多聽、多想、多思考、多接受的態(tài)度去不斷優(yōu)化我們的文檔,盡力寫出一份友好的交互說明文檔。
藍藍設(shè)計建立了UI設(shè)計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計,如果有興趣的話,可以進入一起成長學(xué)習(xí),請掃碼ben_lanlan,報下信息,會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系。
文章來源:站酷 作者:知果日記
分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍藍設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍藍設(shè)計( bouu.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)