进化Unity Editor UX

A new design signifies the first step towards improving the user experience (UX) for an ever-evolving and increasingly complex content creation tool: The Unity Editor.

新的设计标志着朝着不断发展且日益复杂的内容创建工具：Unity Editor改善用户体验(UX)的第一步。

Over 1.5 million creators use Unity every month to make amazing content and interactive experiences. Over the years it has steadily grown to become the world’s leading platform for creating and operating interactive, real-time 3D content, with a diverse and expanding audience of passionate users. As a productivity tool that’s used frequently and for long periods of time, ease of use and efficiency are everything. 

每月有超过150万的创作者使用Unity来制作惊人的内容和互动体验。 多年来，它已稳步发展成为全球领先的平台，用于创建和操作交互式实时3D内容，并吸引了越来越多的热情用户。 作为经常使用且长期使用的生产力工具， 易用性 和 效率 至关重要。

With that in mind, we took a step back to find opportunities for making improvements that are less about new features, and more about the look and feel, core interactions, and workflows. 

考虑到这一点，我们退后一步，找到了进行改进的机会，而这些改进所涉及的并不是新功能，而是更多的 外观 ， 核心交互 和 工作流程 。

Design improvements in numerous areas of the Unity Editor UX are reflected in the latest 2019.3 beta release, with more to come soon. This long-term effort, which will be released in multiple phases, is driven by the goal of ensuring the Editor is:

最新的 2019.3 beta版本 反映了Unity Editor UX在许多领域的设计改进 ，并且很快 还会 有更多改进。 这项长期工作将分多个阶段发布，其目标是确保编辑器具有以下目标：

• Modern. We want to provide Unity users with a modern and professional Editor experience that feels inspiring, well-crafted, and trustworthy. 

  现代。 我们希望为Unity用户提供现代，专业的编辑器体验，使您倍受鼓舞，精心制作和值得信赖。

• Familiar. The Unity user interface should be consistent and aligned with industry standards.

  熟悉 Unity用户界面应保持一致并符合行业标准。

• Accessible. The Unity user interface should be accessible to a wider range of users and their abilities.

  无障碍。 广泛的用户及其功能应该可以访问Unity用户界面。

• Efficient. We want to enable users to create content and complete tasks efficiently by offering a clear and optimized user interface (UI) for common tasks, as well as streamlined workflows. 

  高效。 我们希望通过为常见任务以及简化的工作流程提供清晰，优化的用户界面(UI)，使用户能够高效地创建内容并完成任务。

This blog post summarizes the UX improvements we’ve made to the Unity Editor over the course of multiple releases leading up to and including 2019.3.

这篇博客文章总结了我们在2019年及之前发布的多个版本中对Unity Editor进行的UX改进。

现代外观 (A modern look and feel)

We believe that good design is a harmony of form, function, and aesthetics. A product’s visual design should be purposeful and in service of usability and workflows. The visuals of the Unity Editor’s interface have varied significantly over the years. As our ecosystem grows, we wanted to update the appearance of the Unity Editor for a consistent look and feel and a more cohesive experience.

我们认为，好的设计是形式，功能和美学的和谐统一。 产品的视觉设计应具有针对性，并服务于可用性和工作流程。 多年来，Unity编辑器界面的视觉效果已经发生了很大变化。 随着我们的生态系统的发展，我们希望更新Unity编辑器的外观，以获得一致的外观和感觉以及更紧密的体验。

Themes. The Light and Dark themes have been updated with new colors and treatments throughout the UI to increase clarity. We’ve introduced a more lightweight and minimal look and feel to allow users to focus on their content and workflow. For example, we’ve removed gradients from the UI to reduce distractions while addressing user feedback to maintain a sense of depth in the UI, which ensures that controls are visually distinct and convey their behavior and functionality. 

主题。 整个用户界面中的明暗主题均已更新为新的颜色和处理方式，以提高清晰度。 我们引入了更轻巧和最小的外观，使用户可以专注于其内容和工作流程。 例如，我们从用户界面中删除了渐变，以减少干扰，同时解决用户反馈，以保持用户界面的深度感，从而确保控件在视觉上截然不同并传达其行为和功能。

