山東網站建設

山東網站製作
當前位置: 首 頁 >> 新聞中心 >> 公司新聞

從交互維度量化用戶體驗

從交互維度量化用戶體驗

發布日期:2018-07-06 作者: 點擊:


Part – I 什麽是交互

狹義的交互(Interaction)定義交互主體必須是人本身,而客體可以是產品、環境、服務等等,且不論交互客體是什麽,隻要主體是人,人和客體去進行交互的時候,一定是人帶著心理預期施加一個行為。

然後客體會根據這個行為給與一個反饋(沒有反饋本質也是一個反饋),而人會根據這個反饋是否符合預期去進行心理修正。

如下圖所示,這就是我理解的最小交互模型:

當時我舉的例子是用翻頁器去控製ppt翻頁:

如上圖所示,拆解這一套交互行為:

當我點擊翻頁器的“下一頁”按鈕,我點擊行為附帶的心理預期是“PPT翻往下一頁”,然後我點擊的時候,遙控器塑膠按鈕給到我手指一個物理反饋,證明我按下的行為已經完成了,這是“輸出端(我的手)的交互與反饋”。

這時候遙控器接收到按鈕指令,把指令通過紅外線傳輸到USB接收器上,接收器把指令傳到PC端然後完成翻頁動作,再通過大屏幕傳到我的眼(輸入端)中,我就可以確認這一次交互反饋是符合預期的。

BTW這裏有一點想要補充:設備對設備(上圖中黑色箭頭),也屬於廣義的交互,隻不過現階段大家研究的交互設計都是狹義的,人為主體的交互。

在AG平台日用科技產品的早期,有兩個東西是無法跳過的,那就是按鍵手機和PC電腦。

他們幾乎是同步在發展的,而這兩個產品的交互行為基本上延續到了觸屏手機時代,所以為了弄明白觸屏手機的交互,這兩個產品是值得講一講的。

先看按鍵手機(就是AG平台小時候用的非智能手機):

在按鍵手機中,最讓用戶困惑的其實是按鍵和屏幕之間存在一個映射關係,而不同廠商缺乏一個統一的規範,各家映射規則不一樣。大家是否還記得當年的手機說明書那可以說是相當厚,因為說明書必須要給用戶建構一個心理模型。

比如上圖:點擊左上角和右上角那兩個“-”按鈕,其實一一對應的是屏幕左下角的“Goto”和右下角的“Names”。這個一一對應關係作為今天的用戶來看應該是很平常而且很易懂的,但是當年沒用過手機的人,需要花很長時間閱讀說明書,才能夠明白物理按鍵和屏幕上的映射關係,這就是觸屏手機很難用的地方,也是很反人性的地方。

因為作為用戶來說,心智上,AG平台當然希望所觸即所得。

再來看PC,作為和按鍵手機差不多一起出現的載體形式,人們操作PC端人是通過媒介(也就是鼠標+鍵盤)輸入的,其實本質上,也是AG平台通過鼠標在桌麵上滑動x-y區域,對應到電腦桌麵上指針的移動來創造屏幕中x-y的映射關係,然後鍵盤上幾十個鍵配合輸入完成操作。

大家發現了麽,上述的兩種設備其實本身就是在製造一種一一對應的映射關係去完成交互行為,這兩種載體從出身開始就還是需要很大交互成本的。

隨著科技的發展,觸屏感應技術推出了之後,印象中觸屏手機就是兩三年時間就摧枯拉朽的淘汰了按鍵手機,本質上是幹掉了一一對應的交互映射。

所按即所得:

觸屏手機出現之後,交互專家們不禁要問一個問題了:手和觸摸屏到底有多少種交互方式?

答案是有很多種:

越是高階越是隱藏的交互手勢越複雜,所謂的“交互成本”也越高,比如:錘子三指滑動換屏保那種,就是利用了高階交互便捷實現邊界功能。

那這麽看起來,ioses也好還是所有的安卓手機都好,從用戶端而言,就是組合交互手勢,讓信息更好的傳達而已。那麽同理,在App中也是一樣,如果AG平台了解了每一個交互行為的用戶心理預期,對設計工作而言就能做到有的放矢。

