您现在的位置是：首页 > 设计知识设计知识

axure登录界面设计,axure做登录注册界面

网一2022-11-23 10:59:36设计知识33人已围观

简介axure登录界面设计,axure做登录注册界面PythonAxure是一款功能强大的交互设计软件。作为小白入门的必备软件，我们是从制作登录界面开始学习的。这里我用Axurerp8给大家演示一下如何制作一个登录界面。玩AxureRP

PythonAxure是一款功能强大的交互设计软件。作为小白入门的必备软件，我们是从制作登录界面开始学习的。这里我用Axure rp 8给大家演示一下如何制作一个登录界面。

玩Axure RP，点这个入口看最新教程

工具/软件

硬件型号：联想天翼510S

版本：Windows7

所需软件：Axure RP

方法/步骤

第1步

打开Axure，拖动一个矩形到默认目录中，在右边的检查器中设置矩形框的大小、填充颜色、阴影、圆角半径等数据，使其略显美观。效果如图所示：

第2步

从目录中拖动横线控件，简单划分方框，然后在方框的上半部分拖动一个文本标签，输入文本login；

第3步

之后，将剩余的所需控件拖入登录界面，合理放置在盒子上。要拖动的控件有：两个文本框、一个复选框和一个按钮；为了美观和有创意，还可以拖拽选择一些小标记来美化界面。这完全取决于你的创作偏好。(这里我只是加了两个水滴痕)

第4步

被拖入用于输入用户名和密码的文本框后，需要对其进行一些设置，如设置文本类型、文本提示(用于提示用户输入什么)、最大输入字数等。

第5步

这里需要注意的是，在文本提示之后，有两个提示隐藏的选项，键入和获得焦点。键入是指当用户输入时文本框的提示文字会被隐藏，获得焦点是指当文本框已经被点击表示输入(用户还没有输入)时文本框的提示会被隐藏。图设置用户名和密码的文本框属性：

第6步

为体现良好的人机交互，当用户输入错误密码或用户名不存在时，界面会有提示。这里我们拖动一个tab框作为提示，如图；

第7步

目前为止，整体界面设计已经出来了。下一步是设置登录界面的用例逻辑。当用户名为空、密码为空、用户名错误、密码错误、用户名和密码正确时，都应该有相应的逻辑用例。这里以用户名为例介绍如何设置登录界面的用例。

第8步

点击登录按钮，在登录按钮属性栏交互双击并选择“鼠标点击时”进入点击登录按钮后的用例设置。点击用例编辑器顶部的添加条件，在条件生成界面，当uname元素为空时，点击确定。然后继续在用例编辑器中选择“Set Text”，在configuration action列中选择tips组件，并将文本的值设置为“Please enter your username！”，这样当用户点击登录而不输入密码时，提示内容可以显示在提示框中。

第9步

其余的用例设置大致相同。这里我的用例设置如下：当用户名和密码为空或错误时，点击登录按钮提示框，显示相应的提示信息。当用户输入正确的用户名和密码(用户名：幻云思密达，密码：123456)后，点击登录按钮跳转到www.baidu.com。图是本案例用例的逻辑设置：

第10步

这里做了一个登录界面。按F5查看模型的外观。这里需要注意的是，用例的设置顺序也是有影响的，你在设置的时候一定要考虑清楚。例如，如果您首先设置一个用例来提醒用户名或密码错误，然后设置一个提醒，当用户名或密码为空时，模型的用例执行从第一个用例开始，因此后面提示用户名或密码为空可能会被前面提示用户名或密码错误所覆盖(因为用户名或密码为空，所以可以视为用户名或密码输入错误)。