Icons. Icons are an essential part of the Unity Editor UI, visually expressing objects, actions, and concepts. They add many benefits, such as preserving screen real estate, communicating meaning at a glance, accelerating the understanding of the UI, and enhancing aesthetic appeal.

图标。 图标是Unity编辑器UI的重要组成部分，以视觉方式表达对象，动作和概念。 它们增加了许多好处，例如保留屏幕空间，一目了然地传达含义，加速对UI的理解以及增强美学吸引力。

As part of evolving the Unity Editor UX, we felt it was time to refresh our icons, aligning their style with the icons now found in the Hub, Services Dashboard, and other Unity web properties. These new icons help express Unity’s visual identity. Each icon has been created in multiple sizes so that it renders optimally across display types (e.g., HDPI) and resolutions – icons will appear crisp on every screen. 

作为改进Unity Editor UX的一部分，我们认为是时候刷新图标了，使它们的样式与现在在Hub，Services Dashboard和其他Unity Web属性中找到的图标保持一致。 这些新图标有助于表达Unity的视觉识别。 每个图标均已创建为多种尺寸，以便在各种显示类型(例如HDPI)和分辨率下呈现最佳效果–图标将在每个屏幕上清晰显示。

New Editor and Hub app icons. Icons that appear in the Windows taskbar and the MacOS dock serve as the front door to the apps that are launched when clicked. The new app icons are fresh renditions of the signature Unity cube: white on black background for the Editor, and black on white for the Hub. This modern visual style is consistent with the Unity experience across our ecosystem and reflects Unity’s continued design evolution and attention to alignment.

新的编辑器和Hub应用程序图标。 Windows任务栏中和MacOS扩展坞中显示的图标充当单击后启动的应用程序的前门。 新的应用程序图标是签名Unity多维数据集的最新版本：编辑器为黑色背景上的白色，集线器为黑色。 这种现代的视觉风格与我们整个生态系统中的Unity体验保持一致，并反映了Unity不断的设计演进和对对齐的关注。

New UI font. Text plays an important role in any user interface, and in one as information-dense as the Unity Editor, UI text is crucial. Proper legibility is essential. Getting text to display with consistent quality and reliability across multiple platforms is a challenge, as each operating system will render the same font differently. The Unity Editor has used the same typefaces for a long time, but they have had quality and rendering issues, so we’ve introduced a new font that improves legibility and complements the new UI. After careful consideration, we chose Inter, a modern typeface designed for computer screens. It’s highly legible and helps minimize eye fatigue. Additionally, it renders well across all operating systems and screen types, including both low and high DPI. 

新的UI字体。 文本在任何用户界面中都起着重要的作用，在与Unity编辑器一样信息密集的界面中，UI文本至关重要。 正确的可读性至关重要。 在每个平台上以一致的质量和可靠性显示文本是一个挑战，因为每个操作系统将以不同的方式呈现相同的字体。 长期以来，Unity编辑器一直使用相同的字体，但是它们存在质量和渲染问题，因此我们引入了一种新字体，该字体可以提高可读性并补充新UI。 经过仔细考虑，我们选择了 Inter ，一种专为计算机屏幕设计的现代字体。 清晰易读，有助于最大程度地减少眼睛疲劳。 此外，它可以在所有操作系统和屏幕类型(包括低DPI和高DPI)中很好地呈现。

From an accessibility standpoint, we’ve made further improvements to UI text. Previously, the text size in dropdown menus and text fields was extremely small, so we increased the minimum text size to make the UI more inclusive and usable for a wider audience. 

从可访问性的角度来看，我们对UI文本进行了进一步的改进。 以前，下拉菜单和文本字段中的文本大小非常小，因此我们增加了最小文本大小，以使UI更具包容性并可供更广泛的受众使用。

改进了核心互动和控制 (Revamped core interactions and controls)

The Unity Editor has many core interactions (also known as “micro-interactions”) and controls that are used frequently across many workflows. Improving them can, therefore, have a broad impact on efficiency and ease of use. That’s why we’re committed to addressing existing core interaction problems as well as improving the quality of controls both near-term and long-term.
Here are just a few of the improvements we’ve implemented in this area:

Unity编辑器具有许多核心交互(也称为“微交互”)和控件，这些交互经常在许多工作流程中使用。 因此，对其进行改进可能会对效率和易用性产生广泛影响。 这就是为什么我们致力于解决现有的核心交互问题以及提高短期和长期控制质量的原因。
以下是我们在此领域中实现的一些改进：

1. Window focus. The Unity Editor is a dense environment where many different windows are open and in use at the same time, making it difficult to keep track of which window is currently in focus. That’s why we introduced a visual indicator, a blue line, to clearly indicate the active window receiving input from the user. By reinforcing a sense of context, we hope this helps users focus and stay in their flow.

   窗口焦点 。 Unity编辑器是一个密集的环境，其中同时打开和使用了许多不同的窗口，因此很难跟踪当前哪个窗口处于焦点位置。 这就是为什么我们引入了可视指示器(蓝线)来清楚地指示活动窗口正在接收来自用户的输入的原因。 通过增强上下文感，我们希望这可以帮助用户集中精力并保持他们的流程。

2. Tab improvements. In the past, the width of tabs in the UI was fixed, but this created a visual imbalance where the tabs contained text of varying length, causing irregular spacing. Now the width of tabs is based on the length of the text, so the spacing around the text is consistent. The flexible width also helps with localization as translated text strings can vary greatly in length across languages.

   选项卡的改进 。 过去，UI中选项卡的宽度是固定的，但是这造成了视觉上的不平衡，其中选项卡包含不同长度的文本，从而导致间距不规则。 现在，选项卡的宽度基于文本的长度，因此文本周围的间距是一致的。 灵活的宽度还有助于本地化，因为翻译后的文本字符串的长度在不同语言之间可能会有很大差异。

3. Adding new content. Adding content is a key interaction in all creation software: The “+” button has become a signature element in modern UI that users look for when starting their creation workflow. We’ve adopted this element in the Editor to preserve space and provide a familiar experience for creators.  

   添加新内容 。 添加内容是所有创建软件中的关键交互：“ +”按钮已成为现代UI中的签名元素，用户在启动创建工作流时会寻找它们。 我们在编辑器中采用了此元素，以保留空间并为创作者提供熟悉的体验。

Hover. We’ve added a hover state to controls in the Editor for a more responsive and interactive feel. Hover helps clarify which element the user is interacting with and acts as a prompt for tooltips.

悬停 。 我们在编辑器中的控件上添加了悬停状态，以提高响应速度和交互性。 悬停有助于弄清用户与之交互的元素，并提示用户输入提示。

工作流程改进 (Workflow improvements)

Every task a user performs in Unity is part of a workflow: We define a workflow as a set of steps a user performs to achieve a goal. There are hundreds of workflows in Unity, with different levels of complexity and granularity, meaning there are many opportunities to improve and streamline the experience. 

用户在Unity中执行的每个任务都是工作流的一部分：我们将工作流定义为用户为实现目标而执行的一组步骤。 Unity中有数百种工作流，它们具有不同级别的复杂性和粒度，这意味着有很多机会可以改善和简化体验。

With the 2018 and 2019 releases we’ve begun implementing some key workflow improvements, including the following:

在2018年和2019年版本中，我们开始实现一些关键的工作流程改进，包括以下内容：

Project Settings. Project Settings have long been reported by users as an area that needed improvement. Previously, each Settings page was accessed via the main menu and shown in the Inspector. This meant that users would need to go through many clicks to find the right settings to edit and would often lose the page if they selected something in another window (since each settings page was bound to the Inspector). We’ve now streamlined the Project Settings workflow by unifying all its pages into a single dockable window, allowing users to easily navigate them using a sidebar with tabs for each page. We’ve also added the ability to quickly find specific settings via a Search box. Being able to switch between Project Settings pages in a single click has resulted in a significant gain in efficiency, so we’ve applied the same window layout and behaviors to the Preferences window for a more efficient and consistent experience.