AG平台以“單擊”和“滑動”這兩個最簡單的交互行為舉例:所謂單擊手機屏幕,用戶其實最核心的是有兩個預期。

  • 第一是選中一個元素,比如:Radio組件。

  • 第二是邏輯上的Next,比如:點了一件衣服,應該Next到衣服的詳情,點了付款,應該出現付款流程,點了返回,應該back到上一路徑點等等。

劃動交互也是一樣的,用戶在一塊手機屏幕上單指劃劃劃,用戶內心的預期其實也不複雜,最核心的預期也就兩點:

  • 第一是查看屏幕外的線索(前提是設計師給用戶留下線索了或者是這個UI組件長得就是可以劃動的樣子);

  • 第二是查看相鄰標簽的內容,或者查看同一個標簽下的相鄰元素,比如:ioses的segment controlle組件就是典型例子。

當AG平台了解了這些之後,AG平台在實際的設計工作中,就可以根據上麵這些理論,來合理選擇UI組件去呈現對應的信息了。

Part – II 從交互維度合理選擇UI組件

AG平台在設計工作中,選擇UI組件,本質上就是選擇信息的呈現形式。每一個常見的UI界麵和UI組件,都一定也滿足上麵所說的最小交互模型。

在這裏我舉一些例子說明。

第一個例子:同樣的內容,選擇不同的UI組件呈現,給用戶呈現的是完全不同的產品結構。

大家看下麵這張圖:

這兩個UI模塊擺在大家麵前,大家應該能清晰的感受到,左邊是一個segment控製下麵內容的UI;而右邊是一個所有內容列表的集合頁,隻不過通過tab聚類了而已。

第一件事應該想到的是:如果需要采用右邊的排列形式,就必須要控製tag的字數。然後由於右邊的tag占據了推薦貼的位置,導致推薦貼可能沒有左邊的那種展現形式更加醒目。

但是相對的,圖右的優勢在於,由於豎向排列tag可以讓一個屏幕顯示更多的tag,可以讓用戶更方便的定位內容,比如:外賣產品之所以用右邊這種形式,是因為力求一屏展示更多的菜,而且外賣產品的左側tag一般是一家店鋪的菜的品類,用戶下滑菜品配合點擊品類,點完即走,很方便(京東和淘寶電商類平台也是類似的)。

但是,比如:今日頭條,新聞類客戶端隻能采用左邊的這種形式,因為新聞類客戶端是需要用戶長時間沉浸的,比如:用戶選中一個“體育”的tag之後,一般要沉浸的看好久好久,用戶需要沉浸在這個tag下的內容中,那這個時候顯然用右邊這種設計方式,讓tag常駐屏幕左側是不合適的。

再來看第二個例子,就是UI應該會隨著內容而進行調整和優化。

這裏舉一個唱吧的例子:唱吧從7. 0 到8. 6 之間做了三次改版,大家可以看到,唱吧團隊幾乎是損失了屏幕效率來加大了間隔和突出了歌名,這是為什麽呢?

這是因為頁麵承載的關鍵任務不同,大家對比著7. 0 時候和8. 6 時候的UI樣式,正好是今天快手和唱吧的對比。

大家會發現:其實這個頁麵,快手和唱吧承載的內容都是消費轉化,都希望用戶點擊進去消費內容,但是兩款產品做了截然不同的UI風格,原因是什麽呢?

快手在這個頁麵,其實承載的關鍵任務是:“迅速讓用戶找到感興趣的點”,它這麽設計的本質原因是因為它的截圖可以幫助用戶判斷內容本身。

比如:第一張圖是一個人在打高爾夫,右邊是一個工人,然後第二排左邊是一個遊戲的鏡頭,右邊是一個傳遞正能量,大家可以很方便的通過圖片識別裏麵的內容,用戶更沉浸更聚焦的去選自己喜歡的點擊進入消費就可以了。

但是唱吧的視頻截圖,其實是不能識別裏麵內容的,大家可以看到:第一張圖是一個妹子,第二場圖是一個妹子,第三張圖還是一個妹子,那用戶點擊進去的動力在哪兒了?

除了這個照片長相之外,更多的其實是文字決定的,是這個人唱的這首歌的歌曲名是不是我喜歡的,或者是這個演唱者的的歌手等級。

所以基於這種跟深層次的邏輯,唱吧和快手兩款產品的這個頁麵都是為了促進消費轉化,但是UI長相上完全不同。

