Our approach to interface design has changed dramatically since the rise of mobile devices. Overtime, responsive layouts have become increasingly popular and along with them, “simple design” has become a recognised term.

Ø乌尔到界面设计方法已经由于移动设备的兴起极大地改变。 随着时间的流逝，响应式布局变得越来越流行，并且“简单设计”也随之成为公认的术语。

设计简单 (Simple design)

Simple design or design simplicity is an approach that sits behind the design paradigm — mobile first design. In practise it is wide reaching as it touches on user research, design approach, design intent and final delivery. It’s the idea that if a design is simple enough to work on a mobile, then its success will translate to a desktop. In theory this is correct, however, a literal implementation of this interface transfer will produce a diminished user experience.

简单设计或设计简单性是一种位于设计范式(移动优先设计)背后的方法。 实际上，它涉及到用户研究，设计方法，设计意图和最终交付，因此影响广泛。 它的想法是，如果设计足够简单，可以在移动设备上工作，那么它的成功将转化为台式机。 从理论上讲，这是正确的，但是，此接口传输的字面实现将减少用户体验。

The menu icon, now known as the hamburger icon, is a good example of transferring simple design from mobile to desktop, thus creating ineffective results. When designing for mobile first, it is a common practise to use the hamburger menu as a means of hiding navigation in favour of promoting other content on the hierarchy tree.

菜单图标(现称为汉堡图标)是将简单设计从移动设备转移到桌面设备的良好示例，从而产生了无效的结果。 在首先针对移动设备进行设计时，通常的做法是使用汉堡菜单作为隐藏导航的一种手段，以促进在层次结构树上推广其他内容。

However, by adopting this mobile pattern on a desktop, chrome is being devalued. “Chrome” is the interface elements such as navigation, buttons, lists and other components. By hiding these elements away, content is being deprioritised in favour of design aesthetics.

但是，通过在台式机上采用这种移动模式， Chrome贬值了 。 “ Chrome”是界面元素，例如导航，按钮，列表和其他组件。 通过将这些元素隐藏起来，内容就变得轻而易举，而倾向于设计美学。

Interaction costs are also increased as users are forced to travel further to locate the menu and an additional click is required to reveal menu contents. One additional click is not much in itself, however, it is a common annoyance for users that are required to access the menu more than once. Discovery costs are also increased as although the hamburger menu and associated interaction is a recognised control amongst mobile devices, users must think to look under the control when implemented on desktop. Once discovered, the user must also remember the position and behaviour of the menu when wanting to interact with it again at a later stage.

交互成本也增加了，因为用户被迫进一步旅行以查找菜单，并且需要额外单击以显示菜单内容。 一次单击本身并不多，但是对于需要多次访问菜单的用户来说，这是一个普遍的烦恼。 发现成本也增加了，因为汉堡包菜单和相关的交互是移动设备中公认的控件，但在桌面上实现时，用户必须考虑在控件下查看。 一旦发现，用户还想记住菜单的位置和行为，以便稍后再与之交互。

Simple for mobile does not necessarily mean usable on desktop.

移动简单并不一定意味着可以在桌面上使用。

A second example is the one column layout. A single column layout is an ideal layout for content served on mobile devices. However, if the same single column layout is used to serve content on a device that offers greater real estate, communication and information capacity is wasted. Desktop users are being forced to scroll more than is required and content is slowly drip fed to them with each passing scroll which increases their absorption and reading time. So simple for mobile does not necessarily mean usable on desktop.

第二个示例是一列布局。 单列布局是移动设备上提供的内容的理想布局。 但是，如果使用相同的单列布局在提供更大房地产的设备上提供内容，则会浪费通信和信息容量。 台式机用户被迫滚动超出所需的数量，每次通过滚动时，内容都会缓慢地滴灌给他们，这增加了他们的吸收和阅读时间。 对移动设备如此简单并不一定意味着它可以在台式机上使用。

Simple design is therefore relative. What may be simple for one device may be intricate or difficult for another.

因此，简单的设计是相对的。 对于一个设备可能简单的事情对于另一个设备可能是复杂的或困难的。

频道设计 (Channel design)

Channel design is truly understanding the interface that communicates directly with our user and sending over the appropriate amount of information to suit. It’s about knowing channel capacity.

渠道设计真正理解了与我们的用户直接通信并通过适当数量的信息发送的界面。 这与了解频道容量有关。

Design is about effective communication. A communication channel consists of a source (user), a destination (device) and a channel capacity bridge that connects the two. This bridge is a bi-directional communication system for which the content is controlled by the size of the destination (device).

