操作按钮是在表单的结尾,有个确认提交的动作控件,是专门为触控而设计,不仅可点击,更需要容易点击,还需要根据表单的不同条件反馈不同的按钮状态,清晰可预测,应该准确地描述用户点击按钮后会发生什么,比如提交。复位、下一步…等。按钮是关系到页面的最终转化的重要元素,在按钮的设计上要更加费心。

 

颜色是影响按钮隔离效果的首要因素,多个按钮基本都是通过颜色来区分主次。其次才是样式,设计师利用同理心来理解用户「心理模型」,利用设计手段,将「实现模型」改变成用户可以接受和理解的「心理模型」,给用户提供最常用样式,如果设计和常规样式差异过大的按钮,容易带来额外的认知负担。

 

1.按钮位置

 

右上角:以纯文字的形式固定在导航栏的右侧(屏幕右上角);

表单底部:置于表单的最下方,根据表单内容纵向空间的大小而上下移动。表单内容较多时,容易下沉过多而导致按钮不可见;

设备底部悬浮:悬浮在设备底部,随时可见,会占用一定的纵向空间。

跟随键盘:固定在键盘的某个位置,跟随键盘展示或隐藏,常用于单个字段内容的表单。如:登录页面,填写完手机号码,点击键盘上的确定,会跳转至验证码页面,输入验证码后确定,直接登录成功。

 

UI设计

 

2.交互状态

 

待激活状态:需要完成表单中的部分条件方可激活,变成正常可交互状态;

正常状态:已完成表单必填的内容,按钮是可交互的,并且可用的状态;

激活状态:用户已点击按钮后的状态(且还未结束按按钮的动作);

加载状态:送出表单后,正在加载中,但操作还未完成,没有立即实现的状态;

禁用状态:非交互状态,目前不可交互,但以后可以使用。

 

3.多按钮样式

 

主操作按钮:一个表单页面只能存在一个主操作,也是最醒目、最突出、最重要的按钮;

次操作按钮:存在多个等级,可以通过弱化主操作按钮、图标或突出文字来表现次操作按钮,次级按钮可以多个同时存在。

 

青岛青设网络科技有限公司是国内领先设计团队和营销策划服务商,专注于5G技术下平面设计UI设计,BS系统设计,网站开发,SEO,自媒体,百度百科知道、知乎等百家号,排行榜,删除负面,媒体发文等营销宣传。帮助企业解决5G时代三维动态化站点的设计改造,为客户提供网站一站式解决方案。

 

**本文内容来源网络,经AI自动调整,信息仅供参考**


暂无评论



发表评论

电子邮件地址不会被公开。 必填项已用*标注