当前位置: 首页 > news >正文

网页设计-用户体验

Use Cases (用例)

        用例是用户如何在网站上执行任务的书面描述,从用户的角度描述了系统响应请求时的行为。每个用例都是用户实现目标的一系列简单的步骤。简言之,用例是一种用于描述系统如何满足用户需求的方法。


用例的好处


        1. 明确需求: Use Cases清晰描述系统如何满足用户需求,避免理解上的混淆。
        2. 促进用户参与: 描述用户在特定场景中的使用方式,提高用户参与度,确保系统满足实际需求。
        3. 指导设计和开发: 提供对系统功能和交互的具体指导,有助于设计和开发团队按用户期望构建系统。
        4. 作为测试基础: 作为测试用例的基础,帮助验证系统是否符合规范和用户需求,提高系统质量。
        5. 变更管理: 用于变更管理,及时反映需求变化,确保团队适应新的要求。
        6. 有效沟通工具: 作为沟通工具,用于分享系统工作方式的信息,确保各方理解一致。
通过Use Cases,项目更清晰、团队更协调,最终交付的系统更符合用户期望。


用例的格式


        1. *Use Case名称: 描述Use Case的简短、清晰的名称。

        2. *参与者(Actors): 列出参与Use Case的各种角色或实体。

        3. 目标(Goal): 描述Use Case的目标或期望结果。

        4. 前提条件(Preconditions): 描述执行Use Case之前必须满足的条件。

        5. *基本流程(Main Flow): 描述Use Case的正常执行流程,通常以步骤形式呈现。

        6. *备选流程(Alternate Flows): 描述可能发生的备选或异常情况下的执行流程。

        7. 例外流程(Exception Flows): 描述可能引起Use Case失败或产生错误的情况。

        8. 结果(Postconditions): 描述Use Case执行结束后的系统状态或结果。

        9. 扩展点(Extension Points): 描述可以在将来扩展的地方,以适应未来需求的变化。

        10. 注释和说明(Comments): 提供对Use Case的额外解释或注释。

Use Case示例:

Simple Level
**Use Case名称:** [在这里写Use Case名称]**参与者:** 
- 主要参与者:[列出主要参与者]
- 次要参与者:[列出次要参与者]**基本流程:**
1. [步骤1]
2. [步骤2]
3. [步骤3]...
Middleweight Level
**Use Case名称:** [在这里写Use Case名称]**参与者:** 
- 主要参与者:[列出主要参与者]
- 次要参与者:[列出次要参与者]**基本流程:**
1. [步骤1]
2. [步骤2]
3. [步骤3]...**备选流程:**
- [备选流程1]
- [备选流程2]...
High Level:
**Use Case名称:** [在这里写Use Case名称]**参与者:** 
- 主要参与者:[列出主要参与者]
- 次要参与者:[列出次要参与者]**概述:** [概述Use Case]**触发条件: ** [描述如何触发功能]**前提条件:**
1. [前提条件1]
2. [前提条件2]...**基本流程:**
1. [步骤1]
2. [步骤2]
3. [步骤3]...**备选流程:**
- [备选流程1]
- [备选流程2]...**后置条件: ** [完成后期望得到的状态]

例子: 

