7步打造优秀UX:搞定各种屏幕尺寸

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

文章译自:Adobe Creative Cloud

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

原文作者:Nick Babich

文章翻译:村长道哥

7步打造优秀UX:搞定各种屏幕尺寸_第1张图片

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

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

#1 识别核心用户体验

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

7步打造优秀UX:搞定各种屏幕尺寸_第2张图片

把产品的设备分组

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

移动电话

平板电脑

台式电脑

智能电视

智能手表

7步打造优秀UX:搞定各种屏幕尺寸_第3张图片

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

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

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

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

7步打造优秀UX:搞定各种屏幕尺寸_第4张图片

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

7步打造优秀UX:搞定各种屏幕尺寸_第5张图片


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

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

7步打造优秀UX:搞定各种屏幕尺寸_第6张图片

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

7步打造优秀UX:搞定各种屏幕尺寸_第7张图片

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

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

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

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

7步打造优秀UX:搞定各种屏幕尺寸_第8张图片

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

#4 别忘了大屏幕

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

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

7步打造优秀UX:搞定各种屏幕尺寸_第9张图片

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

7步打造优秀UX:搞定各种屏幕尺寸_第10张图片

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

7步打造优秀UX:搞定各种屏幕尺寸_第11张图片

#5 提供一致的体验

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

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

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

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

7步打造优秀UX:搞定各种屏幕尺寸_第12张图片

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

#6 打造无缝体验

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

7步打造优秀UX:搞定各种屏幕尺寸_第13张图片

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

7步打造优秀UX:搞定各种屏幕尺寸_第14张图片

#7 测试你的设计

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

结论

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

7步打造优秀UX:搞定各种屏幕尺寸_第15张图片

你可能感兴趣的:(7步打造优秀UX:搞定各种屏幕尺寸)