目前交互設(shè)計(jì)在互聯(lián)網(wǎng)產(chǎn)品中的應(yīng)用狀況
“交互設(shè)計(jì)可以提高產(chǎn)品可用性�！痹趪鴥�(nèi)的互聯(lián)網(wǎng)行業(yè)中，建立在這個認(rèn)識基礎(chǔ)上，交互設(shè)計(jì)得到了普遍的接受�！爱a(chǎn)品設(shè)計(jì)開始的時候應(yīng)該先交互啊~~”“你這個項(xiàng)目沒交互過啊~~”這類的說法越來越多當(dāng)然是好的信息，但是，交互設(shè)計(jì)工作到底應(yīng)該怎么做才能提高產(chǎn)品可用性？通常的互聯(lián)網(wǎng)產(chǎn)品研發(fā)中，交互設(shè)計(jì)工作是處于沒有方法的狀況。
理解交互設(shè)計(jì)
交互設(shè)計(jì)是一個設(shè)計(jì)工作。
交互設(shè)計(jì)是一門技術(shù)。
交互設(shè)計(jì)在目前階段的主要使命是提高產(chǎn)品可用性。
通過對界面和操作行為的設(shè)計(jì)提高產(chǎn)品可用性。
互聯(lián)網(wǎng)產(chǎn)品的特點(diǎn)
1.變化快。
2.質(zhì)量低。
3.功能操作與信息傳達(dá)并重。
4.高速創(chuàng)新從而帶來的無標(biāo)準(zhǔn)。
那么，互聯(lián)網(wǎng)產(chǎn)品的交互設(shè)計(jì)應(yīng)該怎么做？
互聯(lián)網(wǎng)產(chǎn)品的交互設(shè)計(jì)方法分享
經(jīng)過長期的摸索、體會騰訊互聯(lián)網(wǎng)產(chǎn)品，我們總結(jié)出了幾個較為有效的設(shè)計(jì)方法：
方法一. 自然語言法。設(shè)計(jì)交互細(xì)節(jié)的方法。
方法二. 結(jié)構(gòu)圖法。設(shè)計(jì)產(chǎn)品信息構(gòu)架的方法。
方法三. 任務(wù)走查法。對現(xiàn)有產(chǎn)品進(jìn)行優(yōu)化的方法，全面普查產(chǎn)品，包括對交互細(xì)節(jié)和信息構(gòu)架。
這三個方法的思路，是基于對交互設(shè)計(jì)工作內(nèi)容如下的分類：
1. 信息構(gòu)架
2. 交互細(xì)節(jié)
但，嚴(yán)格來說，這樣的理解是不對的。交互設(shè)計(jì)工作原本就是“交互細(xì)節(jié)”工作。另外有信息構(gòu)架師來解決信息構(gòu)架的問題。然而，上面提到了互聯(lián)網(wǎng)產(chǎn)品快的特點(diǎn)，更多的研發(fā)步驟顯然更容易將研發(fā)周期拖的更長，把信息構(gòu)架工作和交互細(xì)節(jié)合并起來，減少一個環(huán)節(jié)，更適應(yīng)互聯(lián)網(wǎng)產(chǎn)品的研發(fā)特點(diǎn)。
“為什么不把信息構(gòu)架工作交給產(chǎn)品經(jīng)理來做呢？”如果說交互設(shè)計(jì)工作的核心是表達(dá)（這個觀念，最后還會提到），那么，信息構(gòu)架和交互細(xì)節(jié)都是表達(dá)的重要手段。信息構(gòu)架不清楚的產(chǎn)品，怎么談得到表達(dá)的清楚、明確呢。所以，交互設(shè)計(jì)的工作包含了兩部分：信息構(gòu)架和交互細(xì)節(jié)。
那么，下面我們就開始具體介紹這三個方法：
方法一. 自然語言法
使用自然的語言來表達(dá)頁面信息。
這是一個設(shè)計(jì)界面交互細(xì)節(jié)的方法。
界面表達(dá)的要求是：清晰，明確，簡潔，得體。
想象著用面對面的交流來傳達(dá)信息，再將面對面的傳達(dá)變?yōu)闀姹磉_(dá)，再用界面語言翻譯書面表達(dá)。
除了思路，我們還需要必備的原則、常用的表達(dá)方式和具體操作步驟。
頁面表達(dá)原則：
1. 更少的信息量更好。
2. 結(jié)構(gòu)化更易于理解。
3. 信息的表達(dá)應(yīng)該清楚、明確、直接。
4. 操作可識別。
5. 操作前，結(jié)果可預(yù)知。
6. 操作時，操作有反饋。
7. 操作后，操作可撤銷。
8. 讓用戶知道身處何地。
9. 避免內(nèi)容看上去象廣告。
10. 不提供多余的功能。
11. 相同的功能，在不同的頁面中應(yīng)保持一致性。
12. 措辭統(tǒng)一。
常用的頁面表達(dá)方式：
1. 從左到右，從上到下。
2. 大字更突出。
3. 圖形更吸引人。
4. 動畫會被誤認(rèn)為是廣告。
5. 內(nèi)容邏輯：并列關(guān)系；從屬關(guān)系。
6.多項(xiàng)并列的信息用
7.不同的排序方式VS篩選內(nèi)容
具體操作
第一步. 概括待表達(dá)的信息
第二步. 將概括好的信息排序
第三步. 使用界面語言翻譯
實(shí)例：中信銀行卡
第一步. 概括信息：
描述應(yīng)該是概括的，盡可能簡短。例如：
● 您選擇了回郵方式辦卡，概括解釋這個辦卡方式。
● 接下來您應(yīng)該 下載申請表
● 回郵辦卡的全過程是這樣的…
● 一系列注意事項(xiàng)。
第二步. 排序：
就是上面的順序，沒有變化。
有些時候排序會遇到困難，需要借助界面語言才能準(zhǔn)確反應(yīng)表達(dá)順序。這正是界面設(shè)計(jì)的價值，它可以勝任一些單純適用文字表達(dá)表達(dá)不好的情況。下面的黃鉆續(xù)費(fèi)案例中也許你就會遇到類似的問題。遇到這種問題時，記錄下排序遇到的問題即可。在翻譯過程中問題可能就解決掉了。
第三步. 翻譯：
與之前界面對比：
● 開頭幾句信息順序需要整理，使上下文關(guān)系更清晰。
● 對過程的描述可簡化。
● “說明”應(yīng)更結(jié)構(gòu)化。
這里所說的“與對比界面之前”只是因?yàn)橹暗男枨笪臋n中有相對具象的頁面原型，而這并不意味著這里的工作是“優(yōu)化頁面原型”。需求的傳達(dá)總會有一定的形式，也許是簡單的頁面原型，也許是一份需求文檔。甚至可以更簡單。有時相對具象化的信息記錄或之前的頁面反而會是干擾設(shè)計(jì)者以明確的思路來設(shè)計(jì)，尤其需要小心。
我們有了一種成型的方法，但這并不意味著我們設(shè)計(jì)出的頁面就只有一個樣子了。實(shí)際上不同的設(shè)計(jì)者使用這個方法會設(shè)計(jì)出不同的頁面。下面這是另外一位設(shè)計(jì)師給出的思路，或許這是更好的方案：
1. 您選擇了回郵方式辦卡，概括解釋這個辦卡方式。
2. 第一步. 下載、填寫申請表并回郵給中信
3. 第二步……………………..
4. 第四步……………………..
這樣的信息概括和排序頁面表現(xiàn)將是什么樣子？你可以自己試著畫畫~~
練習(xí)：QQ空間黃鉆催費(fèi)頁面
說明：
黃鉆貴族是QQ空間中的VIP用戶，黃鉆貴族用戶可以免費(fèi)適用空間中的裝扮，另外還可以享受到日志信紙、超大容量相冊等諸多特權(quán)。
當(dāng)用戶的黃鉆貴族身份即將到期的時候，從QQ聊天主面板上的“我的錢包”提示：“錢包”閃動，點(diǎn)擊后用一個490*300px的小窗口告知用戶續(xù)費(fèi)的詳情。
左側(cè)圖片在實(shí)際頁面中是一個flash動畫，若干張圖片切換，顯示黃鉆用戶可以裝扮出的更好的空間效果。
右側(cè)的續(xù)費(fèi)方式希望在所有的續(xù)費(fèi)方式中選擇出兩、三種比較常用的方式，直接顯示出來（就是現(xiàn)在頁面上的“家庭、網(wǎng)吧”兩種方式），方便用戶。同時提供“支付中心”鏈接（http://paycenter.qq.com/cgi-bin/showopenservice.cgi?service_type=home），讓用戶可以在全部續(xù)費(fèi)方式中選擇。
請使用上面介紹的自然語言法重新設(shè)計(jì)這個界面，讓信息表達(dá)的更高效、清晰、明確。
參考方案
需要表達(dá)的信息：
● 某某某，您的黃鉆要過期了。
● 黃鉆貴族很棒滴~~
● 現(xiàn)在續(xù)費(fèi)黃鉆還有額外的優(yōu)惠。
● 續(xù)費(fèi)方式…
更好的信息：
● 某某某，您的黃鉆要過期了。
● 您要是不再是黃鉆了，就有XXXXX損失啦~~
● 現(xiàn)在續(xù)費(fèi)黃鉆還有額外的優(yōu)惠。
● 續(xù)費(fèi)方式…
總結(jié)“自然語言法”
自然語言法的基本思路是把界面表達(dá)轉(zhuǎn)化為自然的人與人交流。人與人的交流是我們每天都會發(fā)生的，相對更容易，這個技能也更容易提高。
這里涉及到的兩個例子都是比較偏向于信息表達(dá)的，對于操作較多的界面，這個方法仍舊適用。
粵公網(wǎng)安備 44010402000282號