axure pr动态可视化元件库在哪有_产品经理如何制作自己的元件库

【为什么要做元件库】

在使用axure进行原型设计的时候,大家除了使用官方的元件库之外,还可以使用第三方的元件库,第三方的元件库很多,也非常好用,比如蚂蚁金服、饿了么等等,但是这些元件库通常是大而全,而且包含了丰富的样式和动态效果,对于普通使用者来说,使用起来不太方便。

对于产品经理来说,尤其是中后台的产品经理,还是要把精力放在业务逻辑上面,而且中后台的产品经理一般使用的页面模式也不是很多,基于此,本人制作了一套基于web端中后台产品经理的元件库。

【如何制作元件库】

如前所述,我们制作元件库的目标是为了产品经理快速的进行原型设计,所以我们不会从字体、颜色这些比较细节的元素考虑,主要还是考虑产品经理主要用的的一些大的模块。通过分析,我把元素分成这几个部分:

1、框架:其实说直白点,就是页面的布局,这是原型最基础也是最核心的部分,目前比较主流的布局方式主要包含两级菜单-上下结构、两级菜单-左右结构和三级菜单结果。

5ef43af77d49388294ad7921db1d27d6.png

2、表格:表格是最常用的元素,中后台的数据很多都是通过表格的形式进行展示,常用的表格形式有查询表格、编辑表格、统计表格和折叠表格,如果做的好的话,表格还用通过中继器动态的进行数据展示。这这一步里面,

18cd3648e2292ca3e543b61f0dd8fc4c.png
查询表格

3、列表:除了使用表格的形式进行数据展示之外,有时候还使用列表的形式展示数据。列表的展示形式也分成两种,普通列表和表格列表,具体实现后如下所示:

77bab11a39ba9c3b2a1326a2f6924c58.png
表格列表

4、表单:表单一般用来录入数据,包括单列录入表单、多列录入表单以及复杂录入表单,可以满足多种数据录入的场景:

c3663f1816363c591e9b8f57b5be9039.png
简单录入表单

5、弹框:在有些业务场景里面,我们还需要使用弹框,弹框也分成三种:录入弹框-单列、录入弹框-多列和警告弹框。

6173722edd795ae9f2367553ca46ce57.png
警告弹框

6、提示:提示包括警告提示、全局提示和气泡提醒,通常用于需要对用户进行提醒的环节。

7c3b7aab5b52591cc24b26795b7ce161.png
气泡提示

7、异常:异常一般包括403、404和500三种异常,这些页面都是大同小异,就是一次错误说明以及导航的按钮。

020ab44487c520016746673bcb34549b.png
403异常

8、流程:流程梳理是产品设计里面最核心的工作,流程图分成普通流程图和泳道图。普通流程图适用于简单的业务场景,而泳道图适用于跨职能的业务场景。

6aa7845f27d25885939ea06e0ad0bf57.png

【总结】

通过上面的8个方面,一个适用于产品经理的元件库就做好了,对于中后台的产品经理来说,已经可以满足日常原型设计工作的需求了,当然随着项目的实践,这个元件库可以继续调整和优化,最终成为产品经理原型设计的好帮手。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值