IBM®
跳转到主要内容
    中国 [选择]    使用条款
 
 
Select a scope: Search for:    
    首页    产品    服务与解决方案     支持与下载    个性化服务    
跳转到主要内容

developerWorks 中国  >  Lotus  >

IBM Workplace Designer 内幕

developerWorks
文档选项

未显示需要 JavaScript 的文档选项


级别: 高级

Ethan Perry, 产品设计师, IBM
Jeff Sokolov, 资深软件产品设计师, IBM

2005 年 11 月 14 日

在本文中我们将窥探一下 IBM Workplace Designer 的内幕。我们将讨论支持各种设计目标的产品特性,以及开发者如何利用这些特性。

IBM Workplace Collaboration Services 中提供了很多有用的功能,可以帮助 IBM 的客户更简单、有效地完成自己的工作。现在,利用 IBM Workplace Designer,业务应用程序开发者可以使用一个可视化的、以文档为中心的开发环境来创建定制的 Workplace 组件,它们可以利用 Workplace Collaboration Services 基础设施所提供的优点。在本文中,我们将概要介绍 Workplace Designer 的以下关键设计目标,并了解一下它们在产品中是如何实现的:

  • 使用一个可视化开发工具实现快速增值。
  • 可选地分隔数据及其表示。
  • 支持以文档为中心的编程模型。
  • 提供灵活的方式来添加基于事件的逻辑。
  • 启用 IBM Workplace Collaboration Services 所提供的协作能力。
  • 支持与其他 IBM 应用程序开发工具一致的方法。
  • 通过样例应用程序和教程来简化学习过程。

接下来我们将讨论一下支持每个设计目标的产品特性,以及开发人员如何利用这些特性。这些特性包括 Form 编辑器、Schema 编辑器、UI 控件、视图控件、简单操作、JavaScript 编辑器和部署能力。

本文主要是为使用快速应用程序开发环境(例如 Lotus Domino Designer 和 Visual Basic)的 Web 开发人员和用户而编写的。读者可以通过本文理解使用 Workplace Designer 的优点及其关键特性,以及如何开始使用这个工具。有关 Workplace Designer 的基本介绍,请参阅 developerWorks Lotus 文章 “IBM Workplace Designer 简介”。

简介

IBM Workplace 系列产品让用户可以使用各种应用程序进行协作。虽然开发人员可以使用 Java API 来开发自己的 Workplace 应用程序,但是现在使用 Workplace Designer 来开发各种定制组件要更加容易。这个工具为迅速创建以文档为中心的应用程序提供了一个可视化环境,它们可以利用 IBM Workplace 系列产品所提供的特有协作特性。

公司在部署 Workplace Collaboration Services 和 Workplace Services Express 时,可以使用那些让员工可以共享组件的现有模板,例如讨论板、成员目录和 Web 会议,所有这些都可以在同一个页面中提供。例如,图 1 给出了一个项目组的 Team Space,其中包括一个小组的 blog、日历、文档、讨论、聊天室和搜索功能:


图 1. 带有 Workplace Designer “team blog” 组件的 Team Space
带有 Workplace Designer “team blog” 组件的 Team Space

管理员或业务用户可以选择在一个应用程序中包括哪些组件,这可以通过编辑模板实现。当公司需要创建现有模板中不能提供的定制组件时,组织中的开发人员可以使用 Workplace Designer 来创建所需要的功能。例如,此处显示的 team blog 就是 Workplace Designer 中所提供的一个样例组件,而且可以进行定制。

在本文中,那些为 Workplace Designer 设计用户界面的产品设计者将讨论这些设计目标在该工具的第一个发行版本中是如何实现的。我们使用了很多种设计技术,包括业务合作伙伴的反馈论坛,与开发小组紧密地进行用户界面规范的循环开发,在使用该工具的原型和早期版本的用户论坛中进行多轮的用户测试(请参阅 这个介绍)。通过这个过程,我们重点关注如何实现几个关键的设计目标,它们对于将 Workplace Designer 设计成开发新 Workplace 应用程序的容易使用的工具非常重要。





回页首


设计目标 1:使用一个可视化开发工具实现快速增值

Workplace Designer 的设计目的是让开发人员可以快速创建有用的组件。UI 控件和 Form 编辑器(请参阅图 2)的组合让我们可以使用拖拽的功能来编辑表单。在 Form 编辑器中,用户可以直接输入文本,并添加各种不同的控件。Properties 面板很容易以一种一致的方式简化控件属性的设置。CSS(层叠样式表)类被包括进来,以便使用 Format 标签对文本和控件应用标准的 Workplace 样式。


图 2. Form 编辑器
Form 编辑器

构建表单有多种选择。开发人员可以通过对表单进行布局入手,也可以通过定义使用 Schema 编辑器的数据库开始入手。用户可以先添加 UI 控件,然后从这些控件的 Properties 面板中的 Data 标签上创建新的数据域。

为了提供与 J2EE 开发一致的方法,并提供一些灵活的数据管理方式,我们可以定义一些与表单布局无关的数据模式。用户可以在多个表单中重用相同的模式,并将这些模式从外部数据源拷贝到 Schema 编辑器中。当一个模式被添加到组件中之后,用户就可以将这个数据域从数据面板中拖拽到一个表单中,这样会自动生成 UI 控件,并将其绑定到这个数据元素上。





回页首


设计目标 2:可选地分隔数据及其表示

使用 Workplace Designer 的开发人员可以将正在开发的组件的 可视化表示(visual presentation) 与该组件所存储的 数据 分隔开来。这意味着表单中的可视化用户界面元素可以连接到不同的数据源上。在 2.5 和 2.6 版本的 Workplace Designer 中,控件可以绑定到存储在 Workplace Designer 的本地数据存储中的数据上。在以后的发行版本中,控件也可以映射到 Web 服务和外部的关系数据库上。这种将数据层与表示层分隔开来的方法可以通过修改数据绑定来简化对表单的重用和更新,而不用重新创建表单,也不用添加其他代码。

正如前面介绍的一样,用户可以先创建一个表单,然后将这个控件映射到数据域上,或者可以先启动 Schema 编辑器(请参阅图 3),并定义数据结构。Schema 编辑器为提供了用来编辑 XML 模式的功能,它们遵循使用 XML 来描述数据结构的 W3C 标准。


图 3. Schema 编辑器
Schema 编辑器

每个表单都被绑定到一个使用模式的数据源上。我们也可以将“面板”添加到一个表单上,例如子表单,或者使用不同数据源和模式的表单。这为重用模式并在一个表单中合并不同模式中的数据提供了很大的灵活性。

例如,可能有一个表单用来显示来自一个使用模式 “project” 的数据源的项目信息。要创建一个称为 “issue” 的分隔模式来描述与这个项目有关的问题的信息,用户需要将一个使用 “issue” 模式的面板添加到使用这个 “project” 模式的表单中。然后就可以在项目信息的右边显示问题信息了,尽管数据是使用不同模式存储的也可以如此。

通过使用 Properties 面板中的 Data 标签(请参看图 4),用户可以将这个 UI 组件绑定到数据上。


图 4. Data 标签
Data 标签

在 Data binding 菜单中,可以通过选择 <<New Field>> 来创建新的数据域,或者从当前模式中选择一个现有的域。

也可以使用 XPath 编辑器来定义一个数据绑定表达式,它可以基于模式中的特定位置来指定一个数据值。XPaths 与指定文件位置路径的功能类似。例如,“/issue/description” 指定了模式元素 “description” 是模式元素 “issue” 的一个子元素。XPaths 还可以包含 “if” 语句和其他操作,从而根据当前数据源中的数据来动态地计算值。





回页首


设计目标 3:支持以文档为中心的编程模型

根据业务合作伙伴和潜在客户的反馈,以文档为中心的编程是 Workplace Designer 应该采用的核心开发方法。使用文档作为应用程序的基础,可以简化用户对信息的共享和协作。将信息提交到表单中,然后将这些信息提供给其他用户使用,这样可以用于很多目的。很多应用程序,例如状态报告、项目问题跟踪、bug 跟踪、费用报告、旅行安排协调以及其他很多程序,都依赖于文档作为功能的中心。Workplace Designer 让开发人员可以很轻松地创建表单,终端用户可以使用这些表单来创建文档。

当在一个工作组件中的表单中出现时,视图控件(请参阅图 5)会显示已经提交的文档。简单的应用程序通常会包含一个表单来将数据提交到文档中,并采用另外一个带有视图控件的表单来显示已经提交的文档。在具有视图控件的表单中,可以使用一个按钮来创建新文档,当用户提交这个新文档时,它就会显示在视图控件的列表中。


图 5. Form 编辑器中的 View 控件
Form 编辑器中的 View 控件

Workplace Designer 还提供了几种更高级的功能,这让您可以通过使用面板在相同的表单中对文档进行混合操作。例如,在前面具有 project 模式和 issue 模式的例子中,使用 issue 模式的面板就与另外一个文档关联在一起,它与使用整个表单的文档不同。如果有多个与一个 project 关联的 issue,那就可以将这个面板设置为一个重复面板,并重复使用这个面板来显示这个面板中所包括的所有信息,即与这个项目关联的每个 issue 的信息。在 Contact List 样例程序中,这种功能用来为一个联系人关联多个电话号码。





