品牌设计必备技！手把手教你创建品牌设计指南
优秀网页设计联盟-SDC-网页设计师交流平台-听讲座，聊设计，找素材，尽在优设网
& / & & / & 正文
Hi,我是优设小编
品牌设计必备技！手把手教你创建品牌设计指南
：很多设计师与创意工作者都忽视了指南的作用（有些人也称其为品牌宝典，或其中的一部分）——它给出了一系列清晰的准则，规定了线上线下的市场推广材料应该长什么样。
风格指南可以为你节约时间与金钱，减少遭遇的挫折，使市场推广材料更易于维护和创造。把它当作一套标注详尽的衍生品；它提供了如何实施的相关说明，有时甚至能让你深入了解其中缘由。
如果你不怎么确信你服务的每个品牌与公司都需要它，或者不确定如何创建，请往下读……
为何每个品牌都应该有设计指南
对于小公司或只有一个设计师的公司而言，设计指南似乎并无必要。但说真的，每个品牌都应当有风格和品牌指南，来确保他们产品的每种视觉元素统一一致。
先拿只有一个设计师的情况来说。如果你是你们公司项目中唯一的设计师。你设计他们的logo、名片和所需的其他所有市场推广材料。你对所有的元素都心中有数。
现在，一年后，公司规模扩大了两倍，突然他们需要再雇一个设计师来分担你的工作。这下好玩了，你得凭记忆教这个新人品牌的设计指南。其中包括很多过去一年内你根本没有考虑过的事情。
当然，如果什么重要的东西没有传达，他们会指责你没有教好新员工。
如果你可以给出一份设计指南，包含了他们所需的一切：颜色、logo尺寸和放置、字体使用等，事情就相当简单了。
又或者说你是为多个客户服务的自由职业者。一份设计指南可以使你轻松回到数月或数年前完成的作品中，而不必梳理旧文件来了解用了具体哪种字体，或是具体颜色的十六进制色值是什么。相反，你可以拖入一个文件，就能瞬间看到你所需的一切。
设计指南可以确保你的作品不会被一些新的、水平欠佳的设计师糟蹋了，他们并不理解你的设计如何发挥作用。你最不想看到的，是你精心设计的logo被缩得太小，或是与其他元素靠的太近，实际上这损耗了它的影响力（更糟的是，元素间的留白彻底被打乱了）。
为每个你服务的品牌创建设计指南，可以使你的工作更轻松，也让你的作品更加统一（使得所有图片显得更专业）。初入一个项目时，创建一套基础的设计指南并不怎么耗时间，却能省去你大量的工作，使你在这过程中避免无尽的挫败。
每套设计指南都会有细微差别，因为它取决于品牌有多复杂，可能需要多少种市场推广材料。不过有些基本的元素几乎在每套设计指南中都会出现。
每个品牌的市场推广材料中都应该使用统一的字体，无论线上线下。列出这些字体，配上例子和字符集，这点尤为重要。
别忘了除了字体使用之外，你可能还得指定标题、照片说明等文字的字号。指定字体族中禁用的特殊样式和字重也是个好主意，连字或备用字符该不该用，诸如此类。
品牌使用的颜色应当尽可能详细。这意味着不仅要提供网页使用的十六进制色值，还要有等价的CMYK甚至Pantone色值用于印刷。不是所有颜色都能完美无缺地在网页和印刷间转换，所以指定优先级是个好主意，这样不会导致最终颜色和你原先的颜色差别太大。
很多十六进制RGB色域直接转换时，若不进行人工调整，会在CMYK模式中发生剧烈的变化（某些蓝色通常会变灰暗，红色会偏橙色或粉色等等）。花时间确认和纠正每个色域，这样可以得到尽可能好的结果。还要确保检查颜色的印刷效果，而不仅仅是屏幕上。
Logo尺寸与位置
通常，多数logo太小会失去其展示效果。你可以设计一个备用logo（通常是简化版）用于小尺寸，或者就定义一个logo展示的最小尺寸。
还要指定logo周围需要多少留白，以保证不影响它的效果。指定logo能否以其他颜色形式呈现（尤其灰度模式），还有它是否只能用在中性背景色上，还是彩色的背景也可以。还要指定logo能否放在边框中，这种情况周围要有多少留白。
图标或其他图形
如果还有独有的特殊图标（或图标集），或者通用的特殊图片，那么指南中得指定这些东西。包含一个指向该图标集的链接，因为图标名并不唯一，容易搞混。
你还需要指定是否只能用某种特定的类型或样式的图片。比如，你可能会指定所有图片都需要包含某种特定颜色，或者都要加上复古的滤镜效果，或者都得是黑白的。
文案写作指南
尽管并非每套设计指南都会需要文案撰写说明，如果你的品牌想努力表现出一种特定的写作风格时，这是个好办法。
可能有些特殊词句会包括在内，同时可能还有些其他词句应该不惜一切避免使用（有时候因为他们与竞争对手有紧密关联）。指明这些非常重要。
可能还有一条，文案应当积极向上，或者要专业，或利用对特定人群有吸引力的语言。
网页的特有元素
尽管有很多元素通行于印刷品和网页间，还是有些网页特有元素，印刷品上是找不到的，网站中却普遍存在。
这包括按钮样式和层级、表单样式呈现之类。若没有一套清晰的规则可以遵循，要使这些东西在多个页面（甚至多个网站）保持统一，会是一项重大的挑战。
还要考虑其他元素
你可能还要考虑为下面这些东西增加指南：
· 品牌历史、愿景和个性化信息。这些在品牌宝典中很常见，可能在标准的设计指南中不多见。
· 社交媒体指南，包括应该分享的文章类型，还有各种品牌元素应该如何用于各社交网站。
· 网站中的设计布局和栅格系统标准，有时印刷广告中也有。
· 其他材料的指南，比如宣传册或名片。
· 所有元素的使用样例。
如果你想看一些有启发性的设计风格指南案例，看看我们去年秋季发布的。
设计指南该有多长？
设计指南的长度可以从一个页面到几十页，取决于品牌的复杂度，还有市场推广材料的种类。
如果是极简的网站，只有一个logo设计、明确的字体和用色，没有线下的材料，单页的设计指南勉强是够了。
但是，一个拥有众多部门、涉及诸多市场的巨型跨国企业，广告横跨众多媒体，就需要类似一本书来阐明所有用法。
不论哪种，你的设计指南只需要包含必要元素，但是要精确传达品牌视觉风格等信息。
一份活文档
你的设计指南不是一块石头。品牌是会进化的。会有新logo出现。网站会进行重设计。市场推广材料会更新。重要的是确保设计指南随着其他更新一并更新。
设计指南也有助于确保品牌以一种无缝的方式升级，尽量不会疏远你的用户。看品牌升级进展到哪里了，可以指出其自然进化的方向，好过鲜明的反差。
虽然设计指南应该具有流动性，会随时间变化，但还是要能查阅旧版本的设计指南。而且要确保你对设计指南做出的任何更改都是经过深思熟虑的，而不是无视现存设计指南的借口。
因为设计指南会随时间变化，确保每个需要的人都能获得最新版本，这非常重要。由于要更改指南的日期与版本，将文件放在云端服务器或其他中心位置是个好主意。
整合设计指南
设计指南中的元素可以整合进网站中。包括CSS文件开头的注释，大概描述一下颜色和所用字体，可以确保你遵循设计指南。
一套完整的设计指南，对于任何可能使用它的人来说应该要简单易用。让人可以通过公司服务器或云端服务器访问也是个不错的办法。你可以在CSS文件中包含一个链接，或是通过其他方法（除非它有密码保护或是放在内部服务器上，不然实际上都应该允许公众访问）。
内部还是公开文档？
越来越多公司向公众开放了它们的设计指南。它的意义在于：
1. 让需要它的人（设计师）可以轻松获得这些信息。你可以给他们一个链接，而不用发邮件或是提供密码。
2. 使品牌更加透明。
3. 如果你的品牌有新闻媒体报道时，它会很有用，因为记者可以获得关于如何使用你们logo的信息等等。而不用等你的公关部门（或个人）回复他们。
当然，如果你决定公开你的设计规范，你就得保证它设计精良，和其他任何销售和市场推广材料一样。这会增加创建设计指南的成本和时间，使得修改它也更加困难。
公开的设计指南也让其他品牌抄袭你变的容易。但你做什么都无法阻止别人这么做（除非法律途径），设计指南确实使这一点更容易。它为品牌抄袭者减少了步骤。
不过，一旦你对自己品牌和业务有信心，这一点对是否公开没多大影响。
将它作为内部文件，更新和修改会更方便，对于初创公司非常重要。指南本身也不需要“设计”，让它尽可能保持功能性。当你的设计师工作负担很重，这么做是有巨大好处的。
设计指南的要点，是为所有人简化和加速设计过程。确保它具备这个作用，不论公开与否。
最新鲜的指南类好文合集：
每个网站都有的404页面创建指南！
配色弱、非科班的设计师童鞋必备！
专为设计师写的Github学习方法！
原文地址：译文地址：
【优设网 原创文章 投稿邮箱：】
================关于优设网================
“优设网“是一个分享网页设计、无线端设计以及PS教程的干货网站。
【特色推荐】
设计师需要读的100本书：史上最全的设计师图书导航：。
设计微博：拥有粉丝量75万的人气微博 ，欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航：全球顶尖设计网站推荐，设计师必备导航：
———————————————————–
想在手机上、被窝里获取设计教程、和各种意想不到的”福利”吗？
添加 优秀网页设计 微信号：【youshege】优设哥的全拼
您也可以通过扫描下方二维码快速添加：
订阅更新：您可以通过
【推荐！设计师必备网址导航】
我们的团队
大家在关注实用必收！如何建立一套UI设计规范？（附众多神器）
优秀网页设计联盟-SDC-网页设计师交流平台-听讲座，聊设计，找素材，尽在优设网
& / & & / & 正文
Hi,我是优设小编
实用必收！如何建立一套UI设计规范？（附众多神器）
编者按：最值得收藏的UI设计干货！今天这篇从概念、灵感，方法及工具3个方面帮同学们理清UI，同时有一大波神器推荐 &&&
作者追波：
概念，灵感，方法和工具。
设计互联网产品，Style Guide / Pattern Library 和纯粹的 Specification 各具不同功能和作用，却都含“”的概念。
1. Style Guide / Pattern Library：
偏重视觉概念，一般以文档或图像格式呈现（不限定）。
内容：对设计作品中的字体（Typeface）、字型（Font）、色板、品牌标识规范（Brand Guideline）、Icon 等要素作出展示和说明。
主要作用于设计团队或设计师之间，展示产品的视觉设计风格。便于风格复用，规范第三方的品牌塑造（Branding）和接入。
实例参考（更多参考下文中“灵感”）：
| Kickstarter
| Dropbox（翻墙）
2. Style Guide / Pattern Library：
偏重（Web 前端）开发概念，基本都以网页文档形式呈现。
内容：对界面元素（UI Elements）的样式风格及实现其效果所对应的代码片段（HTML, CSS）作出说明解释，包含交互和动效设计（以 JavaScript 为主）。例如：常见的基础布局（Grid System）、字体排版（Typography）、按钮、菜单、列表、对话框（Dialog）、Tooltip 等等。
用于团队 Web 设计和开发协作，统一产品风格。复用时提升工作效率，同时也保证用户体验质量。
实例参考（更多参考下文中“灵感”）：
| MailChimp（翻墙）
概念 1 和 2 结合的实例（更多参考下文中“灵感”）：
| Salesforce
| Lonely Planet
3. Specification (Spec)：
介于设计与开发之间，由设计师直接在视觉稿（Mockup）中创建。
内容：主要由 Annotation（注释，国内俗称“标注”）和 Measurement（量度）构成。Annotation 既注释设计稿中界面元素所使用的字体字型、色值等，Measurement 则注明各元素的尺寸及它们的边距，留白等。
用于设计师与开发人员之间沟通和工作交接，保证开发出地产品界面和视觉稿高度统一。
一些常用的项目和文档都有采用上述的“概念”，比如采用了概念 1 的：
采用概念 2 的：
而概念 3 往往仅在公司或团队内部使用（详见下文“工具”）。
灵感和实例资源：
| 收录大量案例，该项目同时也收录了相关文章、工具、书籍、播客等。
| 一个直观的 Guideline 官方链接收集列表。
| 同上，托管在 Tumblr ，以博客形式呈现。
方法和工具：
1. Style Guide / Pattern Library：
方法不限，以能够准确展现视觉设计风格和品牌识别（Identity）的规范为标准。正因其偏视觉化，编写文档不是必须的，可直接用图形编辑软件产出。例如：
也可借助工具：
| Sketch 插件，基于视觉稿生成 “Style Guide”。
| 用于快速制作“Style Guide”的 PSD 模版，
| Frontify 是一个面向设计团队的协作平台，提供“Style Guide”生成和“Spec”工具。
| 解析 URl 对应网站的 Style（主要依靠分析 CSS 文件），展示相关信息，比如字体尺寸（font-size）、色板、浮动（float）采用数量等。
| 填入网站 URL，自动生成对应页面的“Style Guide”。提供 PDF 文件保存。
相关介绍：
2. Style Guide / Pattern Library：
因要制作出网页文档，且其中含有大量的 Web 组件（代码片段）和元素（视觉），可借助前端框架高效产出，比如相对大众的 ，。在大量的自由和开源前端框架项目中，选择有维护支持，自身喜欢或熟悉的即可。
可用工具：
设计师 Brad Frost 有一套叫做“原子设计（Atomic Design）”的 Web 设计理论，在该领域有一定影响，其核心概念就是复用“Pattern Library”，高率生产 Web 页面：
| Brad Frost（翻墙）
他为该理论创建了一个开源项目，基于 PHP： | Build Atomic Design Systems
（HTML, CSS, JS） | Google Web Fundamentals 提供的 Web 生产样板，支持创建“Pattern Library”形式的文档。（翻墙）
（PHP） | “Pattern Library”样板，类似 Pattern Lab。
更多方法类文章和工具列表可参考：
3. Specification （Spec）：
“Spec”应以尽量降低设计师精力消耗，并能让开发人员清晰理解为标准。提高效率并保证质量的基础，是选择合适的工具。
在绘制设计稿所用的图形编辑软件中启用扩展和插件，直接生产“Spec”，高效直击主题：
| Photoshop（$19，推荐，正在使用）
| Photoshop, Illustrator（$49 ,PS 和 AI 单独出售）
| Photoshop, Sketch（$39.99，PS 和 Sketch 单独出售）
| Sketch（自由）
一些其他插件也提供制作“Spec”功能，比如：
| Automated Design Delivery for Photoshop（$29）
| A Photoshop documentor plugin（免费）
相关介绍：
团队协作平台和其他工具：
| 简化设计师与开发人员之间的协作流程（Web 产品），提供 Slice（切图）、Spec、图层转 CSS 等功能。
| 同样是一款有质量的设计协作软件。目前仅支持 Sketch 设计稿，PS 支持仍在开发中。产品处于邀请内侧阶段。
| 上文“Style Guide 工具”提到过，属协作平台，支持对设计稿“Spec”。
| 可独立在系统中运行的 PS 协助软件，但需借用 PS 载入设计文档。提供 Slice，Spec 等功能。
相关介绍：
【优设四月最受欢迎的PS教程排行榜】
Top 1：效果超棒的极简风格海报！
Top 2：给心爱的妹子画一个Q版头像！
Top 3：上帝说，要有光！
原文地址：
作者：王瑞
【优设网 原创文章 投稿邮箱：】
================关于优设网================
“优设网“是国内人气最高的网页设计师学习平台，专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书：史上最全的设计师图书导航：。
设计微博：拥有粉丝量94万的人气微博 ，欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航：全球顶尖设计网站推荐，设计师必备导航：
———————————————————–
想在手机上、被窝里获取设计教程、和各种意想不到的”福利”吗？
添加 优秀网页设计 微信号：【youshege】优设哥的全拼
您也可以通过扫描下方二维码快速添加：
订阅更新：您可以通过
【推荐！设计师必备网址导航】
我们的团队
大家在关注使用其他账号登录
?点击上方“交互设计学堂”关注我们,送电子书
注：本文是Airbnb新的设计语言的一部分，由Airbnb首席设计师Karri Saarinen发布于airbnb.design。从事软件开发和设计工作,我们往往需要提出一个完整的一次性解决方案。但有时我们是受到时间的限制,或者我们只是还没有确定一个清晰的发展方向。一次性的解决方案并不是说它不好,但是如果它不是建立在一个坚实的基础之上,最终我们会发现自己还是不得不回过头来偿还技术积累和设计这笔债。
视觉语言就像任何其他的语言一样。如果不被使用它的每个人共享并理解，那么使用这种语言沟通将很容易出现误解。随着产品或整个团队的壮大，这种模式带来的问题也会越来越突出。
设计一直都是系统最主要的构成部分，设计规范是一种使产品达到可扩展性和可重复性的方式。无论是潘通色卡还是飞利浦发明的十字槽螺钉，这些设计规范使我们能够避免混乱,从而创造更好的产品。最适合建立设计规范的可能就是数字化产品领域了。但它往往不被我们视为优先级的事项。
更好、更快是一个设计规范最基本的要素。更好是因为一致性的体验能让产品更易用；更快是因为它为设计师提供了一套协作的共同语言。
一、为什么需要设计规范
Airbnb这些年增长非常快速。目前我们的设计部门有十多个专职设计输出小组。我们越来越意识到我们需要更系统的设计方法用来指导和提升大家的工作效率。我相信对软件行业来说，这个问题更严重。
1、缺少限制相比于其他设计领域，软件设计几乎没有物理限制。这就意味着任何一个问题都可能有多种解决方案，但这恰恰可能造成用户体验的不一致。因此作为产品所有者或设计师,我们必须创建并遵循自己的设计规范。
2、多人协作软件通常是由一个团队设计出来的，有时甚至可能是很大的团队。这就意味着，创造一个连贯一致的用户体验的难度会随着团队成员的人数增加而呈指数增长。另外，无论团队协作多么一致或团队多小,不同的人总会有不同的解决方案或设计风格,很容易导致体验割裂。
3、多个平台我们需要让产品应用于多种不同的平台和设备。为保证产品在多平台间的同步及体验的一致性，通常需要在不同平台上去做很多重复性的工作。
4、软件是连贯的软件的另一个不同之处在于，虽然它可以被认为是一个产品，但他不会像传统的消费品那样真的磨损或被更换。即使公司和其产品本身发生了大的变化，多年前的代码和设计仍然会存在于产品的许多地方。这就要求不断的维护和升级。
二、马上开始
为了迅速解决我们前面提到的挑战，我们挑选了一些设计师和工程师组建了一个小组，把手头的工作全部放下，在公司外面找了一个工作室，专心于设计创建这套设计语言系统（DLS）。
我们为DLS设置的目标是创建一个更美观和通用性的设计语言。通过定义好的可复用的组件来提高效率。为了集中我们有限的精力,我们优先选定了客户端平台：Android和IOS。
我们开始重新审视和打印出我们以往的那些设计稿。然后将这些设计稿按照顺序依次粘贴在一个板子上，这样我们就能找出哪块的体验比较糟糕并提出优化方案。我们认为,创建一个设计规范最好的开始方式就是先把现有的难题处理掉。我们每个人都分别专注于那些需要重新设计的产品页面或是某些模块，很快我们就建立起了一套指导原则：
1、统一性每个模块的设计都是整体的一部分,应该对整体的表现有正向的提升作用。不应该有单独的特性或风格。
2、通用性Airbnb在全世界都被广泛地应用。我们的产品和视觉语言应该被所有用户认可并理解。
3、形象化我们同时专注于功能设计和视觉设计，我们的产出物应该能清晰地引导用户的认知。
4、会话式我们使用了动态呼吸式的表现手法让用户能够轻易地理解我们的产品。
三、奠定基础
在开始设计这个系统之前,我们已经创建了一个基本的风格指南,我们称为基础部分。这个基础简单地定义了我们的字体、颜色、图标、间距和信息结构。当设计师们在各自探索多样化的创意设计方案时，这个基础风格指南对于一个统一的设计规范来说是必不可少的。我们觉得自己都非常努力，因为我们在为共同的理想工作。回顾我们集体工作的每一天,我们开始看到这个系统模式渐渐浮现出来。我们会在必要时采取纠偏措施,开始定义标准化的组件。
四、创建组件
一般来说,许多风格指南定义组件都被作为“原子组件”,然后用于构建更复杂的“分子组件”。理论上，这种做法能很好的构建连贯灵活的系统。而在现实中，更可能的情况却是：这些可复用的组件被各种方式整合在一起，形成一个更复杂的“分子组件”。其结果往往是造成了各种杂乱脱节的体验，使系统难以维护。
为了避免依赖“原子组件”，我们转而开始考虑把组件作为一个活的有机体元素。它们有功能和特性,是由一组属性定义构成,可以与其他元素共存，也能单独起作用。
一个统一的设计语言不应该仅仅是一组静态规则和单个组件构成的，它应该是一个不断发展的生态系统。
例如,我们的用户头像元素可能最初是被一个风格指南定义的,但最终被用于各种平台上时可能要面临不同的排列或呈现方式,这会导致我们后续难以更新。所以我们必须要在做好适配的前提下解决这个问题。
每个组件都会定义一些必需的元素(如标题、文本、图标和图片),有时也可能包含其他可选元素。这些元素在Sketch文档和代码层都要被定义。不是让层独立于组件起作用,我们要求每个组件都有一个层,并能在视图逻辑上可见或隐藏。
构建组件库
我们在创建这些组件的同时，会把他们收集在一个叫做库的根文件，这种做法贯穿整个设计过程中。一两周后,我们开始看到通过在反复的设计中使用库文件所带来的生产力上巨大飞跃。某天,当最后的原型确定了之后,我们的团队已经能够使用我们的库文件提供的框架在短短几小时内创造近50张设计稿。
随着库文件的扩张,我们开始把各个功能相似的独立组件整理到一个画板中，做好分类。这些画板由一系列常规的分类组成：导航，移动文本，图片和特殊类。
我们创建了一组用于手机的组件(iOS和Android),并让他们适配平板电脑。平板电脑上的组件在很大程度上跟手机上的相同的，从技术层面上来说只需要一套代码，两套不同的样式而已。类似于为网页设计而生的响应式设计方案，这些系统组件在外观和位置上都可以不同。设计师可以使用常规组件设计一个版本，之后就可以很容易地适应IOS和Android下的不同屏幕尺寸。
对于平板电脑,我们创建了一个简单布局的概念，如焦点视图，它聚焦于页面内容，模态窗口和网格布局。
所有的组件和视图都是用我们自己的技术视图框架构建的，用来处理这些风格，状态和自适应性。
我们知道这是一个具有挑战性的项目。这意味着要重新设计和重新构建应用程序中的大多数视图。我们尽最大的努力创建出一个视觉语言系统并于4月17日发布新应用程序。在以后的项目中,我们希望我们能够避免下面这些坑。
1、并不是所有的组件都是同等优先的
在大多数应用程序中都会有一套组件是经常重复使用的。对我们来讲，这些组件就像表格中的行元素。回想一下,我真希望我们花了更多的时间来考虑这些组件并产出一套强大的模式和组件库。事实上在最后，我们曾经被那些不一致的组件伤透了脑筋。
我们最初试图在Sketch中用创建符号的方式来做这些组件，但最后导致一片混乱。即使是现在，我们的设计文件有时仍难以维护。下一步，我们能找到更好的办法来维护和创建新组件。
这个项目要求我们在有限的时间内完成，导致我们忽视了一些文档记录的工作。文档的缺乏带来了一些本可以避免的混乱。像编程一样，创建良好的文档的至关重要的。对我们而言，这是一个迟早要做的事，以便让我们在做每个决定时有更清晰的思路和参考。
这是一个里程碑式的任务，虽然这让很多产品团队成员付出了很多，但最终我们发现创建一个自己的设计语言系统是非常值得的，也是迈向未来的巨大一步。
自从设计语言和代码可以方便的共享以来，我们现在可以在所有客户端平台上大致同步的构建和发布功能。而开发进度也明显更快了,因为产品工程师可以将更多的注意力放在写功能逻辑而不是视觉代码上。此外，工程师和设计师现在也都是用同一个设计语言。
设计师们对这个系统特别兴奋。它让产品人员更加关注真实的需求和设计体验，而不是填充、颜色和类型的选择。这套设计语言让我们的视觉风格保持了很好的一致性，让整个系统更加的流畅。这个系统还使我们所有人能够更快的实现高保真原型和任何想法的呈现，而成本却更低。
我相信在这套系统的辅助下，我们可以将更多精力集中在关注实际的用户体验和我们想要传达给用户的概念和想法上。
转载自：IXDC
回复003看8-12月精华文章目录
加微信，和老D一起学交互，我会在朋友圈多发些好文章哦。
另外新手小伙伴可以提问咨询，不过仅限3个问题哦。
欢迎投稿：
本文来自微信公众账号提交，由微信啦收录，转载请注明出处。
微信扫码 分享文章如何建立一套 UI 设计规范_百度知道
如何建立一套 UI 设计规范
我有更好的答案
组件无需标注，需要适当的配上标注图：除非有更好的方案进行全局替代。 UI Kit psd格式Style Guide pdf格式，为了直观。用于说明色相，从UI Kit的psd文件中提取即可、字号，如果设计师捉摸不定逻辑上的一致性和合适的层级设定。设计师可直接拖拽至PS中使用，避免每次迭代都出现新的方案造成不一致问题的放大，主要作用是指南。Style Guide中不会包含方方面面场景的情况、分隔线、字体，主要作用是提取。 标注图
png格式，可以参考更多以前交付给前端工程师的页面标注图，主要作用是参考，并说明界面中各组件的作用和使用场景，否则应尽量使用之前已应用的方案、间距等这些影响到风格形式的元素如何使用，我向设计师传达的一个原则是，如何建立层级
其他类似问题
为您推荐：
您可能关注的推广
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁}