第四步：輸出符合設(shè)計(jì)規(guī)范的文檔

符合設(shè)計(jì)規(guī)范的交互稿一是視覺美觀昆雀，讓人賞心悅目辱志，提升產(chǎn)品期望蝠筑。二是體現(xiàn)我們的專業(yè)性，在產(chǎn)品設(shè)計(jì)上掌握主導(dǎo)權(quán)揩懒。因此強(qiáng)烈推薦沒有設(shè)計(jì)基礎(chǔ)的同學(xué)可以抽空研究下設(shè)計(jì)規(guī)范什乙。

邏輯上的規(guī)范我們可以參考 Don Norman 的交互設(shè)計(jì)6原則：

? ? 1. Affordance（預(yù)設(shè)用途）

? ? 2. Signifier（視覺指示）

? ? 3. Constraint（限制）

? ? 4. Mapping（匹配）

? ? 5 Feedback（反饋）

? ? 6. Conceptual model（心智模型）

視覺上的規(guī)范我們可以參考 Robbin Williams 《寫給大家看的設(shè)計(jì)書》提到的設(shè)計(jì)原則。筆者常用的設(shè)計(jì)屬性有：位置已球，大小臣镣，字號，顏色智亮，間距忆某，層級，一致性阔蛉。

原型交互稿完成后弃舒，我們除了需要用設(shè)計(jì)標(biāo)準(zhǔn)自驗(yàn)有哪些可以改進(jìn)的地方外，還有些細(xì)節(jié)需要留意馍忽。

一是“特殊性”的處理棒坏，常見的有：

? ? 1. 字符截?cái)?/p>

? ? 2. 頁面空狀態(tài)

? ? 3. 長屏（主要是iPhoneX）和短屏的適配

? ? 4. Android和IOS的差異

二是配合設(shè)計(jì)和開發(fā)的業(yè)務(wù)梳理：

? ? 1. 所有文案的梳理

? ? 2. 所有動效邏輯的梳理

? ? 3. 所有音頻的梳理

? ? 4. 復(fù)雜業(yè)務(wù)邏輯的梳理

? ? 5. 視覺設(shè)計(jì)師所需的頁面流程圖梳理

綜上，交互設(shè)計(jì)的邏輯圖如下：

交互設(shè)計(jì)邏輯圖

舉個(gè)筆者最近設(shè)計(jì)的案例：語音房APP房主邀請上麥

第一步：明確優(yōu)秀設(shè)計(jì)標(biāo)準(zhǔn)

抽象的定義我們根據(jù)LEMES整理如下：

? ? 1.?該功能是否易學(xué)

????2. 該功能操作是否高效

? ? 3. 該功能操作是否易記

? ? 4. 該功能是否糾正錯誤操作

? ? 5. 該功能是否讓用戶滿意

優(yōu)秀競品體驗(yàn)我們可以以“全面K歌”和“TT語音”兩款I(lǐng)OS排名靠前的產(chǎn)品為標(biāo)桿遭笋。

第二步：梳理清楚功能邏輯

首先我們繪制出業(yè)務(wù)流程圖。

業(yè)務(wù)流程圖

其次徒探，使用腦圖梳理一下該功能出現(xiàn)的各種場景瓦呼。

功能可能出現(xiàn)的場景

共7種場景，整理如下：

? ? 場景1：房主邀請不在座位上的玩家上指定座位

????場景2：房主邀請?jiān)谧簧贤婕疑喜煌淖?/p>

????場景3：房主邀請?jiān)谧簧贤婕疑舷嗤淖?/p>

????場景4：房主連續(xù)邀請?jiān)谧簧贤婕疑舷嗤淖?/p>

????場景5：房主連續(xù)邀請?jiān)谧簧贤婕疑喜煌淖?/p>

????場景6：房主連續(xù)邀請不在座位上的玩家上相同的座位

????場景7：房主連續(xù)邀請不在座位上的玩家上不同的座位

核心體驗(yàn)是房主邀請不在座位上的玩家上指定座位（場景1）测暗。在不影響其他場景體驗(yàn)的情況下央串，重點(diǎn)設(shè)計(jì)該場景體驗(yàn)。我們期望用戶可以在無任何指導(dǎo)的情況下碗啄，以最簡便的方式享受到流暢的體驗(yàn)质和。

對于場景1，為保證被邀請玩家的隱私稚字，被邀請方需要確認(rèn)后才會上麥饲宿，保證其聲音不會在未經(jīng)許可的情況暴露在公共場合。為方便邀請玩家快速選擇上麥玩家胆描，我們提供搜索框瘫想，同時(shí)支持昵稱和備注名查詢。

場景2類似于場景1昌讲，優(yōu)化方案是將麥上玩家按順序優(yōu)先顯示在選擇上麥玩家的列表上国夜。場景3屬于無意義操作，我們不予支持短绸，選擇上麥玩家列表上不顯示座位上玩家车吹。針對場景4,5,6,7筹裕，為避免用戶連續(xù)收到邀請干擾，我們設(shè)計(jì)為邀請方不受限制隨意邀請窄驹，但被邀請方在指定時(shí)間閾值內(nèi)只會收到一條邀請饶碘。

第三步：面向?qū)ο蠓治龉δ軐傩?/b>

該功能面向?qū)ο蠓治龅哪X圖如下：

面向?qū)ο蠓治瞿X圖

第四步：輸出符合設(shè)計(jì)規(guī)范的文檔

“特殊性”的處理，我們需要做的有：

? ? 1. 字符截?cái)嗦猓脩裘舷?個(gè)字

? ? 2. 頁面空狀態(tài)扎运，房間無人時(shí)選擇上麥玩家的空狀態(tài)，搜索玩家結(jié)果為空時(shí)的狀態(tài)

綜上饮戳，輸出的頁面流程圖如下：

頁面流程圖

最后豪治，補(bǔ)充下邀請失敗場景的toast文案：

? ? 1. 官方上麥黑名單場景，“邀請失敗，該玩家已被禁止上麥”

????2. 玩家不在房間場景戒悠，“邀請失敗鸠信，該玩家不在房間”

? ? 3. 老版本場景，“邀請失敗掩浙，該玩家版本過低”

小結(jié)

交互設(shè)計(jì)所涉及的領(lǐng)域非常廣，從心理學(xué)到人機(jī)工程秸歧，需要我們孜孜不倦厨姚，持續(xù)積累。理論上多讀優(yōu)秀書籍和文章键菱，實(shí)踐上多學(xué)習(xí)優(yōu)秀產(chǎn)品和多復(fù)盤自身設(shè)計(jì)谬墙。長期堅(jiān)持下來，我們的交互設(shè)計(jì)能力一定能有長足的提升经备。

盡請關(guān)注下一篇：社交產(chǎn)品方法論(八)：數(shù)據(jù)分析的二三事拭抬。