**Use Case名称:** [在这里写Use Case名称]
# Use Case名称: 用户登录**参与者:** 
- 主要参与者:[列出主要参与者]
- 次要参与者:[列出次要参与者]
# 参与者: 用户**目标:** [描述Use Case的目标]
# 目标: 用户成功登录系统**前提条件:**
1. [前提条件1]
2. [前提条件2]...
# 前提条件: 用户已注册并获得登录凭证**基本流程:**
1. [步骤1]
2. [步骤2]
3. [步骤3]...
# 基本流程:
# 1. 用户打开登录页面
# 2. 用户输入用户名和密码
# 3. 系统验证用户身份
# 4. 如果验证通过,用户成功登录
# 5.系统显示用户个人信息页面**备选流程:**
- [备选流程1]
- [备选流程2]...
# 备选流程:
# - 如果用户名或密码不正确,系统显示错误消息**例外流程:**
- [例外流程1]
- [例外流程2]...
# 例外流程:
# - 如果用户多次输入错误,账号被锁定**结果:** [描述Use Case执行结束后的系统状态或结果]
# 结果: 用户登录成功,可以访问个人信息页面**扩展点:** [描述可以在将来扩展的地方]
# 扩展点:
# - 当需要实现多因素身份验证时,可在验证用户身份步骤中扩展该功能**注释和说明:** [提供额外解释或注释]
# 注释和说明:
# - 在实际系统中,可以通过使用验证码或其他安全措施来增强用户身份验证的安全性。
# - 账号被锁定是为了防止恶意登录,可以设定一定的解锁机制或提供找回密码的途径。

Law of UX (UX设计原则)


Jakob's Law

        Jakob's Law,也称为Jakob Nielsen's Law of the Internet User Experience,是由用户体验专家Jakob Nielsen提出的一项法则。该法则主要关注用户在互联网上的使用习惯和期望。具体来说,Jakob's Law表达了以下观点:


"Users spend most of their time on other websites."

翻译过来就是:“用户在其他网站上花费大部分时间。” 这个法则强调,用户在互联网上的体验和习惯是基于他们在其他网站上的经验所形成的。因此,设计人员和开发者在创建新的网站或应用程序时,应该考虑到用户在其他网站上所熟悉的界面和功能,以提供更符合他们期望的体验。

设计原则

        1. 一致性: 保持与其他流行网站相似的设计风格和交互方式,使用户能够更轻松地适应新的界面。
        2. 惯性导航: 利用用户已经学会的网站导航模式,减少学习新系统的成本。
        3. 借鉴最佳实践: 学习和借鉴其他成功网站的最佳实践,以提高用户体验。

Fitts's Law

Fitts's Law(费茨定律)是描述人类肌肉运动和操作之间关系的定律,特别是在指向目标的任务中。该定律由心理学家 Paul Fitts 在1954年提出,并被广泛用于人机界面设计和人机交互研究中。

Fitts's Law 的数学表达式为:

        ID = \log_2(\frac{D}{W}+1)

  • ID 表示任务的难度,也称为指数难度。
  • D 表示目标的距离。
  • W 表示目标的宽度。

 核心观点

        1. 距离影响难度: 任务目标距离越远,任务难度越大。

        2. 目标宽度影响难度: 任务目标越宽,任务难度越小。宽度指的是目标在指向方向上的尺寸。

        3. 指向时间与难度成反比: 指向目标所需的时间与任务难度成反比,即任务越容易,所需时间越短。

Hick's Law

        Hick's Law(希克定律)描述了选择一个项目所需时间与可供选择的项目数量之间的关系。该定律认为,选择的时间会随着可选项的增加而增加。这个法则的核心思想是,当面对多个选项时,人们在做出选择时需要更多的时间。

Hick's Law 的数学表达式为:        

        T = a + b\cdot \log_2(N+1)

  • T 表示选择一个项目所需的时间。
  • a 和 b 是实验中的常数。
  • N 表示可供选择的项目数量。

 核心观点

  1. 选择时间与选项数量呈对数关系: 当可供选择的项目数量增加时,选择所需的时间以对数的方式增加。

  2. 信息过载可能导致决策困难: 当面对大量选项时,决策时间的增加可能导致用户感到困扰,甚至可能影响他们的决策质量。

Von Restorff Effect

Von Restorff Effect(冯·雷斯托夫效应)是一种心理学现象,描述了在一系列相似的物品或元素中,与其他物品不同或独特的项更容易被记住。这个效应由德国心理学家 Hedwig von Restorff 在20世纪30年代首次提出,因此得名。

