IT技术博客大学习 共学习 共进步

Axure 实现网站登录的交互

jerry的交互设计 2011-02-08 23:45:47 累计浏览 4,624 次

原理:

1. 通过变量来记住用户的状态,是处于登录前还是登录后

2. 用master 的 onPageLoad 事件来判断是显示登录前的界面还是登录后的界面

实例:

1. 将设计好登录前和登录后两种界面效果做成dynamic panel的两种state,默认state为未登录的。pannl命名为login

登录前的state命名为no:

登录后的state命名为yes:

2. 添加登录前“登录”按钮的交互事件

2.1

2.2 新建一个变量,“login”

2.3 将该变量login赋值为“yes” 表示已经登录

2.4 添加交互事件

选择reload current page方式

3. 添加登录后“退出”文字链的交互事件

3.1

将该变量login赋值为“no” 表示未登录

4. 将这panel转化成master

5. 为master添加onPageLoad事件

5.1 为交互事件设置引发条件

当变量 login 等于“yes”时,既用户已经登录

5.2 设置交互事件

切换到pannel面板的“yes”state

5.3 同上面的设置

当判断出用户没有登录(变量login等于“no”)切换到dynamic pannel 面板的“no”state

原型图预览

下载源文件

建议继续学习

  1. python实现自动登录discuz论坛 (累计阅读 32,662)
  2. 微信扫码登录网页实现原理 (累计阅读 17,266)
  3. 初探单点登录 SSO (累计阅读 10,505)
  4. 如何设计用户登录 (累计阅读 6,524)
  5. 你会做Web上的用户登录功能吗? (累计阅读 6,264)
  6. 如何让ssh登录更加安全 (累计阅读 5,604)
  7. perl的expect使用方法,实现非交互式登录。 (累计阅读 5,403)
  8. 什么是OpenID?OpenID概念、原理和案例 (累计阅读 5,363)
  9. Axure之变量的使用 (累计阅读 5,046)
  10. 互联网上的单点登录研究 (累计阅读 5,024)