原型分享

原型分享

雅虎天气(APP)案例 Axure原型分享

Axure问答 回复了问题 • 4 人关注 • 3 个回复 • 1351 次浏览 • 2016-12-02 10:29 • 来自相关话题

交互原型设计分享 v1.0 (含海量设计资源和Axure实例)

产品经理交流windir 发表了文章 • 10 个评论 • 2353 次浏览 • 2016-11-01 17:36 • 来自相关话题

上周在公司内部做了一次关于交互原型设计主题的分享,为了准备这次分享花了一周多时间整理并制作了一个分享演示。这个分享演示共分为三个部分,一是关于原型设计的基础知识和常用工具介绍,二是关于目前最主流的设计工具Axure的介绍,三是一些设计资源、工具、文档的整理推荐。另外,还包含许多Axure的交互实例。这些内容可以算是我接触原型设计6年时间以来的一次全面的总结和梳理。

在上次公司内部的分享中一是由于时间有限,二是由于部分参与分享的同事未接触过原型设计或未使用过Axure这款软件,个人觉得很多有价值的内容没办法展开进行介绍。在原型设计方面个人觉得Axure是一款神奇的工具,除了工作中必要的使用之外,曾经还花过大量的时间去钻研这款工具。另外,目前本人正在进行原创的Axure组件库和模板的设计,以国外的收费精品组件库为标准。

有关于原型设计和Axure方面的更多问题,欢迎与我进一步的交流(本人QQ:5698401)。另外欢迎加入Axure的交流和分享群:60750209,本人将不定期分享相关干货。

以下是部分演示截图,完整分享演示地址:http://u.pmdaniu.com/dGK5 (需要使用电脑端浏览器访问) 查看全部
上周在公司内部做了一次关于交互原型设计主题的分享,为了准备这次分享花了一周多时间整理并制作了一个分享演示。这个分享演示共分为三个部分,一是关于原型设计的基础知识和常用工具介绍,二是关于目前最主流的设计工具Axure的介绍,三是一些设计资源、工具、文档的整理推荐。另外,还包含许多Axure的交互实例。这些内容可以算是我接触原型设计6年时间以来的一次全面的总结和梳理。

在上次公司内部的分享中一是由于时间有限,二是由于部分参与分享的同事未接触过原型设计或未使用过Axure这款软件,个人觉得很多有价值的内容没办法展开进行介绍。在原型设计方面个人觉得Axure是一款神奇的工具,除了工作中必要的使用之外,曾经还花过大量的时间去钻研这款工具。另外,目前本人正在进行原创的Axure组件库和模板的设计,以国外的收费精品组件库为标准。

有关于原型设计和Axure方面的更多问题,欢迎与我进一步的交流(本人QQ:5698401)。另外欢迎加入Axure的交流和分享群:60750209,本人将不定期分享相关干货。

以下是部分演示截图,完整分享演示地址:http://u.pmdaniu.com/dGK5 (需要使用电脑端浏览器访问)

2016-11-01_144603.png


2016-11-01_144933.png


2016-11-01_145311.png


2016-11-01_145033.png


2016-11-01_145046.png

【资源分享】Camdy_V1.0_视觉设计规范原型分享 提供RP文件下载

Axure问答黑胡子 发表了文章 • 5 个评论 • 1348 次浏览 • 2016-10-26 14:53 • 来自相关话题

预览地址:
http://fgu2qi.axshare.cn/
下载地址:见附件






源文件下载地址↓
 
预览地址:
http://fgu2qi.axshare.cn/
下载地址:见附件


设计规范.png

源文件下载地址↓
 

Axure手机直播产品原型Demo分享!

Axure问答黑胡子 发表了文章 • 4 个评论 • 862 次浏览 • 2016-10-26 14:38 • 来自相关话题

用户端






Demo预览地址:
http://yggsmz.axshare.cn/live.html

主播端






Demo预览地址:
http://pwr86g.axshare.cn/live.html 查看全部
用户端

用户端.PNG


Demo预览地址:
http://yggsmz.axshare.cn/live.html

主播端

主播端.PNG


Demo预览地址:
http://pwr86g.axshare.cn/live.html

使用Axure8完成的音乐APP播放界面交互作品

Axure问答windir 发表了文章 • 5 个评论 • 782 次浏览 • 2016-08-31 11:44 • 来自相关话题

使用Axure8完成了一个交互原型的练手作品,网易云音乐移动端的播放界面。制作过程颇有挑战,但也有很多探索乐趣。原本以为其中的一些交互细节用Axure是无法实现的,但经过摸索最终都做出来了,几乎是100%重现了全部的细节。唯一的两个小瑕疵:切换曲目时唱片的角度有一些不一致,还有播放计时的准确率不高。






重点操作交互:
音乐播放和暂停
曲目切换(多种切换方式)
计时及进度
进度拖动
喜欢及取消
播放控制(影响曲目播放顺序)
播放列表

演示地址:
http://p3y6of.axshare.com/musicplayer.html
  查看全部
使用Axure8完成了一个交互原型的练手作品,网易云音乐移动端的播放界面。制作过程颇有挑战,但也有很多探索乐趣。原本以为其中的一些交互细节用Axure是无法实现的,但经过摸索最终都做出来了,几乎是100%重现了全部的细节。唯一的两个小瑕疵:切换曲目时唱片的角度有一些不一致,还有播放计时的准确率不高。

musicplayer.png


重点操作交互:
音乐播放和暂停
曲目切换(多种切换方式)
计时及进度
进度拖动
喜欢及取消
播放控制(影响曲目播放顺序)
播放列表

演示地址:
http://p3y6of.axshare.com/musicplayer.html
 

一个交互页面,用iphone6体验更加!

Axure问答黑胡子 发表了文章 • 1 个评论 • 2157 次浏览 • 2016-06-07 19:59 • 来自相关话题

预览地址:http://q30cyr.axshare.cn/share_cover.html
原型地址:


Share-Cover.rp







 
预览地址:http://q30cyr.axshare.cn/share_cover.html
原型地址:



IMG_2077.PNG

 

【高保真社交APP】鱼塘---Skype风格

Axure问答黑胡子 发表了文章 • 6 个评论 • 2443 次浏览 • 2016-05-19 21:14 • 来自相关话题

鱼塘


APP设计图:http://www.zcool.com.cn/work/ZMTU1MzA0NDQ=.html
原型预览:http://li3nly.axshare.cn/
原型下载:http://pan.baidu.com/s/1hr6Bze8
禁止商用,谢谢. 查看全部
鱼塘


