4.1 确定组件库内容

对于新产品来说，业务体量较小，较难抽取共性，组件也不全面，因此较好的方式是参考大厂的组件库确定要做哪些组件，它们的相对成熟，参考价值较高。

对于已经成熟的产品来说，我们可以直接全面体验查看页面，找出所有用到的组件，除基础组件外，提炼出复用率高的业务组件进行结构化和组件制定。

4.2 搭建每一个组件库

以提示弹窗为例，演示单个组件的建立方法。

1. 定义组件：根据业务定义提示弹窗使用场景，用于重要信息的提醒，且需要用户自己关闭操作。

2. 拆分组件：这一步是将组件拆分为元件。对提示组件进行拆分后得到如下：

3. *输出根据业务场景，我们把各个元件*为组件，建成组件集，并定义各种组件的使用规则。

4.3 输出文档并替换到产品中

在组件库建立完成后，只有在日常设计中真正使用组件库，提高组件库在设计稿中的覆盖率，才能真正达到组件库的效果。这就要求我们要输出一份完整的组件库描述文档，在团队中进行推广，加强设计团队的公用意识。设计团队内部可以直接维护一套组件库，设计师设计时直接调用公共组件库组件使用。

另外，我们还要与开发工程师配合逐步完成现有页面的组件替换。

4.4 定期维护组件库

组件库的内容并非一成不变，而是在不断地更新，以保证所包含的组件都是最新和有用的。与其他数据一样，组件也会有增删改。我们需要定期对组件库进行维护。

增加：当有新的组件产生时，我们需要通过判断它的拓展性和复用率，以确定是否将它入库。

删除：随着产品的不断升级迭代，如果某个组件已经不用或复用率很低时，我们可以考虑是否要将它删除。

改：不可避免的，组件会随着业务而进行升级，我们可以通过数据埋点和A/B test的方式来确定某个组件是否要进行改动。

由于篇幅过长，我将文章分成三个部分，有兴趣的朋友可以关注我们，期待剩下的两期吧！

感谢你的阅读支持 · 欢迎留言互动！

本文由 @三原设计 原创发布于人人都是产品经理，未经许可，禁止转载。

题图来自Unsplash ，基于 CC0 协议

该文观点仅代表作者本人，人人都是产品经理平台仅提供信息存储空间服务。