太仓人才网面向对象的用户界面设计

1、太仓人才网面向对象的用户界面的设计与实现太仓人才网 阳光浪子摘要：本文通过对面向对象编程思想的发展，提出了“面向对象的用户界面”的新思想，并阐述了在这个指导思想在太仓人才网开发过程中的具体实现。指出了面向对象的用户界面设计的主要思想：网页上任意信息，如果能确定为某个类的实例，那么就将具有相应的事件和方法。关键词：面向对象 用户界面 太仓人才网 HTML 超文本 1、 引言面向对象编程思想是继面向过程编程思想的发展，这一思想将程序开发的过程和认识事物的过程结合了起来。程序中的类，就好比现实世界中的各种事物，就是对象，每个对象有自己的属性，方法。程序可以通过向封装的类发送消息来控制各个对象，从而实

2、现整个程序的运作。面向对象的思想，使得程序开发过程更加人性，程序的可读性更强，代码的重用度更高，程序的维护更简便。但是这个面向对象的思想通常只是被用作开发过程，所谓的对象和类，也常常只是隐藏在源代码中的各种抽象数据类型。因此，我提出了一个将面向对象的思想应用于用户界面设计的办法，并通过太仓人才网的设计过程来阐述这一思想的具体实现。2、 面向对象技术的基本概念所谓对象（Object）可以是任何的具体事物。例如，现实生活中的计算机、电话机、电视等和Windows中的窗口、命令按钮、标签等均可视为对象。对象包括数据和过程。每个对象都有对应的属性和方法。一个Windows应用程序的外观也是由对象（界面

3、元素）组成的，我们编写Windows应用程序就应该掌握各种对象的使用方法。面向对象的编程思想与我们认识现实世界的过程很吻合，因此使得编程非常直观，可大大提高软件开发效率。面向对象技术认为客观世界是由各种各样的对象组成，每种对象都有各自的内部状态和运动规律，不同对象间的相互作用和联系就构成了各种不同的系统，构成了客观世界。面向对象技术是一种以对象为基础，以事件或消息来驱动对象执行处理的程序设计技术。3、 面向对象的用户界面设计思想的提出面向对象的程序设计技术，有着很多的优势，就不再重复了。但是在开发程序的时候应用面向对象的思想，受益的是开发者。而面向对象的用户界面设计，是为了让程序的最终用户受益

4、于面向对象的思想。 首先，看一下面向对象的程序设计的图示（图3.1）主程序类1类2类3类n实例属性事件方法消息赋值，读取触发动作图3.1 面向对象的程序设计图示图中可见，面向对象的整个系统的运作是通过各个被定义类的实例的动作的组合来完成的。而动作的流程主要是由：主程序流程，事件触发 这两个因素来决定的。而面向对象的用户界面设计，是以用户的操作为程序主线，以响应用户操作为主要事件的一种面向对象的设计。如图3.2用户操作界面类1类2类3类n实例属性事件方法消息赋值，读取触发动作图 3.2 面向对象的用户界面设计4、 面向对象用户界面在人才网的实现太仓人才网是一个B/S架构的网站，它的用户界面主要是

5、HTML及Javascript代码组成的网页。浏览器（B）用户界面HTML用户服务器（S）数据库WEB服务网站脚本程序 PHPTCP/IP操作图4.1 B/S架构的网站整个网站可以供用人单位发布招聘信息，查询人才库，或者供求职者发布自己的简历。4.1 人才网中的对象的归纳和类的定义 人才网的服务可以说主要是处理：求职者，职位，用人单位 这三者的关系。因此，主要的3个对象就是这三个（网站中涉及的其它对象有相同的设计思想）。根据网站的功能的要求，在设计用户界面的时候，需要这样定义类：类名求职者属性姓名，年龄，学历 等个人基本属性 及 是否毕业生，是否登录等网站状态事件点击，提交方法开放，关闭，新增

6、，编辑，更新，删除，登录，查看，联系方式查看，面试通知，关注类名职位属性职位名称，要求，待遇等基本属性 及 是否过期等状态事件点击，提交方法查询，开放，关闭，新增，编辑，更新，删除，查看，应聘类名用人单位属性单位名称，地址，电话等基本信息 及 是否会员单位，是否登录等网站状态事件点击，提交方法开放，关闭，新增，更新，删除，登录，查看，联系方式查看，关注表 4.1 人才网三大对象的定义4.2 人才网中对象的工作方式 虽然用于实现的人才网程序部分是使用了PHP+mySQL 技术，但是我认为面向对象的用户界面的设计应该是与技术细节无关的。因此对人才网中类的工作方式并不使用具体代码来描述。在程序设计的

7、时候建议使用但不局限于面向对象的程序设计方法。我们很容易在网站的用户界面设计完成之前，就在一个假象的用户界面上描述一次用户交互的过程。假设是一个个人用户登陆网站，并且查找合适的职位，然后应聘该岗位的过程。操作流程事件方法属性变化登录个人会员提交用户名密码求职者-登录()确认实例，更新状态查询职位提交查询条件职位-查询()查看某职位点击“查看”职位-查看()应聘该职位点击“应聘”职位-应聘()表 4.2 由对象方法的组合实现的网站功能方法的说明方法程序动作求职者-登录()根据提交的用户名密码，到数据库的注册用户表中进行比对，一旦验证通过，即注册session变量职位-查询()根据提交的条件，生成

8、SQL命令，从数据库中查寻数据，生成职位列表。职位-查看()弹出新窗口，显示该职位的详细信息。职位-应聘()读取当前求职者的属性，将求职者ID和职位ID绑定并添加到“应聘数据表中”表4.3 方法的程序动作方法的参数与返回值方法参数返回值求职者-登录()Username Password登录成功 / 登录失败职位-查询()Select Query结果集职位-查看()职位ID含详细信息的新页面职位-应聘()求职者ID 职位ID新数据ID / 添加失败表 4.4 方法的参数和返回值4.3 人才网用户界面中对象的应用 我们知道一个网页中的元素主要有：文本，图片，及表单元素。而用于实现网页和用户交互的元