APP设计图:http://www.zcool.com.cn/work/ZMTU1MzA0NDQ=.html
原型预览:http://li3nly.axshare.cn/
原型下载:http://pan.baidu.com/s/1hr6Bze8
禁止商用,谢谢.

Camdy:一个包含了app所有操作逻辑,80%交互的原型!

Axure问答黑胡子 发表了文章 • 3 个评论 • 3026 次浏览 • 2016-05-18 10:42 • 来自相关话题

目前只提供预览:http://h7cpv5.axshare.cn/
由于所有界面都做在了一个页面里了,所以第一次加载会比较卡。

原型制作难点:
1.下拉刷新的效果;
2.返回逻辑;
3.贴纸拖动;
4.拍摄,编辑,上传逻辑;
5.个人中心上滑nav栏渐变。
其他效果自己去发现吧。

APP预览:http://heihuzi830.lofter.com/post/1dfdcbab_addb66d




  查看全部
目前只提供预览:http://h7cpv5.axshare.cn/
由于所有界面都做在了一个页面里了,所以第一次加载会比较卡。

原型制作难点:
1.下拉刷新的效果;
2.返回逻辑;
3.贴纸拖动;
4.拍摄,编辑,上传逻辑;
5.个人中心上滑nav栏渐变。
其他效果自己去发现吧。

APP预览:http://heihuzi830.lofter.com/post/1dfdcbab_addb66d
camdy_v1.0_cover_站酷_.png

 

游戏资讯APP原型分享(未完成)

Axure问答黑胡子 发表了文章 • 0 个评论 • 941 次浏览 • 2016-05-16 23:12 • 来自相关话题

主要研究app风格
原型预览:http://kj4jhr.axshare.cn/#p=gameplus





 
主要研究app风格
原型预览:http://kj4jhr.axshare.cn/#p=gameplus

KW}BOSU)JR6VO6]Q)3GLV6D.png

 

之前做的一个视频app的原型(包含交互),分享一下。

Axure问答黑胡子 发表了文章 • 3 个评论 • 1343 次浏览 • 2016-05-11 20:55 • 来自相关话题

之前做的一个视频app的原型,分享一下。
演示地址:http://40gv5s.axshare.cn/#g=1&p=玖果视频  (原来的地址:http://hw8t30.axshare.com/)
原型地址:http://pan.baidu.com/s/1eR1nk5c
APP设计展示:http://heihuzi830.lofter.com/post/1dfdcbab_ac0dd2d
请不要作为商业用途使用,谢谢。 查看全部
之前做的一个视频app的原型,分享一下。
演示地址:http://40gv5s.axshare.cn/#g=1&p=玖果视频  (原来的地址:http://hw8t30.axshare.com/
原型地址:http://pan.baidu.com/s/1eR1nk5c
APP设计展示:http://heihuzi830.lofter.com/post/1dfdcbab_ac0dd2d
请不要作为商业用途使用,谢谢。

Axure模板库(11)-个人页面

Axure问答jituoshiti 发表了文章 • 1 个评论 • 1744 次浏览 • 2016-05-11 15:23 • 来自相关话题

分享一套Axure的模板,以后做原型的时候可以直接复制粘贴了。源文件的下载地址在文章最后。

预览地址:http://l8vc90.axshare.cn/ (社区管理员提供)

今天介绍4个“个人”页面。模板里还包括之前发布过的74个手机和PC上各种常用页面,好多按钮和图标,下面是图片预览。

1、个人页面主要展示个人信息,比如社交app需要展示个人的关注信息、图片、文章、签到等等。






2、工具型app的个人页面可以展示个人的使用状态,或者使用过程中积累的数据。







3、个人页面是“信息”的另一种组织方式。主页面展示最新的、相关性高的信息。个人页面过滤信息,只把某个人的信息展示出来。







4、工具app的个人页面更强调与个人相关的各种功能。








→→→源文件在这里下载(包括Axure 8.0的安装文件和汉化包)
http://pan.baidu.com/s/1c16cyQ0

想看更多的模板、案例可以关注我的公众号——Axure大师。

如果这篇文章帮助了你,记得打赏作者,支持作者发布更多模板~ 查看全部
分享一套Axure的模板,以后做原型的时候可以直接复制粘贴了。源文件的下载地址在文章最后。

预览地址:http://l8vc90.axshare.cn/ (社区管理员提供)

今天介绍4个“个人”页面。模板里还包括之前发布过的74个手机和PC上各种常用页面,好多按钮和图标,下面是图片预览。

1、个人页面主要展示个人信息,比如社交app需要展示个人的关注信息、图片、文章、签到等等。

1.png


2、工具型app的个人页面可以展示个人的使用状态,或者使用过程中积累的数据。

2.png



3、个人页面是“信息”的另一种组织方式。主页面展示最新的、相关性高的信息。个人页面过滤信息,只把某个人的信息展示出来。

3.png



4、工具app的个人页面更强调与个人相关的各种功能。

4.png




→→→源文件在这里下载(包括Axure 8.0的安装文件和汉化包)
http://pan.baidu.com/s/1c16cyQ0

想看更多的模板、案例可以关注我的公众号——Axure大师。

如果这篇文章帮助了你,记得打赏作者,支持作者发布更多模板~

原型分享:什么值得买登录输入动态效果模拟 附源文件

Axure问答黄老师 发表了文章 • 2 个评论 • 1247 次浏览 • 2016-05-07 15:38 • 来自相关话题

 先看效果演示:http://7rnohr.axshare.cn/#g=1&p=index
主要是在输入框为空的条件下,输入框获取焦点和失去焦点时的一个动态效果。
输入框和文字的颜色变化直接用选中状态切换实现。
难点是单击文字也要能实现焦点获取,并且失去焦点后要归为原始状态。注意切换隐藏和显示元件。
大家可以先自己做一下,做完了再下载源文件对比。 查看全部

shurukuang.gif

 先看效果演示:http://7rnohr.axshare.cn/#g=1&p=index
主要是在输入框为空的条件下,输入框获取焦点和失去焦点时的一个动态效果。
输入框和文字的颜色变化直接用选中状态切换实现。
难点是单击文字也要能实现焦点获取,并且失去焦点后要归为原始状态。注意切换隐藏和显示元件。
大家可以先自己做一下,做完了再下载源文件对比。

axure 8.0 动态特效元件库分享 交互设计

Axure问答pancheng 发表了文章 • 8 个评论 • 1791 次浏览 • 2016-04-05 18:04 • 来自相关话题

认准品牌

