下载掌阅APP，畅读海量书库
立即打开
一款手机App与用户直接接触的部分就是UI，因此，UI设计的好坏会大大影响用户使用App的体验。移动UI设计除了需要遵循一些基本的设计原则，还可以采用一些技巧来提升用户体验。
简化操作流程是提升用户体验的常用方法。用户使用App都有一个特定的目标，而实现这个目标需要经历的交互操作和页面转换就是操作流程。通常，实现这一目标所经历的环节越少，体验就越好。简化操作流程可以从优化交互方式和减少页面转换两个方面入手。
优化交互方式包括减少用户点击次数和降低操作难度两个方面。通过减少一些不必要的操作环节，可以优化整个App的操作过程，提高信息的输入和反馈效率。例如，支付宝App在绑定银行卡时，为用户提供了拍照识别卡号的功能，如下图所示，而不需要用户手动输入卡号，这样就减少了用户的点击次数，同时避免了输入错误的情况。
又如，淘宝、微信等App在付款时都提供了指纹支付功能，如下图所示，这也是优化交互方式的表现。使用指纹支付可以减少输入支付密码这一操作环节，提高了交互 效率。
一个App往往有多个操作页面，因此，在操作流程设计阶段，非常有必要进行分析，明确高层次和低层次的任务，并将每个页面的用途反映到相应的设计层次，从而减少页面的转换。下图所示为某App的电影票购买页面，用户只需选择时间就能快速进入对应的选座购票页面，简单的操作和页面转换更容易留住用户。
随着取消物理Home键的iPhone X的发布，手势操作成为人机交互设计的一种趋势，移动UI设计师也因此面临着新的挑战。交互方式的变化意味着用户初次使用一款App时要花更多时间去学习操作，因此，设计师必须更加注重对用户的教育与引导。在设计UI时，可以添加一些必要的手势教程，并利用简单的动画增强用户的学习效果。
许多以手势交互驱动的App都会在首次打开时显示手势教程，以便用户学习操作。下图所示为某App在初次打开时显示的手势教程，通过这个教程，用户能够快速了解这款App的核心操作。
添加手势教程时要注意的是，只需简单提示重要操作，以避免用户因为信息太多而失去观看的耐心，甚至放弃使用App。
由于App首次打开时显示的手势教程只有重要操作，所以其他操作的教程就要在使用的过程中，结合用户所处的页面或正在完成的任务等来显示。
如下图所示即为在特定页面中显示的手势教程。如果想要教给用户一个新的手势，不要指望一次搞定，不要急于求成，而是需要给用户一个渐进的引导，并且这种引导应该是专注于单个交互的，而非一次给用户灌输大量信息。
在手势教程中，还可以适当使用动画来呈现手势，以增强用户的学习兴趣和学习效果。目前有两种比较流行的手势教程动画，分别是提示动画和内容展示动画。
提示动画主要以预览的形式展现如何运用手势与UI中的特定元素进行交互，其作为手势和触发交互之间的桥梁存在。提示动画在各类游戏App中比较常见，如下左图所示。
相比于提示动画，内容展示动画更加微妙，常用于向用户展示交互后呈现出来的内容和结果。如下右图所示的内容展示动画让用户能清楚地看到点击某个选项后的UI内容变化。
任何一个App的UI设计都离不开图像的运用。图像的大小是影响整个UI视觉效果的重要因素。在设计UI时，虽然采用系统通用尺寸大小的图像可以使资源的管理变得更加简单，但是设备的硬件配置差异较大，一些效果不能得到很好的应用。因此，应当针对具体的移动设备屏幕尺寸来设计图像，只有大小合适的图像才能构建最佳的使用体验。
下左图和下右图均为游戏App的UI设计效果。下左图中的UI设计因为尺寸不合适，控制按钮都不能完整显示出来，这样的UI设计即使非常美观，也是不合格的；而下右图中的UI设计因为尺寸完全契合，效果自然非常不错。
图像的格式也是影响UI视觉效果的关键因素。有些App会在加载一些大型图像时出现暂停，这不仅仅是因为图像的大小存在偏差，也有可能是因为采用了不支持的图像格式。
iOS系统和Android系统均支持多种图像格式，如PNG、JPEG、GIF和BMP等。但从图像文件优化的角度来讲，更推荐使用PNG格式。PNG格式采用的是无损数据压缩算法，并且支持透明效果，当UI设计定稿之后，设计师都会采用此格式输出UI中的图标和按钮等。在Photoshop中，执行“文件>导出>存储为Web所用格式（旧版）”菜单命令，在弹出的对话框中可以选择以PNG格式输出图像，如下图所示。
颜色是最引人注目的视觉因素，它能在第一时间吸引受众的注意力，使受众的“眼睛”得到放松或警惕。一个好的UI配色方案可以起到显示UI整体架构和明确视觉层次关系等作用。进行UI设计时，为了增强视觉吸引力，可以适当地使用高对比度的配色方案来处理UI元素。
如下一图所示的UI设计使用蓝色作为背景色，而对需要突出展示的区域使用反差较大的橙色来表现，起到了一定的强调作用；而如下二图所示的UI设计使用白色作为背景色，对按钮使用同为浅色系的黄色进行表现，并且部分按钮上的文字颜色较浅，大大降低了辨识度。
字体是UI设计中重要的构成要素之一，它能辅助信息的传递。在移动UI设计中，字体的选择也是很重要的。除了系统默认的字体外，为了提升UI视觉效果，可以使用其他字体进行表现，但是，不管选择什么类型和样式的字体，都要考虑其易读性，不要使用造型古怪、有碍阅读的字体。
下图一所示的UI设计使用大多数人熟悉的黑体来展示文字内容，通过字号的变化表现文字的主次关系，使用户能快速阅读并掌握信息；而下图二所示的UI设计使用的字体虽然创意性更强，但是易读性较差，用户阅读起来会感到吃力。
除了字体，字号也是一个比较重要的因素。在保持UI元素尺寸平衡性的前提下，尽量将字号制作得够大，也能在一定程度上提高文字的易读性。例如，设置导航主标题字号为40～42 px，大的正文字号为32 px，副文字号为26 px，小字字号为20 px。还可以根据App的类型来设置字号。例如，新闻类或文字阅读类App更注重阅读的便捷性，正文字号可以设置为36 px，并且可以选择性加粗；而列表形式、工具化的App则可以将正文字号设置为32 px，不加粗。