UI设计开发原则

一、一致性原则

坚持以用户体验为中心设计原则,界面直观、简洁,操作方便快捷,用户接触软件后对界面上对应的功能一目了然、不需要太多培训就可以方便使用本应用系统。

1、字体

保持字体及颜色一致,避免一套主题出现多个字体;不可修改的字段,统一用灰色文字显示。

2、对齐

保持页面内元素对齐方式的一致,如无特殊情况应避免同一页面出现多种数据对齐方式。

3、表单录入

在包含必须与选填的页面中,必须在必填项旁边给出醒目标识(*);各类型数据输入需限制文本类型,并做格式校验如电话号码输入只允许输入数字、邮箱地址需要包含“@”等,在用户输入有误时给出明确提示。

4、鼠标手势

可点击的按钮、链接需要切换鼠标手势至手型;

5、保持功能及内容描述一致

避免同一功能描述使用多个词汇,如编辑和修改,新增和增加,删除和清除混用等。

建议在项目开发阶段建立一个产品词典,包括产品中常用术语及描述,设计或开发人员严格按照产品词典中的术语词汇来展示文字信息。

二、准确性原则

使用一致的标记、标准缩写和颜色,显示信息的含义应该非常明确,用户不必再参考其它信息源。

显示有意义的出错信息,而不是单纯的程序错误代码。

避免使用文本输入框来放置不可编辑的文字内容,不要将文本输入框当成标签使用。

使用缩进和文本来辅助理解。

使用用户语言词汇,而不是单纯的专业计算机术语。

高效地使用显示器的显示空间,但要避免空间过于拥挤。

保特语言的一致性,如“确定”对应“取消”,“是”对应“否”。

三、布局合理化原则

在进行UI设计时需要充分考虑布局的合理化问题,遵循用户从上而下,自左向右浏览、操作习惯,避免常用业务功能按键排列过于分散,以免造成用户鼠标移动距离过长的弊端。多做”减法”运算,将不常用的功能区块隐藏,以保持界面的简洁,使用户专注于主要业务操作流程,有利于提高软件的易用性及可用性。

1、菜单

保特菜单简洁性及分类的准确性,避免菜单深度超过3层。

菜单中功能是需要打开一个新页面来完成的,需要在菜单名字后面加上“…”。【只适用于C/S架构,B/S请无视】。

2、按钮

确认操作按钮放置左边,取消或关闭按钮放置于右边。

3、功能

未完成功能必须隐藏处理,不要置于页面内容中,以免引起误会。

4、排版

所有文字内容排版避免贴边显示(页面边缘),尽量保持10-20像素的间距并在垂直方向上居中对齐;各控件元素间也保持至少10像素以上的间距,并确保控件元素不紧贴于页面边沿。

5、表格数据列表

字符型数据保持左对齐,数值型右对齐方便阅读对比,并根据字段要求,统一显示小数位位数。

6、滚动条

页面布局设计时,应避免出现横向滚动条。

7、页面导航

在页面显眼位置应该出现页面导航,让用户知道当前所在页面的位置,并明确导

航结构,如:首页>新闻中心>欧科智能,其中带下划线部分为可点击链接。

8、信息提示窗口

信息提示窗口应位于当前页面的居中位置,并适当弱化背景层以减少信息干扰,让用户把注意力集中在当前的信息提示窗口。一般做法是在信息提示窗口的背面加一个半透明颜色填充的遮罩层。

四、系统操作合理性原则

尽量确保用户在不使用鼠标(只使用键盘)的情况下也可以流畅地完成一些常用的业务操作,各控件间可以通过Tb键进行切换,并将可编辑的文本全选处理。

查询检索类页面,在查询条件输入框内按回车应该自动触发查询操作。

在进行一些不可逆或者删除操作时应该有信息提示用户,并让用户确认是否继续操作,必要时应该把操作造成的后果也告诉用户。

信息提示窗口的“确认”及“取消”按钮需要分别映射键盘按键"Enter”和

Esc”

避免使用鼠标双击动作,不仅会增加用户操作难度,还可能会引过用户误会,认为功能点击无效。

表单录入页面,需要把输入焦点定位到第一个输入项。用户通过Tb键可以在输入框或操作按钮间切换,并注意Tb的操作应该道循从左向右、从上而下的顺序。

五、系统响应时间原则

系统响应时间应该适中,响应时间过长,用户就会感到不安和诅丧,而响应时间过快也会影响到用户的操作节奏,并可能导致错误。因此在系统响应时间上坚持如下原则:

1、2-5秒窗口显示处理信息提示,避免用户误认为没响应而重复操作:

2、5秒以上显示处理窗口,或显示进度条:

3、一个长时间的处理完成时应给予完成警告信息。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/71491.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Java正常加锁但是没有起作用的问题(纪实)

概述 Redisson分布式锁,加锁代码完全正确,但是却没有起到锁的作用。 首先说明一下,这里的加锁代码是正确的,不存在因为加锁错误,锁失效的问题。那么锁是正常有效的,为什么没有起到锁的作用呢。下面先说一下…

等保测评--安全管理中心--测评方法

安全子类--系统管理 a) 应对系统管理员进行身份鉴别,只允许其通过特定的命令或操作界面进行系统管理操作,并对这些操作进行审计; 一、测评对象 提供集中系统管理功能的系统; 二、测评实施 1)应核查是否对系统管理员进行身份鉴别; 2)应核查是否仅允许系统管理员通过…

基于多设计模式下的同步异步日志系统

基于多设计模式下的同步&异步日志系统 代码链接:https://github.com/Janonez/Log_System 1. 项目介绍 本项目主要实现一个日志系统, 其主要支持以下功能: 支持多级别日志消息支持同步日志和异步日志支持可靠写入日志到标准输出、文件…

