jjzjj

软件设计·用户界面设计

miracles_1000th 2024-07-19 原文

一、黄金规则

黄金规则可以应用于所有与人交互的技术产品,构成了一系列用户界面设计原则的基础,有些原则可以知道软件设计的重要方面

1. 把控制权交给用户(place the user in control)

很多情况下,设计者为了简化界面的实现可能会引入约束和限制,其结果可能是界面易于建构但是回妨碍使用,这条规则的具体内容如下:

  • 以不强迫用户进入不必要的或者不希望的动作的方式来定义交互模式(define interaction modes in a way that does not force a user into unnecessary or undesired actions),用户应该能够几乎不用做任何动作就能进入或者退出某个模式
  • 提供灵活的交互(provide for flexible interaction):软件可能允许用户通过键盘、鼠标、数字笔、触摸屏等进行交互
  • 允许用户交互被中断或者撤销(allow user interface to be interruptable and undoable):用户能够中断动作序列去做其他的事情,而不会失去已经做过的工作
  • 当技能水平高的时候,可以使得交互流线化并允许定制交互(streamline interaction as skill levels advance and allow the interaction to be costomized):当用户发现他们其实重复地完成相同的交互序列,那么就可以让高级用户定制界面
  • 使用户和内部技术细节隔离开(hide technical internals from the casual user)
  • 设计应该允许用户和出现在屏幕上的对象直接交互(design for direct interaction with objects that appear on the screen)

