域名百科吧

 找回密码
 立即注册
搜索
域名百科吧 首页 营销杂谈 查看内容

工作效率系列 | 如何制作交互组件库

2017-4-11 09:54| 责任编辑: ymbk8| 查看: 257| 评论: 0

摘要: 曾几何时,每次交互稿都是徒手画,或者截个图在现有的界面上改造。渐渐感到同一平台,每个版本都有很多重复劳动,是时候做个交互组件库了~ 什么是组件库? 就是类似axure左侧栏的这一坨标准控件,方便直接拖拽使用 ...

曾几何时,每次交互稿都是徒手画,或者截个图在现有的界面上改造。渐渐感到同一平台,每个版本都有很多重复劳动,是时候做个交互组件库了~

什么是组件库?

就是类似axure左侧栏的这一坨标准控件,方便直接拖拽使用。

但如何制作满足自己产品需要的交互组件库,一开始是模糊的。最初只是根据自己的需要随便列一些出来,在做的过程中逐渐清晰。

交互组件库的作用:

  • 提高个人工作效率
  • 方便多人合作
  • 使交互文档具有统一美

哪些东西可以做成交互组件?

只需记住一点:当你感觉到某种UI组合,每次都需要重新画一遍的时候,就可以考虑把这种UI组合做成交互组件。

上面所说的“重复劳动”对不同人来(媒体人创业,战斗基因为何彪悍? )说可能定义不尽相同。比如对我来说,即使把Tab的选中状态变一下,也是一种重复劳动。那我就会把不同Tab的选中状态都做一份。这样等到要制作“我的音乐”相关交互的时候,直接把下面第二个组件拖过去就可以了。

但对于某些Tab组合来说,每个Tab底下的内容可能是差不多的,做交互的时候往往只需要表达第一个Tab下的页面就可以了。这种我就只把第一个Tab的选中状态做一下。

总得来说,怎样对自己方便就怎样做。(马化腾:互联网会像水和电一样成为“传统行业”)

交互组件应该具备的特点:组件组件,最大的一个特点就是可组合性。

整理的时候,思考哪些UI组合是不同页面都会共用的,把这些元素剥离出来,就成了交互组件。根据自己的经验,我会把组件归为几大类:

顶栏类

导航类

弹窗类

弹出浮层类

toast类

列表类

键盘类

icon类(各种png图标)

另外,一些常用的主界面和内容页我也会做成组件。这样当我要拿搜索页说事儿的时候,就可以直接把整个搜索页拖过去,而不需要花时间再搭一遍积木了。

单个交互组件应该具备的特点:

可编辑性。PNG图标、文字、选中……每一个元素都是可以单独编辑的。

组件的颜色?

尽量以黑(性)白(冷)灰(淡)风格为主。

如何把各种组件想全?

不用想全,边做边补。所以不同平台的交互组件库应该有专人维护更新,才能保证组件库始终好用。这点其实知易行难,一定要提醒自己“磨刀不误砍柴工”。

组件边上需要写说明文字吗?

个人喜好组件边上不写任何说明文字。因为组件的名字已经反映在axure文档的侧导航上了,只要侧导航分类符合心智模型(好找),页面上清清爽爽的组件(方便拖拽),就能满足我的需求了。

因此,判断一个交互组件库是否好用的标准是:

  • 你自己是不是经常使用自己的组件库
  • 别人乐不乐(绩效管理中不可忽视的五个思想)意使用你的组件库

作者:俞静(微信公众号:听音乐做设计),现任网易云音乐交互负责人。

作者:俞静,来自:如何制作交互组件库 | 人

声明:博客内容除标记原创字样以外内容,均来自网络转载,版权归原作者所有,如涉及版权问题请及时联系处理。

注意啦:淘大米域名抢注,成功率高达99%;购买已备案域名、高PR、高权重、高外链、百度V认证域名就上淘大米(taodami.com.cn)。点击进入:

淘大米官网


鲜花

握手

雷人

路过

鸡蛋

随机推荐

热门图片
  • 零壹财经专访轻易贷母公司开元金融董事长李
  • 轻易贷副总裁文秀:行业处正本清源期 金融
  • 【深度分析】实缴资本25亿的轻易贷,为何如
  • 好看又好耍,这款全新上线的游戏,让你体验
  • 百度谭待出席齐家网2017全国家装行业峰会,
发布主题 客服中心 搜索 官方QQ群

河南网络警察报警平台 公共信息安全网络监察 河南经营性网站备案信息 河南不良信息举报中心 中国文明网传播文明

返回顶部