AG平台看第三個例子:

同樣組件下,選擇不同的交互方式,也會使得效果完全不同,比如:現在有一個UI頁麵,主要由一個tab(ioses叫segment controlled)組件控製下麵的內容,樣子長這樣。

我先假定一個前提:這個app中的這個組件不支持橫劃,隻支持點擊切換。

好了,現在我假設這是一款已經穩定運營了一年的產品,為了說明問題,我假設一個理想數據:

假設每天有20W的uv訪問這個頁麵,其中分流情況是:

  • 10Wuv消費“推薦”下的內容;

  • 2Wuv消費“生活”下的內容;

  • 1Wuv消費“段子”下的內容;

  • 3Wuv消費“美女”下的內容;

  • 4Wuv消費“遊戲”下的內容。

這時候,為了優化交互行為,有一天決定把這個tab組件從不可橫向劃動改成可以劃動的(並且告訴用戶這裏可以滑動了喲~),然後給你一次機會重新排列這五個tab順序,你會怎麽做呢?

最簡單的辦法當然是把五個tab按照用戶消費意願逐一排列,即:“推薦、遊戲、美女、生活、段子”。

這樣排列當然沒有任何問題,但是還有沒有更優解呢?

我給出的解決辦法是這樣的,大家評判一下:

按照用戶的消費量,“遊戲”是消費量第二的一個tab,毫無疑問我會把它排在第二項,這樣可以刺激用戶劃動行為,然後“美女”是消費量第三的,我會把他放在第四位。

這時候我會把“段子”和“生活”這兩個消費率最低的tab,分AB test做兩個版本,放在第三和第五位拿去測,以判斷之前的“段子”和“生活”是由於自身內容不夠優質,還是之前交互成本太低導致的數據較差。

最後AG平台來看第四個例子:

一個app,他的UI張如下圖所示的這個樣子:

現在假設在運營和市場團隊不做任何努力的情況下,單從產品交互的角度,能不能優化上麵這個版塊的點擊率?

首先AG平台來分析一下頁麵架構:

如果AG平台認為,不管是點擊右上角的“>”,還是點擊留個圓形入口都算完成轉化的話,AG平台現在的這個紅色的UI組件,入口位置一共有 7 個。根據長尾理論,如果AG平台把這個圓形入口從 6 個擴展到比如九個,是不是一定對轉化率有正向影響?

答案並不一定。

為什麽呢?

因為主要是這樣的改動會帶來一個未知的泳道橫劃交互,它會產生一定的影響,如下圖所示:用戶看到這個泳道之後可能出現三種行為。

  1. “用戶完全不滑動”——那入口就從 7 個變成了7. 5 個,別的沒有變量影響。

  2. “用戶滑動看完了之後,點擊某一個或者左上角的“>”進入”——這是AG平台想要的轉化。

  3. “用戶滑動看了這些圓形入口之後鬆手,就是不點擊進去”——這是AG平台不願意看到的結果。

想到這裏,那為什麽AG平台不能讓用戶直接滑動之後鬆手就跳轉呢?

想到這裏,所以優化方案如下圖所示,給與用戶一個x軸區間,滑動手勢操過那個區間則告訴用戶你現在鬆手默認跳轉,用戶不願意跳轉也可以回劃,隻要不足這個x區間就給與用戶自主選擇的機會。

我之前在上家工作的時候,AG平台把 6 個圓形入口變成了 10 個,然後用這個“鬆手跳轉”的交互把單元模塊的穿透率從21%提升到了31%,這是一個實戰當中的真實例子。

當然了,請大家再思考這樣的一個問題:

一個頁麵的流量就這麽大,一個地方漲了11%,那勢必別的地方就會相應的損失11%。一般情況下,app首頁承擔著80%以上的分流工作。根據流量漏鬥來看的話,每一次引流都會導致其他模塊的數據下降。

所以,設計師們應該要根據運營策略和公司大的產品OKR,來合理選用合適的交互組件,以達到想要的目的,還是那句話:

“小孩兒才分對錯,大人隻看利弊。”

Part – III 從交互的維度量化用戶體驗

移動互聯網產品設計中,尤其是在中國的app產品,有兩大分歧陣營:“扁平”陣營和“簡潔”陣營。

