iOS Wow體驗 – 第六章 – 交互模型與創(chuàng)新的產(chǎn)品概念(2)

0 評論 12953 瀏覽 1 收藏 35 分鐘

本文是《iOS Wow Factor:Apps and UX Design Techniques for iPhone and iPad》第六章譯文精選的第二部分,其余章節(jié)將陸續(xù)放出。上一篇:Wow體驗 – 第六章 – 交互模型與創(chuàng)新的產(chǎn)品概念(1)

全文由C7210自發(fā)翻譯(編譯),并首發(fā)于Beforweb.com,如需轉(zhuǎn)載,請注明譯者及出處信息。英文原書版權(quán)由Apress所有,中文引進版的版權(quán)由相關出版社所有。

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

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

 

打造標志性的交互模式

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

圖 6-11 通過雙指張開的方式展開一個導航項,超過一定程度之后,格子自動擴展為全屏

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

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

文檔化

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

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

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

請記住一點,交互模型文檔并不是用來描述用戶界面的設計方案或是像線框原型那樣對交互對象進行布局規(guī)劃的。在制定文檔的過程中,要盡量避開這些細節(jié)層面的問題。因為交互模型本身的作用是描述產(chǎn)品整體或局部當中的交互行為模式,以便為后續(xù)的交互及視覺設計相關工作提供明確的目標方向。

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

1FR94429-1

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

案例學習

接下來,我們將通過一個虛擬案例來進一步理解這些理論知識在實際工作中的運用方法,并籍此梳理出一套具有普遍適用性的工作模型。案例中的客戶和產(chǎn)品都是虛構(gòu)出來的,我們將通過完整的交互模型設計過程來了解實戰(zhàn)中的設計思路和問題解決方式。

X公司

首先,讓我們假設出一個客戶,也就是X公司。該公司目前有一款桌面軟件產(chǎn)品,并且已經(jīng)在相關市場中取得了一定的成功。X公司最近意識到,他們必須通過一款iPhone應用來打入移動市場,以保持公司業(yè)績的增長。另外,來自用戶的呼聲以及投資方的壓力也迫使著他們必須盡快地做出這方面的決策。

X公司了解到你是一名出色的移動應用交互設計師,所以決定把這個項目外包給你做。他們希望最終的產(chǎn)品可以在應用商店中一鳴驚人,并一舉戰(zhàn)勝他們的競爭對手剛剛推出的一款同類應用。

X公司的主要業(yè)務方向是文化娛樂。在他們的桌面應用中,用戶可以瀏覽那些來自各方面內(nèi)容源的文娛信息。內(nèi)容形式以視頻為主,音頻和圖片也會占一定的比重。這款桌面應用能夠很好地組織和管理大量的內(nèi)容,使用戶可以很輕松地檢索到自己感興趣的信息。比起競爭對手而言,這也是X公司所具有的優(yōu)勢。

現(xiàn)在,X公司面臨著新的挑戰(zhàn):雖然他們的桌面應用很棒,但要對其進行移動化改造,使之成為一款同樣成功的iPhone應用,卻不是一件很容易的事。桌面應用的用戶界面當中有大量按鈕一類的控制元素,而且它們顯然都是針對鍵鼠輸入方式而設計的。在內(nèi)容的組織與瀏覽方面,導航結(jié)構(gòu)多數(shù)都超過了三層。

X公司的需求

了解了這些背景情況之后,你就可以著手準備實際的設計工作了。首先,你要根據(jù)客戶的實際需求來定義產(chǎn)品的核心功能。經(jīng)過了與X公司相關決策者的訪談交流,并對其桌面應用做了進一步的了解之后,你認識到,他們的iPhone應用需要滿足以下幾個方面的需求:

  • 幫助用戶訪問內(nèi)容庫當中的全部信息。
  • 為用戶提供一種機制,幫助他們快速高效地發(fā)現(xiàn)新內(nèi)容。
  • 用戶可以將內(nèi)容分享給朋友。
  • 用戶可以對內(nèi)容發(fā)表評論。
  • 用戶可以發(fā)布他們在iPhone上創(chuàng)作或拍攝到的內(nèi)容,并通過內(nèi)容庫分享給全部用戶。