项目设置 。 用户长期以来一直将项目设置报告为需要改进的领域。 以前，每个设置页面都是通过主菜单访问的，并显示在检查器中。 这意味着用户将需要多次单击以找到正确的设置进行编辑，并且如果他们在另一个窗口中选择了某些内容，则常常会丢失该页面(因为每个设置页面都绑定到了Inspector)。 现在，我们通过将所有页面统一到一个可停靠的窗口中，简化了“项目设置”工作流，使用户可以使用带有每个页面标签的侧边栏轻松地浏览它们。 我们还增加了通过搜索框快速查找特定设置的功能。 一次单击就可以在“项目设置”页面之间切换，从而显着提高了效率，因此我们将相同的窗口布局和行为应用于“首选项”窗口，以获得更高效，更一致的体验。

Quick Search. When building a large game with hundreds or even thousands of assets and game objects it can be tedious and difficult to locate specific content. The Quick Search feature allows users to easily find anything in the Editor, including assets, game objects, settings, and even menu items. It can be quickly invoked via the shortcut Alt + ‘ and is fully operable using the keyboard: Users can take action against the search results, navigate to an associated settings page, drag an asset into the scene, or activate a menu item. This method for finding content can significantly speed up the user’s workflow and save a lot of clicks and mouse travel.

快速搜索。 当构建具有数百甚至数千资产和游戏对象的大型游戏时，可能很乏味且难以定位特定内容。 快速搜索功能使用户可以轻松地在编辑器中查找任何内容，包括资产，游戏对象，设置，甚至菜单项。 它可以通过快捷键 Alt +' 快速调用， 并且可以使用键盘完全操作：用户可以对搜索结果采取行动，导航到相关的设置页面，将资产拖动到场景中，或激活菜单项。 这种查找内容的方法可以极大地加快用户的工作流程，并节省大量的点击和鼠标移动。

Shortcut Manager. Keyboard interaction is an important aspect of ensuring both user efficiency and accessibility. Being able to execute commands via a keyboard shortcut (a key or combination of keys) drastically speeds up workflows and reduces the need for mouse travel. The new Shortcut Manager lets users view and manage these keyboard shortcuts in the Unity Editor. We’ve also identified many other opportunities with regards to both keyboard and mouse interaction to make the Editor accessible to all users – stay tuned for future releases.   

快捷方式经理 。 键盘交互是确保用户效率和可访问性的重要方面。 能够通过键盘快捷键(一个键或多个键的组合)执行命令的方法极大地加快了工作流程，并减少了鼠标移动的需要。 新的快捷方式管理器使用户可以在Unity编辑器中查看和管理这些键盘快捷键。 我们还发现了在键盘和鼠标交互方面的许多其他机会，使所有用户都可以使用编辑器–请继续关注将来的发行版。

We’re on a mission to improve how users work so they can achieve their objectives with the minimum amount of effort. If we shave off even a small percentage of time from a task users perform many times a day, it begins to add up in terms of efficiency gains. Going forward, we’ll continue to make updates that improve workflows with the purpose of increasing user performance and satisfaction.

我们的使命是改善用户的工作方式，以便他们以最小的努力实现目标。 如果我们减少了用户每天执行多次任务的时间，甚至减少了一小部分时间，那么从效率方面而言，它就开始增加了。 展望未来，我们将继续进行更新，以改善工作流程，以提高用户性能和满意度。

吸引用户 (Engaging users)

One of our core values is to put users first: Collecting user feedback early and often has been, and will continue to be, a key element of our journey. 

我们的核心价值观之一是 将用户放在首位 ：尽早收集用户反馈一直是并将继续成为我们旅程中的关键要素。

The new Editor design has been available in preview builds for almost a year. During that time, we’ve received an incredible amount of useful feedback via the forums, surveys, and social media, which is a testament to our extraordinarily passionate user base. We’ve actively applied the feedback in our design process and iterated based on what we’ve learned from users. 

新的Editor设计已在预览版本中提供了将近一年的时间。 在那段时间里，我们通过论坛，调查和社交媒体收到了令人难以置信的有用反馈，这证明了我们异常热情的用户群。 我们在设计过程中积极应用了反馈，并根据从用户那里学到的知识进行了迭代。