六脉神掌







尽量给每一个交互加上效果,尽量模拟真实的交互

无图无真相,我们先看效果图

1 这是还原Android Material Design风格的一个底部菜单效果








2 这个是模拟欢迎页面








3 模拟自动轮播的广告页面








4 这里是发送短信验证码








5 模拟选择图片附件上传







6 开关按钮








7 购物车数字输入框 收藏框 打分框 单选多选








8 进度条大合集








9 输入框提示语








10 左侧滑动菜单








11 左侧滑动菜单 盖住中间部分








12 右侧菜单








13 右下角浮动菜单







14 上刷新 下拉加载更多








15 抽奖转盘








 


 


除了以上以外还有一些列便捷组件。

作者:潘老师(QQ/微信:55607999),武汉产品经理,6年移动开发,2年产品工作经验,独立负责过项目无数。

以上如需要教程,请留言。

链接: http://pan.baidu.com/s/1gfm87p5 密码: mqym

承接各种UE动效设计 移动应用开发

认准六脉神掌






  查看全部
认准品牌

六脉神掌


logo1_看图王1.png


尽量给每一个交互加上效果,尽量模拟真实的交互

无图无真相,我们先看效果图

1 这是还原Android Material Design风格的一个底部菜单效果


效果1.gif



2 这个是模拟欢迎页面


效果2.gif



3 模拟自动轮播的广告页面


效果3.gif



4 这里是发送短信验证码


效果4.gif



5 模拟选择图片附件上传

效果5.gif



6 开关按钮


效果6.gif



7 购物车数字输入框 收藏框 打分框 单选多选


效果7.gif



8 进度条大合集


效果8.gif



9 输入框提示语


效果9.gif



10 左侧滑动菜单


效果10.gif



11 左侧滑动菜单 盖住中间部分


效果11.gif



12 右侧菜单


效果12.gif



13 右下角浮动菜单


效果13.gif


14 上刷新 下拉加载更多


效果14.gif



15 抽奖转盘


效果15.gif



 


 


除了以上以外还有一些列便捷组件。

作者:潘老师(QQ/微信:55607999),武汉产品经理,6年移动开发,2年产品工作经验,独立负责过项目无数。

以上如需要教程,请留言。

链接: http://pan.baidu.com/s/1gfm87p5 密码: mqym

承接各种UE动效设计 移动应用开发

认准六脉神掌


logo1_看图王1.png

 

Axure RP 7.0 美女浏览原型,内含:多层动态面板嵌套,拖动时函数设定边界,组应用等

Axure问答zilong 发表了文章 • 2 个评论 • 1372 次浏览 • 2015-12-28 16:32 • 来自相关话题

先上一张原型主界面的图片,原型在文章末尾,自己去下载




本案例是以浏览图片为范本的原型设计(仅供娱乐与学习),内部包含多层动态面板,函数应用,应该会对初学者有一点帮助,不过话说在前面,学习Axure还是要循序渐进,先从认识部件,认识函数开始(函数要学好,很重要滴),基础打牢后再继续打磨会事半功倍,不要上来就直接copy人家的函数与动作,要知道实现思路,知道“鸡”是怎么来滴。
下面开始一个一个开始介绍实现方法:
第一部分:主界面的美女显示面板
           项目内容动态面板部件结构




在这里需要再看一下主界面显示的情况




这里我们设置想让图片可以上下拖动,显示其他的未显示出来的内容,注意:这里要设定上下滑动的边界;
并且在相应的图片上进行左右滑动时可以触发动态面板中图片的切换;
在鼠标单击时弹出“看图模式”,进行图片的浏览,在这个界面中必须点击退出按钮才能退出到主界面。
实现思路:首先动态面板要能拖动(设定沿y轴拖动)——设定上下滑动边界条件与动作——设定光标接触部件条件——在相应的接触区域实现左右滑动切换图片的动作——单击相应的图片时候,显示隐藏的对应动态面板并到顶层——点击退出按钮回到主界面
好了,看一下函数的截图:
主页动态面板动作设定:





1,这里的top与bottom我说一下边界设定
top函数:是指部件的顶部Y坐标,这里是不想让动态面板一直向下拖动使主界面中出现无内容区域,所以要设定动态面板沿Y轴拖动时top不能大于0,如果大于0的话我们就设定他的位置回到绝对位置(0,0)




bottom函数:部件的底部,这里与top对应的也是不想让部件的底部一直向上滑出现无内容区域,所以要设定底部bottom的y值不能小于动态面板的区域高度,本案例是525(根据个人设定不同),如果小于525那么就移动到相对位置到(0,[[525-LVAR1.bottom-1]]),(这里再解释一下相对位置:就是以目标位置为基准,是需要正向移动还是反向移动,本案例就是正向移动,所以用大数-小数:525-LVAR1.bottom,说道这个程度如果还不理解我也没办法了,慢慢想吧)









这里有一个点要看一下




在嵌套内部动态面板时为了使显示内容为一个整体,并方便改动内部内容时而外面的函数不受影响,我将主页动态面板的显示内容区域用一个动态面板来显示的,并且将动态面板设定为“调整大小以适合内容”

2,这次再看光标接触部件时左右滑动切换图片的条件





3,鼠标单击进入看图模式
这里的动作是设定在pageA与pageB上的,然后触发相应的动态面板“看图A与看图B”
pageA动作设定




看图A的界面




看图A的动作




返回主界面





第二部分:排序位置
这里是一个矩形部件与动态面板的互动,矩形的显示文字就是动态面板的选中文字(这里我用的toString函数),实现选择的效果。
并让动态面板再次展开时,现在显示的文字与对应的动态面板中的部件处于选中状态,这里又涉及到条件判断,大家看下案例吧。




排序面板,一个例子:智能排序动作配置





第三部分:筛选按钮




看一下筛选动态面板的内部




这里用到了一个小东西,就是分组,这样能够实现每个组中只有一个能够处于选中状态,不会出现复选。





原型百度云盘:http://pan.baidu.com/s/1bovpVI3
在线原型体验:http://9al1jc.axshare.com
建议下载体验,Axure官网在线响应比较慢,下载下来还可以直接看原型的函数设置

今天的案例分享就到这里了,其实是一个很简单的案例,用到的东西并不多,但是还是比较有助于初学者认识一下Axure的一些函数与条件的综合应用的,对于学习Axure我还是文章开头说的话(没注意看的再看一遍),把各个部件兄弟混熟,各种函数会用,各个界面的多种功能认亲完成,然后你的Axure之路才真正开始。

