简单易用的APP可用性测试指南

-回复 -浏览
楼主 2020-04-01 19:19:09
举报 只看此人 收藏本贴 楼主


本文由设计夹设计研究小组成员高源辰翻译校对


手机和移动设备增长速度令人难以置信,这使得UX设计师的工作更具挑战性并且更加具有趣味性。这也意味着用户测试成为了APP和网站UX设计工具的重要组成部分。


与桌面型环境有所不同的是,没有类似Silverback(译者注:Silverback是一款进行可用性测试的软件,可以记录测试者的表情和声音)或Camtasia这类开箱即用的软件是专门设计用来记录移动设备可用性测试的。


即使你没有开发移动应用程序,网站的大部分流量也可能来自于移动设备。进行常规的移动可用性测试是衡量该渠道是否为客户正常工作的唯一途径。


需要一点的技术。 经过多年的实验,我们认为已经找到了可以为我所用的最好的技术。 如果你想测试iPhone或安卓UX设计, 这个解决方案是简单,成本效益并且高品质的。


旧方法:电线和胶带缠绕的时代

在过去,我们用一个“支架”将智能手机和相机安装到一个位置,在这里我们可以记录用户在屏幕上做什么。(为了建造支架,我们在五金店买了一些丙烯酸,用烤箱加热并把它弯成需要的形状。)


我们用胶带将摄像头粘在支架上,给手机缠上胶带和尼龙扣。现在看起来,该设备是相当粗糙的。 这对于用户不是一个自然过程中的体验,谁日常生活中会用两只手轻轻捧着手机以保持支架平稳呢。



 一个正在使用绑着摄像头的智能手机的用户

从技术上讲,这是不可靠的。因为我们在一台笔记本上使用了2个摄像机(在支架上的照相机和笔记本电脑的内置摄像头),并且我们必须同时打开两个摄像应用。这导致性能不佳。有时设置它时大家很有压力,有时测试中突然死机,通常这两种情况同时发生。

还有其他问题,例如屏幕眩光和相机对焦。总之,它设置起来很耗时,性能不可靠并且测试环境不理想。如果客户在周围这一过程就格外有压力,但这是那时已知的最好的解决方案。

一种更好的方式:无线技术

理想情况下,测试设备和软件应该是用户看不见的。我们希望环境尽可能的自然,只有用户与他们的智能手机——没有电线,支架、相机或胶带。


对于UX团队而言,应该把重点放在学习和观察上。我们不想为设置苦恼或担心停电。

我想给你介绍一个简单的设置来实现所有以上目标。它使用户体验团队专注于真正重要的事情,并让用户把注意力放在他们的手机上。它很可靠,所以我们经常在客户面前和培训班里使用它。


我们将重点放在测试智能手机的可用性,使用了一台MacBook作为记录装置。但这一方法也可以在PC上工作。


无线化的测试更自然

步骤1:安装软件

这种设置的神奇之处是苹果AirPlay的无线技术。这个软件可以把你的音乐或视频无线传输到Apple TV上。

所以,你需要购买(15美元)并安装一个叫做Reflector195的软件,它把你的电脑变成一个AirPlay接收器,就像一台 Apple TV一样。这允许我们将用户的智能手机屏幕镜像到笔记本电脑上:用户的智能手机上发生的一切也将在笔记本电脑上看到。

现在我们有了一个不需要一个外部摄像头来记录用户智能手机屏幕的场景。 我们只是需要一个屏幕捕捉软件在笔记本电脑上记录智能手机上的交互场景。我个人最喜欢的是ScreenFlow206 (99美元),原因如下:它很可靠,实验期间它使用了笔记本电脑的摄像头来记录用户面容,这是任何可用性测试的重要组成部分。


步骤2:设置监视器

这一步是可选的,但我喜欢使用一个外接显示器,这样负责人和记录员不用陪伴着用户就可以知道他们的行为。由于这一过程将在监视器进行上,所以也减少了对用户的干扰,他们不会看到智能手机屏幕在笔记本电脑上呈现的放大版。

因此,应该将您的MacBook显示器与监视器连接起来。如果监视器和笔记本电脑显示的完全相同,这意味着这是一个镜像,这是我们不希望看到的。打开“系统偏好”,选择“显示”选项,确保“镜像显示”框是未选中的。


Mac上的正确的显示设置

步骤3:设置Reflector

