Axure原型开发

1axure快速原型设计工具，按照我的理解是类似于美工一样，将所需的页面画好，然后让开发人员根据所画的进行开发。

认识axure页面

2.设计一个登录界面

参照中国农业银行的一个登录界面

 点击掌银注册时，跳转到注册页面

 

 

 

设计了一个如下界面：

 点击掌银注册时，跳转到注册页面，二维码是我复制了知乎的二维码，不要在意啦

3.简单的登录交互实现

以下，举出关于登录的一个交互，登录界面如下：

点击登录按钮之后，将会弹出一个提示框，如下所示：

我们在进行登录交互时，首先将提示框隐藏并置于登录界面的下一层。

为了简单，把用户名和密码以及验证码分别置为tom,123,uwv6

1.当用户名和密码以及验证码都正确时，将会弹出类似于下图的弹出框。

具体操作：点击登录按钮，打开右侧的交互

选择新建交互：

选择触发事件，鼠标单击时。（此处我已经选择了，所以就不能再重新选择了）

选择添加情形：

添加情形主要包括三步：第一步是设置条件，第二步是选择动作，表示要执行的操作，第三步组织动作，包括编辑或修改，第四步是配置动作，表示要选择对象执行动作。

 

 会出现如下这个界面。

选择元件文字，在第二个框中选择要验证的地方，例如我们选择用户名

第三个框选择的是判断符号，我们这里选择的是==

 第四个框我们选择的是文本

第五个框输入我们所给的值（不知道这样表达有没有误）

最后就是这样的啦，对于密码和验证码的验证也是一样，这里就不一一讲述了

 

条件写完了，我们来添加相应的动作

这里我们就选择  显示/隐藏

 

 登陆成功时，我们需要修改提示框中的文字，使他显示为“tom，登录成功”

所以我们还需要添加动作，选择修改文本

弹出一个如下压面，我们可以尝试在局部变量里面，将用户名设置为一个名为userName的变量，

然后在插入或函数的下面修改我们想要内容，[[]]里面代表变量

 点击确定，我们来看效果

 

 整个的验证用户名和密码以及验证码的流程以及完成，

如果有兴趣，还可以验证其他条件，这里就不重复了。

如果有错误，希望大家能够指出来，然后共同进步，再见啦