注:本人也在不断学习进步,如有交流可以加我微信:fzl690894512,欢迎打扰。(本人不相亲 O__O "…但是并不拒绝妹子!)

  查看全部
先上一张原型主界面的图片,原型在文章末尾,自己去下载
项目主界面.jpg

本案例是以浏览图片为范本的原型设计(仅供娱乐与学习),内部包含多层动态面板,函数应用,应该会对初学者有一点帮助,不过话说在前面,学习Axure还是要循序渐进,先从认识部件,认识函数开始(函数要学好,很重要滴),基础打牢后再继续打磨会事半功倍,不要上来就直接copy人家的函数与动作,要知道实现思路,知道“鸡”是怎么来滴。
下面开始一个一个开始介绍实现方法:
第一部分:主界面的美女显示面板
           项目内容动态面板部件结构
项目内容显示动态面板整体框架.jpg

在这里需要再看一下主界面显示的情况
项目主界面.jpg

这里我们设置想让图片可以上下拖动,显示其他的未显示出来的内容,注意:这里要设定上下滑动的边界;
并且在相应的图片上进行左右滑动时可以触发动态面板中图片的切换;
在鼠标单击时弹出“看图模式”,进行图片的浏览,在这个界面中必须点击退出按钮才能退出到主界面。
实现思路:首先动态面板要能拖动(设定沿y轴拖动)——设定上下滑动边界条件与动作——设定光标接触部件条件——在相应的接触区域实现左右滑动切换图片的动作——单击相应的图片时候,显示隐藏的对应动态面板并到顶层——点击退出按钮回到主界面
好了,看一下函数的截图:
主页动态面板动作设定:
项目内容显示动态面板动作.jpg


1,这里的top与bottom我说一下边界设定
top函数:是指部件的顶部Y坐标,这里是不想让动态面板一直向下拖动使主界面中出现无内容区域,所以要设定动态面板沿Y轴拖动时top不能大于0,如果大于0的话我们就设定他的位置回到绝对位置(0,0)
top动作函数设定.jpg

bottom函数:部件的底部,这里与top对应的也是不想让部件的底部一直向上滑出现无内容区域,所以要设定底部bottom的y值不能小于动态面板的区域高度,本案例是525(根据个人设定不同),如果小于525那么就移动到相对位置到(0,[[525-LVAR1.bottom-1]]),(这里再解释一下相对位置:就是以目标位置为基准,是需要正向移动还是反向移动,本案例就是正向移动,所以用大数-小数:525-LVAR1.bottom,说道这个程度如果还不理解我也没办法了,慢慢想吧)
bottom函数设定相对距离.jpg

bottom相对距离函数算法.jpg


这里有一个点要看一下
调整动态面板适应内容大小.jpg

在嵌套内部动态面板时为了使显示内容为一个整体,并方便改动内部内容时而外面的函数不受影响,我将主页动态面板的显示内容区域用一个动态面板来显示的,并且将动态面板设定为“调整大小以适合内容”

2,这次再看光标接触部件时左右滑动切换图片的条件
直接在主界面滑动图片设定的光标范围函数.jpg


3,鼠标单击进入看图模式
这里的动作是设定在pageA与pageB上的,然后触发相应的动态面板“看图A与看图B”
pageA动作设定
pageA鼠标单击时动作.jpg

看图A的界面
看图A界面.jpg

看图A的动作
看图A动态面板动作.jpg

返回主界面
返回键动作.jpg


第二部分:排序位置
这里是一个矩形部件与动态面板的互动,矩形的显示文字就是动态面板的选中文字(这里我用的toString函数),实现选择的效果。
并让动态面板再次展开时,现在显示的文字与对应的动态面板中的部件处于选中状态,这里又涉及到条件判断,大家看下案例吧。
tostring动作.jpg

排序面板,一个例子:智能排序动作配置
智能排序动作.jpg


第三部分:筛选按钮
筛选按钮动作.jpg

看一下筛选动态面板的内部
筛选动态面板内容.jpg

这里用到了一个小东西,就是分组,这样能够实现每个组中只有一个能够处于选中状态,不会出现复选。
指定选项组-分类组.jpg


原型百度云盘:http://pan.baidu.com/s/1bovpVI3
在线原型体验:http://9al1jc.axshare.com
建议下载体验,Axure官网在线响应比较慢,下载下来还可以直接看原型的函数设置

今天的案例分享就到这里了,其实是一个很简单的案例,用到的东西并不多,但是还是比较有助于初学者认识一下Axure的一些函数与条件的综合应用的,对于学习Axure我还是文章开头说的话(没注意看的再看一遍),把各个部件兄弟混熟,各种函数会用,各个界面的多种功能认亲完成,然后你的Axure之路才真正开始。

注:本人也在不断学习进步,如有交流可以加我微信:fzl690894512,欢迎打扰。(本人不相亲 O__O "…但是并不拒绝妹子!)

 

交互原型设计分享 v1.0 (含海量设计资源和Axure实例)

产品经理交流windir 发表了文章 • 10 个评论 • 2353 次浏览 • 2016-11-01 17:36 • 来自相关话题

上周在公司内部做了一次关于交互原型设计主题的分享,为了准备这次分享花了一周多时间整理并制作了一个分享演示。这个分享演示共分为三个部分,一是关于原型设计的基础知识和常用工具介绍,二是关于目前最主流的设计工具Axure的介绍,三是一些设计资源、工具、文档的整理推荐。另外,还包含许多Axure的交互实例。这些内容可以算是我接触原型设计6年时间以来的一次全面的总结和梳理。

在上次公司内部的分享中一是由于时间有限,二是由于部分参与分享的同事未接触过原型设计或未使用过Axure这款软件,个人觉得很多有价值的内容没办法展开进行介绍。在原型设计方面个人觉得Axure是一款神奇的工具,除了工作中必要的使用之外,曾经还花过大量的时间去钻研这款工具。另外,目前本人正在进行原创的Axure组件库和模板的设计,以国外的收费精品组件库为标准。

有关于原型设计和Axure方面的更多问题,欢迎与我进一步的交流(本人QQ:5698401)。另外欢迎加入Axure的交流和分享群:60750209,本人将不定期分享相关干货。

以下是部分演示截图,完整分享演示地址:http://u.pmdaniu.com/dGK5 (需要使用电脑端浏览器访问) 查看全部
上周在公司内部做了一次关于交互原型设计主题的分享,为了准备这次分享花了一周多时间整理并制作了一个分享演示。这个分享演示共分为三个部分,一是关于原型设计的基础知识和常用工具介绍,二是关于目前最主流的设计工具Axure的介绍,三是一些设计资源、工具、文档的整理推荐。另外,还包含许多Axure的交互实例。这些内容可以算是我接触原型设计6年时间以来的一次全面的总结和梳理。

在上次公司内部的分享中一是由于时间有限,二是由于部分参与分享的同事未接触过原型设计或未使用过Axure这款软件,个人觉得很多有价值的内容没办法展开进行介绍。在原型设计方面个人觉得Axure是一款神奇的工具,除了工作中必要的使用之外,曾经还花过大量的时间去钻研这款工具。另外,目前本人正在进行原创的Axure组件库和模板的设计,以国外的收费精品组件库为标准。

有关于原型设计和Axure方面的更多问题,欢迎与我进一步的交流(本人QQ:5698401)。另外欢迎加入Axure的交流和分享群:60750209,本人将不定期分享相关干货。

以下是部分演示截图,完整分享演示地址:http://u.pmdaniu.com/dGK5 (需要使用电脑端浏览器访问)

2016-11-01_144603.png


2016-11-01_144933.png


2016-11-01_145311.png


2016-11-01_145033.png


2016-11-01_145046.png

【资源分享】Camdy_V1.0_视觉设计规范原型分享 提供RP文件下载

Axure问答黑胡子 发表了文章 • 5 个评论 • 1348 次浏览 • 2016-10-26 14:53 • 来自相关话题

预览地址:
http://fgu2qi.axshare.cn/
下载地址:见附件






源文件下载地址↓
 
预览地址:
http://fgu2qi.axshare.cn/
下载地址:见附件


设计规范.png

源文件下载地址↓
 

雅虎天气(APP)案例 Axure原型分享

回复

Axure问答 回复了问题 • 4 人关注 • 3 个回复 • 1351 次浏览 • 2016-12-02 10:29 • 来自相关话题

交互原型设计分享 v1.0 (含海量设计资源和Axure实例)

产品经理交流windir 发表了文章 • 10 个评论 • 2353 次浏览 • 2016-11-01 17:36 • 来自相关话题

上周在公司内部做了一次关于交互原型设计主题的分享,为了准备这次分享花了一周多时间整理并制作了一个分享演示。这个分享演示共分为三个部分,一是关于原型设计的基础知识和常用工具介绍,二是关于目前最主流的设计工具Axure的介绍,三是一些设计资源、工具、文档的整理推荐。另外,还包含许多Axure的交互实例。这些内容可以算是我接触原型设计6年时间以来的一次全面的总结和梳理。

在上次公司内部的分享中一是由于时间有限,二是由于部分参与分享的同事未接触过原型设计或未使用过Axure这款软件,个人觉得很多有价值的内容没办法展开进行介绍。在原型设计方面个人觉得Axure是一款神奇的工具,除了工作中必要的使用之外,曾经还花过大量的时间去钻研这款工具。另外,目前本人正在进行原创的Axure组件库和模板的设计,以国外的收费精品组件库为标准。

有关于原型设计和Axure方面的更多问题,欢迎与我进一步的交流(本人QQ:5698401)。另外欢迎加入Axure的交流和分享群:60750209,本人将不定期分享相关干货。

以下是部分演示截图,完整分享演示地址:http://u.pmdaniu.com/dGK5 (需要使用电脑端浏览器访问) 查看全部
上周在公司内部做了一次关于交互原型设计主题的分享,为了准备这次分享花了一周多时间整理并制作了一个分享演示。这个分享演示共分为三个部分,一是关于原型设计的基础知识和常用工具介绍,二是关于目前最主流的设计工具Axure的介绍,三是一些设计资源、工具、文档的整理推荐。另外,还包含许多Axure的交互实例。这些内容可以算是我接触原型设计6年时间以来的一次全面的总结和梳理。

在上次公司内部的分享中一是由于时间有限,二是由于部分参与分享的同事未接触过原型设计或未使用过Axure这款软件,个人觉得很多有价值的内容没办法展开进行介绍。在原型设计方面个人觉得Axure是一款神奇的工具,除了工作中必要的使用之外,曾经还花过大量的时间去钻研这款工具。另外,目前本人正在进行原创的Axure组件库和模板的设计,以国外的收费精品组件库为标准。

有关于原型设计和Axure方面的更多问题,欢迎与我进一步的交流(本人QQ:5698401)。另外欢迎加入Axure的交流和分享群:60750209,本人将不定期分享相关干货。

以下是部分演示截图,完整分享演示地址:http://u.pmdaniu.com/dGK5 (需要使用电脑端浏览器访问)

2016-11-01_144603.png


2016-11-01_144933.png


2016-11-01_145311.png


2016-11-01_145033.png


2016-11-01_145046.png

【资源分享】Camdy_V1.0_视觉设计规范原型分享 提供RP文件下载

Axure问答黑胡子 发表了文章 • 5 个评论 • 1348 次浏览 • 2016-10-26 14:53 • 来自相关话题

预览地址:
http://fgu2qi.axshare.cn/
下载地址:见附件






源文件下载地址↓
 
预览地址:
http://fgu2qi.axshare.cn/
下载地址:见附件


设计规范.png

源文件下载地址↓
 

Axure手机直播产品原型Demo分享!

Axure问答黑胡子 发表了文章 • 4 个评论 • 862 次浏览 • 2016-10-26 14:38 • 来自相关话题

用户端






Demo预览地址:
http://yggsmz.axshare.cn/live.html

主播端






Demo预览地址:
http://pwr86g.axshare.cn/live.html 查看全部
用户端

用户端.PNG


Demo预览地址:
http://yggsmz.axshare.cn/live.html

主播端

主播端.PNG


Demo预览地址:
http://pwr86g.axshare.cn/live.html

使用Axure8完成的音乐APP播放界面交互作品

Axure问答windir 发表了文章 • 5 个评论 • 782 次浏览 • 2016-08-31 11:44 • 来自相关话题

使用Axure8完成了一个交互原型的练手作品,网易云音乐移动端的播放界面。制作过程颇有挑战,但也有很多探索乐趣。原本以为其中的一些交互细节用Axure是无法实现的,但经过摸索最终都做出来了,几乎是100%重现了全部的细节。唯一的两个小瑕疵:切换曲目时唱片的角度有一些不一致,还有播放计时的准确率不高。






重点操作交互:
音乐播放和暂停
曲目切换(多种切换方式)
计时及进度
进度拖动
喜欢及取消
播放控制(影响曲目播放顺序)
播放列表

演示地址:
http://p3y6of.axshare.com/musicplayer.html
  查看全部
使用Axure8完成了一个交互原型的练手作品,网易云音乐移动端的播放界面。制作过程颇有挑战,但也有很多探索乐趣。原本以为其中的一些交互细节用Axure是无法实现的,但经过摸索最终都做出来了,几乎是100%重现了全部的细节。唯一的两个小瑕疵:切换曲目时唱片的角度有一些不一致,还有播放计时的准确率不高。

musicplayer.png


重点操作交互:
音乐播放和暂停
曲目切换(多种切换方式)
计时及进度
进度拖动
喜欢及取消
播放控制(影响曲目播放顺序)
播放列表

演示地址:
http://p3y6of.axshare.com/musicplayer.html
 

一个交互页面,用iphone6体验更加!

Axure问答黑胡子 发表了文章 • 1 个评论 • 2157 次浏览 • 2016-06-07 19:59 • 来自相关话题

预览地址:http://q30cyr.axshare.cn/share_cover.html
原型地址:


Share-Cover.rp







 
预览地址:http://q30cyr.axshare.cn/share_cover.html
原型地址:



IMG_2077.PNG

 

【高保真社交APP】鱼塘---Skype风格

Axure问答黑胡子 发表了文章 • 6 个评论 • 2443 次浏览 • 2016-05-19 21:14 • 来自相关话题

鱼塘


APP设计图:http://www.zcool.com.cn/work/ZMTU1MzA0NDQ=.html
原型预览:http://li3nly.axshare.cn/
原型下载:http://pan.baidu.com/s/1hr6Bze8
禁止商用,谢谢. 查看全部
鱼塘


APP设计图:http://www.zcool.com.cn/work/ZMTU1MzA0NDQ=.html
原型预览:http://li3nly.axshare.cn/
原型下载:http://pan.baidu.com/s/1hr6Bze8
禁止商用,谢谢.

Camdy:一个包含了app所有操作逻辑,80%交互的原型!

Axure问答黑胡子 发表了文章 • 3 个评论 • 3026 次浏览 • 2016-05-18 10:42 • 来自相关话题

目前只提供预览:http://h7cpv5.axshare.cn/
由于所有界面都做在了一个页面里了,所以第一次加载会比较卡。

原型制作难点:
1.下拉刷新的效果;
2.返回逻辑;
3.贴纸拖动;
4.拍摄,编辑,上传逻辑;
5.个人中心上滑nav栏渐变。
其他效果自己去发现吧。

APP预览:http://heihuzi830.lofter.com/post/1dfdcbab_addb66d




  查看全部
目前只提供预览:http://h7cpv5.axshare.cn/
由于所有界面都做在了一个页面里了,所以第一次加载会比较卡。

原型制作难点:
1.下拉刷新的效果;
2.返回逻辑;
3.贴纸拖动;
4.拍摄,编辑,上传逻辑;
5.个人中心上滑nav栏渐变。
其他效果自己去发现吧。

APP预览:http://heihuzi830.lofter.com/post/1dfdcbab_addb66d
camdy_v1.0_cover_站酷_.png

 

游戏资讯APP原型分享(未完成)

Axure问答黑胡子 发表了文章 • 0 个评论 • 941 次浏览 • 2016-05-16 23:12 • 来自相关话题

主要研究app风格
原型预览:http://kj4jhr.axshare.cn/#p=gameplus





 
主要研究app风格
原型预览:http://kj4jhr.axshare.cn/#p=gameplus

KW}BOSU)JR6VO6]Q)3GLV6D.png

 