设计是关于有效的沟通。 通信通道由源(用户)，目的地(设备)和连接两者的通道容量桥组成。 该网桥是双向通信系统，其内容由目标(设备)的大小控制。

For example. Think of the communication channel as if it were a drinking straw. A narrow straw will reduce our ability to drink as fast as a wider straw would allow.

例如。 将沟通渠道想像成吸管。 较窄的吸管会降低我们喝水的能力，而较宽的吸管会允许。

The size of a device dictates the amount of information that can be sent at one time. If a high volume of information is being sent from a small mobile device, user effort is increased as more time is required to consume, absorb and to scroll to discover the information. We therefore should be designing for the size of the communication channel aka; designing for the device.

设备的大小决定了一次可以发送的信息量。 如果从小型移动设备发送大量信息，则由于需要更多时间来消费，吸收和滚动以发现信息，因此用户的工作量会增加。 因此，我们应该针对通讯通道的大小进行设计。 为设备设计。

Channel design is therefore important in order to obtain and create a seamless experience. A seamless experience is often confused for a visual consistent journey. As the two aforementioned examples highlight, visual consistency across big and small devices will not produce a seamless user experience.

因此，渠道设计对于获得和创造无缝体验至关重要。 无缝的体验通常会混淆视觉一致的旅程。 正如上述两个示例所强调的那样，大型和小型设备之间的视觉一致性不会产生无缝的用户体验。

实现成功的渠道设计 (Achieving successful channel design)

查阅界面指南 (Consult interface guidelines)

To best achieve a seamless and successful channel design, one option is to look for interface guidelines. Companies will often publicise their design interface guidelines, ensuring correct usability and visual practises are employed. Apple are a great example as they have individual interface guidelines for each of their devices:

为了最好地实现无缝和成功的频道设计，一种选择是寻找界面准则。 公司通常会公布其设计界面指南，以确保采用正确的可用性和视觉效果。 苹果公司就是一个很好的例子，因为它们为每个设备都提供了单独的界面指南：

• Apple WatchOS Interface Guidelines

  Apple WatchOS界面准则

• Apple iOS Interface Guidelines

  Apple iOS界面准则

• AppleTV Interface Guidelines

  AppleTV接口准则

Samsung also provide separate interface guidelines for their wearable interface and their handheld interface:

三星还为可穿戴式界面和手持式界面提供了单独的界面准则：

• Samsung Wear OS Guidelines

  三星Wear操作系统指南

• Samsung Handheld Guidelines

  三星手持指南

从最大的Chrome开始-桌面 (Start with maximum chrome — desktop)

A second approach for achieving a seamless and successful channel design is to start with maximum chrome.

实现无缝和成功的通道设计的第二种方法是从最大Chrome开始。

When designing for desktop, start by exposing all the chrome elements that your site requires. Don’t start out your design process by adopting a minified set of components such as hamburger menu or accordion lists that hide away content. Alternatively, start with each and every component in front of your eyes. Slowly substitute components for their minified counterparts introducing more whitespace into your interface. Stop at the point in which you feel you have achieved a balanced ratio of content-to-chrome.

在为桌面设计时，首先要公开您网站所需的所有chrome元素。 不要通过采用最小化的组件集(例如隐藏菜单内容的汉堡包菜单或手风琴列表)来开始设计过程。 或者，从眼前的每个组成部分入手。 慢慢地将组件替换为缩小的组件，从而在界面中引入更多的空格。 停下来，让您感到内容和Chrome的比例达到平衡。

从最小的Chrome开始-移动版 (Start with minimum chrome — mobile)

When working in the mobile first paradigm, work with minified versions of each component. Slowly swap out some of the minified elements for their larger counterparts. As an example, if you have a paragraph of text which is truncated with a ‘read more’ call to action, reveal all of the paragraph on the interface. Continue with this process until you feel you have reduced the appropriate amount of available whitespace.

在移动第一范式中工作时，请使用每个组件的缩小版本。 慢慢地将一些缩小的元素换成较大的元素。 例如，如果您有一段文本被“”号召性用语截断，请在界面上显示所有段落。 继续执行此过程，直到您感觉到减少了适当的可用空白量。

Devices determine the scope of the communication channel between themselves and the user. By identifying device real estate and working within optimal content-to-chrome ratios, your users experience will become seamless and consistent across all channels.

设备确定其自身与用户之间的通信通道范围。 通过确定设备的空间并以最佳的内容与Chrome比率工作，您的用户体验将在所有渠道中变得无缝且一致。