回页首


设计目标 4:提供灵活的方式来添加基于事件的逻辑

几乎每个添加到表单中的 UI 控件都可以有一些在用户或系统事件发生时触发的脚本。最常见的例子是按钮,当用户点击按钮时就会触发这个按钮的事件。正如大部分桌面和 Web 应用程序的开发人员所知道的一样,诸如 JavaScript 之类的脚本语言是用来定义各种行为的强大工具,而不需要使用功能完善的编程语言,例如 Java。脚本语言还可以执行很多常见的操作,这甚至使用 Workplace Designer 的简单操作就可以实现,而不需要编写任何脚本。

开发人员可以使用 Events 标签中的简单操作来打开表单,修改当前表单的文档模式,或者从视图中删除所选择的文档。使用简单的对话框,开发人员可以指定要打开哪个表单,这就可以模拟终端用户在运行时使用这个组件时会发生的操作。

在 JavaScript 编辑器(请参看图 6)中,有很多特性可以帮助我们创建并组织代码。代码补全(code completion)的特性会显示很多可能的函数或属性,它们可以用来补全所输入的表达式。简单地按下 CTRL 和空格键就会看到下拉菜单。例如,如果输入一个 “@” 符号,然后按下 CTRL-空格键,就可以看到所有可用的 @ 函数。由于我们的客户非常熟悉 Domino Designer 中的 @ 函数,因此在 Workplace Designer 中通过 JavaScript 可以使用很多这些函数。


图 6. JavaScript 编辑器
JavaScript 编辑器

在这个编辑器中,代码是使用不同颜色进行显示的,这样就可以使用与缺省代码颜色不同的颜色来显示注释、字符串和 JavaScript 的关键字。开发人员可以使用 JavaScript 中的 Preferences 对话框来设置自己喜欢的颜色。

我们还有一个 Reference 标签,其中列出了在 Workplace Designer 包含的 JavaScript 库中可以使用的函数。这些库提供了很多可以在服务器上执行的功能。





回页首


设计目标 5:启用 IBM Workplace Collaboration Services 所提供的协作能力

有很多特性可以确保 Workplace Designer 利用 Workplace 应用程序的核心功能:部署、模板、访问控制、参数定制和 Workplace API。

部署

反复部署对于开发人员的工作来说是一个非常重要的概念。为了对自己的代码进行测试并反复进行必要的修改,开发人员需要能够快速而且方便地部署自己的应用程序。Workplace Designer 实现这种功能的方法如下:利用部署的更多技术特性,生成适当的文件,并将这些文件放置到 Workplace 应用程序服务器上的适当地方(可能是 Workplace Collaboration Services 或 Workplace Services Express)。这是通过一个部署配置文件实现的(请参看图 7)。


图 7. 部署配置文件
部署配置文件

在创建一个包含相关服务器和数据库信息的部署文件之后,就可以选择 Deploy 选项开始部署这个组件了。向同一个服务器进行后续部署的操作会自动更新相应的组件。更新后的组件在部署到服务器上之后,就可以在这台服务器上的任何应用程序模板中使用了。

访问控制

Workplace Designer 让开发人员可以提供对不同表单和数据的访问控制,这可以基于预定义的角色(例如读者、作者和编辑者)进行控制。在将一个组件添加到一个 Workplace 应用程序(例如 Team Space)中时,这个 Team Space 模板的管理员就可以指定应该将哪些访问角色映射到每个成员类型上。在对应成员类型下列出的用户对于这个模板就具有了指定级别的访问权限。举例来说,moderator 列表中的所有成员都被分配了这个 Workplace 组件的编辑者访问角色(请参看图 8)。


图 8. Workplace Designer 对一个组件的访问级别
Workplace Designer 对一个组件的访问级别

参数

在组织中,业务用户可能希望自己对使用的应用程序进行定制,而不需要求助于开发人员。通过利用参数,使用 Workplace Designer 的开发人员可以开发出能够方便地改变的组件。开发人员可以确定几个变量,让 Workplace Team Space 或应用程序的管理员可以在创建组件时设置它们。例如,Blog 组件具有参数 BlogTitle 和 BlogDesc(这是一个描述)。这样,管理员就可以在创建应用程序的新实例时决定 blog 的标题和描述。开发人员使用 JavaScript 引用管理员可以设置的参数。例如,在 Blog 组件中,脚本 “context.getComponentParameter("blogTitle")” 将产生输入的参数值(见图 9)。