之前做的一个视频app的原型(包含交互),分享一下。

Axure问答黑胡子 发表了文章 • 3 个评论 • 1343 次浏览 • 2016-05-11 20:55 • 来自相关话题

之前做的一个视频app的原型,分享一下。
演示地址:http://40gv5s.axshare.cn/#g=1&p=玖果视频  (原来的地址:http://hw8t30.axshare.com/)
原型地址:http://pan.baidu.com/s/1eR1nk5c
APP设计展示:http://heihuzi830.lofter.com/post/1dfdcbab_ac0dd2d
请不要作为商业用途使用,谢谢。 查看全部
之前做的一个视频app的原型,分享一下。
演示地址:http://40gv5s.axshare.cn/#g=1&p=玖果视频  (原来的地址:http://hw8t30.axshare.com/
原型地址:http://pan.baidu.com/s/1eR1nk5c
APP设计展示:http://heihuzi830.lofter.com/post/1dfdcbab_ac0dd2d
请不要作为商业用途使用,谢谢。

Axure模板库(11)-个人页面

Axure问答jituoshiti 发表了文章 • 1 个评论 • 1744 次浏览 • 2016-05-11 15:23 • 来自相关话题

分享一套Axure的模板,以后做原型的时候可以直接复制粘贴了。源文件的下载地址在文章最后。

