网页设计-用户体验

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

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【测试入门】测试用例经典设计方法 —— 因果图法

01、因果图设计测试用例的步骤 1、分析需求 阅读需求文档,如果User Case很复杂,尽量将它分解成若干个简单的部分。这样做的好处是,不必在一次处理过程中考虑所有的原因。没有固定的流程说明究竟分解到何种程度才算简单,需要测试…

Flutter 滚动布局:sliver模型

一、滚动布局 Flutter中可滚动布局基本都来自Sliver模型,原理和安卓传统UI的ListView、RecyclerView类似,滚动布局里面的每个子组件的样式往往是相同的,由于组件占用内存较大,所以在内存上我们可以缓存有限个组件,滚动…

每天五分钟计算机视觉:掌握迁移学习使用技巧

本文重点 随着深度学习的发展,迁移学习已成为一种流行的机器学习方法,它能够将预训练模型应用于各种任务,从而实现快速模型训练和优化。然而,要想充分利用迁移学习的优势,我们需要掌握一些关键技巧。本文将介绍这些技巧,帮助您更好地应用迁移学习技术。 迁移学习的关键…

HCIP-BGP选路实验

一.实验拓扑图 二.详细配置 R1 interface GigabitEthernet0/0/0 ip address 12.1.1.1 255.255.255.0interface LoopBack0 ip address 1.1.1.1 255.255.255.0interface LoopBack1 ip address 10.1.1.1 255.255.255.0bgp 1 router-id 1.1.1.1 peer 12.1.1.2 as-number 2ipv4-fa…

Unity New Input System 及其系统结构和源码浅析【Unity学习笔记·第十二】

转载请注明出处:🔗https://blog.csdn.net/weixin_44013533/article/details/132534422 作者:CSDN|Ringleader| 主要参考: 官方文档:Unity官方Input System手册与API官方测试用例:Unity-Technologies/InputS…

c/c++公交管理系统(星穹轨道可视化EasyX)

注:全代码由博主个人耗时两个星期开发,实现了基础的公交管理系统功能:1.前端用户查询站点以及查看所有站点。2.后端管理员权限,实现登录系统检验,添加路线以及删除路线。最重要的是使用EasyX实现了星穹轨道的启动以及抽…

ROS2手册的离线编译安装

ROS开发中经常要查询相关API,把文档下载到本地离线使用方便快捷,极大提高开发效率 下载ROS2文档 git clone https://github.com/ros2/ros2_documentation.gitcd ros2_documentation安装sphinx pip install Sphinx配置sphinx sphinx-quickstart按提示…

快速上手的AI工具-文心辅助学习

前言 大家好晚上好,现在AI技术的发展,它已经渗透到我们生活的各个层面。对于普通人来说,理解并有效利用AI技术不仅能增强个人竞争力,还能在日常生活中带来便利。无论是提高工作效率,还是优化日常任务,AI工…

【Linux】vim的使用

个人主页 : zxctsclrjjjcph 文章封面来自:艺术家–贤海林 如有转载请先通知 目录 1. 前言2. vim的基本概念3. vim的基本操作4. vim正常模式命令集4.1 命令模式4.1.1 光标定位 4.2 插入模式4.3 底行模式 这个是在网上找的一张关于vim键盘的图 1. 前言 …

爬虫requests+综合练习详解

Day2 - 1.requests第一血_哔哩哔哩_bilibili requests作用:模拟浏览器发请求 requests流程:指定url -> 发起请求 -> 获取响应数据 -> 持续化存储 爬取搜狗首页的页面数据 import requests# 指定url url https://sogou.com # 发起请求 resp…

Netty和Reactor设计模式

Netty Netty一个线程通过多路复用,能够实现多个socket的非阻塞的调用。 Reactor Reactor 模式是一种设计模式,也叫响应器模式。 以下是 Reactor 模式的基本组成部分: 事件处理器(Event Handlers): 这些是实际处理特…

【深度学习目标检测】十七、基于深度学习的洋葱检测系统-含GUI和源码(python,yolov8)

使用AI实现洋葱检测对农业具有以下意义: 提高效率:AI技术可以快速、准确地检测出洋葱中的缺陷和问题,从而提高了检测效率,减少了人工检测的时间和人力成本。提高准确性:AI技术通过大量的数据学习和分析,能够…

Simulink之Signal

Simulink.Signal 指定信号的属性 描述 此类使您能够创建工作区对象,用于分配或验证信号或离散状态的属性,如其数据类型、数字类型、维度等。您可以使用信号对象来: 将值指定给信号源未指定的信号属性(值为-1或auto)。 验证其值由信号源显式指定的信号属性。此类属性的…

Windows系统如何修改Nginx配置实现远程访问多个本地站点

文章目录 1. 下载windows版Nginx2. 配置Nginx3. 测试局域网访问4. cpolar内网穿透5. 测试公网访问6. 配置固定二级子域名7. 测试访问公网固定二级子域名 1. 下载windows版Nginx 进入官方网站(http://nginx.org/en/download.html)下载windows版的nginx 下载好后解压进入nginx目…

IDEA配置Maven

打开idea选择Configure-->Settings 配置Mavne的路径信息 创建一个Maven项目 创建完成后默认会打开我们的pom.xml文件 添加一个junit的maven 分享一个maven资源的下载网址 Maven Repository: Search/Browse/Explore (mvnrepository.com) 打开网址 选中它进入首页 搜索jun…

Go新项目-Gin中wire的依赖注入方式实战(6)

选型Go项目过程中,针对依赖注入方式的分析和使用 参考资料 https://go.dev/blog/wirehttps://medium.com/dche423/master-wire-cn-d57de86caa1bhttps://toutiao.io/posts/et0t2lk/previewhttps://imlht.com/archives/223/https://lailin.xyz/post/go-training-week…

右值引用和move语义

文章目录 一、左值和右值二、左值引用和右值引用三、move语义四、右值引用的作用1.左值引用的作用和局限2.右值引用的作用3.重谈std::move()4.完美转发 一、左值和右值 在《C Primer Plus》书中这样提到左值:左值是用于标识或定位存储位置的标签。 对于早期的 C 语…

Kafka框架详解

Kafka 1、Kafka介绍 ​ Kafka是最初由linkedin公司开发的,使用scala语言编写,kafka是一个分布式,分区的,多副本的,多订阅者的消息队列系统。 2、Kafka相比其他消息队列的优势 ​ 常见的消息队列:Rabbit…

【设计模式】张一鸣笔记:责任链接模式怎么用?

我将通过一个贴近现实的故事——请假审批流程,带你了解和掌握责任链模式。 什么是责任链模式? 责任链模式是一种行为设计模式,它让你可以避免将请求的发送者与接收者耦合在一起,让多个对象都有处理请求的机会将这个对象连成一条…

MQ 消息丢失、重复、积压问题,如何解决?

面试官在面试候选人时,如果发现候选人的简历中写了在项目中使用了 MQ 技术(如 Kafka、RabbitMQ、RocketMQ),基本都会抛出一个问题:在使用 MQ 的时候,怎么确保消息 100% 不丢失? 这个问题在实际…