這些需求目標已經(jīng)得到了X公司相關團隊及決策人員的確認。雖然其桌面應用的很多功能并沒有體現(xiàn)在這個列表中,但是根據(jù)移動應用上下文環(huán)境中的用戶實際需求來看,目前的這些功能已經(jīng)足夠了。

明確了產(chǎn)品需求,我們就可以對工作流的組織方式進行構(gòu)思了。在這方面,最好多花些時間和心思,從細節(jié)層面對工作流進行深入地挖掘與定義,這樣做可以使接下來所創(chuàng)建的交互模型能夠最大程度地發(fā)揮出自身的潛力和價值。

這份需求列表可以幫我們看出這款應用的本質(zhì)。其中,絕大部分需求與內(nèi)容有著直接的關聯(lián),而類似分享和評論這樣的輔助功能也是依托于內(nèi)容的基礎之上的。所以我們可以得出結(jié)論,內(nèi)容是這款應用在功能與用戶體驗等方面的核心。當你與客戶進行溝通交流的時候,還會對一些將要在后續(xù)工作當中面對的關鍵問題有所預見。例如,我們可以了解到,對于這款以內(nèi)容檢索和瀏覽為核心的應用來說,用戶所做出的交互行為多數(shù)是為了獲取內(nèi)容而在層級化的信息結(jié)構(gòu)中進行的導航操作。

要將這一點體現(xiàn)在工作流文檔中,有兩種方式供我們選擇。一是在文檔中準確地反映出涉及內(nèi)容瀏覽和導航的層級結(jié)構(gòu);另外還可以將這方面的工作流簡化成為文檔中的一個節(jié)點。讓我們通過一張流程圖來看看這兩種方式之間的區(qū)別(見圖 6-13):

1FR9A36-2

圖 6-13流程圖被簡化前后的信息結(jié)構(gòu)對比

這給我們帶來了一個值得思考的問題:究竟是否有必要將工作流完整無缺地體現(xiàn)在文檔中? 這個問題的答案還要視具體情況而定。對于那些會對用戶界面設計方案產(chǎn)生直接影響的交互流程 ,你需要在文檔中將它們盡可能完整而詳細地體現(xiàn)出來。而對于那些有可能在用戶界面設計過程中得到一定程度簡化的交互流程,不妨直接在工作流文檔中將它們打包成為一個節(jié)點,避免工作流的組織方式被復雜化。

在當前的案例中,我們需要為用戶提供一種機制,幫助他們在移動應用的上下文環(huán)境中快速高效地發(fā)現(xiàn)并瀏覽內(nèi)容??梢灶A見的是,為了實現(xiàn)這個需求,我們必須在將來的某個設計環(huán)節(jié)當中將桌面版應用原有的信息結(jié)構(gòu)進行最大程度地簡化,例如可以在構(gòu)建交互模型時,將內(nèi)容的導航與瀏覽整合到同一個交互過程當中。在這種情況下,我們完全可以選擇簡化版的流程圖來指導我們接下來的工作(見圖 6-14)。

1FR94G7-3

圖 6-14 做出了信息結(jié)構(gòu)會被簡化的預見之后,采用簡化版本的流程圖

隨著核心需求的基本工作流被逐步確定,我們也能越發(fā)清晰地看到,這個案例帶給我們的一個很大的挑戰(zhàn),就是能否找到一種與移動應用上下文環(huán)境的關聯(lián)更加緊密的方式,來幫助用戶獲取內(nèi)容。接下來,我們將帶著這個問題進入到交互模型的構(gòu)建階段。

應用的細節(jié)

為了能夠在X公司的iPhone應用中實現(xiàn)更加合理的內(nèi)容瀏覽機制,你決定首先從他們的桌面應用入手,進行更加細致的分析。經(jīng)過一番實際的使用,你發(fā)現(xiàn),在桌面應用當中,內(nèi)容被劃分為十個主類別,其中每個類別之下都有十個左右的子類,而每一個子類當中又包含著若干獨立的內(nèi)容對象。整個系統(tǒng)當中大約有幾千個內(nèi)容節(jié)點。

