本文的原作者是SimpleSite的设计团队负责人，他结合多年PC端和移动端的经验，总结了7条适用于移动设备的设计原则并提供了一些相关的案例。无论你是为Web还是为APP设计，这些原则均适用，因此希望对你有所帮助。

原则1：追求极简主义

“完美不是没有什么可以添加的，而是没有什么可以去掉的。”
——安东尼·德·圣埃克苏佩里

将所有必要的UI元素放到智能手机屏幕上，同时又不造成界面混乱和用户负担过重，这可能是一件棘手的事情，因此当空间有限的时候，追求极简主义尤为重要。在为每个屏幕上的UI元素设定优先级时，你需要保持理智。如果在界面中添加过多的信息，试图为用户提供他们想要的一切，可能会导致用户不知所措。

深入了解移动用户的需求，他们最需要完成的任务是什么?你需要为它们提供哪些基本信息和功能? 根据一条简单的经验法则，在每个屏幕争取一个主要操作。在这里，比如过滤器，合理的默认值，巧妙的排序选项，易于访问的搜索功能以及逐步公开的解决方案就派上用场了。

一旦你确定了尽可能多的优先级，你可以通过增加留白、使用简单、优雅的字体和其他视觉设计最佳实践来达到更加简约的设计。极简设计可以改善网站或应用程序的视觉体验和速度。速度是体验的一部分，加载页面或某些内容花费的时间越长，体验就越差。

你和你的用户不可能做到面面俱到，所以要优先考虑速度以及可能添加的所有功能，内容和视觉效果等。

案例一：Instapaper

Instapaper应用程序上允许用户方便地保存文章以备以后阅读，并且该应用程序的主屏幕也是围绕此目的设计的，它显示了用户已保存文章的列表。

在其文章列表上方有一个搜索栏，在每个顶部都有一个菜单，该应用程序甚至没有最常见的页脚菜单。此外，该应用程序采用了干净的单色设计。

案例二：Behance

Behance是另一个可以学习的精美简约APP。该设计使用了大量的留白，并且每个屏幕都有清晰的焦点。

原则2：将最重要的元素放在靠近底部或中心的位置

史蒂文·霍伯（Steven Hoober）在移动用户行为和最佳实践方面做了很多有趣的研究。他的研究表明，当用户用一只手拿着手机时，将最重要的UI控件放在用户拇指可以触及的地方是很重要的，尽管他也证明了用户可以通过多种不同方式握持手机。

他还指出，如果让移动用户选择，他们更喜欢将内容垂直居中显示在屏幕上。阅读与内容互动似乎都是这种情况。

“我进行了一项研究，使用户可以将内容移动到屏幕上自然希望的位置。一旦将内容移动到屏幕中间，他们就会点击选择它。” —史蒂文·霍伯

在必要的情况下，可以考虑将（一些）最重要的内容居中显示在屏幕上，但是不要将页脚菜单设置为居中的图标和按钮。当可以选择时，移动用户更喜欢在屏幕中间阅读内容并与之交互。

案例一：Audible

有充分的理由证明，页脚菜单在各种不同的应用程序中都非常常见，除此之外，音频播放器还提供了一个将主控件放置在屏幕下半部分的例子，例如在播客应用、音乐播放器和有声读物应用程序中，主控件都是位于屏幕的下半部分。

案例二：Fitbit

可以说，Fitbit应用程序的主要功能是向用户提供信息。为了便于用户访问，这些信息集中在应用程序的主屏幕上。

原则3：减少文本输入

虽然从很多方面来说这都是一项令人惊叹的发明，但不可否认的是，使用触摸屏键盘进行长时间输入会很糟糕。由于按键太小，与笔记本电脑或外部键盘的机械运动相比，反馈效果较差。

与笔记本电脑或台式设备上的用户相比，你的移动用户与设计进行交互的时间通常更少，他们可能在旅途中或排队等候时想要分散片刻的注意力。

某些辅助程序可以将笔记本电脑或台式设备的优点带到移动设备中。如果你的用户在平板电脑上使用外接键盘，鼠标/或手写笔，则在这方面，他们更接近你的笔记本电脑和台式机用户。但是对于大部分用户来说，情况可能并非如此。

你的手机用户在使用你的网站或产品时，既没有意愿也没有时间输入大量文本。因此设计如下：

-自动填充任何可以自动填充的输入字段；

-当用户开始键入或输入搜索词时，提出明智的建议；

-让用户选择类别或以其他方式过滤选项；

使用日期选择器，而不是要求你的用户编写日期。

这些只是几个明显的例子，一旦你养成了问自己这个问题的习惯，可以通过减少用户输入次数来解决此任务，你也能发现更多的问题。

案例：Eventbrite

值得借鉴的是Eventbrite应用程序中的搜索功能。特别是在搜索基于时间的事件时，常规日期选择器实际上是智能默认列表中的最后一个选项：“随时”，“今天”，“明天”，“本周”和“本周末”。

原则4：增加点击目标的大小

笔记本电脑或台式电脑上的光标可以让用户点击屏幕上最小的目标，但是在触摸屏上点击目标要困难的多，不仅是因为你的指尖比鼠标的光标大且准确性不高，而且在你尝试点击它时，它会覆盖目标。

根据原则2，理想情况下，点击目标的大小取决于其在屏幕上的位置。但是，最大可能性的设计点击目标是不会出错的。

