UI设计:触摸优先设计、响应式设计、移动优先设计(2)

Twitter最近的一次改版验证了这些原则。

新版Twitter采用了简约化设计，在各种设备上具有一致的体验。

Twitter改版的目标之一是为了向用户提供一致体验，无论在电脑上还是在各种移动设备上。获得一致的视觉和感受体验对于UI来说是一个挑战，但整个产品在不同设备上获得一致的体验则是更大的挑战。针对这两方面的挑战，移动优先设计可以帮我们实现。

在Twitter的改版中，我发现了一件很有趣的事，即移动体验对整个产品设计的影响。例如，除了"Tweet"按钮外，所有的动作按钮均布置在"Home"、"Connect"、"Discover"、"Me"四个标签下面。该简单化的设计在小屏幕设备中运行完美，四个项目也能在标签栏中融洽"相处"。

在桌面网站中，虽然新增了一些其他特性，但建立在移动版本基础上的简洁仍需存在。虽然桌面版本上有大量的空间来完成更多的复杂设计，但设计仍要有所约束、有更好的适应性，以确保达到一致的多设备体验。

小心有"狼"

在巴赫之前的调音系统中，被同时演奏出的不和谐间隔的音符会产生侧耳、咆哮般的声音。音乐家把这种声音称为"狼嚎"。

在界面设计中，当针对某一种体验设计的视觉或交互元素转移到另一种体验环境中就会失效，那么我们称这种元素为"狼"。回想一下，你曾经费力地用手指点击一个很小的针对鼠标设计的链接，还有痛苦地在移动设备、触摸设备上阅读着字体很小的文本，而这些设备上的界面元素只依靠鼠标点击。这些都是UI上的"狼"。

这些文章的链接只依靠鼠标完成交互。当在触摸式的移动设备中浏览时，它们的可能性就会减低。

New York Magazine提供了一个好用、美观的下拉式导航菜单，但你只能使用鼠标来点击它。

注意事项

响应式设计，提供针对设备的特定体验，确实可以解决很多此类问题。如果我们能调整一个按钮的大小以适应某一特定的环境，那么我们就不必接受这种笨重、顾及全局的方法。但是我们需要支持的设备数量只会增加，定制所有可能的方案即将变得不合理。

即便我们可以在执行层面定制完美的设计，但仍有必要在概念层面考虑一下可调节的、可统一访问的设计。

下面列出了几个注意事项

● 响应式地思考

即便你并不正在实现一个完全响应式设计，简单地用响应式的方式去思考将会对实现可用的、统一的设计大有帮助。

● 触摸优先式思考

针对手指点触设计的按钮，同样可以用鼠标来点击。但针对鼠标设计的按钮，用手指触控时就会显得太小了。触控优先式设计，可以确保你的网站和应用很好的迁移到其他环境中。

● 统一式思考

正如"早测试，经常测试"一样。在设计过程中，应该尽早并经常思考你的设计如何成功运行在不同的设备之上。

● 移动优先式思考

移动优先设计，可以让你专注于那些关乎你成功的事情上。保持对最重要特性的关注，在不同设备上实现统一的体验就变得更加容易了。

● 小心

交互行为不会在各种界面中得到统一支持。通过鼠标来完成的功能在触摸设备上可能会有问题。通过触摸来完成的操作可能用鼠标就无法执行。但这并不意味者我们不能使用它们，只是我们应该清楚它们的使用限制。

希望用户可以在不同的设备上使用我们的网站和应用时获得完美的体验。也希望我们的劳动成果可以在尽可能多的环境中可用。

本文编译：陈秋歌，原文链接。