桌面應用中的交互模型是很容易理解的。它會向用戶呈現(xiàn)一個網(wǎng)格狀的選項列表,其中每個單元格都對應著一個內(nèi)容主類別。選擇了其中的某個主類之后,整個列表會被刷新,這個主類所包含的子類會依次填充到每個單元格當中。繼續(xù)選擇其中的某個子類,整個列表會再次刷新,并且被這個子類所對應的內(nèi)容對象重新填充。這些內(nèi)容對象通??梢蕴顫M多個界面,你可以不同的界面中切換瀏覽。

另外,這款桌面應用在導航方面做的不是很理想。用戶必須至少進入到子類列表界面之后才能發(fā)現(xiàn)一個所謂的全局導航,而且當你深入到內(nèi)容層面之后,會發(fā)現(xiàn)這個導航只能幫你回到頂級的主類列表界面。另外,在內(nèi)容層面當中缺乏必要的上下文指示,用戶很難發(fā)現(xiàn)當前的內(nèi)容對象從屬于哪個子類。

在你對這些流程進行實際體驗的時候,要記得將自己的觀察和想法及時地記錄下來。這些記錄也許會對交互模型的創(chuàng)建起到重要的指導作用。正像我們在列表模型改造練習當中了解到的,某些在表面看來無關緊要的零星想法,卻有可能被擴展成為很有價值的交互概念。在某些情況下,你完全可以將那些從觀察記錄里歸納出的想法加入到交互模型文檔當中。

根據(jù)當前案例的實際情況,你有針對性地在內(nèi)容層級結(jié)構(gòu)這方面做了特別的記錄與分析;這些信息將對交互模型的構(gòu)建方案產(chǎn)生決定性的影響。目前,我們對于內(nèi)容結(jié)構(gòu)的理解大致是這樣的(見圖 6-15):

1FR95523-4

圖 6-15 X公司桌面應用當中的內(nèi)容結(jié)構(gòu)

桌面應用的交互模型當中有一個很嚴重的問題。正如我們在前文當中了解到的,當用戶處于內(nèi)容層面的時候,必須首先通過全局導航回到主類列表界面,才能再次進入子類列表界面或是某個子類當中的內(nèi)容對象列表界面。而這只是眾多問題當中的一個。你現(xiàn)在還不清楚桌面應用當中的這種網(wǎng)狀模型能否適用于iPhone的用戶體驗模式。

既然我們已經(jīng)在之前的練習中打造過一個網(wǎng)狀模型,那么不妨試著對這個概念進行再利用,并且將我們先前定義好的交互機制運用到當前案例的信息結(jié)構(gòu)當中。(見圖 6-16)。

1FR92U9-5

圖 6-16 在網(wǎng)狀模型中,從主類列表界面導航至子類列表界面

由于具有幾乎相同的網(wǎng)格結(jié)構(gòu),這個交互模型與X公司的桌面應用在體驗方面是具有很大相似之處的。對于那些已經(jīng)熟悉了桌面應用的用戶來說,這是好事。不過畢竟,這種模型在小屏幕設備當中受到的空間局限還是很大的。在iPhone當中,我們最多只能使用3行3列的網(wǎng)格,而在桌面應用中,網(wǎng)格可以達到10行15列,具體的列數(shù)還會隨著顯示器的規(guī)格不同而變化。

正像我們之前在模型改造練習當中定義過的,用戶可以通過雙指張開的方式展開網(wǎng)格單元,也可以直接點擊單元格進入下層結(jié)構(gòu)。不過在當前的案例中,我們要降低第一種方式當中的那個狀態(tài)閥值,使系統(tǒng)在接收到雙指張開的手勢之后,能夠立刻將單元格進行擴展,直至全屏狀態(tài)。

這個交互過程中的關鍵要素就是單元格在展開時所表現(xiàn)出的過渡動畫效果。我們希望給用戶帶來一種感覺,仿佛每一層界面都是嵌套在上一層界面當中的一個網(wǎng)格單元里的;當用戶使用雙指對某個單元格進行展開操作的時候,可以看到下層界面正在從格子當中呈現(xiàn)出來,并隨著單元格的擴展而填滿全屏。這種視覺交互效果可以準確地體現(xiàn)出這款應用的信息組織方式,而且對用戶來說,這種交互模式也是非常直觀的。