Since we’re making big changes that must be grounded in real needs, we’ve actively involved users from the start. At the end of the day, changes are only worth making if they solve problems and add value for our users. If you’d like to share your comments on the new design you can do so in our forum.

由于我们进行的重大更改必须以实际需求为基础，因此我们从一开始就积极参与了用户的工作。 归根结底，只有在解决问题并为我们的用户增加价值时，才值得进行更改。 如果您想分享对新设计的评论，可以在 我们的论坛中进行 。

下一步是什么？ (What’s next?)

This is just the beginning. Users can look forward to more UX improvements in future releases at all levels, including look and feel, core interactions, and workflows.

这仅仅是开始。 用户可以期待将来所有级别的UX改进，包括外观，核心交互和工作流。

Below is a concept visualization of several future UX improvements under investigation: We’re reimagining tools and actions to bring them closer to the user’s area of focus and help them stay in their creative flow. Additionally, this concept explores Workspaces that enable users to easily create and switch between Editor layouts that are optimized for specific tasks, e.g., World Building, Animation, Lighting, etc. 

下面是正在研究中的一些未来UX改进的概念可视化：我们正在重新设计工具和操作，以使它们更接近用户的关注区域并帮助他们保持创作流程。 此外，该概念还探索了使用户能够轻松创建并在针对特定任务(例如，世界建筑，动画，照明等)进行了优化的编辑器布局之间进行切换的工作区。

Data-oriented game creation and development is an important area of investigation that we’re dedicating a significant amount of user research and design effort into. We’re also working hard to evolve workflows to be intuitive, user-centric, and efficient as part of our long-term vision to empower creators to achieve their goals with ease.

面向数据的游戏的创建和开发是重要的研究领域，我们致力于大量的用户研究和设计工作。 我们还努力将工作流程发展为直观，以用户为中心和高效，这是我们长期愿景的一部分，旨在使创作者轻松实现目标。

We’ll continue to engage users for feedback to inform and validate future designs and we’d like to sincerely thank the community for sharing their valuable input thus far. 

我们将继续吸引用户的反馈意见，以告知和验证未来的设计，并衷心感谢社区 到目前为止 分享他们宝贵的意见 。

开发人员人机界面指南 (Human Interface Guidelines for developers)

If you’re an Asset Store developer with an existing Editor extension or package we have created a Transition Guide as part of our new Human Interface Guidelines site (currently in beta) to help you adopt the new themes, look and feel, and interactions. 

如果您是资产商店开发人员，并且具有现有的Editor扩展程序或软件包，我们将在 新的Human Interface Guidelines网站(当前为Beta)中 创建 过渡指南 ，以帮助您采用新的主题，外观和交互方式。

忍者大城市项目 (The Ninja Megacity project)

The Ninja Megacity demo shown in the screenshots above was created by the Graphics and Animation teams to demonstrate new features being released in the Animation Rigging package in Unity 2019.2. We used these tools to teach a Studio Workshop at this year’s SIGGRAPH and the example project is available on github. We then upgraded the project to Unity 2019.3 in order to test the new UX improvements featured in this blog post.

上面的屏幕快照中显示的Ninja Megacity演示是由图形和动画团队创建的，以演示 Unity 2019.2中 Animation Rigging软件包 中 发布的新功能 。 我们使用这些工具 在今年的SIGGRAPH 上开设 了 Studio Workshop， 示例项目 位于github上 。 然后，我们将该项目升级到Unity 2019.3，以测试此博客文章中介绍的新UX改进。

致谢 (Acknowledgements)

The work described in this blog post represents the combined efforts of many teams at Unity: R&D UX, PM, Brand & Design, Labs, Content, Product, QA, and Editor teams have all come together to envision and implement the Editor UX improvements. 

这篇博客文章中描述的工作代表了Unity众多团队的共同努力：R＆D UX，PM，品牌与设计，实验室，内容，产品，QA和Editor团队共同努力，以期实现并实施Editor UX的改进。

翻译自: https://blogs.unity3d.com/2019/08/29/evolving-the-unity-editor-ux/