图 9. Blog 属性
Blog 属性

Workplace API

通过使用 JavaScript 来创建并修改使用 Workplace API 的 Workplace 对象,我们就可以与 Workplace 平台进行更高级的集成。在 Workplace Designer 的脚本编辑器中,开发人员可以通过使用适当的 JavaScript 调用 Workplace API 来以编程方式生成 email 消息、Web 会议和日历安排。

Livenames

在 Workplace Designer 2.6 中,使用 Workplace Designer 开发的组件可以充分利用 “livenames” 的功能,使用户能够通过简单地点击一个名字来进行协作。用来显示在 Workplace 应用程序服务目录中可以找到的雇员名的域和列都可以提供另一个下拉菜单,从而让终端用户可以立即向所显示的员工发送 email 或即时消息。





回页首


设计目标 6:支持与其他 IBM 应用程序开发工具一致的方法

Workplace Designer 生成的组件可以在使用 Workplace Collaboration Services 和 Workplace Services Express 所提供的 Template Builder 功能的 Workplace 应用程序中使用。将这些组件部署到一个 Workplace 应用程序服务器上,就可以将其加入到在 Application Templates 中包含的可用组件列表中。

在 Rational Application Developer 中也可以编写 Java 代码,然后调用 Workplace Designer 的 JavaScript 编辑器所提供的 Java 方面的功能。将来,Workplace Designer 可以用作 Rational Application Developer 环境的一个插件。开发人员可以使用 Workplace Designer 功能在编写 Java 应用程序和编辑 Workplace 组件之间进行切换。





回页首


设计目标 7:通过样例应用程序和教程来简化学习过程

根据用户的反馈,我们希望确保有样例应用程序和教程能够帮助开发人员迅速掌握 Workplace Designer 的使用。最终,Workplace Designer 将提供一些样例应用程序,例如 Project Manager、Discussion Database 和 Contact List。探索这些样例应用程序是如何构建起来的,这是一种很好的学习方法,可以了解如何将表单、视图控件、面板和模式集成在一起来制作 Workplace 的控件。在 IBM 的 developerWorks Workplace Web 站点 上还提供了其他一些样例应用程序。

这个教程已经包括在 Workplace Designer 文档中了,目的是让您了解创建表单和模式的步骤,以及使用 Script 编辑器的方法。这个文档还包括对各种特性的介绍,以及可以使用的 JavaScript 函数的参考。

Workplace Application Development 论坛 是提出有关 Workplace Designer 的问题的一个好地方。IBM 的员工会经常在这里回答问题,它也是开发人员共享自己的开发知识的一个社区。





回页首


结束语

如果您是一个 Domino Designer 用户、Web 开发人员或 Visual Basic 用户,就会发现 Workplace Designer 有很多地方都与它们非常相似。如果您有使用 UI 控件创建表单的经验,并且知道如何编写脚本,那么就应该可以快速创建 Workplace 组件。

如果您希望将来版本的 Workplace Designer 中有哪些特性,或者有任何建议,请与我们联系。



参考资料



作者简介

Ethan Perry 是 IBM Software 组的一名产品设计师,主要负责 Workplace、Portal 和 Collaboration Software 方面的设计工作。他目前正在为 IBM Workplace 应用程序开发工具设计用户界面,包括 Workplace Designer。Ethan 拥有 Yale 大学计算机系的学士学位,以及 MIT 的硕士学位。他已经在各种会议中发表了几篇人机交互方面的文章,还在自己的工作中作为用户体验设计者编写了很多设计和策略文档。可以通过 ethanp@us.ibm.com 与 Ethan 联系。


Jeff Sokolov 是 IBM Software 组的一名产品设计师,主要负责 Workplace、Portal 和 Collaboration Software 方面的设计工作。他目前在这个组中负责领导支持 IBM Workplace 的应用程序开发工具的设计工作。Jeff 拥有圣地亚哥的加州大学的学士学位,以及卡内基梅隆大学感知发展心理学的博士学位。在他的学习和职业生涯中,他已经在很多会议、杂志期刊和书籍上发表了很多文章。可以通过 sokolov@us.ibm.com 与 Jeff 联系。




对本文的评价

太差! (1)
需提高 (2)
一般;尚可 (3)
好文章 (4)
真棒!(5)

建议?







回页首


IBM 公司保留在 developerWorks 网站上发表的内容的著作权。未经IBM公司或原始作者的书面明确许可,请勿转载。如果您希望转载,请通过 提交转载请求表单 联系我们的编辑团队。
    关于 IBM 隐私条约 联系 IBM 使用条款