如何輸出一份會表達的交互文檔

在項目設(shè)計中,交互設(shè)計師與上游的產(chǎn)品經(jīng)理睡陪,下游的視覺設(shè)計師,開發(fā)工程師和測試等崗位的工作密不可分匿情。不論是承上啟下的工作溝通兰迫, 還是方案評審的設(shè)計講解,專業(yè)的交互設(shè)計師應(yīng)該具備優(yōu)秀的表達能力炬称,不僅是語言方面的表達汁果,交互文檔的表達也尤其重要。交互文檔是對接上下游崗位转砖,利于協(xié)同團隊工作的重要輸出件须鼎。(本文會以Axure軟件輸出形式舉例說明)

一、交互文檔的輸出原則

交互文檔本身就相當于一個產(chǎn)品府蔗,我們要考慮到上下游不同崗位(目標用戶)對交互文檔的不同需求(用戶目標)晋控,交互文檔輸出原則(設(shè)計目標),在文檔的結(jié)構(gòu)姓赤,內(nèi)容和形式上可總結(jié)為三大原則:

1. 邏輯嚴謹赡译,文本簡明

邏輯混亂的文字表達通常會顯得比較啰嗦,甚至會讓人不知道你要表達的是什么不铆,降低了閱讀效率蝌焚,也增大了溝通成本。交互文檔的整體內(nèi)容結(jié)構(gòu)與頁面內(nèi)容結(jié)構(gòu)(文字關(guān)系)的書寫要思路清晰誓斥,邏輯嚴謹只洒,簡明扼要,并盡可能的做到“不重復(fù)劳坑,不遺漏”將交互設(shè)計的思路和方案更好的可視化毕谴。當然,邏輯和文本的表達都是可以訓練的,日常生活中我們也應(yīng)該注意這方面的培養(yǎng)與提升涝开。

2. 便于迭代循帐,利于協(xié)同

剛?cè)胄械臅r候我是一名UI設(shè)計師,我的第一份交互文檔是用PS做的舀武,在PS里輸出圖片再粘貼到Axure上拄养,首先是文檔管理起來很麻煩,其次是編輯起來不方便银舱,迭代修改都要找到對應(yīng)頁面的PS源文件修改后再轉(zhuǎn)移到Axure瘪匿,工作效率大大降低。交互稿在方便別人的同時纵朋,也應(yīng)該方便自己柿顶,而我卻忘記了自己也是這個產(chǎn)品的用戶。

文章開始說到交互文檔是對接上下游利于協(xié)同團隊工作的重要輸出件操软,所以文檔應(yīng)該保證利于其他崗位人員的查看或編輯的嘁锯。如在文檔格式方面,如果你是用Axure做設(shè)計聂薪,發(fā)給對方源文件外也要生成一份HTML文件家乘,這樣就算對方?jīng)]有Axure軟件,也可以順利打開藏澳。

3. 美即適用?

美國心理學家丹尼爾·麥克尼爾提出美即好效應(yīng):“對一個外表英俊漂亮的人仁锯,人們很容易誤認為他或她的其他方面也很不錯∠栌疲”

交互文檔不僅要邏輯“美”业崖,表現(xiàn)層面也要考慮視覺上的美,可以從圖文排版蓄愁、字體大小双炕、明暗層次等方面去考慮。輸出一份美的交互文檔從視覺上來說還能潛移默化的促進人們形成正面積極的態(tài)度撮抓,積極的態(tài)度會使你的交互評審更高效妇斤,也會提升程序大哥們寫代碼過程中的愉悅感。當然丹拯,追求美的產(chǎn)出也應(yīng)該是設(shè)計師的職業(yè)素養(yǎng)站超。

二、交互文檔的結(jié)構(gòu)與內(nèi)容

下面我簡單介紹下交互文檔的輸出思路乖酬,供大家學習參考死相。這里要注意的是,每位設(shè)計師要根據(jù)公司實際工作情況來定文檔的樣式咬像,有針對性地進行設(shè)計輸出媳纬。