Von Restorff Effect 的关键观点可以总结为:

"Items that stand out are more likely to be remembered."

翻译过来就是:“在一组相似的事物中,与其他事物有明显差异的那个事物更容易被记住。”

通过应用 Von Restorff Effect 的设计原则,设计师可以提高用户对特定元素的关注度,增强用户对重要信息的记忆,从而改善用户体验和信息传递效果。

设计原则

  1. 突出差异性: 通过使某个元素在整体设计中与其他元素有明显的差异,例如使用鲜艳的颜色、突出的形状、引人注目的图标等,使其更易于被用户注意到。

  2. 强调重要信息: 如果在一组信息中存在关键或重要的信息,通过使用不同的样式或颜色将其突出显示,以确保用户更容易注意到和记住这些关键信息。

  3. 提高可识别性: 在设计中使用独特和易于识别的元素,以增加用户对这些元素的注意力和记忆度。这对于品牌标识、关键操作按钮等方面特别重要。

  4. 避免过度使用: 尽管 Von Restorff Effect 有利于突出某些元素,但过度使用可能导致混乱和降低效果。因此,在设计中要谨慎使用这个原则,确保它符合整体设计的需要。

  5. 一致性和可辨识性: 确保突出的元素在整体设计中保持一致性,以避免混淆。与此同时,确保这些元素仍然易于识别和与整体设计协调一致。

Miller's Law

Miller's Law(米勒定律)是心理学家George A. Miller提出的一项心理学原则,最初是在1956年的一篇论文中提出的。该定律描述了人类大脑对于信息处理的认知限制,具体来说,它指出人们在短时记忆中能够有效处理的信息单元数量是有限的。

Miller's Law 的核心表达式是:

"The average number of objects an individual can hold in working memory is about seven, plus or minus two."

翻译过来就是:“一个人在工作记忆中能够保持的平均对象数量约为七个,加减二。”

简而言之,Miller's Law 指出,人们在进行认知任务时,能够有效处理的信息单元数量大约为7个,这个数字可能在5到9之间变动。
 

设计原则

  1. 信息分块: 将大量信息划分成小块,每个小块包含的信息单元数量不要超过人类短时记忆的限制,通常在7个左右。这有助于用户更轻松地处理和记忆信息。

  2. 明确重要信息: 将重要的信息突出显示,确保用户能够专注于关键的元素。这有助于避免信息过载,使用户更容易理解和记住关键信息。

  3. 逻辑组织: 在设计中采用清晰的逻辑组织,将相关的信息放在一起,有助于用户更容易建立起信息的联系和理解信息的关系。

  4. 限制选择数量: 在用户面临选择时,限制选项的数量,以避免过多的选择导致决策困难。这可以通过分阶段呈现选择项或使用更明确的分类方式来实现。

  5. 简洁性和一致性: 保持设计的简洁性和一致性,避免引入过多的不必要元素和复杂性。简洁和一致的设计有助于用户更容易理解和记忆界面。

Law of Proximity

Law of Proximity(近似法则)是一种描述元素在空间中的布局和组织的设计原则,它强调物理上靠近的元素会被视为相关的或属于同一组。这个法则表明,人们倾向于将靠近彼此的元素视为有关联的,而将距离较远的元素视为不相关的。

具体来说,Law of Proximity 表达了以下观点:

"Objects that are near, or proximate to each other, tend to be grouped together."

翻译过来就是:“靠近或相邻的物体倾向于被视为一组。”

通过合理运用 Law of Proximity,设计师可以创建更有条理、易于理解的界面布局,提高用户对信息的感知和理解能力。这有助于改善用户体验,使用户更轻松地与界面进行交互。