遺憾的是,這個模型當中還存在一些弊端,例如回到上層結(jié)構(gòu)的導航方式問題。使用相反的操作手勢,也就是雙指捏合的方式進行回退操作是具有一定的可行性的,但是對于內(nèi)容較為復雜的界面來說,這種交互方式的視覺效果缺乏干凈利落的感覺。所以,網(wǎng)格模型的概念也許可以在某些特定的需求當中發(fā)揮其真正的潛力,但它似乎不適合當前案例中的應用??梢哉f,這種交互模型的擴展性并不是很強,我們無法將它很好地運用到一些常見的需求當中。

另外,這個交互模型是一種典型的雙手解決方案,用戶必須一手持機,同時使用另外一只手進行相關操作。這種交互方式本身談不上不好,但是考慮到最終產(chǎn)品所處的移動上下文環(huán)境,這并不是一個很理想的模式。

對于當前的案例,有沒有其他更加適用的交互模型呢?讓我們回過頭來重新思考一下常規(guī)列表的可能性。傳統(tǒng)的單列縱向列表非常便于單手操作,而且很適合用來展現(xiàn)層級化的信息結(jié)構(gòu)。這種特性幾乎使其成為了iPhone當中最具普遍適用性的導航方案。不過也正是因為它的適用性太強,所以通過這種方式打造的交互方案通常會缺乏足夠的創(chuàng)新性。有什么辦法可以幫助我們以全新的方式來使用傳統(tǒng)的列表模型呢?

在之前的練習中,我們曾經(jīng)對單列縱向列表進行過天馬行空般的改造,這次,我們不妨在保持標準列表原貌的基礎上尋求一些局部當中的改進方法。在實際產(chǎn)品中,我們不能僅僅為了標新立異而刻意吹捧差異化的原則,尤其是不能在還有相關問題沒有得到解決的情況下片面地采用并不適宜的方案。在當前的案例中,網(wǎng)格模型不能很好地幫助用戶實現(xiàn)回退方面的導航功能,而且不便于單手操作。另外,正像我們在前文當中提到的,目前的桌面應用當中還存在著其他方面的問題,例如在內(nèi)容層面當中缺乏必要的上下文指示,用戶很難發(fā)現(xiàn)當前的內(nèi)容對象從屬于哪個子類,而且當你深入到內(nèi)容層面之后,只能通過現(xiàn)有的導航機制回到頂級的主類列表界面等等。接下來,我們將致力于打造一個能夠解決所有這些問題的新模型。

1FR922c-6

圖 6-17 擁有獨特交互方式的傳統(tǒng)單列縱向列表。用戶可以在某個列表項中向左輕掃,使原本處于隱藏狀態(tài)的二級列表結(jié)構(gòu)呈現(xiàn)在這個列表項當中。

這個解決方案第一眼看上去很普通,也很容易理解,它似乎就是一個內(nèi)容類別列表。然而這個模型在很多方面都與iOS當中的標準列表有所區(qū)別。用戶在前兩層信息結(jié)構(gòu)當中進行導航操作的時候,整個列表的視圖模式是不會發(fā)生變化的。當用戶選擇了某個主類之后,對應的子類列表會直接出現(xiàn)在這個主類所在的列表項當中。這個過程所涉及到的狀態(tài)變化只會發(fā)生在當前列表項的可視區(qū)域里。用戶可以在這個列表項區(qū)域當中通過上下滾動的方式來瀏覽子類列表,而當前區(qū)域以外的部分則始終保持不變,也就是說,用戶無需離開當前界面就能隨時訪問其他主類當中的子級分類。

我們可以讓用戶通過向左輕掃的方式將子類列表“拖入”主類所在的列表項可視區(qū)域當中,也可以讓他們對某個其他位置上的目標對象進行相關操作,來觸發(fā)某種動畫效果,使子類列表移入可視區(qū)域。你可以對各種方式進行構(gòu)思和嘗試,并從中找到一種操作體驗最自然的、誤操作幾率最低的來加以使用。

