软件工程CH05详细设计

Click to edit Master title style,Click to edit Master text styles,Second level,Third level,Fourth level,Fifth level,11/7/2009,#,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,Computer Science & Technology,*,*,2024/9/16,1,软件工程(run jin n chn),软件工程(run jin n chn),刘迎春(yngchn),软件工程,第一页，共65页。,2024/9/16,2,第5章 详细(xingx)设计,5.1 详细(xingx)设计的任务与内容,5.2 详细(xingx)设计工具,5.3 人机界面设计,问题定义,可行性研究,可行否？,否,是,需求分析,终止项目,概要设计,计划,时期,详细设计,第二页，共65页。,2024/9/16,3,5.1详细设计(shj)的任务与内容,详细设计(shj)的任务，是对总体设计(shj)阶段划分出的每个模块进行明确的算法描述。模块的内部过程描述就是模块内部的算法设计(shj)。,1.详细设计(shj)的意义:,有无正确的软件详细设计(shj)描述，对软件开发人员来说，直接影响到他们的程序正确性和编程效率,详细设计(shj)描述对于软件测试和维护人员也是重要的文档，使得他们不需要阅读程序代码，就能了解模块内部的程序结构,第三页，共65页。,2024/9/16,4,2.详细(xingx)设计的内容,程序描述,功能,性能,输入(shr)项,输出项,算法,流程逻辑,接口,存储分配,第四页，共65页。,2024/9/16,5,5.2 详细设计(shj)工具,在过程设计阶段，要决定各个模块的实现算法，并精确地表达这些算法。表达过程规格说明(shumng)的工具叫做详细设计工具。,图形工具,表格工具,语言工具,第五页，共65页。,2024/9/16,6,5.2.1 程序(chngx)流程图,程序(chngx)流程图也称为程序(chngx)框图，程序(chngx)流程图使用的基本控制结构是:,第六页，共65页。,2024/9/16,7,程序流程图的标准符号,(a)选择（分支）；(b)注释；(c)预先定义的处理；(d)多分支；,(e)开始或停止(tngzh)；(f)准备；(g) 循环上界限；(h) 循环下界限,(a),(b),(c),(d),(e),(f),(g),(h),第七页，共65页。,2024/9/16,8,循环的标准符号 注解(zhji)的使用,第八页，共65页。,2024/9/16,9,多出口(ch ku)判断,第九页，共65页。,2024/9/16,10,程序(chngx)流程图的特点和缺点,程序流程图中的箭头代表控制流,对控制流程的描绘很直观，便于初学者掌握,缺点:,程序流程图本质上不是逐步求精的好工具，它诱使程序员过早地考虑程序的控制流程，而不去考虑程序的全局结构(jigu)。,程序流程图中用箭头代表控制流，因此程序员不受任何约束，可以完全不顾结构(jigu)程序设计的精神，随意转移控制。,第十页，共65页。,2024/9/16,11,5.2.2 N,-,S,图,N-S图也叫做盒图。五种基本控制结构由五种图形构件(gujin)表示。,第一个任务,第二个任务,第三个任务,循环条件,DO-WHILE,部分,A,F,T,条件,F,ELSE,分支,THEN,分支,CASE,条件,F,F,值,1,F,值,2,F,值,n,F,DO-UNTIL,部分,循环条件,(a) 顺序(shnx),(b) 分支(fnzh),(c),多路分支,(d) DO-WHILE,循环,(e) DO-UNTIL,循环,(f),调用子程序,A,第十一页，共65页。,2024/9/16,12,N-S图的嵌套定义(dngy)形式,第十二页，共65页。,2024/9/16,13,N-S图的特点(tdin)和缺点,一个特定(tdng)控制结构的作用域明确,不可能任意转移控制,很容易确定局部和全程数据的作用域,很容易表现嵌套关系，也可以表示模块的层次结构,盒图没有箭头，因此不允许随意转移控制。坚持使用盒图作为详细设计的工具，可以使程序员逐步养成用结构化的方式思考问题和解决问题的习惯。,缺点:,复杂逻辑情况下,难以布局,第十三页，共65页。,2024/9/16,14,问题(wnt)分析图(PAD),PAD也设置了五种基本控制结构的图式，并允许递归使用,PAD图所描绘(miohu)的程序结构十分清晰。图中最左面的竖线是程序的主线，即第一层结构。随着程序层次的增加，PAD图逐渐向右延伸，每增加一个层次，图形向右扩展一条竖线,PAD图中竖线的总条数就是程序的层次数,第十四页，共65页。,2024/9/16,15,PAD基本(jbn)结构,第十五页，共65页。,2024/9/16,16,对应于增量型循环结构(jigu),for i := n1,to,n2 step n3 do在PAD中有相应的循环控制结构(jigu),PAD的扩充(kuchng)控制结构,第十六页，共65页。,2024/9/16,17,PAD的特点(tdin),PAD图是二维树形结构的图形，程序从图中最左竖线上端的结点开始执行，自上而下，从左向右顺序执行，遍历(bin l)所有结点,用PAD图表现程序逻辑，易读、易懂、易记,第十七页，共65页。,2024/9/16,18,示例(shl),第十八页，共65页。,2024/9/16,19,示例(shl),第十九页，共65页。,2024/9/16,20,PAD描述(mio sh)的示例,第二十页，共65页。,2024/9/16,21,自动化工具(gngj),VISIO,其他(qt)实例,第二十一页，共65页。,2024/9/16,22,人机界面(rn j ji min)设计,软件的任务是由用户在提供给用户的虚拟工作环境(hunjng)中来完成,用户所面对的虚拟工作环境(hunjng)就是人机界面,用户承担需要创造、判断和探索的任务，而计算机承担重复检查、计算和数据处理的任务,人机界面设计是软件设计的重要内容。,第二十二页，共65页。,概念(ginin)区分,（1）用户体验：UE,用户体验并不是指产品本身是如何工作的，而是指产品如何和外界联系并发挥作用，也就是人们如何“接触“或者“使用”它。,（2）交互：用户通过某种方式发出指令，且系统对此作出相应的反应,交互设计是关于创建新的用户体验的问题，目的在于增强和扩充人们的工作、通信及交互方式，使他们能够更加(gnji)有效地进行日常工作和学习。,第二十三页，共65页。,UI设计(shj),（3）User Interface Design,用户界面设计，在很大程度上就是在探讨如何让产品(chnpn)的界面更加具有可用性，如何让用户有更良好的体验。这是一种优化后的界面，通过这种界面，用户能更方面地完成任务，获得良好的感觉。,例如：一个按钮的设计，美工设计考虑如何好看，而用户界面设计师则考虑按钮如何摆放，上面显示什么文字，甚至到底要不要这个按钮的问题。,第二十四页，共65页。,UI设计(shj)的重要性,用户能够正确、高效的完成任务，取决于软件(run jin)所提供的工作环境,在应有的功能和性能基础上，人机界面在完成用户任务，用户形成使用软件(run jin)的感受中起到非常重要的作用。,软件(run jin)用户界面设计要综合考虑“易用性设计”、“艺术设计”和“技术实现”,2024/9/16,25,第二十五页，共65页。,各种( zhn)对话框,好的,差的,第二十六页，共65页。,UI 设计(shj)常见问题,界面措辞含糊，甚至有错别字。连简单的消息框都设计不好，可能存在文不对题的语病。,界面布局混乱，缺乏逻辑(lu j)，凡是能放的东西都堆集上去，让用户不知从何下手。,没有防错处理，不对用户输入的数据进行检验，不根据用户的权限自动隐藏或者禁用某些功能。执行破坏性的操作之前，不提醒用户确认。总之，如果用户执行了错误的操作，那他活该。,不提供进度条、动画来反映正在进行的比较耗时间的过程，对于重要的操作也不返回结果，让用户干着急。,第二十七页，共65页。,2024/9/16,28,人机界面应具备(jbi)的特性,输入和输出信息是与用户的使用直接相关的。输入和输出的方式和格式应当尽可能方便用户的使用。一定要避免因设计不当给用户带来的麻烦。,因此，在软件需求分析阶段和设计阶段，就应基本确定输入和输出的风格。系统能否被用户接受(jishu)，有时就取决于输入和输出的风格。,第二十八页，共65页。,人机界面(rn j ji min)应具备的特性,1. 界面适合于展现功能,软件的功能需要通过用户界面来展现。用户界面一定要适合于软件的功能，这是最基本的要求。如果用户无法通过这个界面来使用软件，“易用性”根本就无从谈起。,例如，对于一个三维建模软件而言，必须具备通过鼠标对模型进行旋转、移动(ydng)、缩放等操作功能,“用户界面适合于展现功能”是首要的设计原则，它提醒设计者不要片面追求界面外观漂亮而导致华而不实。,第二十九页，共65页。,2. 界面(jimin)适合于用户群体,一个软件产品可能有许多类型的用户，例如有些用户对计算机比较外行，有一些用户可能是计算机的行家。在设计用户界面时应当尽可能多地了解不同类型用户的使用(shyng)习惯和水平，努力使不同类型用户在操作软件的时候感觉不到困难和麻烦。（理想境界）,如果不能使所有类型的用户都感到满意，那么重点满足以下类型的用户：“主流用户”，“有影响力的用户”,算法的可隐可显性,用户可以根据需要制定和修改界面方式,第三十页，共65页。,3.界面容易被用户(yngh)理解,用户界面中的所有元素都不能出现错误文字，也没有令人费解（例如二义性、逻辑混乱）的文字。用户界面设计人员绝对不能对界面上的文字马马虎虎，措词必须“正确、准确”。,图标按钮的含义一定要直观明了，最好给图标加文字说明，防止用户误解。,所有的界面元素应当提供充分而必要的提示，例如当鼠标移动到工具条上的某个图标按钮时，应当在该图标旁边出现功能提示。,界面结构能够清晰地反映工作流程。,文字信息和界面布局尽量(jnling)和用户群体的使用习惯相匹配。,对于复杂的用户界面而言，最好提供界面“向导”，及时让用户知道自己在界面结构中所处的位置。,第三十一页，共65页。,3.界面容易(rngy)被用户理解-2,“地址”两字让人费解，让人搞不清楚是住址，还是http网址？搜索一个名字行不行？,“试一试，浏览器地址栏中也可以(ky)直接搜索”这句话有点多余，用户不知道究竟从哪里搜索,第三十二页，共65页。,3.界面容易被用户(yngh)理解-设计一个优秀的向导式界面,第三十三页，共65页。,4.,一致性和个性化,“用户界面风格一致”的最大好处就是能够减少用户的记忆量、减少出错几率，并且迅速积累操作经验。,同一(tngy)类型软件的用户界面应当有一定程度的相似性。例如Microsoft公司的Office家族里有Word、Excel、PowerPoint、Outlook等软件，这些软件提供的“复制、剪切、粘贴”功能的操作方式都是相同的。,反之，软件习惯于设置F1键为帮助热键，如果某个设计者别出心裁地让F1键成为软件终止的热键，那么在用户渴望得到帮助而伸手击F1键的一刹那，他的工作就此完蛋。相信这个用户会被这另类的F1气疯了。,第三十四页，共65页。,个性化与一致性的矛盾(modn),对于一些非常注重安全性的商业软件（如银行软件）而言，用户界面的“一致性”要比“个性化”重要得多，因为一致的用户界面可以减少用户出错的几率。例如，国内所有银行的自动取款机的用户界面都是非常相似的，谁也不会设计一些新花样玩玩。,而对于非严格系统的应用软件而言，有个性化的界面自然比泯然于众的界面更具有(jyu)吸引力。尤其是娱乐领域的软件，用户更加喜欢有个性的甚至是颠覆传统的用户界面。,设计人员应当根据软件的需求以及广大用户的喜好，在使用户界面具备必要的“一致性”的前提下，突出该软件的“个性”。不仅让用户使用起来方便，而且对软件留下深刻的印象。,第三十五页，共65页。,示例(shl)分析,IE 的Toolbar按钮一般不会有下拉菜单（与流行软件的界面元素不一致）。如果要下拉菜单的话，应该加“下拉”标记。“,清理”和“修复”含有立即执行、并且(bngqi)会改动用户计算机设置的含义，用户担心点击“清理”和“修复”按钮将出现不期望的操作。,第三十六页，共65页。,5.及时(jsh)反馈操作信息,及时反馈信息很重要，至少要让用户心里有数，知道该任务处理得怎么样了，有什么样的结果。,当用户进行某项操作后，如果过了一会儿（几秒钟）用户界面一点反应都没有，这将使用户感到迷茫和不安，因为(yn wi)他不知道是自己操作错了还是软件死机了。,第三十七页，共65页。,示例(shl)分析,专业软件一般都要提供(tgng)反馈操作信息的窗口区域,第三十八页，共65页。,各种( zhn)对话框,好的,差的,第三十九页，共65页。,6.防错和出错(ch cu)处理,用户在使用软件的过程中，不可避免地会出现一些错误的操作。倘若用户不小心输入了错误的数据、或者(huzh)错误地删除了有用的数据，而软件傻乎乎地、将错就错地执行了，那么用户肯定很恼火，以后就不敢放心地使用软件。,在设计用户界面时必须考虑防错处理，目的是让用户不必为避免犯错误而提心吊胆、小心翼翼地操作。,第四十页，共65页。,6.防错和出错(ch cu)处理-2,常见的防错处理措施有：,对输入数据进行校验。,对于在某些情况下不应该使用的菜单项和命令按钮，应当将其“失效”（变成灰色，可见但不可操作）或者“隐藏”。,执行破坏性的操作之前，应当获得用户的确认。例如用户删除一个文件时，应当弹出对话框：“真的要删除该文件吗”，当用户确认后才真正删除文件。,尽量提供(tgng)Undo功能，用户可以撤销刚才的操作。,第四十一页，共65页。,7.最少步骤(bzhu)、最高效率,设计(shj)用户界面时应当尽可能地替用户着想，用户应当用最少的操作步骤完成某项操作任务，获得最高的使用效率。（手机充值，超级女声）,尽管减少一个操作步骤而完成任务所节约的时间微乎其微（可能只有几秒钟），但是用户的感觉反差却很强烈。,第四十二页，共65页。,8.合理(hl)的布局,首先，界面的总体布局应当有一定的逻辑性，最好能够与工作流程吻合。,其次，窗口（或页面）上的界面元素的布局应当整齐清爽。界面元素应当在水平或者垂直方向对齐，行、列的间距保持一致。,窗体的尺寸要合适，界面元素不应放得太满，边界处需要留有一定的空间(kngjin)，也不可过于宽松，显得零乱。,界面元素需要一致的对齐方式，以避免参差不齐的视觉效果。同类的界面元素尽量保持大小一致，起码要保证高度或宽度的一致（例如命令按钮）。逻辑相关的元素要就近放置，便于用户操作。,要善于利用窗体和界面元素的空白，以及分割用的线条。,第四十三页，共65页。,9. 合理(hl)的色彩,相比于布局，设计合理的色彩就困难多了，因为色彩的组合千变万化，并且人们对颜色的喜好也极不相同。,例如，人们对黑色的理解差异很大。,一般规律：,如果不是为了显示真实感的图形和图像，那么应当限制一帧屏幕的色彩数目，因为人们在观察屏幕的时候(sh hou)很难同时记住多种色彩。,第四十四页，共65页。,9. 合理(hl)的色彩 -2,一般规律：,应当根据对象的重要性来选择颜色，重要的对象应当用醒目的色彩表示。,使用颜色的时候应当保持一致性，例如错误提示信息用红色表示，正常信息用绿色表示，那么切勿乱用红色和绿色。,在表达信息时，不要过分依赖颜色，因为有些用户可能(knng)色盲或色弱。,第四十五页，共65页。,10.,国际化,软件的国际化是大势所趋。为了能够更好地适应国内和国际市场，在设计用户界面的时候应当充分考虑语言和文化的差异。尽可能使用标准的图解方式和国际通行的语言，要求简单易懂，易于翻译，方便不同母语的用户。,翻译文字要地道，要符合本地习惯，不能硬翻译，否则太不专业。MSN Messenger在发送文件的时候，出现如下图所示的提示“传输：2407 KB 还未完成”。明显是汉语中的病句，居然出现在微软的产品中，显然是硬翻译英文Messenger的结果。正确的翻译应该(ynggi)是“文件正在传输，剩余2407 KB”。,第四十六页，共65页。,10.,国际化,特别(tbi)要留意下列元素的国际化问题：,字体、提示信息、在线帮助。,货币、度量单位。,日期格式（如MM/DD/YY、Year-MM-DD等格式）。,人的名字、电话号码、通信地址。,图标、标签。,阅读顺序或习惯,第四十七页，共65页。,2024/9/16,48,典型(dinxng)界面,第四十八页，共65页。,2024/9/16,49,6种智能手机界面(jimin),第四十九页，共65页。,2024/9/16,50,手机操作系统比较(bjio),第五十页，共65页。,2024/9/16,51,WP7系统七大(q d)功能亮点-1,启动屏幕,Windows Phone7的启动屏幕把对手机用户最重要的应用(yngyng)和功能放在前台，让应用(yngyng)明确而容易操作。,第五十一页，共65页。,2024/9/16,52,WP7系统七大(q d)功能亮点-2,用户中心,用户中心针对人们当今交流的方式而生，带来了朋友们的Facebook状态(zhungti)更新、各种联系信息和电话号码。在这里，用户可以回应朋友们的SNS信息或是直接发送短信。,第五十二页，共65页。,2024/9/16,53,WP7系统(xtng)七大功能亮点-3,游戏中心：集成Xbox LIVE,游戏中心不仅仅是一个游戏的文件夹，这是一个能访问游戏、寻找新游戏和连接朋友们的地方。它延展了Xbox LIVE社交游戏体验(tyn)，并提供了只有Windows Phone7才有的移动游戏感受。,第五十三页，共65页。,2024/9/16,54,WP7系统七大(q d)功能亮点-4,第五十四页，共65页。,2024/9/16,55,WP7系统七大功能(gngnng)亮点-5,照片中心,Windows Phone 7包含一个独立的相机按钮，即使手机处于锁定(su dn)状态也可以使用，帮助用户抓住关键瞬间。Windows Phone还让分享照片变得更简单，通过照片中心可以分享和评论自己与别人的照片。,第五十五页，共65页。,2024/9/16,56,WP7系统七大(q d)功能亮点-6,音视频中心,把所有的媒体放在一个地方，包括歌曲、视频和广播。用户(yngh)可以听调频广播或是从互联网上下载、聆听音乐。Zune市场也是这个体验的一部分，让用户(yngh)在移动时也可以了解最新的歌曲、电影，并和朋友们分享。,第五十六页，共65页。,2024/9/16,57,WP7系统七大(q d)功能亮点-7,本地搜索,Windows Phone 7带来了整合的必应搜索体验，内置GPS和必应地图。本地搜索可以迅速提供相关场所的电脑号码、价格、评价和位置。用户可以选择驾车(ji ch)或是徒步路线，观看街景图像和实时交通状况。,第五十七页，共65页。,WP8,2024/9/16,58,第五十八页，共65页。,2024/9/16,59,第五十九页，共65页。,2024/9/16,60,智能手机操作界面分析(fnx),切换效果,Touch和Gesture,重力(zhngl)感应,滑动(hudng)切换,遮罩弹出,渐入渐出,闪屏,Zoomin,zoomout,touchstart :,手指放在屏幕上时触发,touchend :,手指离开屏幕时触发,touchmove :,手指在屏幕上移动时触发,touchcancel :,取消,Touch,事件,(,这个貌似是系统触发的,),gesturestart :,开始手势事件,gestureend :,停止手势事件,gesturechange :,改变手势事件,第六十页，共65页。,2024/9/16,61,交互设计五大(w d)关键素养-1,高超的沟通技能,最难的部分是关于人和管理的，是文化成分。杀手级界面设计要能实现，得说服团队所有人。工作目的就是要能在团队里建立起一种以用户体验为中心的文化，在团队的整个研发过程中，用户体验始终处于指导地位，引导(yndo)大家做出真正符合市场/用户需求的产品。,不会沟通，就会失败；不能说服，就会失败；不愿倾听，还是会失败。,第六十一页，共65页。,2024/9/16,62,交互设计五大(w d)关键素养-2,了解认知科学,只有充分了解人类心灵的能力上限和薄弱之处，才能做出最优的设计和决策。这些基础知识至关重要，能帮助了解文化和语言背后更深层次的意涵。,短时记忆（short-term memory）能存储多少内容？注意(zh y)焦点（locus of attention）有哪些特性？从有序列表中选择条目需要多久？习惯如何影响设计？,第六十二页，共65页。,2024/9/16,63,交互设计五大关键(gunjin)素养-3,学会编程，再菜鸟都比不会好,在设计师（设计者）与工程师（实现者）组成团队里，同理心是最关键的要素。没有同理心，实现者不关心设计如何，而设计者也不会讲究实际。如果一家公司的团队纠结于specs和code之间，来回折腾，颠过来倒过去地搞，说明团队缺乏同理心，设计者与实现者无法(wf)相互理解。,把设计与实现划清绝对的界线是可怕的。设计-编码者和编码-设计者组成团队才是最优化的配置。,第六十三页，共65页。,2024/9/16,64,交互设计(shj)五大关键素养-4,创作、创作、再创作,伟大的设计师总是不停地做设计。伟大的设计师会纠结于电梯里令人迷惑的按钮布局和ATM机上不妥当的按钮标签。他们会就此拍照、写博客，反复琢磨。如果你不喜欢搞创作做设计，那你根本就不该进入这个行当。你得投入千千万万个小时的亲身实践，才可能在领域(ln y)里占有你自己的一席之地。你是在为大家做设计，你得深入了解大家，深入生活。,应该有大把小的创意项目，有些完成了的，有些失败了并从中获益匪浅的，还有弃置的。如果没有，说明你没走上身为设计师的正道。,第六十四页，共65页。,2024/9/16,65,交互设计(shj)五大关键素养-5,学习图美设计,软件的外表同样重要(zhngyo)。外表影响着可用性。外表不是全部，但却是最显著的东西。,交互设计师应该学一学字体样式排版 ，学一学Swiss grid system ，掌握技巧，让设计脱颖而出即使这意味着在一开始不得不模仿别人的风格。,作为交互设计师身处“卖想法”的行业。不幸的是，杰出的想法会因为丑陋的草图而被冷落。要想在竞争中崭露头角，你需要学习，成为一名足够好的图美设计师。,第六十五页，共65页。,