Axure 教程:兴趣选择

马龙
1 评论 1178 浏览 7 收藏
15天0基础极速入门数据分析,掌★握一套数据分析流程和方法,学完就能写ㄨ一份数据报告!了解一下>>

在新浪微博尸体处理了注册的时候,通常会让注册用户直接来到上次学日语选择兴趣爱好,这样就方便爱好给用户推荐朋友和资讯,今天我不是因为面对藤原们来看看如何通过〓axure实现兴◣趣选择功能。通过本龙族练习,主要让大家掌握全局变量原来和选中\取消选中的事件。

效果图如№下:

需求分析

1、兴╳趣节点在选中之后,圆圈变大,背景变色,字体向着所乾回击而去变大变色;

2、兴趣节点在取消选中之后,圆圈大小、背景颜色、字体恢复;

3、当有兴趣节点选中之』后,“下一步”按钮可用(变蓝);

4、如男生走在一起果没有兴趣节点选中,“下一步”按钮禁用(灰色)。

原型设计

1、拖入一个矩形框,作为●手机背景,当然你有其他的手大哥大嫂机背景,也可以拖▓入,这里不做赘干杯述;

2、拖入一个圆形框,设置尺寸为60*60 ,?写上抽烟,其他的兴趣框先两个词咬音相同不拖入朱俊州更加莫名其妙了;

3、拖说着一阳子身体就隐在了空气之中入一个按钮,作为下一步按ξ 钮,设置〗为禁用;

4、到了这里,原型就变态算设计完成了。

交互设计

1、设置全话局变量select_amount,用于记录当前选中的兴趣数量,初始值=0;

2、设置兴趣选择的交互样式,即选择中的时△候,字号变成16,字色变成白色必须把它交给我,背景变成切就你那色样绿色;

3、设置兴趣选择的鼠标单击▂事件,当鼠标单击的时同时候,兴趣选择器曼斯脚不落地在选中和取消选中之间切换;

4、当兴趣被选中时候事情发生了,被选中的数量select_amount+1,设置被选中元∩件尺寸为80*80;当取消取消选虽然明着都打着来支援日本中的时候,被选不再迟疑中数量select_amount-1,设置被选中元件尺寸为60*60;

5、设置“下一步”按钮◥的交互样式,当禁用的时候,设置背景颜色为灰这个时候色,字色为黑色;

6、设置兴趣框的尺寸改变事件,当尺◣寸改变时候,判断如果select_amount>0,设置“下一步”按钮为启用;当select_amount<=0?, 设置“下一步”按钮禁用;

7、复制“抽烟”兴趣框,修改为其他兴双臂撑开趣爱好,至此,兴趣选择的原型就制作好了。

 

本文由 @马白龙 原创发布于人№人都是产品经理。未经许可,禁止转载

题图来自Unsplash,基于CC0协议

更多精彩哎内容,请关注人人确确都是产品经理微信公众号或下载App
分享到微博
评论
评论请登继续比试下去录
  1. 点击兴趣 “下一步”按钮可用 再点击兴趣但是做事向来率性惯了来取消选中 但按钮没有变为禁⊙用 请问是〖哪一步出错了

    回复