9、素主要是超链接和表单元素，其中，表单元素主要是文本框，下拉单，各种选项钮，按钮等。 太仓人才网的用户界面中包含了个人信息，单位信息，职位信息等各种相关的数据，面向对象的设计主要表现在：网页上每个信息，如果能确定为某个类的实例，那么就将具有相应的事件和方法。例如，甲单位的人事，登录人才网以后，他的用户名就是某某公司，他在人才网的bbs当中看到一个叫做张三的人发表了高论，觉得不错，这时候，他点击“张三”这个名字，就能看到张三的简历，而后就可以像张三发送面试通知书。这实际上就是 求职者-查看()；求职者-面试通知() 这两个方法在“张三”这个实例上的实现。网页上任意个信息，如果能确定为某个类的实例，

10、那么就将具有相应的事件和方法。因此：人才网上出现的任何一个单位名称，都能通过超链接来显示单位信息卡；出现的任何一个个人名称，都能通过超链接来显示个人信息卡；出现的任何一个职位信息都能通过超链接来显示职位信息卡。图 4.2 单位信息卡 单位信息卡，是对象用人单位的用户界面，将根据当前用户的不同身份具有不同的属性和事件入口。用户类型：页面显示可调用方法普通访客，非本单位的企业会员单位简介，招聘列表职位-查看()个人求职者单位简介，单位联系方式，招聘列表职位-查看()用人单位-关注()用人单位-点评()本单位企业会员单位简介，单位联系方式，招聘列表职位-查看()用人单位-编辑()表 4.5 单位信息

11、卡图 4.3 职位信息卡用户类型：页面显示可调用方法普通访客，非本单位的企业会员职位简介职位-查看()个人求职者职位简介职位-应聘()职位-关注()用人单位-关注()本单位企业会员职位简介职位-编辑()职位-删除()职位-查看应聘者()表 4.6 职位信息卡图4.3 个人信息卡用户类型：页面显示可调用方法普通访客个人基本信息，无联系方式求职者-打印简历()求职者-查看言论()个人求职者本人个人基本信息求职者-打印简历()求职者-查看言论()求职者-关闭()求职者-编辑()企业会员 普通会员个人基本信息求职者-打印简历()求职者-查看言论()求职者-关注()求职者-面试通知()求职者-联系方式申

12、请()企业会员 高级会员与普通会员不同处：求职者-联系方式查看()表 4.7 个人信息卡4.4 面向对象的用户界面生成 太仓人才网的用户界面就是html网页，不论首页或者功能页面，或者查询结果页面，都是由PHP输出实现的。根据“网页上任意信息，如果能确定为某个类的实例，那么就将具有相应的事件和方法”的思想，那么凡是具体的名称，编号，这些从数据库中取得的信息，一般都能被确认为某个类的实例。例如：“张三”这两个字，就能确定为是求职者的一个实例。而如“太仓*有限公司”则能被确认为一个用人单位的实例。因此在程序设计的时候应用 求职者-显示姓名()，求职者-显示编号()，求职者-显示信息卡() 等这样的

13、方法来实现。求职者-显示姓名()，并不是简单的将某个人的姓名输出到页面，而是要输出：张三 这样的html代码。而 viewpinfo.php页面就是调用求职者-显示信息卡()，来输出一个“个人信息卡”的页面，其中具体的内容将根据当前用户身份的不同而不同（见表4.7），下图以个人信息卡为例介绍用户界面的效果。某HTML页面 张三李四张三后台代码前台显示个人信息卡个人信息卡中包含的方法求职者-打印简历()求职者-查看言论()求职者-关注()求职者-面试通知()求职者-联系方式申请()求职者-联系方式查看()Function 求职者-显示姓名图4.4 面向对象的用户界面生成4.5 人才网实现面向对象

14、的用户界面效果太仓人才网通过采用面向对象的用户界面设计思想来设计以后，基本实现了“网页上任意信息，如果能确定为某个类的实例，那么就将具有相应的事件和方法”，也就是说，网页上出现的任意一个求职者编号，或者姓名，或者昵称，不论是在查询结果中，还是在线用户列表中，或者留言板中，都能通过点击打开其对应的信息卡，实现各种属于求职者类的操作，同样，用人单位，职位信息，设摊信息都如此。网站上的日期也是一个对象，通过点击日期，可以打开万年历，通过点击访问量可以打开访问量统计表，等等。5、 面向对象的用户界面与超文本的发展网页代码使用的是HTML，HTML(Hyper Text Markup Language)

15、，就是一种超文本标记语言。超文本是一种信息管理技术，它以结点为单位组织信息，在结点与结点之间通过表示它们之间关系的链加以连接，构成表达特定内容的信息网络。从我的面向对象的角度来观察超文本的概念，可见，超文本技术为面向对象的用户界面设计提供了良好的基础。超文本的每个结点，就是一个具有“链接”事件的对象，超文本组织信息的方式类似于人类的联想记忆方式，而面向对象的理论则是接近人类认识事物的方式，因此在设计网页的时候，应用面向对象的用户界面的设计思想，使得面向对象思想和超文本技术有了完美的结合。6、 面向对象的用户界面是信息多元化发展的趋势网站上传统的线性文本信息表达量及表达方式已经不能满足用户的需求，而超文本技术的应用使得面向对象的用户界面开发有了基础。面向对象的用户界面开发，以最终用户的视角，应用面向对象的思想，充分考虑人们联想记