面對競爭對手的產(chǎn)品，積極主動地尋求具有差異化的用戶體驗(yàn)設(shè)計(jì)之道——這個過程會順理成章地引出“標(biāo)志性的交互模式”這一話題。所謂“標(biāo)志性的交互模式”，就是指那些能夠幫助用戶對你的應(yīng)用產(chǎn)品及公司品牌產(chǎn)生辨識和認(rèn)知效應(yīng)的獨(dú)特交互模式。

這項(xiàng)工作并不意味著要在現(xiàn)有的產(chǎn)品設(shè)計(jì)開發(fā)流程當(dāng)中做出某種額外的技術(shù)投入，它所關(guān)系到的是一種能夠在設(shè)計(jì)方案當(dāng)中體現(xiàn)出來的觀念模式和設(shè)計(jì)目標(biāo)。其實(shí)，打造具有差異化的用戶體驗(yàn)這個過程本身就是對標(biāo)志性的交互模式的定義，只不過我們一直以來所討論的對象都是單一的應(yīng)用產(chǎn)品。如果你所在的公司或團(tuán)隊(duì)同時擁有數(shù)款系列化的應(yīng)用產(chǎn)品，那么你在系統(tǒng)層面的全局化設(shè)計(jì)思路就必須同時擴(kuò)展到其他產(chǎn)品及相關(guān)功能當(dāng)中。這也意味著你需要擴(kuò)展交互模型設(shè)計(jì)方案的作用范圍；其中的每一個設(shè)計(jì)決策都有可能影響到產(chǎn)品家族當(dāng)中的其他成員。

打造標(biāo)志性的交互模式

回顧一下我們在前文中探索的網(wǎng)狀列表交互模型，其中，網(wǎng)格單元的展開瀏覽方式以及相應(yīng)的操作手勢的運(yùn)用，其實(shí)算得上是一種標(biāo)志性的交互模式了。當(dāng)時，我們的主要目的還是解決文字內(nèi)容無法完整顯示的問題；現(xiàn)在，站在產(chǎn)品全局的角度進(jìn)行思考，我們還可以將這樣的交互模式通過怎樣的方式運(yùn)用在哪些地方呢？不妨在導(dǎo)航方面試試它的可行性。假設(shè)這個網(wǎng)狀列表其實(shí)是應(yīng)用中的導(dǎo)航結(jié)構(gòu)，其中每一個單元格都對應(yīng)著一個導(dǎo)航項(xiàng)，那么這種展開并瀏覽的交互方式用在這里是否得當(dāng)呢？答案是肯定的。

圖 6-11 通過雙指張開的方式展開一個導(dǎo)航項(xiàng)，超過一定程度之后，格子自動擴(kuò)展為全屏

這次，我們對網(wǎng)狀列表交互模型進(jìn)行了適當(dāng)?shù)馗脑�，不過其中的基礎(chǔ)模式仍然是展開瀏覽。用戶可以通過雙指張開的方式展開網(wǎng)格單元，閱讀其中的導(dǎo)航文字內(nèi)容。如果展開的程度沒有超過某個預(yù)設(shè)值，那么當(dāng)用戶的手指離開屏幕時，格子就會自動恢復(fù)到默認(rèn)的尺寸；一旦展開的程度超過了預(yù)設(shè)閥值，那么單元格就會自動擴(kuò)展至全屏，這個導(dǎo)航項(xiàng)所對應(yīng)的下級界面就會完整地呈現(xiàn)出來。另外也必須考慮到，用戶有可能更加習(xí)慣于直接點(diǎn)擊單元格來進(jìn)行導(dǎo)航操作，所以我們不妨將這種方式也加入到當(dāng)前的模型當(dāng)中，用戶可以根據(jù)自己的習(xí)慣或是喜好來進(jìn)行操作。

我們正在打造一種與常規(guī)做法截然不同的交互模型。傳統(tǒng)的線形空間模型通常會給我們帶來一種“節(jié)點(diǎn)化”體驗(yàn)，而在我們當(dāng)前所打造的這個交互模型當(dāng)中，用戶不再需要通過“從A點(diǎn)到B點(diǎn)”的方式在信息結(jié)構(gòu)中行進(jìn)，他們可以在任何需要的時候直接觸發(fā)相應(yīng)的內(nèi)容與功能。從工作流的角度來說，這兩類交互方式?jīng)]有本質(zhì)區(qū)別，因?yàn)樗鼈兯鶎?shí)現(xiàn)的需求目標(biāo)是相同的；而站在體驗(yàn)差異化的角度來看，這兩種模式帶給用戶的感知幾乎是完全不同的。

文檔化

撰寫交互模型文檔同樣是一件非常重要的工作。你需要抓住頭腦中的模型概念，將這些信息落實(shí)到文檔中，并在設(shè)計(jì)開發(fā)團(tuán)隊(duì)當(dāng)中與大家進(jìn)行分享和交流。這樣做可以幫助你對自己的想法進(jìn)行驗(yàn)證，確保由這些概念所演化出的實(shí)際應(yīng)用界面可以被用戶很好的理解和使用。

你可以采用任何你喜歡的形式來創(chuàng)建文檔，只要確保在其中落實(shí)以下兩個方面的基本要素即可：

• 以一種簡潔而清晰的方式，可視化地將交互模型的本質(zhì)描繪出來。
• 為那些難以通過可視化的方式準(zhǔn)確表達(dá)出來的交互模式提供附加描述。

請記住一點(diǎn)，交互模型文檔并不是用來描述用戶界面的設(shè)計(jì)方案或是像線框原型那樣對交互對象進(jìn)行布局規(guī)劃的。在制定文檔的過程中，要盡量避開這些細(xì)節(jié)層面的問題。因?yàn)榻换ツＰ捅旧淼淖饔檬敲枋霎a(chǎn)品整體或局部當(dāng)中的交互行為模式，以便為后續(xù)的交互及視覺設(shè)計(jì)相關(guān)工作提供明確的目標(biāo)方向。

下圖所展示的是一個可視化的交互模型文檔范例，它描述了我們之前創(chuàng)建的網(wǎng)狀導(dǎo)航結(jié)構(gòu)。

圖 6-12 將交互模型文檔化

標(biāo)簽： 用戶體驗(yàn) 移動應(yīng)用 Web應(yīng)用 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點(diǎn)！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請與原作者聯(lián)系。