设计系统

设计系统就像产品团队的通用视觉语言。它加快了设计过程,并在团队之间建立了桥梁,使产品成为现实。

在UXPin中,您可以创建自己的设计系统,帮助您的团队在提高质量的同时最小化设计债。

设计系统让您在项目的早期阶段收集设计指南和资源。这反过来又帮助您维护一致性并简化团队的流程。

设计系统可以通过仪表板的顶部访问-在这里您还可以创建一个新的设计系统或访问现有的设计系统。

创建设计系统

开放设计系统开始建造一个。您将有可能从头开始,从现有的设计系统库或模板创建一个新的、完全空的设计系统。在本文中,我们将重点讨论前两个选项。

从头开始创建一个设计系统

若要创建空设计系统,请选择从头开始创建.这将创建一个与设计系统同名的相应设计系统库。您可以随时更改左上角的名称。

每个设计系统由以下四个部分组成:颜色排版资产而且组件.您可以从您想要的部分开始,并通过拖动到结构中的所需位置来重新排列它们。

要添加颜色,请在颜色节输入HEX代码,单击“Enter”。可以通过双击每种颜色的名称来重命名它。自定义名称将显示在预览的规格模式。

若要上传资产,请转到资产节,单击“上传。svg格式的图像或图标”。可以在上传后重命名。

当谈到排版,您可以在编辑器中直接从画布中添加文本样式和格式。开放你的原型,从左侧面板底部的列表中选择DS库,在画布上选择文本元素,并通过单击将其添加到文本样式部分+文本样式.字体及其大小和重量将上传到图书馆及其设计系统。

添加组件与编辑器中的文本元素相同。打开原型,选择画布上的元素,并通过单击将其添加到Components部分+组件

用DS库创建一个设计系统

若要从现有设计系统库构建设计系统,在创建新的设计系统时,必须首先从下拉菜单中选择该库。库中的所有组件现在都将包含在设计系统的相应部分中。但是为了做到这一点,您首先需要拥有编辑设计系统库的权限。一个设计系统库只能有一个对应的设计系统。

添加描述

你可以描述设计系统的每个部分添加描述在这里.除了文本之外,这些描述还可以包含详细的链接、颜色示例、代码元素和其他帮助开发人员实现设计的信息。

您可以为整个部分、类别添加描述,在排版和组件的情况下,甚至为单个文本样式或元素添加描述。

特定组件的描述将与设计系统的名称一起作为规格模式的单独部分显示在预览中。

设置权限

您可以决定谁可以查看和编辑您的设计系统-整个团队,特定的团队成员或只有您。在仪表板中打开设计系统,将鼠标悬停在更多操作图标上对于所选的系统,请选择权限从下拉列表中。

请记住,这些权限将设置为设计系统库和设计系统。

编辑设计系统

要编辑或删除设计系统,必须先登录并具有权限。有权限的用户可以删除整个设计系统,编辑其部分或只是选定的元素。编辑模式还允许您在两种显示模式之间进行选择,堆栈或磁贴。

要在“编辑器”中访问设计系统,请打开左侧的“设计系统库”部分。如果一个库有一个相应的设计系统,它旁边就会有一个标签。单击它,匹配的系统将在一个新选项卡中打开。

在《设计系统-字体》中有两种方法来检查排版和文本风格。字体是根据您选择的字体自动生成的。它显示了一个字体及其所有样式和一个交互式示例,以便您可以看到您的字体如何在操作中表现。文本样式显示您从画布中添加的特定文本及其详细属性。

共享设计系统

您可以轻松地与团队、外部合作者和涉众共享您的设计系统——即使他们没有活跃的UXPin帐户。做那件事:

在仪表板中打开要共享的设计系统并单击设置在左下角。复制模式中的链接并发送给任何你想要共享设计系统的人。

Baidu
map