这两天刚刚自学了Axure RP，它是用于交互做高保真原型图的一款软件，上手比较容易，跟ps不一样，它是直接拖拽的，而不是需要选框绘制，开始学基础呢不是很扎实总是学了忘忘了再学，所以跟大家分享的过程对我而言又是一次重新的温习了。
今天学的是微信的主页面，点击下面的四栏后上面的图片便会跟着切换。
左侧下面是我们可以用的图形工具，一般矩形较常用，所以我们拖动它到任意位置，尺寸呢我是自己设定的，只是为了做展示所以并未按照手机品牌对应的分辨率尺寸来做，如果大家想做的更标准些，可以去找相应的参数。
拖动矩形调整大小如下，
Axure RP 做基础的微信框架(一)
大框架打好后我们把下面的四栏分别拖进来并命名，
Axure RP 做基础的微信框架(一)
我们想要点击这四个栏，上面的这框内容可以跟着变动，所以我要再拖拽一个放到上面，为了能看清，我特意加粗并且给背景添了颜色和命名。
Axure RP 做基础的微信框架(一)
前面绿框的背景我们需要根据底下的按钮而切换，所以我们需要给它转化为动态模版。
单击右键选择动态模版
Axure RP 做基础的微信框架(一)
然后双击就生成了一栏动态模版
Axure RP 做基础的微信框架(一)
我们需要在右下角的页面找到+号，复制三个，并且命名
Axure RP 做基础的微信框架(一)
然后在选择到动态模版的微信那栏里ctrl+a复制粘贴到其它三栏里，并且把它们的背景颜色和文字输入好
Axure RP 做基础的微信框架(一)
回到主页面我们点击第一个框为它加入要显示的图片
选择框后右侧选择鼠标单击时如下设置，
Axure RP 做基础的微信框架(一)
后面的三个框的分别选择相对应的图，并按如上操作
Axure RP 做基础的微信框架(一)
点击右上角的预览即生成，生成后分别点击就可以看到页面的切换啦
Axure RP 做基础的微信框架(一)
第一次分享，有不对的地方，欢迎各路大神给予指出，个人还是Ui小白一枚，但喜欢学习，每天进步一点点，相信总有一天可以踏入专业领域的大门。
网友评论