這種交互模型在導航和瀏覽方面的效率很高,用戶可以在同一個界面當中同時查看兩個層面的信息。不過這里同樣存在一些很明顯的問題,例如子類列表會被局限在一個非常有限的可視區(qū)域當中,用戶一次最多能完整看到一到兩個條目。另外,這種模式本身只支持兩個類別層面之間的導航,要查看最終的內(nèi)容對象,我們還需要使用另外一個模型將內(nèi)容完整的呈現(xiàn)在屏幕當中。所以,這種模式也難以很好地適用于當前的案例。

我們希望找到一種新的方式,它即可以沿用上面這種模型在導航方面的靈活性,同時又能使內(nèi)容具有更好的可讀性。另外,在上面的模型當中,主類條目的表現(xiàn)形式以及對有效空間的占用率也可以得到適當?shù)膬?yōu)化。需要記住,這款應用的核心需求當中要求我們提供一種快速高效的機制,以幫助用戶更好的瀏覽內(nèi)容。我們對于交互模式的思考必須圍繞著這個中心思想進行展開。

我們繼續(xù)在列表的概念上做文章,不過這次,我們可以試著為列表增加一些不同的屬性,使閱讀方式更具流動性。如下圖所示,這種模型當中不存在彼此分離的視圖狀態(tài)變化,它是一種連貫的、更具動態(tài)化的解決方案,而且對用戶的交互行為具有更好的響應性。

1FR9E94-7

圖 6-18 該模型將主類與子類列表整合到同一個層面中,使瀏覽更加迅速。用戶可以通過縱向滾動來瀏覽主類列表,在某個主類當中通過橫向滾動來瀏覽子類列表。

這個交互模型與之前的那些有所不同。初始狀態(tài)下,界面為導航結(jié)構(gòu)和其他功能保留了一定的空間。說到這款應用當中的其他功能,我們并沒有進行過相關的描述,因為對于當前的案例練習來說,那些細節(jié)問題并不重要,我們的主要目的是站在一個較高的層面上,構(gòu)筑整個產(chǎn)品的核心體驗模式。所以目前,我們只需要將注意力放在與內(nèi)容的導航與瀏覽相關的交互模型上就可以了,因為這些方面才是整個產(chǎn)品的基礎與核心。

最初,這個模型只會呈現(xiàn)出一部分主類導航項。每個主類都以文字標簽的形式出現(xiàn),用戶無需任何操作即可直接獲得子類列表當中的分類信息。這種二維導航結(jié)構(gòu)可以幫助用戶以非線型的方式在同一個層面中瀏覽原本屬于不同層面的信息。

要查看更多的主類以及它們對應的子類列表,用戶只需執(zhí)行縱向滾屏操作。當主類列表接觸到屏幕的上邊緣時,排在最前面的幾個主類條目就會自動收起,以便為后面的留出顯示空間。在這個過程中,用戶不需要進行任何控制,縱向滾屏這個操作本身就會觸發(fā)這種類似手風琴風箱折疊一樣的效果。

要查看某個子類當中所包含的內(nèi)容對象也是很容易的。當用戶在默認視圖中選擇了某個子類時,界面會過渡成為一個新的網(wǎng)格內(nèi)容模型,這個模型即可以像默認視圖那樣對內(nèi)容進行分類呈現(xiàn),同時也支持沒有文字標簽的單列網(wǎng)格單元(見圖 6-19)。要查看某個內(nèi)容對象,用戶只需要點擊橫向列表當中的某個單元格,內(nèi)容對象就會擴展至全屏。

1FR96313-8

圖 6-19 子類列表視圖。在橫向的內(nèi)容對象列表當中點擊某個單元格,內(nèi)容對象就會擴展至全屏。

在這個模型當中,我們可以將用于回退的導航控制元素放在界面頂部。這個控制元素既可以是一個簡單的返回按鈕,也可以是相對復雜的類似面包屑的形式。最重要的是,相比于之前的幾個模型,這次我們終于能夠以一種比較合理的方式來實現(xiàn)導航控制機制了。