2. 减轻用户的记忆负担(reduce the users' memory load)

只要可能,系统应该“记住”相关的信息并通过有助于回忆的交互场景来帮助用户

  • 减少对短期记忆的要求(reduce demand on short-term memory):通过提供可视的提示,使得用户能够识别过去的动作
  • 建立有意义的默认设置(establish meaningful default):初始的默认集合应该 对一般的用户有意义,但是,用户应该能够说明个人偏好,并且应该让用户能够自己定义初始默认值
  • 定义直观的快捷方式(define shortcuts that are intuitive) : 使用助记符(Alt + P 激活打印功能等)完成系统功能的时候,助记符应该以容易记忆的方式联系到相关的动作
  • 界面的视觉布局应该基于真实世界的象征(the visual layout of the interface should be based on a real-world metaphor): 一个账单支付系统应该使用支票簿和支票登记册来指导用户的账单支付程序
  • 以一种渐进的方式揭示信息(disclose information in a progress fashion): 关于某任务、对象或者行为的信息应该首先在高抽象层次上呈现

3,保持界面一致(make the interface consistent)

(1)按照贯穿所有屏幕显示的设计规则来组织可视信息

(2)将输入机制约束到有限集合,在整个应用中得到一致使用

(3)从任务到任务的导航机制要一致定义和实现

  • 允许用户将当前任务放入到有意义的环境中(allow users to put the current task into a meaningful context): 提供指示器(e.g. 窗口标题、图标、一致的颜色编码)帮助用户知晓当前工作环境,另外,用户应该能够确定他的来处以及转换到新的任务的途径
  • 在完整的产品线上保持一致性(maintain consistency across a family of applications):一个应用系列都应该使用相同的设计规则
  • 如果过去的交互模式已经建立起用户期望,除非有不得已的理由,否则不要改变它(if past interactive models have created user expectations, do nor make changes unless there is a compelling reason to do so)

二、用户界面分析和设计

用户界面设计模型 

  1. 软件工程师建立用户模型(user model), 确立系统最终用户的轮廓(profile)
  2. 软件工程师创建设计模型(design model)
  3. 用户最终在脑海里对界面产生映像,称为用户的心理模型(mental model)
  4. 系统的实现者提供实现模型(implementation model) 

用户界面设计过程 

这是一个迭代的过程,包括4个不同的框架活动:

  1. 界面分析和建模
  2. 界面设计
  3. 界面构建
  4. 界面确认

界面分析和建模:

在用户界面设计中,理解问题就意味着了解:

  • 通过界面和系统交互的人(end-user)
  • 最终用户为完成工作要执行的任务
  • 作为界面的一部分而显示的内容
  • 任务的处理环境

在任务建模和分析中,可以使用很多分析技术:

  • 用例(use case): 描绘参与者和系统的交互方式,大多数情况下采用第一人称而且以非正式形式书写
  •  任务细化(task elaboration):细化处理任务
  • 对象细化(object elaboration)
  • 工作流分析(workflow analysis): 理解在涉及多个成员的时候,工作过程是如何完成的

界面设计(interface design)

尽管已经提出了很多不同的用户界面设计模型,但它们都建议结合以下步骤:

  1. 定义界面对象和动作
  2. 确定事件(用户动作),也就是回导致用户界面状态发生变化的事件
  3. 描述每个状态的表示方式
  4. 说明用户如何利用界面提供的信息来解释每个状态 

在进行用户界面设计的时候,总会遇到问题,很多设计人员总是在很晚才注意到这些问题,导致不必要的反复、项目拖延和用户的挫折感,最好的方法是在设计初期就将这些设计问题(design issue)加以考虑,因为这个时候方便修改

  1. 响应时间(response time)
  2. 帮助设施(help facilities)
  3. 错误处理(error handling)
  4. 菜单和命令标记(menu and command labeling)
  5. 应用的可访问性(application accessibility)
  6. 国际化(internationalization)

实现 

从建立一个可供场景评估的原型开始,随着迭代设计过程的进行,一种用户界面的成套工具会被用来完成用户界面的建构

用户界面确认 

  1.  用户界面要能够正确完成每一个用户任务和一系列用户动作,同时满足左右的用户需求
  2. 用户界面要易于使用和学习
  3. 软件能够作为用户工作中的有用工具,用户接受度高 

三、WebApp的用户界面设计 

有效的用户界面在视觉上是明显而且易于操作的,用户不用考虑系统的内在工作机制同时,有效的应用和服务会应用其最大的工作量

WebApp的用户界面设计原则

  1. Anticipation: 能够预估用户的下一步动向,及时提供引导或者方便用户动作的要素
  2. Communication:系统应该及时反馈用户开始的任何动作序列的结果
  3. Consistency:一致性体现在控制菜单、图标和审美设计上
  4. Controlled autonomy:给用户有底线的控制自由
  5. Efficiency: 提高用户的工作效率
  6. Focus:能够让用户专注于自己现有的工作,而不是分散注意力
  7. Fitt's Law:图标之间的距离
  8. Human Interface object: 要设计大量可复用的人机交互图标等
  9. Latency reduction: 多任务并行处理来使得用户能够按照自己的进度推进任务
  10. Learnability: 最小化网站的学习时间
  11. Maintain work product integrity: 工作结果要被及时的保存,防止因为error丢失
  12. Readability : 能够被所有人群读懂
  13. Track state:记录状态,用户退出之后再进入可以回到上一次访问的地方
  14. Visible navigation: 把导航和指引永远放在一个地方

WebApp的工作流 

  1.  检查分析模型中包含的信息,并根据需要进行改进
  2. 设计一个大致的WebApp界面的模版
  3. 将用户的需求和特定的交互动作练习起来
  4. 定义一个用户动作集,将用户动作和每个软件任务练习起来
  5. 将每个交互动作的流程列出
  6. 精化流程和用户界面的审美设计
  7. 识别所有需要用来实现用户界面的交互物件(图标等)
  8. 建立一个用户和界面交互的流程
  9. 建立交互的行为展示
  10. 描述每个状态下的界面显示
  11. 精化和评审 

有关软件设计·用户界面设计的更多相关文章

  1. ruby-on-rails - Rails - 子类化模型的设计模式是什么? - 2

    我有一个模型:classItem项目有一个属性“商店”基于存储的值,我希望Item对象对特定方法具有不同的行为。Rails中是否有针对此的通用设计模式?如果方法中没有大的if-else语句,这是如何干净利落地完成的? 最佳答案 通常通过Single-TableInheritance. 关于ruby-on-rails-Rails-子类化模型的设计模式是什么?,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.co

  2. ruby-on-rails - 使用 rails 4 设计而不更新用户 - 2

    我将应用程序升级到Rails4,一切正常。我可以登录并转到我的编辑页面。也更新了观点。使用标准View时,用户会更新。但是当我添加例如字段:name时,它​​不会在表单中更新。使用devise3.1.1和gem'protected_attributes'我需要在设备或数据库上运行某种更新命令吗?我也搜索过这个地方,找到了许多不同的解决方案,但没有一个会更新我的用户字段。我没有添加任何自定义字段。 最佳答案 如果您想允许额外的参数,您可以在ApplicationController中使用beforefilter,因为Rails4将参数

  3. ruby-on-rails - 简单的 Ruby on Rails 问题——如何将评论附加到用户和文章? - 2

    我意识到这可能是一个非常基本的问题,但我现在已经花了几天时间回过头来解决这个问题,但出于某种原因,Google就是没有帮助我。(我认为部分问题在于我是一个初学者,我不知道该问什么......)我也看过O'Reilly的RubyCookbook和RailsAPI,但我仍然停留在这个问题上.我找到了一些关于多态关系的信息,但它似乎不是我需要的(尽管如果我错了请告诉我)。我正在尝试调整MichaelHartl'stutorial创建一个包含用户、文章和评论的博客应用程序(不使用脚手架)。我希望评论既属于用户又属于文章。我的主要问题是:我不知道如何将当前文章的ID放入评论Controller。

  4. ruby - RVM "ERROR: Unable to checkout branch ."单用户 - 2

    我在新的Debian6VirtualBoxVM上安装RVM时遇到问题。我已经安装了所有需要的包并使用下载了安装脚本(curl-shttps://rvm.beginrescueend.com/install/rvm)>rvm,但以单个用户身份运行时bashrvm我收到以下错误消息:ERROR:Unabletocheckoutbranch.安装在这里停止,并且(据我所知)没有安装RVM的任何文件。如果我以root身份运行脚本(对于多用户安装),我会收到另一条消息:Successfullycheckedoutbranch''安装程序继续并指示成功,但未添加.rvm目录,甚至在修改我的.bas

  5. 软件测试基础 - 2

    Ⅰ软件测试基础一、软件测试基础理论1、软件测试的必要性所有的产品或者服务上线都需要测试2、测试的发展过程3、什么是软件测试找bug,发现缺陷4、测试的定义使用人工或自动的手段来运行或者测试某个系统的过程。目的在于检测它是否满足规定的需求。弄清预期结果和实际结果的差别。5、测试的目的以最小的人力、物力和时间找出软件中潜在的错误和缺陷6、测试的原则28原则:20%的主要功能要重点测(eg:支付宝的支付功能,其他功能都是次要的)80%的错误存在于20%的代码中7、测试标准8、测试的基本要求功能测试性能测试安全性测试兼容性测试易用性测试外观界面测试可靠性测试二、质量模型衡量一个优秀软件的维度①功能性功

  6. LC滤波器设计学习笔记(一)滤波电路入门 - 2

    目录前言滤波电路科普主要分类实际情况单位的概念常用评价参数函数型滤波器简单分析滤波电路构成低通滤波器RC低通滤波器RL低通滤波器高通滤波器RC高通滤波器RL高通滤波器部分摘自《LC滤波器设计与制作》,侵权删。前言最近需要学习放大电路和滤波电路,但是由于只在之前做音乐频谱分析仪的时候简单了解过一点点运放,所以也是相当从零开始学习了。滤波电路科普主要分类滤波器:主要是从不同频率的成分中提取出特定频率的信号。有源滤波器:由RC元件与运算放大器组成的滤波器。可滤除某一次或多次谐波,最普通易于采用的无源滤波器结构是将电感与电容串联,可对主要次谐波(3、5、7)构成低阻抗旁路。无源滤波器:无源滤波器,又称

  7. 计算机毕业设计ssm+vue基本微信小程序的小学生兴趣延时班预约小程序 - 2

    项目介绍随着我国经济迅速发展,人们对手机的需求越来越大,各种手机软件也都在被广泛应用,但是对于手机进行数据信息管理,对于手机的各种软件也是备受用户的喜爱小学生兴趣延时班预约小程序的设计与开发被用户普遍使用,为方便用户能够可以随时进行小学生兴趣延时班预约小程序的设计与开发的数据信息管理,特开发了小程序的设计与开发的管理系统。小学生兴趣延时班预约小程序的设计与开发的开发利用现有的成熟技术参考,以源代码为模板,分析功能调整与小学生兴趣延时班预约小程序的设计与开发的实际需求相结合,讨论了小学生兴趣延时班预约小程序的设计与开发的使用。开发环境开发说明:前端使用微信微信小程序开发工具:后端使用ssm:VU

  8. ruby-on-rails - 设计注册确认 - 2

    我在我的项目中有一个用户和一个管理员角色。我使用Devise创建了身份验证。在我的管理员角色中,我没有任何确认。在我的用户模型中,我有以下内容:devise:database_authenticatable,:confirmable,:recoverable,:rememberable,:trackable,:validatable,:timeoutable,:registerable#Setupaccessible(orprotected)attributesforyourmodelattr_accessible:email,:username,:prename,:surname,:

  9. ruby - 在没有基准或时间的情况下用 Ruby 测量用户时间或系统时间 - 2

    因为我现在正在做一些时间测量,我想知道是否可以在不使用Benchmark类或命令行实用程序time的情况下测量用户时间或系统时间。使用Time类只显示挂钟时间,而不显示系统和用户时间,但是我正在寻找具有相同灵active的解决方案,例如time=TimeUtility.now#somecodeuser,system,real=TimeUtility.now-time原因是我有点不喜欢Benchmark,因为它不能只返回数字(编辑:我错了-它可以。请参阅下面的答案。)。当然,我可以解析输出,但感觉不对。*NIX系统的time实用程序也应该可以解决我的问题,但我想知道是否已经在Ruby中实

  10. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法? - 2

    我遇到了一个非常奇怪的问题,我很难解决。在我看来,我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时,我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性,其中包括href和data-method。再次单击此链接后,我的服务器收到了对新href的请求,但使用的是旧的data-method,即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是,如果我刷新页面,HTML与"new"HTML相同(随返回的JS发生变化),但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

随机推荐