“扁平”陣營表示了,AG平台需要產品足夠扁平,最好就是三次交互可以觸達所有app界麵。

“簡潔”陣營也表示了,AG平台需要頁麵信息足夠簡潔,最好一個頁麵隻完成一個核心任務。

雙發你來我往,誰也說服不了誰,如下圖所示:

“簡潔”陣營反駁“扁平”陣營說:你們一點都不遵守席客定律,層級扁平是扁平了,但是相應的頁麵信息變得越來越多,給用戶呈現的幹擾就越來越多,用戶做出決定的時間也越來越多,所以你們“扁平黨”都是辣雞。

這時候“扁平”陣營也找到了反駁的論點,他們說你看你頁麵足夠簡潔了,但是頁麵層級就很深啊,交互成本這麽高,每一次都伴隨流失,可用性這麽差,你們還有理了?所以“簡潔黨”你們才是辣雞!

中國的互聯網產品,很難做到既簡潔又扁平,這個問題的根源在於永遠有那麽多信息需要呈現,永遠有那麽多功能需要添加,這個是中國的激烈市場競爭導致的,並不是說中國的產品就不如國外的好(我的哥哥之前在Facebook現在Airbnb工作,他經常感歎道國外的互聯網產品到中國來真的都得死…)。

我想要討論的是,麵對中國現在互聯網產品市場現狀, 如果一款產品非要你站隊上麵兩派陣營,你會選哪一派?

我現在的選擇是“扁平黨”,因為用戶麵臨一款眼花繚亂的app,如果是經常使用,缺功能布局信息架構很少改動的前提下,早晚也會習慣和適應的,但是如果一些核心的東西不能第一時間暴露在用戶眼中,很有可能用戶就不知道你有這種功能。

這個就是為什麽AG平台設計經常會說這個產品經理傻逼吧,怎麽什麽東西都想展現出來,這一堆東西找個入口集合收起來,頁麵多幹淨多清爽多好看呀~~

我早年間也是和諸位一樣的觀點,但是現在我越來越覺得,界麵清爽了,你的大功能feature因為設計隱藏沒有被發現,不是設計開發測試都白做了麽,說好的ROI在哪裏?

AG平台大家都是互聯網從業者,不管看到這篇文章的你是一位設計、產品、還是開發、測試、運營人員,AG平台都明白用戶體驗這個詞是由N多維度綜合而成的一個過程性評價,它和方方麵麵都有關係。

那既然是這麽專業且牽連甚廣的一個名詞,AG平台真的就沒有辦法去量化評價它了嗎?

永遠不要忘記,用戶體驗是個過程,而AG平台每個人也都是用戶本身。在這裏我提供一種普通用戶維度的比較好用的用戶體驗評估方法是“窮舉分析用戶行為路徑”。

比如:你是一款外賣產品的設計師,那麽用戶在不同產品模塊下,定一個外賣的流程路徑大概有多少種,都窮舉出來。

比如:你是一款在線演唱類的產品設計師,那麽用戶在產品中完成一首歌需要的用戶路徑到底有多少條,窮舉所有路徑之後一一優化,讓路徑變得更加扁平,或許是一個最“笨”但是有效的方案,怎麽優化呢?

用淘寶消息頁舉個例子:

淘寶消息頁上麵有“交易物流”、“通知”、“互動”三個tab,這時候AG平台假設一個用戶三個按鈕下麵都有消息,用戶想要看完這三個消息大概需要幾次交互?

答案是至少 6 次:“點擊第一個進去 – 返回 – 點擊第二個進去 – 返回 – 點擊第三個進去 – 返回”,這樣的交互顯得呆板且冗長,淘寶團隊巧妙的把三個內頁集合成一個頁麵的三個tab形式,大大縮短的交互成本,這就是所謂的“把用戶路徑變得更扁平”。



本文網址:http://www.heimayibanjia.com/news/490.html

關鍵詞:山東營銷型網站建設,濟南營銷型網站建設,營銷型網站製作

最近瀏覽:

  • 在線客服
  • 聯係電話
    18615652552
  • 在線留言
  • 關注AG平台
  • 在線谘詢
    歡迎給AG平台留言
    請在此輸入留言內容,AG平台會盡快與您聯係。
    姓名
    聯係人
    電話
    座機/手機號碼
    郵箱
    郵箱
    地址
    地址