东北大学——软件需求分析与系统设计——第七章笔记整理(2020年5月整理)
程序员文章站
2022-03-22 10:13:03
全九章节的笔记导航目录:[其他剩余章节目录](https://blog.csdn.net/momentni/article/details/109260971)全笔记PDF版下载链接:[下载链接](https://download.csdn.net/download/momentni/13027629)...
全九章节的笔记导航目录:其他剩余章节目录
全笔记PDF版下载链接:下载链接
一、GUI设计原则
(一)GUI客户端
1.GUI客户端的分类
- 桌面平台的可编程客户端:胖客户端(thick),在客户端上可以实现一定的业务功能(C/S模型)
- Web平台的浏览器客户端:瘦客户端(thin),基于web,需要从服务器获取数据和程序(B/S模型)
2.GUI设计指南
- 用户控制式(User in control)
- 用户控制式是主要的GUI指南
- 非母亲式(No mothering)管理——程序不应该像母亲一样为你做事
- 用户启动行为;如果程序取得控制权,则用户也要获得必要的反馈(沙漏、进度条……)
- 一致性(Consistency)
- 同一个程序内不同界面的风格应保持一致(符合操作系统的风格)
- 界面设计不能过于创新
- 符合组织内部开发的命名、编码和其他与GUI相关的标准
- 同一个程序内不同界面的风格应保持一致(符合操作系统的风格)
- 个性化和客户化(Personalization & Customization)
- Personalization + Customization = Adaptability
- 个性化:单个用户的使用行为
- 客户化:对某一个特定的组织做一个特定东西
- 宽容(Forgiveness)
- 允许用户进行实验或出错,鼓励用户探索,允许用户选择错误的路径
- 提供多级撤销 / 取消(undo)操作
- 比如是否警告用户取款的后果?这与个性化指南相关
- 反馈(Feedback)
- 反馈由用户控制式指南派生出来的,与用户控制指南最相关
- 在系统中为每个用户事件建立视听提示
- 审美和可用性(Aesthetics & Usability)
- 审美是系统视觉上的吸引力
- 可用性是与使用界面有关的方便性、简单性、有效性、可靠性和生产率
- 提高用户满意度
二、桌面GUI设计
(一)主窗口(Primary Window)
1.主窗口的性质
- 主窗口有一个边界(框架)
- 框架包含窗口的标题栏、菜单栏、工具栏、状态栏以及窗体上可浏览或修改的内容区
- 窗体可浏览和修改的内容可以组织成窗格
- 窗格的分类
- 行浏览器——用垂直滚动条或键盘上的键向上向下浏览这些记录
- 树状浏览器——用锯齿状的列表显示相关的记录(JavaFX.TreeView)
- 主窗口区别于辅窗口的一个典型特征是:主窗口有菜单栏和工具栏,而辅窗口没有
(二)辅窗口(Secondary Window)
1.辅窗口的性质
- 通常是模态窗口——在最上层,使用其他窗口前必须关闭辅窗口
- 辅窗口的分类
- 对话框(dialog box)
- 标签夹(tab folder)
- 下拉列表(drop-down list)
- 消息框(message box)
(三)菜单和工具栏
(四)按钮及其他控件
三、Web GUI设计
(一)Web应用系统
1.Web应用程序
- Web应用程序是一种允许用户在Internet浏览器执行业务逻辑的Web(分布式C/S)系统
- 业务逻辑可以放在服务器或/和客户端
- 在Web应用系统中,菜单项、按钮、超链接这些GUI组件用于用户事件编程
- 链接到其他网页的方式
- 网页标题下的菜单栏
- 菜单栏下面的面包屑区域
- 左边和右边的菜单面板
2.使能技术(Enabling Technology)
- 维护Web客户端和服务器之间的连接的最原始的机制是Cookie
- 脚本(script)和小程序(applet)用于创建动态的客户端页面
- 脚本——由浏览器解释执行的程序(JavaScript编写)
- 小程序(applet)——编译好的组件,在浏览器环境中执行
- 访问数据库的使能技术——标准数据访问库(Data Access Libraries)
- ODBC
- JDBC
- RDO(远程数据对象)
- ADO(ActiveX数据对象)
- 服务器端的使能技术
- HTML(超文本标记语言)
- ASP(动态服务器页面)
- JSP(Java服务器页)
- 网页的使能技术
- JavaScript / VBScript
- XML文档
- Java applet
- JavaBean
- ActiveX控件
3.部署体系结构
- 浏览器客户端——在客户端运行浏览器外的应用代码(脚本或小程序)
- Web服务器——处理来自浏览器的页面请求,并动态生成页面和要在客户端执行和显示的代码
- 应用服务器——在系统实现涉及分布式对象时,应用服务器不可或缺,它处理业务逻辑
- 数据库服务器——业务构件封装存储在数据库中的持久数据
(二)内容设计
1.内容设计的目标
- 如何将网站或Web应用系统的可视内容展现在用户的Web浏览器上
- 设计必须具更具有适应性,并考虑到不同用户的需要、兴趣、技能和偏好
2.从网站到Web应用系统的统一(continuum)
- Web应用系统——包含部分或全部未确定页面内容的网站
- 动态网页——由应用服务器管理,找到浏览器请求的结果页面并将他们发送到浏览器
- 静态网页——由Web服务器管理,从Web服务器接收不完整的页面,扫描网页代码,与数据库通信并请求需要的信息,在网页上插入新的信息,并把网页传给Web服务器
3.表单
(三)导航设计
1.菜单和链接
- 网页之间导航的2个主要工具
- 具有类似的功效
- 功效:指用户期望GUI项具有的行为
- 菜单的分类
- 顶部菜单——用于整个网站的导航
- 左手菜单——用于导航到达网站控制以外的网页——放置网站的关键要素
- 右手菜单——显示网站范围内的网页
2.面包屑和导航面板
- 面包屑——用于告诉用户当前的位置(当前工作的页面),放置在页面的顶部菜单下面
- 导航面板——显示一个交易工作流程的所有步骤,且不允许返回上一步
3.按钮
(四)利用GUI框架支持(leverage)Web设计
1.MVC困境
- 困境:在可编程客户端和基于Web的应用系统中,在presentation和control之间分离和消除循环
- presentation提交请求给control服务,control决定应接收响应的Presentation对象。
- 相关技术:集中(模型1,presentation和control对象成对出现)和分散(模型2,核心的PCBMER框架提倡二者物理隔离)
2.Struts技术
四、GUI导航建模
(一)用户体验故事情节(User eXperience Storyboarding,UX)
1.UX建模的5个步骤
-
在用例中添加参与者
-
为用例添加可用性特点
- 可用性是一个非功能性需求,通常被定义为补充规范类的系统限制
-
定义UX元素
- 其中包括确定GUI容器和构件。一个特殊的固定格式的类模型用来展现UX元素
-
用UX元素为用例流程建模
- UX驱动下的行为性协作建模
- UML交互图(顺序图/协作图)用于表示事件的UX流程
- 行为的分类
- 用户行为(如点击按钮、输入等)
- 环境行为(如系统跳转等)——名称前要加“$”符号
- UX驱动下的行为性协作建模
-
为用例建立屏幕导航模型
- UX驱动下的结构性协作建模
- 结构性UX协作产生UX-构造型类图
- 结构性UX协作模型可以作为用例的导航图,它是UX故事情节的基础
- UX驱动下的结构性协作建模
(二)UX元素建模
1.相关构造型
- <<storyboard>>——包构造型,定义了一个包含UX故事情节的包
- <<screen>>——屏幕抽象定义为输出到屏幕的窗口
- <<input form>>——代表了窗口的容器形式
- <<compartment>>——在屏幕的任何区域展现,可以被多个屏幕复用
2.域标签:
- Editable——说明字段是否能被用户修改 {editable = true / false}
- Visible——说明字段在用户的视野中是否可见(但是程序仍然可以访问){Visibility= visible/ hidden}
- Selectable——意味着字段是否可选择(高亮或其他,表明是活动的){Selectable= true / false}
本文地址:https://blog.csdn.net/momentni/article/details/109259676