可以說,這是到目前為止我們能夠找到的最佳解決方案了。你可以將這套方案落實在交互文檔當中,并直接通過這個文檔向X公司的相關決策人員及團隊做以講解,引導他們站在用戶的角度去理解這款模型的出色之處。從這個交互模型當中,他們也能很直觀地體會到這款應用與競爭對手的產(chǎn)品相比所具有的創(chuàng)新性。你完全不用花費時間去打造線框原型、視覺稿或是高保真原型來完成這項工作

對交互模型的創(chuàng)建過程進行了完整的了解之后,你還可以沿用在這個案例當中學到的方法,繼續(xù)通過其他產(chǎn)品概念進行練習和嘗試,看看能否從中得到一些新的感悟。

總結(jié)

令人驚嘆的設計要素

“令人驚嘆”的設計要素是指那些給用戶帶來的體驗感受可以達到其心中某個“情感閥值”的產(chǎn)品表現(xiàn)層元素。要使應用產(chǎn)品達到令人驚嘆的效果,你必須讓用戶對于設計方案產(chǎn)生某種特別的反應。以下三個方面的因素將決定著產(chǎn)品帶來的體驗感受能否跨越用戶心中的“情感閥值”:

  • 符合直覺:設計方案必須能夠引導用戶做出最符合直覺的反應行為。
  • 差異化創(chuàng)新特征:設計方案中要有明顯的創(chuàng)新特征,至少要讓用戶感受到某些不同尋常的產(chǎn)品體驗。
  • 積極響應:設計方案本身要能以積極的姿態(tài)去緩解那些由于差異化所導致的與用戶預期或舊有習慣不符的陌生感。

而“令人驚嘆”的體驗效應以及上述三點推動因素又會受到設計方案自身所具有的一些屬性的影響:

  • 界面外觀:也就是設計方案所呈現(xiàn)出來的界面布局結(jié)構(gòu)、渲染方式以及所有相關的靜態(tài)視覺組成元素。
  • 交互方式:包括人機物理交互、手勢以及其他常規(guī)的用戶界面輸入方式。
  • 視覺交互效果:包括那些能夠為設計方案賦予生機的動態(tài)的界面元素及視覺效果。這些交互效果通常與某些特定的響應行為相關,對設計方案的整體質(zhì)量也會起到重要的影響作用,甚至包括那些與交互行為沒有直接關聯(lián)的臨時狀態(tài)。

如果我們能夠在這其中的某一方面做到出類拔萃,那么產(chǎn)品體驗就完全有可能達到令人驚嘆的程度。當然,這種做法是相當有風險的,要更加有效地提升產(chǎn)品整體的感知效應,這三個方面的良好表現(xiàn)是缺一不可的。

交互模型

通過構(gòu)建交互模型,我們可以對產(chǎn)品的基本交互方式及視覺交互效果進行規(guī)劃。構(gòu)建交互模型的過程通常包括四個步驟,其中前三步是必要的前期工作,而最后一步則是建模工作本身。這四個步驟包括:

  • 確定需求
  • 定義需求用例與測試腳本
  • 規(guī)劃產(chǎn)品工作流
  • 構(gòu)建交互模型

在打造具有高度差異化的交互模型的過程中,我們會遇到很多挑戰(zhàn)。有一些基本的設計思路和方法可以幫助我們將這項工作進行的更加卓有成效:

  • 抽象:試著將用戶界面當中的交互對象抽象成為基礎的邏輯形態(tài),拋開表現(xiàn)層的干擾,對其本質(zhì)進行思考。
  • 改造與重組:以交互對象的基礎邏輯形態(tài)作為組件來構(gòu)造交互模式。結(jié)合產(chǎn)品的實際需求,在必要的時候?qū)换ソM件進行合理的改造和重組。
  • 可行性驗證:將這些交互模式放到已經(jīng)規(guī)劃好的工作流當中檢驗其可行性。
  • 解決方案:通過以空間、時間或狀態(tài)變化等概念為主導的方案來解決交互模型當中的問題。
  • 擴展:提升交互模型的普遍適用性,使其能夠運用到產(chǎn)品當中的其他功能領域。
  • 記錄:詳細記錄下自己在交互模型構(gòu)建工作當中的各種感受和想法。
  • 文檔化:通過可視化的文檔對交互模型進行直觀的描述。
更多精彩內(nèi)容,請關注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發(fā)揮!