交互

2018年移动端app设计的六个实践性指南

4135

移动APP的开发变得越来越主流，APP能为用户提供更直接的内容和服务。所以很多公司都想开发自己的APP获取用户。

但是，根据“财富”杂志的报道，超过75%的用户第一次打开APP后就再也不打开了。用户希望从APP获得更好快速的内容，更好的操作和更好的体验。所以，我们开发的APP应该适应使用的环境，做到尽可能的易用，让用户有更好的体验。

那么，如何才能成为良好的用户体验呢？25学堂跟大家一起来探讨移动端app设计的六个指南。

一、最小化认知负荷

让用户第一次接触到app时的交互（例如认知负荷）困扰越小，app能够保留在用户手机里的机会就越大。

1、优化用户流程

优化流程首先要了解用户是如何与app进行交互的。作为设计人员和开发人员，我们应该在整个用户流程的背景下理解用户的目标。这些知识将帮助我们确定任务完成期间最常见的摩擦点。

这里有几个实用的优化用户流程的方法：

a、将大任务分成若干个子任务。如果任务包含用户方所需的大量步骤和操作，则最好将此任务划分为多个子任务。电子商务APP中的渐进式结帐流程就是一个很好的例子。您可以将结帐过程分为多个步骤，每个步骤都需要用户操作。

b、使用可以获取到的用户信息。您可能已经有很多关于用户的信息 - 那请正确使用此信息。我们来举打车软件“优步”的例子。优步不会询问用户的位置，优步会根据地理位置数据自动读取当前用户的位置。此时，用户只需要选择目的地就可以了。

c、自然的展示下一个操作内容。当任务需要用户完成若干步骤时，通过清楚地显示下一步的情况，可以让用户操作时心中有数，不会厌烦，然后顺利完成剩下的任务。

d、标示每个页面的最主要操作按钮。按照这个简单的原则，您可以让界面更易于学习和使用。使用视觉上的突出展示来优先考虑重要元素（例如主要号召性用语按钮的高对比颜色）。

2、去掉干扰

良好的用户界面设计主要是能够提供相关信息并避免不相关的干扰信息。

页面上每增加一个按钮，图像，图标都会使页面变得更加复杂和难以理解。电脑上的干扰已经够烦人了，而在移动设备上，因为屏幕更小，所以没有足够的空间放置很多信息，一切从简。

提示：如果要减少某一用户流程页面上的干扰 - 那么只需要显示流程当前步骤中需要的内容。例如，当用户做出选择时，显示足够的信息帮助他们进行选择，然后在下一个页面上显示更多选择内容。

3、让导航出现在显眼的地方

所有酷炫的功能和引人入胜的内容如果不被人找到，那么这些功能或内容是没有意义的。

以下是一些关于导航的规则：

a，不要隐藏导航。避免隐藏导航，如手势驱动，因为大多数用户很难找到它。

b，一致的导航。开发人员经常在单个页面上隐藏菜单，不要这样设计，因为它可能让你的用户混淆和迷失。

c，标示当前位置。未能指出当前位置是许多APP的常见问题。回答用户“我在哪里？”是好的导航最基本的内容之一。

提示：最好使用标准规范的导航模式 - 比如标签栏（适用于iOS）和导航抽屉（适用于Android）。大多数用户都熟悉这两种导航模式。

二、优化媒介的交互

手机不是台式机的小版本 - 它们有自己的细微差别和限制。

1、元素应该设计的显而易见

移动用户界面的设计需要清楚地表达哪些元素是可互动的，哪些元素是静态的。

与桌面不同的是，用户可以使用悬停效果来了解某些内容是否具有互动性，但移动用户只能通过点击某个元素来检查交互性。用户应该只要看到某个元素就能够正确预测界面元素的行为方式。

2、为手指操作的友好设计

当您在移动界面中设计可操作的元素时，制定足够大的目标非常重要，以便用户轻松点按。作为一个经验法则，控件的触摸面积至少为7-10毫米时，用户才可以用手指准确敲击。这种尺寸的控件使用户触摸它时，边缘仍然可见，用户将能够了解他们是否准确地击中目标。

此外，请确保两个元素之间的位置不要太接近 - 控件之间应有适当的间距以防止错误输入。

3、考虑拇指的操作区域

为操作的大拇指设计不仅考虑被点击的目标足够大，还要考虑我们握设备时的方式。

尽管拇指可以操作大部分屏幕，但只有三分之一的屏幕是真正毫不费力的可操作区域。这个区域被称为自然拇指区。其他区域需要伸展手指，甚至需要改变握移动设备的方式才能够着。根据手部位置（左侧，右侧或重叠部分），我们可以看到移动设备的安全区如下图中的绿色区域。

屏幕越大，越难操作。

在为手机设计时考虑所有不同的区域：

绿色区域是导航选项或频繁交互操作的最佳区域（如CTA（号召性用语按钮））。

红色区域是潜在危险选项的最佳位置（如删除或擦除）。用户不太可能意外触发此选项。

4、中断设计

我们生活在一个经常被打断的世界。有些东西总是试图分散我们的注意力，并将我们的注意力引向别处。

例如，用户可能在等待火车时使用您的app。设计移动思维至关重要。让用户在中断后返回时更容易重新与应用进行互动。

Twitter是中断设计的一个很好的例子。APP的通知屏幕显示所有最近的通知。只要用户停留在此屏幕上，应用程序不会自动更新列表 - 它只是在列表顶部显示状态“X条新通知”。这允许用户在一段时间后重新与应用程序互动时不会失去目前的位置。

4、多屏幕体验

移动应用不是只存在移动互联网中。

例如，移动用户通常在移动设备上浏览电子商务网站，然后切换到桌面进行购买。这种操作需要无缝切换。

Spotify是一个不错的案例。您可以在Mac上设置播放列表，并立即在iPhone上使用。当您在设备之间切换时，Spotify会记住您停止的位置。

5、直观的手势操作

使用您的应用所在类别中最适合该应用的手势操作。

为什么？因为手势是隐藏的控件。

正如Thomas Joos 在他的文章“超越按钮：拥抱手势驱动界面”中指出的那样，在用户界面中使用手势的最大缺点是学习曲线。每次用手势替换可见控件时，应用程序的学习曲线都会上升。发生这种情况是因为手势具有较低的可发现性 - 它们总是隐藏起来的，人们需要先能够识别这些选项。这就是为什么使用已被广泛接受的手势至关重要。例如：用于Feed媒体流的应用程序的下拉刷新。