设计原则

  1. 相关元素靠近: 将相关的元素放置在相邻的位置,形成组块,使用户能够直观地感知它们之间的关系。例如,在导航菜单中,将相关的菜单项放在一组,以便用户更容易导航。

  2. 组织信息结构: 利用近似法则来组织信息的结构,使得界面布局更清晰、易于理解。确保相关的内容和功能靠近彼此,减少用户在查找信息时的认知负担。

  3. 避免混淆: 避免将不相关的元素过于靠近,以防止混淆用户。确保界面上的元素布局清晰,避免用户误解元素之间的关系。

  4. 注意分组: 将属于同一类别或功能的元素放在一组,而与其他组之间保持适当的距离。这有助于用户更容易区分不同组之间的内容。

  5. 强调重要性: 如果有特别重要或需要突出的元素,通过将它们放置在相对独立的位置,以强调其重要性。这有助于用户更容易注意到和关注这些元素。

  6. 保持一致性: 在整体设计中保持一致的元素间距和分组方式,以确保用户在不同页面或部分之间的一致性体验。

相关文章:

网页设计-用户体验

Use Cases (用例) 用例是用户如何在网站上执行任务的书面描述,从用户的角度描述了系统响应请求时的行为。每个用例都是用户实现目标的一系列简单的步骤。简言之,用例是一种用于描述系统如何满足用户需求的方法。 用例的好处 1. 明确需求: Use…...

docker应用:vocechat

简介:VoceChat是一款超轻量级的Rust聊天应用程序、API和SDK,优先考虑私人托管。使用VoceChat建立您自己的聊天功能!作为一款非常好用的通讯应用程序,它可以让你与朋友、家人和同事进行即时消息聊天,支持图片视频的分享…...

linux 02 vmware的快照,文件管理

