移動可用性測試?分享一個你絕對不知道的新招(附教程)

舒舟:在移動設備上進行可用性測試是大多用戶體驗設計團隊既關注又頭疼的部分,市面上的各種專業測試工具各有利弊,如何抉擇是一道難題。性能好、對用戶干擾少、錄制質量高、能記錄用戶面部表情和手部操作、價格便宜等要素成為大家在選擇工具與方法時重點關心的內容。本文作者Colman Walsh提供了一種討巧的方式,能較好的解決測試中大部分問題。盡管不完美(無法記錄用戶與移動設備屏幕互動),依舊值得一試,有精力的同學可以結合Lookback(https://lookback.io),或許能搗鼓出一套更完善的解決方案來。

移動端令人難以置信的增長趨勢和移動設備的全面普及,讓用戶體驗設計師的工作更具挑戰性與趣味性。這意味著移動應用與移動站點的用戶測試成為用戶體驗工具中的重要一環。

與桌面環境有所區別的是,移動端可用性測試缺少像Silverback或Camtasia這樣開箱即用的軟件記錄工具。

即使不開發一款移動應用,你的網站大部分流量也可能來自于移動設備。執行常規的移動可用性測試,便成為衡量該渠道是否正常工作的唯一途徑。

此時需要一定的動手能力,經過多年實驗,我們認為已經找到了最理想的手段。如果你想簡單測試iPhone 或Android 的體驗,這套方法不僅簡單,性價比高,而且效果出色。

舊法:線纜加膠帶

過去我們使用“雪橇”將智能手機與攝像頭固定在某個位置,從而方便我們記錄用戶在屏幕上的行為。(要制作一個雪橇,我們在五金店買了一些丙烯酸通過烤面包機將其彎曲成型,非常有趣)

我們將攝像頭用膠帶粘貼在雪橇上,并且把手機用膠帶和尼龍搭扣裝好。回頭看來,這種做法還是很簡陋的。用戶不得不經常用兩只手托穩手機以保持雪橇穩定,當然也談不上自然體驗。

移動可用性測試?分享一個你絕對不知道的新招(附教程)

圖1. 用戶正在使用綁著攝像頭與雪橇的手機

從技術上說它是不可靠的。由于使用了一臺筆記本的雙攝像頭(雪橇上的攝像頭和筆記本內置攝像頭),我們不得不同時開啟兩個攝像應用,這導致了一定性能問題。要么在設置中造成內存緊張,要么在測試中攝像頭熄滅,往往兩者兼而有之。

還有其它一系列問題,比如屏幕炫光和攝像頭失焦。總得說來,設置測試環境非常耗時,而且性能不可靠,測試環境并非最優。尤其是客戶在身邊時,壓力尤其大,但這也是那時我們能做到最好的情況。

新招(當然更好):無線

理想情況下,用戶應該無法看到測試環境與軟件。我們希望創造盡可能自然的測試環境,只有用戶與智能手機,沒有線纜、雪橇、攝像頭或膠帶等干擾。

對于用戶體驗團隊來說,在用戶測試中不斷學習和洞察才是關鍵。我們不希望一直為設置測試環境或者攝像頭熄滅而費心。

我希望通過介紹一個簡單的設置來達成這些目標,它幫助用戶體驗團隊專注于真正重要的事情,讓用戶專注于他們的手機。因為它非常可靠,所以我們經常在培訓課程中面對客戶使用。

接下來重點談智能手機的可用性測試,我們使用一臺MacBook作為記錄設備。當然,這種方法也適用于Windows PC。

移動可用性測試?分享一個你絕對不知道的新招(附教程)

圖2. 無線測試的方式更加自然

第一步:安裝軟件

產生神奇效果的關鍵在于Apple的AirPlay無線技術,該軟件能讓你把流媒體(音樂、視頻)通過無線的方式傳送到Apple TV上。

因此,首先你需要購買并安裝一個叫做Reflector(大概15刀)的軟件,它能將筆記本變成一個AirPlay信號接收器,像Apple TV一樣。這樣一來,我們能夠把用戶智能手機屏幕以鏡像的方式投射到筆記本電腦上,用戶屏幕上的內容將在筆記本屏幕上同步出現。

現在我們可以不需要額外攝像頭來錄制用戶屏幕了,只需要在筆記本電腦上通過屏幕錄制軟件進行錄制即可。強烈推薦ScreenFlow(大概99刀),不但可靠性高,并且在測試環節中能通過筆記本電腦攝像頭捕獲用戶面部內容,這是任何可用性測試的重要組成部分。

第二步:設置顯示器

這一步是可選的。因為我傾向于使用外接顯示器,使主持人和記錄員不必同時瞥過用戶肩膀來觀察行為。這樣也能將用戶干擾降至最低,用戶不會看見面前筆記本電腦屏幕上的巨大手機屏幕投射,它會出現在外接顯示器上。

所以,為你的MacBook連上外部顯示器,如果外接顯示器與筆記本屏幕顯示一致內容,意味著這不是我們希望設置的鏡像模式。打開“系統偏好-顯示”,將“鏡像顯示”去掉勾選。

移動可用性測試?分享一個你絕對不知道的新招(附教程)

圖3. Mac的正確顯示設置

第三步:設置Reflector

要將智能手機內容發送到筆記本電腦屏幕上,只需打開Reflector,在筆記本電腦屏幕左上角的工具欄上可以看到它的圖標。

移動可用性測試?分享一個你絕對不知道的新招(附教程)

圖4. Reflector打開后你將看到的圖標

第四步:對智能手機進行鏡像

現在就是見證奇跡的時刻!如果你使用的是iPhone,從屏幕底部上劃,啟動AirPlay。然后從列表中選擇你的MacBook,再打開鏡像按鈕。

移動可用性測試?分享一個你絕對不知道的新招(附教程)

圖5. 在你的iPhone上打開鏡像

你的iPhone應該出現在外接顯示器的中間,是不是很神奇!(要是iPhone出現在MacBook屏幕中,只要把它拖拽到外接顯示器上即可)

使用Android 4.4.2或更高版本設備的,從屏幕頂部向下劃動進入設置,選擇“投射屏幕”選項,然后選擇你的MacBook。

注意:你的智能手機和MacBook必須保持在同一Wi-Fi網絡中,要是出現問題,這是故障排除首先進行的事情。

第五步:設置ScreenFlow

開始錄制前,打開ScreenFlow。初始設置對話框彈出,你需要做如下設置:

移動可用性測試?分享一個你絕對不知道的新招(附教程)

圖6. 設置ScreenFlow

1、“錄制桌面來源”

選中并確保從下拉菜單中選擇你的外接顯示器。(參照示例中的2270W)

2、“錄制視頻來源”

選中并確保選擇默認選項“FaceTime高清攝像頭(內置)”。

3、“錄制音頻來源”

選中并選擇“內置麥克風”。

第六步:開始錄制測試內容

讓用戶處于MacBook正前方,這樣你能在ScreenFlow的預覽中看到他們的面部。然后按下紅色錄制按鈕,搞定,現在已經開始錄制了。

當你與記錄員在外接顯示器上觀察用戶行為時,用戶正端坐在空白的筆記本電腦前,像往常一樣使用手機,沒有線纜、膠帶、攝像頭或者其它干擾。

在以下截圖中,我在iPhone上把玩Spotify。你能看到,在錄制手機屏幕的同時,ScreenFlow提供了畫中畫窗口來顯示用戶面部表情,完美的可用性測試。

移動可用性測試?分享一個你絕對不知道的新招(附教程)

圖7. ScreenFlow輸出錄制內容的截圖

當然,這種方式依舊不能展示用戶的手指與設備互動的過程。但總體說來,它的優點還是很多(見結論中的列表),算是一個無可非議的好方法。

設置總覽

需要明確的是,讓我們回顧下設置的全貌。用戶應該坐在MacBook面前,使用自己的手機,主持人和記錄員應該坐在附近,通過外部顯示器觀察用戶行為。

移動可用性測試?分享一個你絕對不知道的新招(附教程)

圖8. 測試中房間與屏幕等設施的安放方式

使外接顯示器正面遠離用戶視線,否則大屏幕上的手機屏幕影像會干擾用戶的注意力。

結論

我們介紹的這種方法有諸多優點值得一試:

1、簡單

首次將所有環節調試完畢之后,接下來每次只需要花費5分鐘左右來設置。

2、可靠

它并不完美,但軟件崩潰和設置問題出現的幾率很低。然而,雪橇+攝像頭的方案出現問題則是意料之中的事。

3、性價比高

假如你使用MacBook,整個解決方案只需花費不到200刀。(與之對應,專業高端的可用性測試軟件Morae售價2000刀)

4、專業

高質量并專業的輸出,看上去不像是黑客技術。我們把錄制的內容與參與的客戶、高管們分享,效果很好。

5、靈活

這種方案適用于主流平臺:PC、Mac、Android和iOS。

6、方便

因為不需要任何膠帶或者尼龍搭扣,測試者還能使用自己的手機,這讓你的測試更加自然有效。

「優設2月份優秀教程合集」

地圖圖標教程:
《PS教程!手把手教你打造一個配色小清新的地圖圖標》

卡通動物肖像:
《AI教程!教你繪制六個扁平化風格的卡通小動物肖像》

卡通人物肖像:
《AI教程!教你繪制扁平化風格的卡通人物肖像(四人組合篇)》

原文地址:smashingmagazine
譯者:阿里巴巴1688事業部/無線交互/舒舟

移動可用性測試?分享一個你絕對不知道的新招(附教程)

【優設網 原創文章 投稿郵箱:2650232288@qq.com】

================關于優設網================
"優設網uisdc.com"是國內人氣最高的網頁設計師學習平臺,專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書:史上最全的設計師圖書導航:http://hao.uisdc.com/book/
設計微博:擁有粉絲量104萬的人氣微博@優秀網頁設計 ,歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航:全球頂尖設計網站推薦,設計師必備導航:http://hao.uisdc.com

收藏 1
點贊

復制本文鏈接 文章為作者獨立觀點不代表優設網立場,未經允許不得轉載。