文檔的整體結(jié)構(gòu)可以理解為圖書中的目錄部分双肤,下圖是我整理的一份文檔結(jié)構(gòu)模板,分為文檔封面钮惠、更新日志、設(shè)計思路七芭、需求表素挽、交互稿、廢紙簍六個部分狸驳。必要時预明,還可包含信息架構(gòu)、交互規(guī)范說明耙箍、頁面流程圖等部分撰糠。

1. 文檔封面

這個部分呈現(xiàn)產(chǎn)品簡介,包含版本信息辩昆、參與人員等基本信息阅酪。

2. 更新日志

在項目中設(shè)計方案的修改和優(yōu)化是不可避免的,方案有調(diào)整時更新日志就比較重要了汁针。更新日志可以清晰記錄新增或修改了哪個具體頁面术辐,新增或修改的內(nèi)容是什么,日期施无、版本……這樣項目成員就可以一目了然關(guān)注到重點修改更新信息辉词,提升了工作效率。

3. 設(shè)計思路

這一部分在交互評審會中尤為重要猾骡,因為參加評審的人很可能還不了解這個項目瑞躺,如果我們會上直接講方案,忽略設(shè)計思路的講解兴想,評審的過程就很可能局限在了布局排版上幢哨,評審也就沒有了意義。將設(shè)計過程更加結(jié)構(gòu)化呈現(xiàn)出來襟企,如概述項目背景嘱么、目標用戶、產(chǎn)品目標顽悼、場景分析曼振、用戶目標 、設(shè)計目標與設(shè)計思路(如圖)蔚龙,方便他人理解整個項目背景下的設(shè)計思路冰评,也方便以后回溯總結(jié)項目設(shè)計。但沒必要將全部的分析內(nèi)容都放進來木羹,畢竟這份文檔不是需求分析文檔甲雅,篩選放入重要且適當?shù)膬?nèi)容展現(xiàn)即可解孙。

任務(wù)流程是用圖形化的形式來表達產(chǎn)品邏輯關(guān)系的步驟和過程,指用戶使用產(chǎn)品中操作后的各種結(jié)果反饋等抛人。進行流程設(shè)計前提是完全了解需求弛姜,站在用戶的角度去考慮引導(dǎo)用戶完成用戶目標,關(guān)注用戶的操作不僅可以讓你的思維更清晰妖枚,還可以避免有操作邏輯的遺漏廷臼。還能讓其他人能快速理解。

4. 需求表

當交互設(shè)計中涉及到其他崗位的需求時(如動畫绝页、語音荠商、音效等),可選擇表格呈現(xiàn)续誉,或是提供共享盤路徑方便他人查看莱没,但要記的在需求更改或更換路徑要及時更新,這個部分可根據(jù)實際情況選擇呈現(xiàn)酷鸦。

5. 交互稿

交互稿主體結(jié)構(gòu)的功能層級要清晰饰躲,合理的命名,格式統(tǒng)一井佑,新增/修改的內(nèi)容以及日期要統(tǒng)一標識清晰属铁,方便他人瀏覽查找。

交互稿單頁面包含界面圖躬翁、設(shè)計說明焦蘑。不要包含太多功能交叉,方便他人理解盒发。交互說明可以通過文字例嘱,流程圖配合方式呈現(xiàn),比純文字的說明更直觀宁舰。還要注意不要遺漏異常拼卵、特殊情況說明,保證交互說明思路清晰而內(nèi)容詳盡蛮艰,交互說明類型有以下幾種:

限制:包含極限值腋腮、范圍值等,如:數(shù)值是否存在極值壤蚜,最多顯示多少字符即寡,多出是否折行,如99+等袜刷;

狀態(tài):包含默認狀態(tài)聪富、常見狀態(tài)、特殊狀態(tài)著蟹;

操作:包含常見操作(正常操作得到的反饋)墩蔓、特殊操作(極端情況操作)梢莽、誤操作秆吵、手勢操作(雙擊熟空、長按、捏视哑、伸阵面、滑動)等葡粒;