01.快照 使用快照: 同时的快照管理器: 如果想要返回快照,选择要选择的快照,跳转 02. 文件管理: cd 修改当前路径 02.touch 创建文件 03. mkdir 创建文件夹 mkdir -p 文件夹 (创建之前没有的上级文件…...

项目架构之Zabbix部署

1 项目架构 1.1 项目架构的组成 业务架构:客户端 → 防火墙 → 负载均衡(四层、七层) → web缓存/应用 → 业务逻辑(动态应用) → 数据缓存 → 数据持久层 运维架构:运维客户端 → 跳板机/堡垒机&#x…...

RocketMQ源码阅读-Message消息存储

RocketMQ源码阅读-Message消息存储 1. CommitLog的作用2. CommitLog 存储消息3. 时序图4. 小结 在Broker消息接收一篇中,分析到Broker接收到消息,最终会调用CommitLong#putMessage方法存储消息。 本篇来分析CommitLong#putMessage存储消息的流程。 1. C…...

《C语言学习》---郝斌版---笔记

简介 学习计算机,离不开C语言的学习,而C语言学习过程中的视频课教程,目前来说,如果郝斌老师的C语言排第二,没有人敢排第一 郝斌老师的C语言教程,通俗易懂,引人发思,特别适合新手入门…...

Python(32):字符串转换成列表或元组,列表转换成字典小例子

1、python 两个列表转换成字典 字符串转换成列表 列表转换成字典 column "ID,aes,sm4,sm4_a,email,phone,ssn,military,passport,intelssn,intelpassport,intelmilitary,intelganghui,inteltaitonei,credit_card_short,credit_card_long,job,sm4_cbc,sm4_a_cbc" …...

CentOS 7 安装私有平台OpenNebula

目录 一、配置yum源 二、配置数据库MySQL 2.1 安装MySQL 2.2 修改MySQL密码 2.3 创建项目用户和库 三、安装配置前端包 四、设置oneadmin账号密码 五、验证安装 5.1 命令行验证安装 5.2 数据存放位置 5.3 端口介绍 5.4 命令介绍 六、访问 6.1 设置语言 6.2 创建主…...

(aiohttp-asyncio-FFmpeg-Docker-SRS)实现异步摄像头转码服务器

1. 背景介绍 在先前的博客文章中,我们已经搭建了一个基于SRS的流媒体服务器。现在,我们希望通过Web接口来控制这个服务器的行为,特别是对于正在进行的 RTSP 转码任务的管理。这将使我们能够在不停止整个服务器的情况下,动态地启动…...

基于STM32微控制器的四轮智能小车控制系统设计

标题:基于STM32微控制器的四轮智能小车控制系统设计与实现 摘要: 本文针对移动机器人领域的应用需求,详细介绍了基于STM32系列单片机(以STM32F103C8T6为例)为核心的四轮小车控制系统的设计和实现过程。该系统集成了电…...

JPA的复杂查询包括一对多多对一和多对多的查询

1. 多表关联查询和排序 假设我们有两个实体类:Customer和Order,它们之间是一对多的关系,即一个客户可以有多个订单。我们想要查询某个客户的所有订单,并按订单金额进行降序排序。 Entity Table(name "customers") pu…...

电脑文件mfc100u.dll丢失的解决方法分析,怎么修复mfc100u.dll靠谱

mfc100u.dll丢失了要怎么办?其实很多人都遇到过这样的电脑故障吧,说这个mfc100u.dll文件已经不见了,然后一些程序打不开了,那么这种情况我们要怎么解决呢?今天我们就来给大家详细的说说mfc100u.dll丢失的解决方法。 一…...

从DETR到Mask2former(2): 损失函数loss function

DETR的损失函数包括几个部分,如果只看论文或者代码,比较难理解,最好是可以打断点调试,对照着论文看。但是现在DETR模型都已经被集成进各种框架中,很难进入内部打断掉调试。与此同时,数据的label的前处理也比…...

Java21 + SpringBoot3集成WebSocket

文章目录 前言相关技术简介什么是WebSocketWebSocket的原理WebSocket与HTTP协议的关系WebSocket优点WebSocket应用场景 实现方式1. 添加maven依赖2. 添加WebSocket配置类,定义ServerEndpointExporter Bean3. 定义WebSocket Endpoint4. 前端创建WebSocket对象 总结 前…...

鲸鱼优化算法WOA改进预告

鲸鱼优化算法(Whale Optimization Algorithm,WOA)是一种基于自然界中鲸鱼群体行为的启发式优化算法。这个算法模拟了鲸鱼的觅食行为和社会行为,通过模拟这些行为来解决优化问题。 以下是鲸鱼优化算法的一些关键特点和步骤&#x…...

Nightingale 夜莺监控系统 - 告警篇(3)

Author:rab 官方文档:https://flashcat.cloud/docs/content/flashcat-monitor/nightingale-v6/usage/alert/alert-rule/ 目录 前言一、配置1.1 创建钉钉机器人1.2 n9e 创建通知用户1.3 n9e 创建团队(组)1.4 将通知用户添加团队1.…...

【LeetCode2696】删除子串后的字符串最小长度

1、题目描述 【题目链接】 标签:栈 、字符串、模拟 难度:简单 给你一个仅由 大写 英文字符组成的字符串 s 。 你可以对此字符串执行一些操作,在每一步操作中,你可以从 s 中删除 任一个 “AB” 或 “CD” 子字符串。 通过执行操作…...

VMware安装CentOS7虚拟机

VMware 安装 获取 VMware 安装包 下载地址:链接:https://pan.baidu.com/s/1ELR5NZa7rO6YVplZ1IUigw?pwdplz3 提取码:plz3 包括:当然,也可以自己去别的地方下载,WMware 版本都差不多,现在用的比…...

Linux第22步_安装CH340驱动和串口终端软件MobaXterm

开发板输出信息通常是采用串口,而计算机通常是USB接口,为了让他们之间能够交换数据,我们通常采用USB转串口的转换器来实现。目前市场上的串口转换器大多是采用CH340芯片来实现的,因此我们需要在计算中安装一个CH340驱动程序&#…...

Elasticsearch 地理空间搜索 - 远超 OpenSearch

作者:来自 Elastic Nathan_Reese 2021 年,OpenSearch 和 OpenSearch Dashboards 开始作为 Elasticsearch 和 Kibana 的分支。 尽管 OpenSearch 和 OpenSearch Dashboards 具有相似的血统,但它们不提供相同的功能。 在分叉时,只能克…...

USB micro输入口中三个问题详解——差分信号、自恢复保险丝SMD1210P050TF、电容滤波

前言:本文对USB micro输入口中遇见的三个问题进行详解:差分信号、自恢复保险丝SMD1210P050TF、电容滤波 目录: 差分信号 自恢复保险丝SMD1210P050TF 电容滤波 如下图,USB为U-F-M5DD-Y-1型号(9个引脚,除…...

mysql原理--undo日志1

1.事务回滚的需求 我们说过 事务 需要保证 原子性 ,也就是事务中的操作要么全部完成,要么什么也不做。但是偏偏有时候事务执行到一半会出现一些情况,比如: (1). 事务执行过程中可能遇到各种错误,比如服务器本身的错误&…...

Zookeeper系列(一)集群搭建(非容器)

系列文章 Zookeeper系列(一)集群搭建(非容器) 目录 前言 下载 搭建 Data目录 Conf目录 集群复制和修改 启动 配置示例 测试 总结 前言 Zookeeper是一个开源的分布式协调服务,其设计目标是将那些复杂的且容易出错的分…...

【高等数学之泰勒公式】

一、从零开始 1.1、泰勒中值定理1 什么是泰勒公式?我们先看看权威解读: 那么我们从古至今到底是如何创造出泰勒公式的呢? 由上图可知,任一无穷小数均可以表示成用一系列数字的求和而得出的结果,我们称之为“无穷算法”。 那么同理我们想对任一曲线来…...

奇异值分解在图形压缩中的应用

奇异值分解在图形压缩中的应用 在研究奇异值分解的工程应用之前,我们得明白什么是奇异值?什么是奇异向量? 奇异值与奇异向量 概念:奇异值描述了矩阵在一组特定向量上的行为,奇异向量描述了其最大的作用方向。 奇异值…...

C++深入学习之STL:1、容器部分

标准模板库STL的组成 主要由六大基本组件组成:容器、迭代器、算法、适配器、函数对象(仿函数)以及空间配置器。 容器:就是用来存数据的,也称为数据结构。 本文要详述的是容器主要如下: 序列式容器:vector、list 关联…...

Javascript——vue下载blob文档流

<el-table-column label"操作" fixed"right" width"150" showOverflowTooltip><template slot-scope"scope"><el-button type"text" v-has"stbsd-gjcx-down" class"edit-button" click&…...

C# 的SequenceEqual

SequenceEqual 是 LINQ 扩展方法之一&#xff0c;用于比较两个序列&#xff08;如数组、列表等&#xff09;的元素是否相等。 该方法的详细定义如下&#xff1a; public static bool SequenceEqual<TSource>(this IEnumerable<TSource> first, IEnumerable<TS…...

第九部分 使用函数 (一)

目录 一、简介 二、函数的调用语法 一、简介 在 Makefile 中可以使用函数来处理变量&#xff0c;从而让我们的命令或是规则更为的灵活和具 有智能。make 所支持的函数也不算很多&#xff0c;不过已经足够我们的操作了。函数调用后&#xff0c;函数 的返回值可以当做变量来使用…...

【JUC进阶】14. TransmittableThreadLocal

目录 1、前言 2、TransmittableThreadLocal 2.1、使用场景 2.2、基本使用 3、实现原理 4、小结 1、前言 书接上回《【JUC进阶】13. InheritableThreadLocal》&#xff0c;提到了InheritableThreadLocal虽然能进行父子线程的值传递&#xff0c;但是如果在线程池中&#x…...