【Three.js】第二十一章 Physics 物理

介绍 物理是WebGL可以添加到项目体验中最酷的功能之一。人们喜欢真实物理感的物体,看到它们碰撞、倒塌、坠落和弹跳,就像我的作品集一样: https: //bruno-simon.com/ 有很多方法可以将物理功能添加到您的项目中,这取决于您想要实…

Python标准库sys

sys 模块主要负责与 Python 解释器进行交互,该模块提供了一系列用于控制 Python 运行环境的函数和变量。 函数和对象清单 对象名称 对象说明 sys.argv 命令行参数List,第一个元素是程序本身路径 sys.path 返回模块的搜索路径,初始化时…

如何使用 Python 多处理模块

在本文[1]中,我们将学习如何使用多处理模块中的特定 Python 类(进程类)。我将通过示例为您提供快速概述。 什么是多处理模块? 还有什么比从官方文档中提取模块更好的方式来描述模块呢? Multiprocessing 是一个使用类似…

区块链技术研究探讨

介绍 区块链技术是一种去中心化的分布式账本技术,它通过将数据存储在多个参与者之间的区块链网络中,确保数据的透明性、安全性和不可篡改性。以下是关于区块链技术的一些重要信息: 1、 工作原理:区块链是由一系列按时间顺序链接…

21.4 CSS 盒子模型

1. 边框样式 border-style属性: 指定元素的边框样式.常用属性值: - none: 无边框(默认值). - solid: 实线边框. - dotted: 点状边框. - dashed: 虚线边框. - double: 双线边框. - groove: 凹槽状边框. - ridge: 脊状边框. - inset: 内阴影边框. - outset: 外阴影边框.这些值可…

python内置类属性

class Person:"""这是一个类,功能是描述一个人的精神面貌与行为"""age 19def __init__(self, name):self.name namedef run(self):print("run")"""__dict__ : 类属性__bases__ : 类所有父类构成元组__doc…

使用SimPowerSystems并网光伏阵列研究(Simulink实现)

💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势:🌞🌞🌞博客内容尽量做到思维缜密,逻辑清晰,为了方便读者。 ⛳️座右铭&a…

随机流-RandomAccessFile

RandomAccessFile RandomAccessFile 基本操作案例 RandomAccessFile 基本操作 案例 import java.io.*;public class TestMain09 {public static void main(String[] args) throws Exception {insert("D:\\home\\product\\aa.txt",2,"ni");}public static…

C++:类和对象(二)

本文主要介绍:构造函数、析构函数、拷贝构造函数、赋值运算符重载、const成员函数、取地址及const取地址操作符重载。 目录 一、类的六个默认成员函数 二、构造函数 1.概念 2.特性 三、析构函数 1.概念 2.特性 四、拷贝构造函数 1.概念 2.特征 五、赋值…

TS编译选项

自动监控编译 tsc xxx.ts -w 在一个文件夹下,创建 tsconfig.json 文件,在用命令 tsc 就可以自动编译当前文件夹下的ts文件 tsconfig.json文件配置如下: {/*tsconfig.json 是ts编译器的配置文件,ts编译器可以根据它的信息来对代…

Jenkins+maven+testng+htmlreport单元自动化测试

背景说明 为了可以在jenkins自动化运行单元测试的代码,所以使用maventestng的技术结合,达到手动或者定时去执行单元测试的代码,以便提高人工运行的自动化的效率。单元通过该方案也可以套用在httpclient框架去执行测试web api接口的自动化测试…

Kubernetes 工作中常见命令总结

① configmap 文件的操作命令:命名空间为platform,configmap的名称为openapi kubectl -n platform describe configmap openapi kubectl -n platform get configmap openapi -o yaml kubectl -n platform edit configmap openapi kubectl -n platform…

撰寫自己的Python C擴展!

撰寫自己的Python C擴展! 前言spam.cheaderC函數參數參數解析函數主體生成回傳值 method table模組定義模組初始化函數拋出異常main函數完整代碼 編譯及鏈接使用gcc使用gcc Python flags使用distutils 從Python調用C函數直接import使用distutils透過ctypes調用so檔 前言 本篇…

2022年09月 C/C++(五级)真题解析#中国电子学会#全国青少年软件编程等级考试

C/C++编程(1~8级)全部真题・点这里 第1题:城堡问题 1 2 3 4 5 6 7 ############################# 1 # | # | # | | # #####—#####—#—#####—# 2 # # | # # # # # #—#####—#####—#####—# 3 # | | # # # # # #—#########—#####—#—# 4 # # | | | | # # ###########…

2023高教社杯数学建模E题思路模型 - 黄河水沙监测数据分析

# 1 赛题 E 题 黄河水沙监测数据分析 黄河是中华民族的母亲河。研究黄河水沙通量的变化规律对沿黄流域的环境治理、气候变 化和人民生活的影响, 以及对优化黄河流域水资源分配、协调人地关系、调水调沙、防洪减灾 等方面都具有重要的理论指导意义。 附件 1 给出了位…

Opencv图像暗通道调优

基于雾天退化模型的去雾算法,Opencv图像暗通道调优,(清华版代码)对普通相片也有较好的调优效果,相片更通透。 结合代码实际运行效果、算法理论模型、实际代码。我个人理解,实际效果是对图像的三个颜色通道…

04架构管理之分支管理实践-一种git分支管理最佳实践

专栏说明:针对于企业的架构管理岗位,分享架构管理岗位的职责,工作内容,指导架构师如何完成架构管理工作,完成架构师到架构管理者的转变。计划以10篇博客阐述清楚架构管理工作,专栏名称:架构管理…