本文首发于公众号：设计新手村

文章译自：Adobe Creative Cloud

原文标题：Designing for Different Screens and Devices: 7 Steps to Creating A Great UX

原文作者：Nick Babich

文章翻译：村长道哥

从屏幕微小的智能手表到屏幕最宽的电视，显示的内容应该可以在不同大小的屏幕内呈现和互动。但针对不同设备的设计更多的是调整内容的大小。这涉及到很多复杂的问题：设计师需要最大化每个设备的用户体验，让用户相信这款应用确实是为他们的设备专门设计的，而不是简简单单地拉伸，然后充满整个屏幕。

为了创造一个良好的用户体验，必须找到一种有效的策略来解决不同的设备和屏幕尺寸的问题。

#1 识别核心用户体验

每个产品都有一个核心的用户体验，这基本上就是产品存在的原因。产品解决了人们的一个需求，所以变得有意义，并为用户提供了价值。主要内容和功能的结合反映了核心的用户体验。要找到你产品的核心用户体验，问自己一个问题：“对于客户来说最常见和最重要的任务是哪些？”在产品使用的每个途径上对这些核心任务给予支持是至关重要的。例如，Uber 的核心用户体验是在任何时候都可以轻松地叫车。无论屏幕大小是怎样的，这个功能都应该适用于为这个目的而设计的每个设备。

把产品的设备分组

尽管市面上有各种各样的设备，屏幕大小不一，而且完全不可能针对单个设备去做设计，但可以根据用户关注的功能去为产品划分设备组别。最常见的设备分组是：

移动电话

平板电脑

台式电脑

智能电视

智能手表

不同的设备分组在不同的环境中可以提供不同的服务：用户可以根据屏幕类型来进行不同的交互。例如，移动电话主要用于处理小任务，时长通常很短。平板电脑主要用于内容消费，在大多数眼里目前还不能被认为生产力工具。理解各种设备类型的定位对于构建良好的用户体验是很重要的。

#2 对每个场景的用户体验进行调整

在确定产品的核心用户体验并选择一组想要支持的设备之后，需要为每个组（针对每个使用场景）进行用户体验的调整。为不同的设备组设计时，使用场景是非常重要的。

首先，并非每一个功能在所有的设备上都有意义。你需要确定不同的场景，在这些场景中产品将在不同的设备组中使用，并设计适合每种场景的用户体验。例如，很多移动用户都希望从产品中获得与桌面电脑不同的东西。以 Evernote 为例，做为一款流行的笔记产品，可以在多种设备上使用。Evernote 的桌面版针对内容消费进行了优化：桌面版 Evernote 优化了文本阅读和媒体文件的浏览。

而移动版则是针对笔记、照片和捕捉音频进行优化的。

其次，不同的屏幕采用不同的输入法。以触摸输入为例，设计师在设计触摸输入设备（手机和智能手表）时一些常见的错误包括：

过小的点击目标。点击目标（如CTA按钮）必须有足够的大小才行。最小限度的7毫米通常来说就可以了，但是最好使用10毫米的触摸目标大小。

把元素都紧紧地堆在一起。你应该考虑一下点击目标的大小，以及它们之间的间距，因为间距可以帮助分隔控件，并给用户界面提供呼吸的空间。为了防止输入错误建议最小的间距为23pt。

使用悬停状态。在触摸屏上，没有“悬浮”这个东西。

#3 优先为最小的屏幕设计

从历史上看，设计师工作的顺序总是从最大的屏幕到最小的——这意味着第一个也是最主要的设计是为了完整的桌面版（拥有最多的功能）。只有在桌面版设计完成之后，它才会被移植到移动设备和其他设备组。然而，在为桌面版设计时，我们通常会遇到“厨房洗涤槽”问题：产品中添加了许多特性，尤其是涉及到多个利益相关者的时候。这并不奇怪，因为当拥有大量的空间时，添加功能相对来说总是比较容易的。然而实践表明，移动为先的设计会更好，用最小的屏幕创建应用程序，因为这与你的用户是息息相关的。

当你首先为最小尺寸的屏幕做设计时，你不得不去思考什么是最重要的。过了一段时间后，无论是在桌面、平板电脑还是电视上，你会对产品的其他版本应用这样的方法，仔细认真的选择要添加的功能。

在大多数情况下，手机将是屏幕尺寸最小的设备。如果你的产品是可穿戴设备，那么你需要考虑使用更小分辨率的微型屏幕。

#4 别忘了大屏幕

和对小屏幕的思考一样，给大屏幕同样级别的注意力：

不要只是把你的设计放大铺到那些大屏幕上。充分利用你所拥有的额外空间。

确保图像不会因为在最大尺寸的屏幕上而模糊。

考虑大屏幕的规格。每个设备组都有自己的特定功能。例如，电视屏幕的设计被称为“10英尺体验的设计”，因为从沙发上看，屏幕上的元素明显比桌面屏幕小得多。

#5 提供一致的体验

一致的体验意味着应用在所有屏幕大小上的体验都是相似的。无论什么样的设备，一致的体验是打通各个平台用户体验的关键组成部分:

一致的体验为产品未来的交互设置了预期，并让用户建立信心。

一致的体验让用户在其他设备上使用你的产品更加轻松。

你可以将不同的屏幕尺寸看作是相同体验的各个方面，而不是根据不断增加的屏幕和设备进行单独的设计。例如，谷歌搜索应用在所有设备上提供相同的搜索体验。

当设计和功能统一时，用户可以在他们的设备上更快更有效地完成任务。

#6 打造无缝体验

在不同的设备组中打造无缝的体验对于用户来说非常重要。人们可以在设备之间自由地切换来完成工作，当他们从一个设备转向另一个设备时，他们希望产品和服务能够与他们一起切换。这意味着用户无需考虑他们设备的变化、环境的变化或场景的变化，还可以依赖于应用强大的功能和独立于设备的易用性。

基于使用场景的不同，你可能希望各个设备上的内容是同步的。以苹果音乐为例：你可以在 Mac 上设置播放列表，这个列表会立即同步到你的 iPhone 上，或者你可以在 iPhone 上直接听歌，然后当你切换回 Mac 后 iPhone 上的内容同样会同步过来。

#7 测试你的设计

在测试环境中工作的东西并不一定适用于现实世界。在真机上进行产品的可用性测试，这有助于在发布产品之前发现一些用户体验方面的问题。

结论

在为多种屏幕和设备设计时，最好的策略是时刻谨记终端用户的体验。作为用户体验设计师，你必须评估产品的使用时间、地点和方式，然后寻找出用户的最佳体验。不管你的内容最后会显示在多大的屏幕上，用户都希望在设备得到流畅的体验。