预览地址:http://l8vc90.axshare.cn/ (社区管理员提供)

今天介绍4个“个人”页面。模板里还包括之前发布过的74个手机和PC上各种常用页面,好多按钮和图标,下面是图片预览。

1、个人页面主要展示个人信息,比如社交app需要展示个人的关注信息、图片、文章、签到等等。






2、工具型app的个人页面可以展示个人的使用状态,或者使用过程中积累的数据。







3、个人页面是“信息”的另一种组织方式。主页面展示最新的、相关性高的信息。个人页面过滤信息,只把某个人的信息展示出来。







4、工具app的个人页面更强调与个人相关的各种功能。








→→→源文件在这里下载(包括Axure 8.0的安装文件和汉化包)
http://pan.baidu.com/s/1c16cyQ0

想看更多的模板、案例可以关注我的公众号——Axure大师。

如果这篇文章帮助了你,记得打赏作者,支持作者发布更多模板~ 查看全部
分享一套Axure的模板,以后做原型的时候可以直接复制粘贴了。源文件的下载地址在文章最后。

预览地址:http://l8vc90.axshare.cn/ (社区管理员提供)

今天介绍4个“个人”页面。模板里还包括之前发布过的74个手机和PC上各种常用页面,好多按钮和图标,下面是图片预览。

1、个人页面主要展示个人信息,比如社交app需要展示个人的关注信息、图片、文章、签到等等。

1.png


2、工具型app的个人页面可以展示个人的使用状态,或者使用过程中积累的数据。

2.png



3、个人页面是“信息”的另一种组织方式。主页面展示最新的、相关性高的信息。个人页面过滤信息,只把某个人的信息展示出来。