请遵循Apple和Android提供的指南，后者建议点击目标分别至少选择44 x 44dp和48 x 48dp（与设备无关的像素）。最明显的实现方法是增加UI控件的大小。此外，尝试在元素周围添加一些额外的留白，不仅可以降低误点击的风险，还可以创建更简约的界面。留白还可以使每个点击目标大于控件本身，这并应用于屏幕上的所有UI控件，且对于那些不易变大的小控件尤其重要。

你可能不希望在页脚菜单中增加可点击图标的大小，或对文本链接使用32点的字号。相反，只需增加元素本身周围不可见的点击目标区域的大小即可（或告诉你的开发同事这样做），在不影响其他UI元素的情况下使其尽可能大。

如果你遵循上面的建议，那么你设计的是为了预防错误而不是错误处理。但是，你永远不可能完全消除错误提示。考虑到这一点，请确保在错过目标时不会发生灾难性事件。

案例：Meetup

Meetup应用程序是值得学习的好例子之一，在查看Meetup小组时，屏幕中间有一个显眼的大按钮，用户可以轻松触摸并点击。

原则5：优先考虑易读性

无论设计平台是什么，易读性都是重要因素之一。在设计时应该始终遵循字体大小，行高，长格式文本的字体选择等方面的通用原则。

对于移动设备，最重要的建议是16pt的字体大小。如果使用比这个更小的字体，那么对于部分用户来说，可读性就会受到影响。不过，针对移动设备更有趣的挑战是，你的网站或应用程序可能会在户外使用。它将在路上、繁忙的街道上使用，并在阳光直射屏幕或用户眼睛的情况下使用。从可用性的角度来看，这并不是真正的“理想条件”。

如果你的目标是伟大的用户体验——而不仅仅是在一个灯火通明的房间里才能完美展示——你需要优先考虑易读性，而不是你自己的审美偏好。

案例：Medium

许多本机应用程序支持动态调整字体大小，以适应用户的设置。从设计完美的字体大小到确保你的应用程序支持动态字体，这将改变作为产品设计师的职责。如果你想从一个网站学习可读性优化设计，推荐访问Medium.com。

原则6：提供即时且良好的反馈

随着5G的到来，针对糟糕的移动互联网连接进行设计可能很快就不再是一个问题了。不过，在此之前，不要期望你的移动用户拥有稳定、高速的互联网连接，也不要忽视你的加载状态。任何移动用户都可能在某一时刻等待加载数据，特别是当它们使用手机连接时，“等待”是一个相对术语，我们很少用毫秒来度量，但是我们会在UX中做。

如果延迟超过300毫秒，你的用户将会注意到，如果延迟超过1000毫秒，用户可能会开始在心理上有转换。如果不能在这段时间内加载用户点击的内容，至少需要向他们展示你正在做的事情。

案例：Duolingo

提供一些反馈绝对比完全没有反馈要好，例如Duolingo，他们利用加载时间来提供一个有趣的事实，并伴随着吉祥物有趣的动画，有用且引人入胜。

原则7：轻松恢复错误

错误和误解是你的责任，但你永远无法彻底消除它们。无论你如何遵循上述原则，无论你是一个多么出色的设计师，用户错误都不可避免地会发生。此外，在你和你的用户控制范围之外，始终存在发生错误的风险。其中一些（例如由于连接不良而导致页面无法加载）在移动设备上的可能性更大。

案例一：Google Sheets

当提到“撤销”功能时，你可能会想到微软的Word、Excel和PowerPoint以及谷歌等工具。请注意，它是少数几个优先处理的控件之一，始终可以在在Google Sheets应用的顶部菜单栏中访问。

案例二：Airmail

带有各种列表的应用程序允许用户通过在列表项上向左或向右滑动来执行特定的操作。在Airmail中对电子邮件列表执行的操作由滑动的方向和长度确定，并且是即时执行的，这对于能够加快工作流程的高级用户来说非常有用。但是从经验上讲，它也容易出错。

当鼠标向左滑动时，“删除”按钮就派上用场了。包括在发送电子邮件时也会显示类似的撤销按钮。在其他应用程序中，可以删除、存档或勾选列表中的内容也很常见。

Key Takeaways

基本的、通用的UX最佳实践适用于各种设备和屏幕尺寸。然而，由于小屏幕、触摸交互、使用环境以及通常较差的互联网连接，有些在移动设备上甚至更为重要，有些原则特别适用于移动设备。

在设计中追求极简主义，甚至比台式机和笔记本电脑还要简约。将界面中最重要的元素居中，以便用户可以轻松访问它们，并最大限度地减少所需的文本输入；

增加点击目标的大小，以帮助你的用户更快，更无缝地实现他们的目标，并优先考虑易读性，以满足用户在户外使用你的网站或应用程序时所体验到的小屏幕和强光照明；

对用户执行的任何操作给予及时和良好的反馈。你可能需要一秒钟的时间来加载所请求的内容或页面，而你的用户将很快失去耐心并怀疑是否有什么问题；

最后，当所有其他方法都失败时，至少要确保启用了简单的错误恢复。错误是无法避免的，它们可能在你和你的用户的控制之内，也可能不在，所以要帮助你的用户快速回到正轨，否则可能会永远失去他们。

翻译自原文：https://uxdesign.cc/learn-from-the-best-mobile-design-principles-f1bdc46bc016

欢迎关注我的公众号：UX辞典（微信号：uxpedia-design）