ai智能时代 设计师的出路
The advent of artificial intelligence confronts us with a paradigm shift for our society. In many fields, what was previously man-made, could tomorrow be done by an AI. In the near future, changes and challenges await us which we will have to face in a way that was previously unimaginable. We will have to share our world with artificial intelligence, rethinking how we produce work and our social models.
人工智能的出现为我们的社会带来了范式转变。 在许多领域，以前可以人工制造的东西明天就可以由AI完成。 在不久的将来，变革和挑战等待着我们，我们将不得不以以前无法想象的方式来面对它们。 我们将不得不与人工智能分享我们的世界，重新思考我们如何生产工作和社会模型。
Like many other sectors, the world of web design has also been affected by this change. In recent years, in fact, several tools have been created that implement AI in the field of design and web development.
像许多其他部门一样，网页设计的世界也受到了这一变化的影响。 实际上，近年来，已经创建了几种在设计和Web开发领域中实现AI的工具。
Many companies have started to adopt artificial intelligence to create tools that help developers and designers in creating web projects. These new tools facilitate the work of professionals, helping them to perform their tasks, so as to save time in some steps of the process of creating a digital product.
许多公司已经开始采用人工智能来创建工具，以帮助开发人员和设计人员创建Web项目。 这些新工具可促进专业人员的工作，帮助他们执行任务，从而在创建数字产品的过程的某些步骤中节省时间。
Although some of these tools are still in the experimental phase and still require a process of improvement, it is already glimpsed how artificial intelligence and its machine learning models can inspire a new way of working in the field of design and front-end development.
尽管其中一些工具仍处于试验阶段，仍需要改进的过程，但已经瞥见了人工智能及其机器学习模型如何激发设计和前端开发领域的新工作方式。
“Some people call this artificial intelligence, but the reality is this technology will enhance us. So instead of artificial intelligence, I think we’ll augment our intelligence.” — Ginni Rometty
“有人将其称为人工智能，但现实情况是，这项技术将增强我们的实力。 因此，我认为我们将取代人工智能，而不是人工智能。” —吉妮·罗密蒂(Ginni Rometty)
Let’s start to see together the main tools powered by AI born in recent years to help designers and developers.
让我们开始一起看看近年来诞生的AI支持的主要工具，这些工具可以帮助设计人员和开发人员。
伊扎德 (UIzard)
UIzard is a tool that transforms your hand-drawn wireframes into digital design and front-end code automatically.
UIzard是一种工具，可将您的手绘线框自动转换为数字设计和前端代码。
By simply taking a photo with your smartphone of your sketch drawn on paper, UIzard will transform it in a few moments into a high fidelity prototype. Once translated into digital, you can customize its style-guides, export the design to Sketch and finally obtain the front-end code.
通过用智能手机简单地在纸上绘制素描照片，UIzard将在短时间内将其转换为高保真原型。 转换成数字后，您可以自定义其样式指南，将设计导出到Sketch并最终获得前端代码。
To perform the magic that transforms your sketch into digital design and code, UIzard uses artificial intelligence through machine learning models, Computer Vision (technology for building artificial systems that obtain information from images or multi-dimensional data) and deep learning networks.
为了执行将草图转换为数字设计和代码的魔力，UIzard通过机器学习模型，计算机视觉(用于构建从图像或多维数据中获取信息的人工系统的技术)和深度学习网络使用人工智能。
This tool was created by an international team of engineers, designers and entrepreneurs who had already anticipated the times in 2017 and created a system to generate code from a screenshot of a User Interface graphics (Pix2code).
该工具由一支由工程师，设计师和企业家组成的国际团队创建，他们已经预见了2017年的时代，并创建了一个从用户界面图形屏幕截图(Pix2code)生成代码的系统。
Twitter: @UizardIO
推特： @UizardIO
Microsoft的Sketch2Code (Sketch2Code by Microsoft)
Sketch2Code was launched by Microsoft in late 2019 and is able to transform your pen and paper designs into an HTML prototype with the help of AI.
Sketch2Code由Microsoft在2019年末推出，能够在AI的帮助下将笔和纸的设计转换为HTML原型。
Thanks to the use of Computer Vision, the Microsoft team has built a system that understands what the designer is designing and translates it into HTML code. Sketch2Code allows you to speed up the manual code creation process by automatically carrying out this task.
由于使用了Computer Vision，Microsoft团队建立了一个系统，该系统可以了解设计人员的设计并将其转换为HTML代码。 Sketch2Code允许您通过自动执行此任务来加快手动代码创建过程。
Custom Vision and Computer Vision APIs (Azure Cognitive Services) are used to identify objects and recognize handwriting; and through the Azure Cloud Platform, objects that help identify the layout are returned. And finally the layout is passed to the MVC Sketch2Code web application to generate the HTML code.
自定义视觉和计算机视觉API(Azure认知服务)用于识别对象和识别笔迹； 并通过Azure云平台，返回有助于识别布局的对象。 最后，将布局传递到MVC Sketch2Code Web应用程序以生成HTML代码。
前线 (Fronty)
Fronty is an online tool that converts an image into HTML / CSS code thanks to AI.
Fronty是一个在线工具， 借助 AI，它可以将图像转换为HTML / CSS代码。
This tool allows you to create a website simply by uploading an image of your design. Once your design is loaded, Fronty will automatically generate the front-end code (HTML / CSS) in minutes.
使用此工具，您只需上传设计图片即可创建网站。 加载设计后，Fronty将在几分钟内自动生成前端代码(HTML / CSS)。
Furthermore, through their UI editor, you can easily modify the content and design of your website online. Fronty is able to return clean code with semantically correct HTML and source code based on powerful SCSS.
此外，通过其UI编辑器，您可以轻松地在线修改网站的内容和设计。 Fronty能够使用语义正确HTML和基于强大的SCSS的源代码返回干净的代码。
Fronty was launched in late 2019 by Tigran Vardanyan in California. It is possible to try a demo of the tool on the official website.
Fronty由Tigran Vardanyan在加利福尼亚州于2019年底推出。 可以在官方网站上尝试该工具的演示。
Twitter: @fronty_com
推特： @fronty_com
TeleportHQ的游乐场 (Playground by TeleportHQ)
TeleportHQ is an open source platform that uses AI to create ‘real-time design-to-code’ tools.
TeleportHQ是一个开源平台，使用AI来创建“实时设计到代码”工具。
In 2018 TeleportHQ first launched the video (above) which showed how a wireframe drawn on a blackboard was transformed in real time into front-end code. The result was impressive!
TeleportHQ在2018年首次发布了视频(上图)，该视频展示了如何将黑板上绘制的线框实时转换为前端代码。 结果令人印象深刻！
The process had been possible thanks to the Computer vision, which is trained to recognize hand-drawn UI elements, and a machine learning model built using TensorFlow (open source platform for machine learning developed by Google Brain team).
得益于经过培训的计算机视觉，可以识别手绘UI元素，以及使用TensorFlow(由Google Brain团队开发的开放源代码的机器学习平台)构建的机器学习模型，该过程得以实现。
Since then TeleportHQ, a company born in Romania, continue his research in the world of AI for web design.
从那以后，出生在罗马尼亚的TeleportHQ公司就继续在AI领域进行Web设计研究。
Recently launched a new AI-powered platform for Front-End Development in beta: Playground.Playground is a platform for modern front-end development that requires little code / no code. It is a visual development tool that allows you to create user interfaces quickly and easily without programming.
最近在beta版中推出了一个新的AI驱动的前端开发平台： Playground。Playground是用于现代前端开发的平台，几乎不需要任何代码。 它是一种可视化开发工具，使您无需编程即可快速轻松地创建用户界面。
TeleportHQ is now working on an engine of previsions for the platform. This means while you are working, the platform will offer you the best steps to follow based on the training received on your behavior within it.
TeleportHQ现在正在为该平台进行引擎预配置。 这意味着，在您工作时，该平台将根据收到的有关您的行为的培训为您提供最佳步骤。
You can try the platform for free here: Playground
您可以在此处免费试用该平台： 游乐场
Twitter: @teleportHQio
推特： @teleportHQio
Zecoda (Zecoda)
Zecoda is a tool that with the help of artificial intelligence provides you with the opportunity to transform your Sketch files into front-end code quickly and easily.
Zecoda是一款借助人工智能工具，可让您有机会轻松快捷地将Sketch文件转换为前端代码。
Simply upload your design file to Zecoda and in a short time you will be returned the HTML, CSS and JavaScript code, with the Vue.js framework. With Zecoda you can transform your design into a responsive website ready to be published, without having to write the code.
只需将您的设计文件上传到Zecoda，即可在短时间内通过Vue.js框架返回HTML，CSS和JavaScript代码。 借助Zecoda，您无需编写代码即可将设计转变为可发布的响应式网站。
Zecoda defines itself as an instrument with 90% artificial intelligence and 10% human touch. This is because it combines the speed of deep learning with the quality and safety given by a web developer review. In fact, the code that will be returned to you will always be checked by a developer.
Zecoda将自己定义为具有90％的人工智能和10％的人为触觉的仪器。 这是因为它将深度学习的速度与Web开发人员评论提供的质量和安全性相结合。 实际上，返回给您的代码将始终由开发人员检查。
On the site you will find examples of responsive websites created with Zecoda and also the price table.
在该网站上，您可以找到使用Zecoda创建的自适应网站的示例以及价格表。
Twitter: @ZecodaHQ
推特： @ZecodaHQ
Artyline (Artyline)
Artyline is an AR mobile app that allows you to instantly create interactive high fidelity prototypes based on your handmade sketches.
Artyline是一款AR移动应用，可让您基于手工草图立即创建交互式高保真原型。
Imagine being able to view your prototype drawn on paper in Augmented Reality to present it in a briefing. With Artyline this is possible!
想象一下，您可以在增强现实中查看纸上绘制的原型，并在简介中进行展示。 有了Artyline，这是可能的！
In addition, this iOS app offers you the possibility to choose creative screens with modern ui & usability styles options in real time, as well as the possibility of creating Usability-testing, through Eye-tracking and Click-tracking analytics.
此外，此iOS应用还为您提供了实时选择具有现代ui和可用性样式选项的创意屏幕的可能性，以及通过眼动跟踪和点击跟踪分析创建可用性测试的可能性。
The steps to use the app are simple: draw your sketch, scan it with the app and in a few moments you will get your digital sketch in AR.
使用该应用程序的步骤很简单：绘制草图，使用该应用程序进行扫描，稍后，您将在AR中获得数字草图。
Artyline is enhanced by artificial intelligence, thanks to which it recognizes sketch elements using Computer Vision and converts them into a ready-made mockup on your smartphone in Augmented Reality.
人工智能增强了Artyline的功能，这使得Artyline可以使用Computer Vision识别草图元素，并将其转换为增强现实中智能手机上的现成模型。
To better understand how it works, take a look also at the Artyline demo on Youtube.
为了更好地了解它是如何工作的，还请看一下Youtube上的Artyline演示 。
Twitter: @StartupArtyline
推特： @StartupArtyline
结论👾 (Conclusion 👾)
It is clear that Artificial Intelligence is here to stay and we can only understand it and derive the maximum benefits from it, always reflecting on keeping this technology ethical and respectful of human work.
显然，人工智能将继续存在，我们只能理解它并从中获得最大的收益，始终在思考保持这种技术符合道德并尊重人类工作。
The tools shown above make us understand how artificial intelligence can help simplify the work of designers and front-end developers. The evolution of these tools will help us in the design and will allow to speed up the processes of creating web projects. However, we will have to think if these tools can one day bypass the functions of some professionals, such as front-end developers. If in fact it is still difficult to think of an AI that creates creative designs, it is no longer absurd to imagine a tool that creates front-end code independently, as the tools above demonstrate.
上面显示的工具使我们了解了人工智能如何帮助简化设计人员和前端开发人员的工作。 这些工具的发展将帮助我们进行设计，并将加快创建Web项目的过程。 但是，我们将不得不考虑这些工具是否有一天可以绕过某些专业人员(例如前端开发人员)的功能。 如果实际上仍然很难想到可以创建创意设计的AI，那么像上面的工具所示，再也不用想象可以独立创建前端代码的工具了。
The challenge for web design is to be able to understand how it is possible for us to support artificial intelligence in the creation of digital projects, without losing our “human” value.
网页设计面临的挑战是能够了解我们如何在创建数字项目时支持人工智能，而又不失去我们的“人类”价值。
Like every revolution brings changes, artificial intelligence will also bring new perspectives, in which new employment opportunities will arise but some professions will also be lost. The important thing is to understand this revolution and, somehow, anticipate its times, rethinking our work, acquiring new skills so as not to be found unprepared and thus knowing how to reinvent itself.
就像每场革命都会带来变化一样，人工智能也将带来新的观点，在这些观点中会出现新的就业机会，但也会丢失一些专业。 重要的是要了解这场革命，并以某种方式预见革命的时代，重新思考我们的工作，掌握新技能，以免被发现毫无准备，从而知道如何进行自我改造。
We still do not know how it will be possible to maintain a right balance between human and artificial intelligence, but it is our duty to think about it and try to build models that allow society to take advantage of the latter in favor of the former.
我们仍然不知道如何在人类和人工智能之间保持适当的平衡，但是我们有责任思考并尝试建立模型，使社会能够利用人工智能来支持后者。
翻译自: https://blog.prototypr.io/ai-powered-tools-for-web-designers-adc97530a7f0
ai智能时代 设计师的出路
扫一扫
20万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