3.png



4、工具app的个人页面更强调与个人相关的各种功能。

4.png




→→→源文件在这里下载(包括Axure 8.0的安装文件和汉化包)
http://pan.baidu.com/s/1c16cyQ0

想看更多的模板、案例可以关注我的公众号——Axure大师。

如果这篇文章帮助了你,记得打赏作者,支持作者发布更多模板~

原型分享:什么值得买登录输入动态效果模拟 附源文件

Axure问答黄老师 发表了文章 • 2 个评论 • 1247 次浏览 • 2016-05-07 15:38 • 来自相关话题

 先看效果演示:http://7rnohr.axshare.cn/#g=1&p=index
主要是在输入框为空的条件下,输入框获取焦点和失去焦点时的一个动态效果。
输入框和文字的颜色变化直接用选中状态切换实现。
难点是单击文字也要能实现焦点获取,并且失去焦点后要归为原始状态。注意切换隐藏和显示元件。
大家可以先自己做一下,做完了再下载源文件对比。 查看全部

shurukuang.gif

 先看效果演示:http://7rnohr.axshare.cn/#g=1&p=index
主要是在输入框为空的条件下,输入框获取焦点和失去焦点时的一个动态效果。
输入框和文字的颜色变化直接用选中状态切换实现。
难点是单击文字也要能实现焦点获取,并且失去焦点后要归为原始状态。注意切换隐藏和显示元件。
大家可以先自己做一下,做完了再下载源文件对比。

axure 8.0 动态特效元件库分享 交互设计

Axure问答pancheng 发表了文章 • 8 个评论 • 1791 次浏览 • 2016-04-05 18:04 • 来自相关话题

认准品牌

六脉神掌







尽量给每一个交互加上效果,尽量模拟真实的交互

无图无真相,我们先看效果图

1 这是还原Android Material Design风格的一个底部菜单效果








2 这个是模拟欢迎页面








3 模拟自动轮播的广告页面








4 这里是发送短信验证码








5 模拟选择图片附件上传







6 开关按钮








7 购物车数字输入框 收藏框 打分框 单选多选








8 进度条大合集








9 输入框提示语








10 左侧滑动菜单








11 左侧滑动菜单 盖住中间部分








12 右侧菜单








13 右下角浮动菜单







14 上刷新 下拉加载更多








15 抽奖转盘








 


 


除了以上以外还有一些列便捷组件。

作者:潘老师(QQ/微信:55607999),武汉产品经理,6年移动开发,2年产品工作经验,独立负责过项目无数。

以上如需要教程,请留言。

链接: http://pan.baidu.com/s/1gfm87p5 密码: mqym

承接各种UE动效设计 移动应用开发

认准六脉神掌






  查看全部
认准品牌

六脉神掌


logo1_看图王1.png


尽量给每一个交互加上效果,尽量模拟真实的交互

无图无真相,我们先看效果图

1 这是还原Android Material Design风格的一个底部菜单效果


效果1.gif



2 这个是模拟欢迎页面


效果2.gif



3 模拟自动轮播的广告页面


效果3.gif



4 这里是发送短信验证码


效果4.gif



5 模拟选择图片附件上传

效果5.gif



6 开关按钮


效果6.gif



7 购物车数字输入框 收藏框 打分框 单选多选


效果7.gif



8 进度条大合集


效果8.gif



9 输入框提示语


效果9.gif



10 左侧滑动菜单


效果10.gif



11 左侧滑动菜单 盖住中间部分


效果11.gif



12 右侧菜单


效果12.gif



13 右下角浮动菜单


效果13.gif


14 上刷新 下拉加载更多


效果14.gif



15 抽奖转盘


效果15.gif



 


 


除了以上以外还有一些列便捷组件。

作者:潘老师(QQ/微信:55607999),武汉产品经理,6年移动开发,2年产品工作经验,独立负责过项目无数。

以上如需要教程,请留言。

链接: http://pan.baidu.com/s/1gfm87p5 密码: mqym

承接各种UE动效设计 移动应用开发

认准六脉神掌


logo1_看图王1.png

 

Axure RP 7.0 美女浏览原型,内含:多层动态面板嵌套,拖动时函数设定边界,组应用等

Axure问答zilong 发表了文章 • 2 个评论 • 1372 次浏览 • 2015-12-28 16:32 • 来自相关话题

先上一张原型主界面的图片,原型在文章末尾,自己去下载




本案例是以浏览图片为范本的原型设计(仅供娱乐与学习),内部包含多层动态面板,函数应用,应该会对初学者有一点帮助,不过话说在前面,学习Axure还是要循序渐进,先从认识部件,认识函数开始(函数要学好,很重要滴),基础打牢后再继续打磨会事半功倍,不要上来就直接copy人家的函数与动作,要知道实现思路,知道“鸡”是怎么来滴。
下面开始一个一个开始介绍实现方法:
第一部分:主界面的美女显示面板
           项目内容动态面板部件结构




在这里需要再看一下主界面显示的情况




这里我们设置想让图片可以上下拖动,显示其他的未显示出来的内容,注意:这里要设定上下滑动的边界;
并且在相应的图片上进行左右滑动时可以触发动态面板中图片的切换;
在鼠标单击时弹出“看图模式”,进行图片的浏览,在这个界面中必须点击退出按钮才能退出到主界面。
实现思路:首先动态面板要能拖动(设定沿y轴拖动)——设定上下滑动边界条件与动作——设定光标接触部件条件——在相应的接触区域实现左右滑动切换图片的动作——单击相应的图片时候,显示隐藏的对应动态面板并到顶层——点击退出按钮回到主界面
好了,看一下函数的截图:
主页动态面板动作设定:





1,这里的top与bottom我说一下边界设定
top函数:是指部件的顶部Y坐标,这里是不想让动态面板一直向下拖动使主界面中出现无内容区域,所以要设定动态面板沿Y轴拖动时top不能大于0,如果大于0的话我们就设定他的位置回到绝对位置(0,0)




bottom函数:部件的底部,这里与top对应的也是不想让部件的底部一直向上滑出现无内容区域,所以要设定底部bottom的y值不能小于动态面板的区域高度,本案例是525(根据个人设定不同),如果小于525那么就移动到相对位置到(0,[[525-LVAR1.bottom-1]]),(这里再解释一下相对位置:就是以目标位置为基准,是需要正向移动还是反向移动,本案例就是正向移动,所以用大数-小数:525-LVAR1.bottom,说道这个程度如果还不理解我也没办法了,慢慢想吧)









这里有一个点要看一下