要开始向笔记本电脑传输智能手机的图像了,首先打开你的电脑上的Reflector。你就会看到在屏幕左上角工具栏的 Reflector图标。


打开Reflector时你会看到这个图标

步骤4:镜像你的智能手机

下面就是见证奇迹的时刻。如果你使用的是iPhone,上滑并启用AirPlay。然后从列表中选中你的 MacBook(在这一例子中是“Colman的MacBook Pro”)。最后,单击“镜像”转为打开状态(变成绿色)。


打开镜像你的iPhone

你的iPhone屏幕现在应该出现在了你的外接监视器正中间。好神奇!(如果iPhone出现在您 MacBook的屏幕上,只用把它拖到外接监视器上。)

对于装有Android 4.4.2以上系统的移动设备,从屏幕顶部向下滑动进入设置。选择“投射屏幕”选项,然后选择你的MacBook。

注意:你的智能手机和 MacBook需要在同一Wi-Fi网络下完成这些工作。这是你出了问题故障排除时第一件要确认的事。

步骤5:设置screenflow

开始记录,打开ScreenFlow;新记录的配置对话框将会出现。你需要调整以下三个设置:

设置ScreenFlow

· “录制桌面来源”
选中“录制桌面来源”并选择下拉菜单中的外接显示器(下图中的“2270w”)。

· “录制视频来源”
选中“录制视频”并选择“FaceTime HD摄像头(内置),“这是默认的选项。

· “录制音频来源”
选中“录制音频来源”并选择“内置麦克风”。


步骤6:开始记录这次测试

将用户直接带到MacBook前。此时你应该可以在 ScreenFlow预览中看到他们的脸。然后,按下红色记录按钮。你现在就已经在录制了。

你和记录员在监视器前观察用户行为,他们端坐在一片空白的电脑前,像平时一样使用智能手机——没有电线,管道胶带、相机或托架。

在下面的截图中,你可以看到我在iPhone上玩Spotify。你可以看到我同时捕捉智能手机屏幕的画面,ScreenFlow还提供了画中画模式显示用户图像,完美匹配可用性测试。


一张screenflow录制输出截图

当然,这一记录不会显示用户的手指与设备的交互。但这项技术总的来说还是好处多多(见下面的列表),这种利弊权衡是合理的。

设置概述

让我们回顾一下现场应该是什么样子。用户应该坐在电脑前使用他们手中的智能手机。负责人和记录员(如果有的话)应该坐在附近看外部监控。


如何安排测试的空间和屏幕

保持显示器远离用户。在大屏幕上看到他们的智能手机会使他们分心。

结论

这种方法有很多优点值得一提:

· 简单
你把设备连接好测试过一次后,下次再使用大约只需要五分钟的时间。

· 可靠
它不完美,但很少出现崩溃和设置问题。支架相机的方法中,这些问题时有发生。

· 成本低
如果你有MacBook的话这一解决方案的造价少于200美元。(相比之下, Morae,这种高端的可用性测试软件,售价为2000美元。)

· 专业
输出的视频是高品质的并且很专业。看起来不那么复杂。我们可以与客户,管理人员,和任何人分享我们的记录视频。

· 灵活
该解决方案主要适用的平台:PC、Mac、iOS和Android。

· 方便
最终,由于你不需要任何胶带或尼龙扣,试验参与者可以使用自己的手机。这使得你的测试更自然、更有效。


更多资源

· Reflector195
用于把你的电脑变成一个AirPlay接收器。有Mac版和PC版。

· ScreenFlow206
用于在你的Mac上录制屏幕和使用画中画功能。

· Camtasia21
用于在你的PC上录制屏幕和使用画中画功能。

· “Quick Tip: Make Your Own iPhone Usability Testing Sled for £522,” Harry Brignull
原博客文章。


-下面是社群介绍,了解一下,以便我们更好的交流-



是全球设计师分享、互助、成长的知识社群

是全球设计师的思想交流阵地

我们的宗旨是传播有格、有用、有趣

实战型接地气干货,倡导跨界的设计交流

建立“大设计”的交流平台


小伙伴们注意啦~

设计夹长期招募讲师

如果你想塑造自己的行业影响力

那就过来亮剑吧~!

加入设计夹讲师大军,请

用力戳死下面的二维码:

对~用力哦!


打开阅读原文访问

让你丑哭的设计夹网站

更多书籍和软件等各位看官免费下载

「设计夹往期回顾和参加社群实战分享点击进入」



我要推荐
转发到