UI设计中的规范总结

时间：2023-09-11 07:48:01 | 来源：网站运营

时间：2023-09-11 07:48:01 来源：网站运营

UI设计中的规范总结：内容大纲

一、设计规范的重要性
二、认识界面设计规范
三、设计规范的构成
四、如何建立设计规范
五、彩蛋规范文档资源



✪设计规范的重要性✪


所谓无规矩不成方圆，规范和秩序存在我们生活中的方方面面，工业时代有企业制定出标准化的流水线使效率成倍提升，互联网时代各大一线知名互联网公司谷歌和苹果也都有着自己的设计规范，大到平台以及系统小到单个产品。做为互联网设计师都知道好的规范可以提升效率、保持统一、提升精细度，那么什么样的规范是好的设计规范呢？
产品不同阶段规范的作用也有所区别，在产品初期规范的主要保障后续设计的高效和可扩展性，随着产品的扩展以及人员的增加会在这个时候不仅要延续之前的高效和可扩展性，同时还要方便查阅，以及便于设计与设计设计与程序的之间交接减少重复劳动，还需要保持整个产品不同页面的视觉语言统一性和控件组件及交互方式的一致性，大致可以总结为以下三点。


✪认识设计规范✪


“设计规范"并不陌生，网上也可以搜到很多设计规范，但是这些设计规范真的适合我所做的产品吗？什么样的设计规范是好的设计规范呢？这里先放一波比较知名的规范，熟知的有谷歌的Material Design、苹果的Apple Developer、以及Ant Design、Element等....我习惯把这些规范分类为系统平台级规范和产品业务设计规范


图片（Material Design）

图片（Apple Developer）

图片（Ant Design）：瞄准“四小”小生日、小聚会、小白领、小家庭


tips：你是不是把那上面那些链接都打开看了一遍了呢？想必机智的你已经看过上面的规范网站了，也对规范有了一定的了解。

✪设计规范的构成✪

回观几大一线互联网公司的设计规范和视觉语言大致可分为设计原则和基本视觉元素和构成。



设计原则：表现产品传递出的特征、气质、风格，通过情绪版等方法论梳理出表现这种特征、气质、风格的视觉表现形式为了达到一致性所需要遵守的一种视觉表现形式。 一般设计原则包括界面布局、对齐、对比、重复、亲密、平衡。

基本视觉元素：基本视觉元素即组成界面所需要的元素，一般由线条、图形、图标、明暗、色彩、质感、空间等，也还有一些比较重要但经常被忽略的隐性元素例如对齐线、间距、留白等，各个元素表现方式不同所传递出的注目度也有所不同。



✪如何建立设计规范✪

拆解了设计规范的构成了解界面的构成的基本组成元素有哪些后可以更好的来帮助我们来构建设计规范。以原子设计原理五步走来构建规范，五步分别由原子——分子——组件——模块——模块。






1、定义基础规范这里可理解为定义原子主要包括文字字号字重、色彩色调、图标层次形式等界面重最小构成单位，归纳界面中的信息层级有秩序的提炼出来。







2、分子由原子组合形成的简单的界面组件例如按钮（由文字加一个矩形），或文本框（由一个矩形和一个提示文本）






3、组件 界面中比较通用由原子和分子组成相对复杂的界面元素（例如导航栏、列表、卡片等）

4、模块由原子、分子、组件进行组合排列形成的内容结构

5、页面将实际内容套件在特定的模版，页面是模版的具体实例，最后是整体的页面。




彩蛋来啦！！！ 彩蛋来啦！！！ 彩蛋来啦！！！

后台回复“规范”领取为你精心准备的各大平台规范源文件吧！！！