互动点播系统设计与实现UI界面的设计与开发.docx

互动点播系统设计与实现UI界面的设计与开发摘 要：近两年来，各式各样的网络电视盒子丰富了电视观 众的选择，而各类中间件简化了电视盒子的程序开发，使得普通的程序员也可以在此平台方 便的设计开发软件，以满足多样的需求。极大的市场潜力意味着有着大量的相应软件需求， 通过设计开发互动点播系统，可以提前接触到这个流行的技术领域，对于我们了解有关电视 盒子应用开发有极大的帮助。关键词：电视盒子；定制芯片；互动；中间件；服务器Abstract:In the past two years, all kinds of network TV box enriched TV audience's choice, and all kinds of the middleware simplifies the application development of TV box, make ordinary programmers can also in the platform software design and development, to meet the diverse needs. Great market potential means that there are a large number of corresponding software requirements, through the design and development on demand system, can come into contact with the popular technology in advance, for us to understand about TV box application development is of great help.Key words:Custom chip box; interactive television; middleware; server1 UI界面的设计与开发1.1 编写目的UI是 User Interface，即用户界面的简称。而UI设计指的是对软件的人机交 互、操作逻辑以及界面的美观程度的整体设计。一个好的UI设计，不仅可以让 软件变得更加有个性和品位，还有让软件的操作变得更加人性化，简单舒服的任 务。UI设计大体包括：一，图形设计，即传统意义上的美工。二，交互设计，也 就是软件的操作逻辑，操作流程之类的。三，用户测试，用来测试交互设计的合理性以及图形设计的美观性。所以这里，就从这三个方面来阐述UI界面的设计 与开发。1.2 图形设计UI 界面设计的第一步，就是就是图形设计。我们的项目前端主要使用 HTMl+CSS来实现效果呈现，所以在图形设计时候，主要使用PhotoShop来对图 片进行切片和处理，用文本编辑器对图片进行排版设计。因为涉及到大量重复的的图片处理步奏，我还特别为此用applescript编写了简易的图片批处理脚本，方 便在PhotoShop上的处理，提高图片设计效率。使用PhotoShop，给我们进行图形处理提供了极大的帮助，PhotoShop的特点有一下这些：图1-1在 PS中进行图形设计图1-2使用apples编c写r的iPpSt脚本1、像素层级的编辑像素是组成图片的最基本元素。Photoshop 可以做到像素层级的编辑，功能 强大。另外，除了编辑现有图片外，用户还可以用Photoshop制作图像，例如加 入字体、向量图案等等。2、图层功能图层功能让图片既可以分层编辑，也可以合并图层进行统一修改。在同一个 图层内，用户可使用Layer Mask功能选取套用编辑的部分。3、动作功能动作功能可记录一连串的编辑动作，然后应用在不同图片中。当然PhotoShop的缺点也很明显：批量处理不方便。Photoshop单张图片的 编辑处理功能比较强大，其本身也是为处理单张图片而设计。虽然可以使用 camera RAW plug in来处理RAW文件，但Photoshop本身的批量处理功能并不 算强大。所以针对这个缺点，我们根据实际需求，为其开发了简易的批处理工具，与 PhotoShop相结合，就能很好的实现我们对于图形设计的需求了。第二步，为了在项目中使用设计好的图形，必须借助HTML+CSS来呈现效 果。HTML指的是超文本标记语言，标准通用标记语言下的一个应用。“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。超文本标记 语言的结构包括“头”部分（英语：Head）、和“主体”部分（英语：Body）,其中"头” 部提供关于网页的信息，“主体”部分提供网页的具体内容。CSS指的是层叠样式 表，是一种用来表现HTML或XML等文件样式的计算机语言。我们将图形放在 HTMl的body里，用CSS来控制要呈现的效果，就能实现我们所需要的图形设 计效果：<!-节目列表-><div id=style= position:absolute; left:386px; top:258px; width:772px;height:76px; font-size:20px; color:#ffffff; visibility:hidden; >正在请求数据，请稍等!</div><div style= position:absolute; left:100px; top:189px; width:280px; height:300px; ><div class=><img id=src= width=height= /></div></div><div style= position:absolute; left:400px; top:189px; width:480px; height:300px; ><div class=><img id=src= width=height= /></div></div></div>节选片段选自项目首页的HTML代码块，是节目列表的图形设计与展示。第 一行的“<-节目列表->”表示以下模块代码行是属于节目列表功能的函数块。 <div>标签是层叠样式表中的定位技术,用来为HTML文档内的内容提供结构和背景的元素。div中的id是HTMl的选择器,id选择器允许以一种独立于文档元 素的方式来指定样式,在这块代码中,我指定class为的div存放设计好的第一张图片，并在 里赋予它 CSS 的属性，使图片对于页面相对 定位，并规定内部包含的img标签，确定图片的相对路径和相对位置。大量的图片都是通过这种方式定位在项目上，错综复杂的图片就构成了这个 项目的图形设计。1.3 交互设计想要做好UI的交互设计，必须要求熟悉网站，能独立完成项目开发,网页设 计和相关操作从事UI设计网站界面必须知道的知识。现场生产过程,例如,网站整 体页面布局和网站知识的本质,能够满足现场整体统一。设计一个网站并不仅仅 是把信息,如图片和文本信息,音频和视频的页面如此简单,但是应该开始从用户 的实用性,清楚的设计网站的性质,性质不同的设计风格,如政府机构是一个社会 人们互相交流,信息公告,发布提供类网站,主要用于政府的公共可以学到一些重 要的措施,重要的发布文档,和促进社会道德、伦理等等。1.3.1 交互设计技术介绍在该项目里面，我们主要使用 JavaScript作为主要的交互设计语言，通过 JavaScript来控制用户的的操作与实际函数的映射和逻辑的设计。JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语 言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广 泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用） 网页上使用，用来给HTML网页增加动态功能。JavaScript是一种属于网络的脚 本语言,已经被广泛用于 Web 应用开发,常用来为网页添加各式各样的动态动能, 为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中 来实现自身的功能的。1.3.2 交互设计功能思路由于本项目的运行平台是电视盒子，所以在用户实际运用时候，是通过遥控器而不是鼠标或者键盘对其进行操控。所以说，该项目的实际交互设计需要考虑 的第一个因素就是如何模拟用户通过遥控器进行自然的操作，而不会感到不正常。第二个因素是要贴合考虑到操作的方便性和合理性，让用户通过尽可能少的 步奏操作，完成想要的动作。想要解决第一个问题，可以参考曾经智能DVD机的操作方式，观察他们的 界面安排和操作方式，通过对比和学习，就可以摸索出一套比较通用的操作规范， 不同于电脑端或者移动端的操作方式，只要将这套操作规范转换成实际的代码， 就能顺利的实现模拟遥控器的操作方式。同时，我还将可能会用到的遥控器功能 键以及与其对应的实际键值进行了搜集和整理。第二个问题，我们小组进过探讨和研究，决定使用当前社会上比较流行的栅 格化原则来进行交互设计。我们的项目，规定了像素分辨率为1280*720。所以我们参照960栅格化系统 的系统指定，设计出了1280栅格系统。通过这个1280栅格系统，就可以设计出 同时具备方便性和合理性的交互逻辑，达到我们的目标预期。1.3.3 交互设计代码分析function grdEvent(event)var keycode = event.which;Utility.println(+keycode);switch(keycode)case 1:/ upcase 38:if(tipShowFlag | moreInfoShowFlag) return 0;if(area = 1)lastArea = area;changeArea(0);if(area = 2 && listPos < 3)lastArea = area;changeArea(1);else if(area = 2 && (listPos = 3 | listPos = 4) changeListPos(-3);else if(area = 2 && listPos = 5)第 7 页 （共 30 页）changeListPos(-1);else if(area =2 && IistPos = 6) changeListPos(-4);return 0;break;节选的函数grdEvent代码块主要负责接收用户所按按键的真实键值，并执行 对应的响应函数。通过这个函数，用户每次按键之后想要的反应都会实时响应， 达到用户的需求。下面具体介绍代码的功能实现：“var keycode = event.which底层硬件集成的中间系统会通过接收器接收到 用户通过遥控器按下的键位，并将具体键值传递给event，并通过变量keycode接 U攵。“Utility.println(+keycode);”Utility.println方法可以将后面括号内的内容在串口输出打印。接下来的SWitCh(keycode).是编程语言经典的多分枝选择语句，准确的使 用SWitChCaSe语句能有效的避免冗长的if.elseif.else代码块。圆括号内的 keycode就是指前文所指的真实键值，通过一条条匹配对应键值的函数方法即可 实现用户需求。代码块中出现大量类似 if(tipShowFlag | moreInfoShowFlag) return 0;的语句， return 0的作用是跳出当前循环，而放在if()的后面意思就是当括号内成立时候， 就跳出当前语句。作用就是在执行对应键值操作的方法之前先判断，当前状态是 否不能响应这个动作，比如正在加载数据或者有上层panel覆盖的时候，就不能 响应确认按键的动作。如果不加这种判断，就很有可能出现逻辑错误，影响用户 使用体验。这同时也是开发过程中最经常出现的问题之一，需要有清晰的思路已 经多次的检查排漏才能确保不会出现此类问题。function changePos(_num)if(area = 1)menuPos += _num;if(menuPos < 0) menuPos = 6;if(menuPos > 6) menuPos = 0;$().style.left = 99 + 158 * menuPos +else if(area = 0)lastPos = menuPos;menuPos += _num;if(menuPos < 7) menuPos = 10;if(menuPos > 10) menuPos = 7;$(lastPos).style.visibility =;$(menuPos).style.visibility =;function changeArea(_area)area = _area;if(area = 0)if(lastArea = 1 | menuPos != 6)menuPos = 7;$().style.visibility =;$(menuPos).style.visibility =;else if(_area = 1)area = _area;$().style.visibility =;if(lastArea = 0 && (menuPos = 7 Il menuPos = 8)IastPos = menuPos;menuPos = 5;$().style.left =;$(lastPos).style.visibility =else if(lastArea = 2 && listPos = 2) lastPos = listPos;menuPos = 5;$().style.left =;$(+lastPos).style.visibility =节选代码块包含两个有关交互设计的函数ChangePos和ChangeArea,从名字就可以很容易看出这两个函数是移动焦点位置和切换显示区域的函数。图2-1用 are来a为项目划分区域我们的项目，是将页面分成多个区域，用area来区分。因为每个区域的交互 逻辑都有不同，划分区域就可以清楚的将不同的逻辑代码放在不同的地方，一方面可以提高开发效率，减少开发时间。二是代码分离开，方便排查错误，这样当 测试时候是在哪一区域出现逻辑交互错误，就可以快速定位代码位置，知道错误 的大体位置。同理，在每个区域里的每个相对位置我们用XXXPos来表示，比如区域area0 中有四个区域(搜索、收藏、历史、首页)，于是我们就用menuPos0menuPos3 来标示。这样，“if(menuPos < 0) menuPos = 3;if(menuPos > 3) menuPos = 0就可 以表示在循环中，如果当前焦点位置从第四个首页再往右移动，即munuPos=3再 加1，就自动切换回最左边的搜索，即menuPos=0。这种切换方式代码量非常少， 而且逻辑清晰，非常适合在我们这种简单的小程序里面使用。在项目中，大量这 种类型的代码的调用，构成了项目最基础的交互移动系统，互相联系又不相互影 响，强化了系统的鲁棒性。$().style.visibility =和$().style.visibility =是通过html控制括号内对象类选择器的CSS。顾名思义可以看得出来，visibility指代的是对象是否 可见。通过对其属性进行赋值hidden和visible，就可以轻松实现控制对象的出现 和隐藏。如果同时让相邻的两个相同元素一个显示，一个消失，则可以出现仿佛 是这个元素从一个位置移动到另一个位置的假象。这是一种编程的技巧，我们可 以在每个焦点可能会移动的位置都事先隐藏一个焦点元素，这样，只要当系统监 测到用户想要移动焦点位置的意图时候，通过hidden/visible的方法，就可以轻松 实现。与之相对应的是$().style.left = 396 + 150 * listPos +;$().style.top =;这种方法，只生成一个焦点元素，每次监测到用户移动焦点意图的时候，去 计算焦点坐标变化，再让焦点移动到结束位置。这种做法需要在每次焦点移动时 候做全面判断移动规则，然后用对应的变换函数去计算移动后的坐标位置。这两种做法优缺点非常明显。前者优点是没有任何延迟，在我们项目不支持 多线程的硬件基础上，同时多个元素的移动不会出现卡顿或延迟的感觉，缺点就第 11 页 （共 30 页）是前端页面代码比较冗长，每个对位都会嵌入同样的焦点图片标签。后者优点是 前端代码清楚，只有一个个位置，没有大量重复的代码。但是缺点是后台逻辑部 分有大量判断计算函数，而且开发难度较大，容易出现错误和bug。最佳的方法 是两种相结合，移动规则单一且量大的时候用第二种方法，位置少但是移动不规 律时候后第一种方法。这样就可以很好的实现交互设计的需求了。1.4总结网站界面的设计从以前的只重技术不重设计正逐渐改善为两者兼顾，设计的 重要性和技术性是同等重要的。如果只重技术而设计的不好，那么即使技术性再 强也达不到好的用户体验效果，从而不能满足一个网站总的功能的发挥，这样就 影响了网站的价值，只有将技术性和设计效果结合起来才能达到更好的用户体验, 更合理的人机交互，实现网站存在的价值。因此，网站界面的UI设计对于网站 的建设非常重要。我们的项目很大程度是靠视觉呈现给用户使用与感受的，所以UI开发也是重 中之重。前期我们做了大量的讨论与准备，研究过当前市场上比较流行的项目和 开发方式，在开发中也是慢慢摸索，常用的工具有如PhotoShop、HBuilder之类 的都是在使用中渐渐熟悉的。不过，在探索和实践中，我们也深切体会到UI设计 的重要性，同时也能感受到用户正真的需求，设计出最合适的交互方式，也为接 下来的页面逻辑设计打好了基础。2页面逻辑的设计与实现2.1编写目的逻辑设计就是把一种计划、规划、设想通过视觉的形式通过概念、判断、推 理、论证来理解和区分客观世界的思维传达出来的活动过程。逻辑设计比物理设 计更理论化和抽象化，关注对象之间的逻辑关系，提供了更多系统和子系统的详 细描述。而我们的项目最终完成之后也是交由用户使用，一个完整且没错误的页面逻辑会是用户的使用体验达到完美，所以页面逻辑设计也是项目里非常重要的一个部分，在本段会介绍我们项目主要页面逻辑的设计与实现。2.2设计中的逻辑网格是用竖直或水平分割线将布局进行分块，把边界，空白和栏包括在内， 以提供组织内容的框架的辅助性工具。设计中不能忽视的网格，从印刷物料到网 页 页面，还是最新的Windows8系统界面，无论我们的设计如何，网格在设计 中必然存在。网格可以使页面布局显得紧凑而且稳定，为设计师在设计站点时提 供 一个逻辑严谨的模板。网格也可以使版式设计有连贯性和韵律，让那些看上 去相当小并且毫无联系的元素也可以在网格的布局里占有自己的一席之地。 但是网格不只是让设计师一味地按照规律来枯燥的设计，只是在一个合理的运用 下构造和设计出好的作品来，适时地打破规则也能有意外的惊喜。2.3数据传递的逻辑设计我们项目的数据是通过HTTP的ajax与服务器进行交互，传递数据的格式主 要由Xml转Json来进行。ajax是指一种创建交互式网页应用的网页开发技术。通过在后台与服务器进 行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载 整个网页的情况下，对网页的某部分进行更新。传统的网页（不使用 AJAX）如 果需要更新内容，必须重载整个网页页面。Ajax 的核心是 JavaScript 对象 XmlHttpReque。st该对象在 Internet Explorer 5 中首次引入，它是一种支持异步 请求的技术。简而言之，XmlHttpRequest 使您可以使用 JavaScript 向服务器提 出请求并处理响应，而不阻塞用户。Http定义了与服务器交互的不同方法，最基本的方法有4种，分别是GET， POST，PUT，DELETE。URL全称是资源描述符，我们可以这样认为：一个URL 地址，它用于描述一个网络上的资源，而HTTP中的GET，POST，PUT，DELETE 就对应着对这个资源的查，改，增，删4个操作。到这里，大家应该有个大概的第 13 页 （共 30 页）了解了，GET一般用于获取/查询资源信息，而POST一般用于更新资源信息。function getlistProgData() listProgs = ;/clearListPrograms();if (listAjaxObj = null) listAjaxObj = new ajaxClass();listAjaxObj.frame = window; else listAjaxObj.requestAbort();$().style.visibility =;listAjaxObj.successCallback = function(_xmlHttp, _params) var data = parseDom(this.getResponseXML();var jsonData = parseJson(data.toJson();if (typeof(jsonData) !=| jsonData = null) $( ).innerText = 获取数据失败！;$( ).style.visibility =;if (!oneRequestFinish) oneRequestFinish = true;else $().style.visibility =;return; var key =;if (key in jsonData) var totalResult = parseInt(jsonData.FolderContents 0.totalResults, 10);listServiceId = jsonData.FolderContents0.FolderFrame0.serviceId;listChargeMode =jsonData.FolderContents0.FolderFrame0.chargeMode;if (totalResult > 0) /理论上来说应该没有电影返回，可以不用考虑。var series = jsonData.FolderContents0.ChildFolder;var movies = jsonData.FolderContents0.SelectableItem;/添加一个属性标识是电视剧还是电影if (typeof series !=) for (var i = 0; i < series.length; i+) seriesi.type =; else series = ;if (typeof movies !=) for (var i = 0; i < movies.length; i+) moviesi.type =; else movies = ;listProgs = series.concat(movies);/hashTableObj.put(_params0, listProgs);currPage = Number(currPage);initListPrograms();$( ).style.visibility =;$().style.visibility =;else if (in jsonData) var message = jsonData.NavServerResponse0.message;var code = jsonData.NavServerResponse0.code;$( ).innerText = 发生错误！错误码： + code;$( ).style.visibility =;if (!oneRequestFinish) oneRequestFinish = true;$().style.visibility =;listAjaxObj.failureCallback = function(_xmlHttp, _params) $( ).innerText = 获取数据失败！;$( ).style.visibility =;if (!oneRequestFinish) oneRequestFinish = true;else $().style.visibility =;listAjaxObj.urlParameters =+ CAManager.cardSerialNumber +languageCode='Zh-CN' regionCode='1' includeFolderProperties='Y'listAjaxObj.callbackParams = hashTableKey;listAjaxObj.url = + ip + port +,+ menuType + (currPage + 1) + DEBUG;listAjaxObj.requestData( );这块引用的函数getlistProgData代码块就是负责数据交互逻辑的函数。z在 代码头定义的listProgs就是用来存放请求到的数据的数组。通过判断listAjaxObj 是否为空来判断此页面是否为第一次加载数据，如果是第一次的话，将给他创建 新的ajaxClass对象。ajaxClass对象就是像服务器请求数据用的对象。这是在函数的尾部，我们把要请求的数据拼接成 xml 的实现储存在 listAjaxObj.urlParam里et，e然rs后用POST的方式发往事先定义好的服务器位置。 再根据组员的数据库设计，就可以在数据库里查找所需要的数据了。接下来就是通过判断是否请求成功转到成功或失败的回调函数里。回调函数 就是一个通过函数指针调用的函数。如果你把函数的指针(地址)作为参数传递 给另一个函数，当这个指针被用来调用其所指向的函数时，我们就说这是回调函数。回调函数不是由该函数的实现方法直接调用，而是在特定的事件或条件发生 时由另外的一方调用的，用于对该事件或条件进行响应。因为可以把调用者与被 调用者分开，所以调用者不关心谁是被调用者。它只需知道存在一个具有特定原 型和限制条件的被调用函数。简而言之，回调函数就是允许用户把需要调用的方 法的指针作为参数传递给一个函数，以便该函数在处理相似事件的时候可以灵活 的使用不同的方法。在listAjaxObj.successCallback的成功回调函数内部，用data来接收返回数据， 再通过data.toJson方法将数据转成Json类型保存在jsonData里。再通过读取 jsonDAta里面对应字段的内容判断请求到的是电影资源还是电视剧资源，并分别 存放在series和movies里，最后拼接成listProgs的完整接收数据。因为格式统 一，所以可以方便其他函数调用。而listAjaxObj.failureCallback则通过一系列的判断，得出请求失败的原因并 附上对应措施，包括请求超时、请求资源为空、请求格式错误等一系列可能出现 问题的情况。失败回调函数的作用在于一方面不会使得请求失败就处于卡死状态 影响用户使用体验，另一方面也方便我们开发时候的调试工作，能够直观的看出 问题出在哪个环节，提高开发效率。function initListPrograms() var srcPrefix = DEBUG = 0 ? (+ ip + port +) :for (var i = 0; i < 5; i+) if (i < listProgs.length) var posterUrl = ;if (typeof(listProgsi.Image) !=) for (var k = 0; k < listProgsi.Image.length; k+) if (listProgsi.Imagek.width =&&listProgsi.Imagek.height =) posterUrl = srcPrefix +listProgsi.Imagek.posterUrl; $(+ i).src = posterUrl;var name = listProgsi.type =?listProgsi.displayName : listProgsi.titleBrief;$(+ i).innerHTML = getStrChineseLen(name, 6);$(+ i).style.backgroundImage =这initListPrograms函数块是接着上面数据请求动作完毕之后执行的函数。 其作用就是将请求到的数据一条条的在指定的位置上显示出来。var srcPrefix = 是一种很经典的代码三目运算 符。条件运算符是唯一有3个操作数的运算符，所以有时又称为三元运算符。对 于条件表达式b?x:y，先计算条件b，然后进行判断。如果b的值为true，计算x 的值，运算结果为x的值；否则，计算y的值，运算结果为y的值。一个条件表 达式从不会既计算x，又计算y。条件运算符是右结合的，也就是说，从右向左 分组计算。HTML绝对路径(absolute path)指带域名的文件的完整路径。表示源文 件所在目录的上上级目录，以此类推。相对路径就是指由这个文件所在的路径引 起的跟其它文件(或文件夹)的路径关系。使用相对路径可以为我们带来非常多 的便利。然后通过多重嵌套循环将符合规格的图片依次存放在对应的$( + i)元素里 面。同理，listProgsi.type =? listProgsi.displayName : listProgsi.titleBrief;符合判定的资源描述名称都存放在$( + i)里，还通过判断是否字数过长而进行 节选。这样，就能通过简单的代码实现，在页面上看到优美的图文展示了。第 17 页 (共 30 页)历史新片血置临时同居凡人炽情年份:2013导演:乔舒亚.迈克尔斯坦演员:阿什被库彻.德篆特 英罗尼,乔什，言续交布斯故事简介:改出,居缱创始人乔布斯的传记片.从大学退学后，乔布斯开始专注于自 呼掘与保索，之后他和志同道合的好友沃兹尼亚克共同包建了苹臭电脉公 司，一度风我强劲.然而随着时间的推修，乔布斯和沃兹尼亚克之间的分歧越 来述多，最终在矛盾无法调和的情况下乔布斯慎然出走成立了新公司.-HDMI1百万室贝图2-2项目实际效果图2.4逻辑设计总结如果说页面UI设计是一个项目的皮肉，那么页面逻辑设计就是这个项目的 骨架，只有完整且没有错误的逻辑设计，才能支撑起整个项目的运行与使用。所 以，一个项目的逻辑设计是整个开发流程里的重中之重，也是最花费时间的流程 之一。我们小组分工明确，我负责页面逻辑设计，其他组员负责数据库设计，两 者相结合，就构成了一个完整的逻辑交互系统。再经过后期的测试，以及硬件的 搭配选择，就能很好的实现我们的需求，令用户使用时候感到满意。数据加载模块测试引言.编1写目的1通过对测试结果的分析，得到对软件质量的评价2分析测试过程，产品，资源，信息，为以后制定测试计划提供参考3评估测试执行和测试计划是否符合4分析系统存在的缺陷，为修复和预防bug提供建议1.背2景主要读者：互动点播系统项目管理人员，互动点播系统项目测试人员其他读者：互动点播系统项目相关人员1.定3义列出本文件中用到的专门术语的定义和缩写词的原词组。功能测试：对产品的各项功能进行验证，根据功能测试用例，逐项测试，检查产品是否达到用户要求的功能。2测试概要编号测试类型预期测试内容测试人数（人）工作时间（天）与实际是否有差别差别1功能测试根据系统需求文档和设计文 档，检查产品是否正确实现 了功能。22无无2性能测试提取系统性能数据，检查系 统是否满足在需求中所规定 达到的性能。21无无3界面测试检查界面是否美观合理20.5无无4文挡测试检查文档是否足够、描述是否合理20.5无无5兼容性测试对于 B/S 架构的系统来 说需要考虑用户端浏览 器的版本。20.5有无6容错性测试检查系统的容错能力，错误的数据输入不会对功能和系统产生非正常的影响，且程20.5无无序对错误的输入有正确的提示信息7易用性测试检查系统是否易用友好20.5无无8流程测试按操作流程进行的测试， 主要有业务流程、数据流 程、逻辑流程、正反流程， 检查软件在按流程操作 时是否能够正确处理21无无9安装测试检查系统能否正确安装、配置20.5无无10配置测试检查配置是否合理、配置是否正常20.5无无11异常测试检查系统能否处理异常20.5无无测试结果及发现.功1能测试结果分析模块模块编号操作步骤操作描述数据期望结果实际结果测试状态(P/F)互动点播系统1(数据加1连接广电光纤网络ip“全部”可连接连接P2向服务器请求数据资源“电影”可请求请求成功P3接收服务“全部”可接收接收成功P载模块）器返回数据4解析接收资源“全部”可解析解析成功P5显示解析资源“电影”出现图文出现图文P3.4对统计报表模块功能的结论3.4.能1力该部分能实现报表的导出以及直观显示，清晰地了解各种分布情况。3.4.限2制该部分实现比较完善。3.5分析摘要3.5.能1力经测试，本系统基本达到了需求，向指定服务器发送请求已经将接收的数据 解析成