反饋:操作后得到的反饋動作(提示、跳轉(zhuǎn)膜钓,動畫語音等)。

6. 廢紙簍

交互文檔中的回收站(后悔藥)卿嘲,廢棄的頁面或過程方案稿別急著刪除颂斜,方案在不斷調(diào)整優(yōu)化的過程,本以為沒有用的頁面拾枣,統(tǒng)統(tǒng)放這里沃疮,后期很可能用的到哦!

三梅肤、后記

不同的公司會有不同的工作流程司蔬,根據(jù)項目、流程等實際情況來設(shè)計適合自己的交互設(shè)計文檔姨蝴。當然俊啼,最重要的還是對設(shè)計本身的多方面思考。在什么樣的場景下左医,你通過什么方式解決了什么問題授帕,還有沒有更好的方式…… 細致去分析并權(quán)衡取舍,就可以做出一份邏輯清晰會表達的交互設(shè)計文檔了浮梢。

以上分享希望對大家會有所幫助跛十。同時歡迎各位同行指正交流~

…… 遇見你真好,謝謝你的閱讀……

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末秕硝,一起剝皮案震驚了整個濱河市芥映,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌远豺,老刑警劉巖奈偏,帶你破解...
    沈念sama閱讀 217,542評論 6 504
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異憋飞,居然都是意外死亡霎苗,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,822評論 3 394
  • 文/潘曉璐 我一進店門榛做,熙熙樓的掌柜王于貴愁眉苦臉地迎上來唁盏,“玉大人内狸,你說我怎么就攤上這事±謇蓿” “怎么了昆淡?”我有些...
    開封第一講書人閱讀 163,912評論 0 354
  • 文/不壞的土叔 我叫張陵,是天一觀的道長刽严。 經(jīng)常有香客問我昂灵,道長,這世上最難降的妖魔是什么舞萄? 我笑而不...
    開封第一講書人閱讀 58,449評論 1 293
  • 正文 為了忘掉前任眨补,我火速辦了婚禮,結(jié)果婚禮上倒脓,老公的妹妹穿的比我還像新娘撑螺。我一直安慰自己,他們只是感情好崎弃,可當我...
    茶點故事閱讀 67,500評論 6 392
  • 文/花漫 我一把揭開白布甘晤。 她就那樣靜靜地躺著,像睡著了一般饲做。 火紅的嫁衣襯著肌膚如雪线婚。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,370評論 1 302
  • 那天盆均,我揣著相機與錄音塞弊,去河邊找鬼。 笑死缀踪,一個胖子當著我的面吹牛居砖,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播驴娃,決...
    沈念sama閱讀 40,193評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼奏候,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了唇敞?” 一聲冷哼從身側(cè)響起蔗草,我...
    開封第一講書人閱讀 39,074評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎疆柔,沒想到半個月后咒精,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,505評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡旷档,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,722評論 3 335
  • 正文 我和宋清朗相戀三年模叙,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片鞋屈。...
    茶點故事閱讀 39,841評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡范咨,死狀恐怖故觅,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情渠啊,我是刑警寧澤输吏,帶...
    沈念sama閱讀 35,569評論 5 345
  • 正文 年R本政府宣布,位于F島的核電站替蛉,受9級特大地震影響贯溅,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜躲查,卻給世界環(huán)境...
    茶點故事閱讀 41,168評論 3 328
  • 文/蒙蒙 一它浅、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧镣煮,春花似錦罚缕、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,783評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽黔衡。三九已至蚓聘,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間盟劫,已是汗流浹背夜牡。 一陣腳步聲響...
    開封第一講書人閱讀 32,918評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留侣签,地道東北人塘装。 一個月前我還...
    沈念sama閱讀 47,962評論 2 370
  • 正文 我出身青樓,卻偏偏與公主長得像影所,于是被迫代替她去往敵國和親蹦肴。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 44,781評論 2 354

推薦閱讀更多精彩內(nèi)容