组件（component）就是可复用的，由一些元素按照一定的顺序和空间排列、归纳、重组后构成的元素组合

比如电商瀑布流中商品块可以是由图片，标题，标签，价格，组成的一个组件简单拆分一下就是这种...

使用组件的优势：一、统一，组件的复用可以保证使用同一组件模块的样式一致，减少拖拽所形成的偏差，在不同页面使用使整体风格统一；二、高效，可以全局修改内容；三、灵活、可以快速自由组合；四、复用，不仅在一个项目中可以使用，在其他关联项目同样可以使用；五、便捷，对于团队来说有统一的组件库避免了多人多风格的现象，有助于提升整个产品的视觉统一与交互规则的统一，同时也方便后期的修改，更新迭代等工作的进行。当然组件不仅局限于UI设计中样式 也可以用于运营banner，h5等 例如一键更换图片与文字内容形成新的所需要的图片等。

常用组件库

常用组件库：

apple UI design resource    ----------   https://developer.apple.com/design/resources/

蚂蚁金服设计规范  -----------  https://ant.design/docs/spec/introduce-cn

we UI微信组件库 ----------   https://developers.weixin.qq.com/miniprogram/design/

vant 有赞组件库 ----------   https://youzan.github.io/vant/#/zh-cn/design/   (  https://vant-ui.github.io/vant/#/zh-CN/design#se-cai-gui-fan)

element 饿了么（B端）---------   https://element.eleme.cn/#/zh-CN     （https://element.eleme.cn/#/zh-CN/component/installation）

京东taro UI组件库 ---------   https://taro-ui.jd.com/#/docs/introduction

阿里Clarity design  ---------   https://design.teambition.com/resource/design-resource

组件的整理与归类：可以把页面栅格化处理，根据栅格的宽度搭建页面

组件的命名：可参考  xx类别/xx模块/xx组件/xx状态 ，要耐心分类 不要偷懒

一个电商组件规范

sketch组件解析：

得到的结果如下

sketch如何建立一条图片素材库

一些组件的拆解与参考与注意的点

00000000000011