axure原型设计之转盘抽奖

转盘抽奖一般会出现在一些金融类网站中,通过转盘抽奖来激活用户浏览行为,后来又多用于微信的公众号运营中,通过转盘抽奖来宣传活动,从而达到吸粉的目的。这一章就教大家如何使用axure原型工具制作转盘抽奖原型。

第一步:拖拉摆放好相关控件

1、转盘:300X300的白底黑框圆形,一条垂直线、一条45度垂直线、一条水平线、一条45度水平线,四线交叉组合居中放于白底黑框圆形上方,将白底黑框圆形等分切割成八份,每一份放一个文本标签,文本标签的文字角度可通过键盘微调适当即可,文本标签的文字有三个分别是“一等奖”,“二等奖”和“三等奖”,其余的皆为“谢谢惠顾”,将以上元件组合并命名为“转盘”。

2、抽奖按钮:100X100的灰底黑框圆形,中间文字为“抽奖”,将此元件命名为“抽奖按钮”,并居中置于“转盘”上方。

3、抽奖指针:10X32的灰底黑框三角形,将此元件命名为“抽奖指针”,并置于“抽奖按钮”的正上方。

第二步:为“抽奖按钮”添加鼠标单击时用例

此用例中只添加一个动作,即:相对旋转转盘,角度为[[100000+Math.random()*360]],方向为顺时针,锚点为中心,动画为线性,时间为2000毫秒。

好了,预览并点击“抽奖按钮”即可以看到转盘抽奖效果。同时也可以随时关注我的个人博客:http://weidublog.com,因为工作过程中有很多这些axure原型设计小技巧的例子,所以我会坚持分享下去,希望对大家有帮助,你们对我的关注就是我的动力。

效果图:axure原型设计之转盘抽奖

附件下载:转盘抽奖rp文件

作者:维度

转载请注明出处:http://weidublog.com/index.php/2017/03/22/216/

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 抽屉列表实在是太常见了,一般做后台设计的产品经理特别熟悉,因为基本大多数后台的菜单都是以抽屉列表的形式存在着,因为...
    孤_帆_一_心阅读 6,485评论 0 1
  • 效果图:axure原型设计之二维码扫描框 自从二维码流行起来之后,二维码成了移动端的一种很关键的入口,随时随地只需...
    孤_帆_一_心阅读 10,792评论 0 0
  • 概述 一个项目从立案到项目结束,项目的原型图设计师必不可少的,作为一个iOS开发者而言,其实我更应该关注一些程序方...
    神经骚栋阅读 64,900评论 19 245
  • 巍巍天山裹银装,伊水寂寂冰下咽。 最喜农家炉火红,檐前冰阵似剑长。
    于新源阅读 2,523评论 4 4
  • 2017年,是我们泸州创建全国文明城市的最关键的一年,学校有着非常关键的桥梁纽带作用。我校结合自身实际,充分发挥学...
    SHE林阅读 1,599评论 0 0