在嵌套内部动态面板时为了使显示内容为一个整体,并方便改动内部内容时而外面的函数不受影响,我将主页动态面板的显示内容区域用一个动态面板来显示的,并且将动态面板设定为“调整大小以适合内容”

2,这次再看光标接触部件时左右滑动切换图片的条件





3,鼠标单击进入看图模式
这里的动作是设定在pageA与pageB上的,然后触发相应的动态面板“看图A与看图B”
pageA动作设定




看图A的界面




看图A的动作




返回主界面





第二部分:排序位置
这里是一个矩形部件与动态面板的互动,矩形的显示文字就是动态面板的选中文字(这里我用的toString函数),实现选择的效果。
并让动态面板再次展开时,现在显示的文字与对应的动态面板中的部件处于选中状态,这里又涉及到条件判断,大家看下案例吧。




排序面板,一个例子:智能排序动作配置





第三部分:筛选按钮




看一下筛选动态面板的内部




这里用到了一个小东西,就是分组,这样能够实现每个组中只有一个能够处于选中状态,不会出现复选。





原型百度云盘:http://pan.baidu.com/s/1bovpVI3
在线原型体验:http://9al1jc.axshare.com
建议下载体验,Axure官网在线响应比较慢,下载下来还可以直接看原型的函数设置

今天的案例分享就到这里了,其实是一个很简单的案例,用到的东西并不多,但是还是比较有助于初学者认识一下Axure的一些函数与条件的综合应用的,对于学习Axure我还是文章开头说的话(没注意看的再看一遍),把各个部件兄弟混熟,各种函数会用,各个界面的多种功能认亲完成,然后你的Axure之路才真正开始。

注:本人也在不断学习进步,如有交流可以加我微信:fzl690894512,欢迎打扰。(本人不相亲 O__O "…但是并不拒绝妹子!)

  查看全部
先上一张原型主界面的图片,原型在文章末尾,自己去下载
项目主界面.jpg

本案例是以浏览图片为范本的原型设计(仅供娱乐与学习),内部包含多层动态面板,函数应用,应该会对初学者有一点帮助,不过话说在前面,学习Axure还是要循序渐进,先从认识部件,认识函数开始(函数要学好,很重要滴),基础打牢后再继续打磨会事半功倍,不要上来就直接copy人家的函数与动作,要知道实现思路,知道“鸡”是怎么来滴。
下面开始一个一个开始介绍实现方法:
第一部分:主界面的美女显示面板
           项目内容动态面板部件结构
项目内容显示动态面板整体框架.jpg

在这里需要再看一下主界面显示的情况
项目主界面.jpg

这里我们设置想让图片可以上下拖动,显示其他的未显示出来的内容,注意:这里要设定上下滑动的边界;
并且在相应的图片上进行左右滑动时可以触发动态面板中图片的切换;
在鼠标单击时弹出“看图模式”,进行图片的浏览,在这个界面中必须点击退出按钮才能退出到主界面。
实现思路:首先动态面板要能拖动(设定沿y轴拖动)——设定上下滑动边界条件与动作——设定光标接触部件条件——在相应的接触区域实现左右滑动切换图片的动作——单击相应的图片时候,显示隐藏的对应动态面板并到顶层——点击退出按钮回到主界面
好了,看一下函数的截图:
主页动态面板动作设定:
项目内容显示动态面板动作.jpg


1,这里的top与bottom我说一下边界设定
top函数:是指部件的顶部Y坐标,这里是不想让动态面板一直向下拖动使主界面中出现无内容区域,所以要设定动态面板沿Y轴拖动时top不能大于0,如果大于0的话我们就设定他的位置回到绝对位置(0,0)
top动作函数设定.jpg

bottom函数:部件的底部,这里与top对应的也是不想让部件的底部一直向上滑出现无内容区域,所以要设定底部bottom的y值不能小于动态面板的区域高度,本案例是525(根据个人设定不同),如果小于525那么就移动到相对位置到(0,[[525-LVAR1.bottom-1]]),(这里再解释一下相对位置:就是以目标位置为基准,是需要正向移动还是反向移动,本案例就是正向移动,所以用大数-小数:525-LVAR1.bottom,说道这个程度如果还不理解我也没办法了,慢慢想吧)
bottom函数设定相对距离.jpg

bottom相对距离函数算法.jpg


这里有一个点要看一下
调整动态面板适应内容大小.jpg

在嵌套内部动态面板时为了使显示内容为一个整体,并方便改动内部内容时而外面的函数不受影响,我将主页动态面板的显示内容区域用一个动态面板来显示的,并且将动态面板设定为“调整大小以适合内容”

2,这次再看光标接触部件时左右滑动切换图片的条件
直接在主界面滑动图片设定的光标范围函数.jpg


3,鼠标单击进入看图模式
这里的动作是设定在pageA与pageB上的,然后触发相应的动态面板“看图A与看图B”
pageA动作设定
pageA鼠标单击时动作.jpg

看图A的界面
看图A界面.jpg

看图A的动作
看图A动态面板动作.jpg

返回主界面
返回键动作.jpg


第二部分:排序位置
这里是一个矩形部件与动态面板的互动,矩形的显示文字就是动态面板的选中文字(这里我用的toString函数),实现选择的效果。
并让动态面板再次展开时,现在显示的文字与对应的动态面板中的部件处于选中状态,这里又涉及到条件判断,大家看下案例吧。
tostring动作.jpg

排序面板,一个例子:智能排序动作配置
智能排序动作.jpg


第三部分:筛选按钮
筛选按钮动作.jpg

看一下筛选动态面板的内部
筛选动态面板内容.jpg

这里用到了一个小东西,就是分组,这样能够实现每个组中只有一个能够处于选中状态,不会出现复选。
指定选项组-分类组.jpg


原型百度云盘:http://pan.baidu.com/s/1bovpVI3
在线原型体验:http://9al1jc.axshare.com
建议下载体验,Axure官网在线响应比较慢,下载下来还可以直接看原型的函数设置

今天的案例分享就到这里了,其实是一个很简单的案例,用到的东西并不多,但是还是比较有助于初学者认识一下Axure的一些函数与条件的综合应用的,对于学习Axure我还是文章开头说的话(没注意看的再看一遍),把各个部件兄弟混熟,各种函数会用,各个界面的多种功能认亲完成,然后你的Axure之路才真正开始。

注:本人也在不断学习进步,如有交流可以加我微信:fzl690894512,欢迎打扰。(本人不相亲 O__O "…但是并不拒绝妹子!)