Qt Design Studio —— UI开发的新时代

本文翻译自Qt Design Studio – The New Age of UI Development

原文作者：Petref Saraci，Qt Design Studio产品经理

校审：Haipeng Yu

我非常高兴向大家宣布Qt发布了一个特别的新产品。

在发布Qt 3D Studio 2.0的同一天，我们同时发布了最新、最火的Qt设计工具扩展包 —— Qt Design Studio

Qt Design Studio是一款UI设计和开发工具，它让设计师和开发者可以迅速设计原型，并且开发复杂的可伸缩的UI。

我敢说大家与设计师或者开发者配合的时候（这取决于您的角色），都遇到过许多特别典型的挑战。

开发者们通常都会觉得设计师们不太“接地气“，设计师只会给开发者发一份冗长、详细的UI技术说明书PDF。有时，这发生在完成初始的评估工作后。大多数情况下，还需要把这份UI技术说明书和目标硬件能力进行匹配，整个过程含糊不清和不可靠，非常耗时间。同样耗时间的还有与设计师”协商“的过程，这意味着在项目进度的重压之下，要不断地妥协和修整设计。对于最终产品的质量来说，这不是好兆头。

从另一个方面来看，设计师们往往关心的是自己想到的最好的设计创意--这是设计情怀。但是实际中什么样是可行的，这一点对他们而言就很难理解，除非看到他们的设计实际运行起来。他们也希望能够分分钟测试新的方法并优化设计，而不是等待数周（最坏情况）直到实际硬件运行后才能迭代设计。设计师们通常都希望尽快请真实用户测试他们的设计，但这一般都会因时间所限而半途放弃。

然而真正的麻烦在于：由于这种低效的工作方式，最终用户的使用体验糟糕，并蒙受高昂的损失。

我们认为，一旦设计师和开发者能高效合作，就能促进和激发产品创新,并最终大幅提升用户体验。

使用Qt，QML以及Qt Design tools增强工作流

Qt Design Studio是可以被设计师们和开发者们一起使用的工具。单这一点就能让两者间的合作变得更简单、更协调。设计师可以查看图形视图，而开发者能够查看QML代码。通过该工作方式，设计师可以把他们的Photoshop设计在几分钟时间内运行到实际设备上去！

Qt Design Studio的详细特性：

• Qt Photoshop Bridge —— 在Photoshop中创建您的UI设计和UI组件，然后把它们导入到Qt Design Studio中。这包含一个先进的Photoshop插件，它能把您的设计翻译成QML语言，并导入到Qt Design Studio中。
• 基于时间轴的动画 —— 创建高级动画从来都不是容易的事情。基于时间轴/关键帧的编辑器，它能让设计师为各种类型元素创造每个像素都完美的动画，而不需要写任何一行代码。
• QMLLive Preview —— 在桌面、Android设备、Boot2Qt设备上直接运行和预览您的应用。实时地在目标设备上检查您修改的效果。
• QML Visual Effects  —— 在您的设计上直接应用开箱即用的可视效果。例如：模糊、上色、发光或更多。您甚至可以在时间轴编辑器中添加可视效果动画。
• QML Shape Items —— 许多个开箱即用的形状，例如：扇形，弧线、三角形等，随时可以帮助设计原型和创建定制的QML可视效果。
• 管理和创建定制的、可复用的元件 —— 只需几次鼠标点击一可以把Photoshop的图层变成可以被不同项目复用的元件。
• 还有许多， 例如：简单的图层和状态管理。

这些关键特性将在1.0版本中彻底完成并优化，该版本预计将在今年年底发布。同时，现在发布的技术预览版已经包含了许多差不多可用的关键特性，衷心期待能得到大家的反馈。

从哪里可以下载Qt Design Studio技术预览版？请访问我们的Qt Design Tools网页，点击2D Feature Highlights下的“Get Qt Design Studio Tech Preview“按钮，申请为期10天试用，您也可以点击该页面右侧的Contact Us联系我们中国团队申请延长试用期。为加快审核流程，请务必填写完整、准确的联系方式和公司信息。

我们计划把Qt Design Studio增加为一个商业版客户可以免费使用的工具。技术预览阶段不需要使用商业许可证。但是，如果您要发布使用Qt Design Studio技术预览版开发的应用程序，您需要有效的商业许可证。目前，我们也正在准备开源版本的选项，完成后我们将发布更多信息。