Axure-RP-8交互原型设计案例教程第15章-团队合作项目.pptx

1、第15章 团队合作项目A x u r e R P 8 交 互 原 型设 计 案 例 教 程Axure RP 支持两种形式的团队合作形式：一种是使用HTML 原型中的讨论功能，另一种是使用团队项目。1.HTML 原型中的讨论功能该功能的基本的意思是，将原型发布为带讨论功能的HTML 文件后，其他用户可以凭借原型发布者提供的项目ID和密码访问发布到Axure Share 中的原型并能通过“DISCUSS”（讨论）面板发表自己的见解，原型发布者也可以回复其他用户提出的意见和见解，实现原型发布者和其他用户之间的交流互动，如图15-1 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队

2、合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.1 团队合作形式Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.1 团队合作形式图 15-1 HTML 原型中的讨论功能2.团队项目团队项目是Axure RP 中真正的团队合作形式，它允许UX 设计团队之间在同一个RP 项目中分工协作共同完成原型设计任务。团队项目的基本意思为：将Axure RP 共享项目文件放在服务器或共享目录中，这个服务器或共享目录就像一个共享仓库，存储着构成整个RP 项目的所有元素。在这个大仓库中会有许多文件和文

3、件夹，它们都有很重要的作用，任何人不能随意修改这个大仓库中的文件。团队中的每个UX 设计师都可以通过一个“获取”指令获得这个大仓库中的项目资料，获取的同时会在自己的电脑上建立那个大仓库的复制，也就是共享项目副本文件。如果UX 设计师要上传自己的工作成果，则需要通过“提交”指令来完成。图15-2 简要展示了团队项目协作流程。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.1 团队合作形式Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项

4、目15.1.1 团队合作形式图 15-2 团队项目协作示意图Axure RP 创建团队项目的方法有两种：一种直接新建团队项目，另一种是从现有的RP 文件创建团队项目。1.直接新建团队项目执行【文件】【新建团队项目】命令，打开如图15-3 所示的【创建团队项目】对话框。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目图 15-3【创建团队项目】

5、对话框2.将项目文件放在AxureShare 中如果要将团队项目文件存放在Axure Share 服务器中，首先需要按照第14 章中介绍的方法注册一个账号并登录到Axure Share 中，此时，【创建团队项目】对话框左上角的蓝色链接文字会显示用户的名称，如图15-4 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目图 15-4 登录成功显示用户名文件夹：用于指定项目文件存放的位置，本选项是可选项，如果不做设置，则创建的项目文件会存放到用户的“My Projects”文件夹中，当然也可

6、以指定存放的位置，方法为：单击右侧的文本框或者最右侧的按钮，在弹出的位于Axure Share 服务器中的用户文件夹目录列表中选择存放位置，如图15-5 所示。团队项目名称：给创建的团队项目文件起个名字，如图15-6 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目图 15-5 指定团队项目文件存放的目录位置 图15-6 命名团队项目文

7、件创建元件库：勾选该项后，当单击下方的【创建】按钮创建团队项目后，会在Axure RP 中自动进入创建元件库程序界面，程序左上角的面板不再显示【页面】面板，而是【元件库页面】面板，如图15-7 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目图 15-7【元件库页面】面板在这种状态下，如果要在元件库中创建新元件，则需要先执行【签出】操作，才可以在页面中添加和编辑对象，元件创建完毕后，还需要执行【签入】结束操作。如果不勾选“创建元件库”选项，则单击下方的【创建】按钮创建团队项目后，在Ax

8、ure RP 程序界面的左上角位置显示的仍然是【页面】面板，如图15-8 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目图 15-8【页面】面板中的页面本地目录：用于指定项目文件副本在本地电脑存放的位置，这个目录必须是空的，否则创建时会出现提示，如图15-9 所示。URL 密码：用于设置访问团队项目所需的密码。虽然是可选项，但是最好设置密码，如图15-10所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项

9、目15.1.2 创建团队项目图 15-9 指定项目文件副本在本地的存放位置 图15-10 指定团队项目文件存放的目录位置设置完成后，单击【创建】按钮，弹出【成功】对话框表示创建团队项目成功，如图15-11 所示。创建团队项目成功后，在Axure Share 中可以看到刚刚创建的团队项目，文件图标以洋红色显示，这有别于普通RP 文件的青色图标，同时还能看到分配给团队项目的ID 以及URL，如图15-12 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目图 15-11 创建团队项目成功提示

10、Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目图 15-12 Axure Share 中存放的团队项目3.将项目文件放在SVN 中除了将创建的项目文件放在Axure Share 服务器中，还可以将项目文件放在SVN 中，如图15-13所示。从对话框中可以看出，SVN 参数设置与Axure Share 参数设置基本相同，只是SVN 没有“URL密码”参数。不过要注意，这里的“团队目录”与Axure Share 不同，它指的是一个网络驱动器（或者本地的一个目录），也就是局域网中作为服务器中的共

11、享盘或者是一个共享文件夹，如图15-14所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目图 15-13 将项目文件放在SVN 中图 15-14 指定网络驱动器作为存放目录当然，如果该团队项目文件只是供自己使用，则完全可以在本地电脑中指定一个驱动器来存放。例如，放在本地电脑的“E:TeamProjects”中，如图15-15 所示。在“团

12、队项目名称”中输入名字，在“本地目录”中指定项目副本存放的目录位置，如图15-16 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目图 15-15 指定本地电脑驱动器存放团队项目 图15-16 命名团队项目名称和指定本地目录参数设置完成后，单击对话框下方的【创建】按钮，即可创建一个团队项目。现在打开指定的团队项目目录位置就会发现在该目录

13、下，程序创建了一个以团队项目名称命名的文件夹，如图15-17 所示。双击该文件夹打开后，里面包含了多个子文件夹和几个其他文件，如图15-18 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目图 15-17 团队项目文件存放在指定的位置图 15-18 项目文件夹中的子文件夹和文件同样，也可以打开本地目录，在该目录下存放的是项目文件的副本，

14、包含一个团队项目和一个名为“DO_NOT_EDIT”的子文件夹，如图15-19 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目图 15-19 本地目录中的文件夹和文件4.从现有的RP 文件新建团队项目如果已经打开或新建了一个RP 文件，则可以从当前的RP 文件新建团队项目，方法是：执行【团队】【从当前文件创建团队项目】命令，同样打开与直接新建团队项目相似的对话框框，不同的是，这里的对话框没有“创建元件库”选项，而且在团队项目名称中已经自动输入了当前RP 文档的名称，如图15-20 所

15、示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.2 创建团队项目图 15-20 从RP 文件创建获取团队项目是指团队项目组成员从Axure Share 或者SVN 中获得团队项目的副本以供自己编辑项目使用。获取团队项目副本的方法是：执行【团队】【获取并打开团队项目】命令或者执行【文件】【打开团队项目】命令都可以打开【获取团队项目】对话框，如图15-21 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团

16、队项目图 15-21【获取团队项目】对话框1.从Axure RP 中获取团队项目根据获取团队项目的用户不同，可以将获取团队项目分为两种情况：一种是团队项目的创建者要获取团队项目；另一种是非团队项目组成员要获取团队项目。（1）团队项目的拥有者获取团队项目。团队项目的创建者也就是团队项目的拥有者，拥有者要获取团队项目时，只要打开Axure RP 并登录到Axure Share 账号中，然后执行【获取并打开团队项目】命令，在打开的对话框中输入要获取项目的ID 或者从直接从列表中选择要获取的项目即可，如图15-22 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项

17、目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团队项目Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团队项目图 15-22 设置获取团队项目的ID（2）非团队项目成员要获取团队项目。如果要获取团队项目的用户不是团队项目的拥有者或者团队项目的成员，那么，即便输入正确的项目ID，也无法获取。图15-23 是其他用户使用团队项目的ID 要获取团队项目副本的设置。单击【获取】按钮后，由于该用户不是团队项目成员，所以会弹出图15-24 所示的提示。Axure RP 8 交互原型设计案例教程

18、第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团队项目Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团队项目图 15-23 其他用户获取团队项目设置图15-24 无法获取团队项目的提示团队项目的拥有者或项目的其他成员登录到 服务器并进入允许获取的团队项目所在文件夹（Axure Share 成为工作空间），然后单击“invite people”（邀请他人）链接，如图15-25 所示。单击“invite people”链接会弹出一个对话框，在该对

19、话框中输入被邀请人的邮箱，如果有多个被邀请人，则邮箱之间用逗号分开，在下方还可以输入500 字以内的邀请语，如图15-26所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团队项目Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团队项目图 15-25 邀请他人文字链接 图15-26 输入被邀请人邮箱设置完成后，单击下面的【Invite】按钮即可发出邀请，现在就可以在当前页中看到pending（待定）人

20、员名单，也就是刚才发出邀请的那些邮箱地址，由于被邀请人还未同意加入这个团队项目，所以在Share with（获得共享）人员名单中显示No one（无人），如图15-27 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团队项目图 15-27 显示待定人员用户邮箱如果被邀请人登录到，就会看到发过来的邀请函，单击“Accept”蓝色文字链接表示接受邀请，单击“Decline”蓝色文字链接表示拒绝邀请，如图15-28 所示。被邀请人接受邀请后，可以看到加入的团队项目以及该项目的拥有者和待定加入团队项

21、目的其他被邀请人，如图15-29 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团队项目Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团队项目图 15-28 被邀请人收到的邀请函 图15-29 被邀请人的账户中显示的团队项目被邀请人加入团队合作项目后，还可以单击“invite people”蓝色文字链接继续向他人发出邀请，或者单击“unjoin”蓝色文字链接退出团队合作项目，如图15-30 所示

22、。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团队项目图 15-30 被邀请人账户中的团队项目被邀请人接受邀请后，发出邀请函的项目拥有者或项目的其他成员在自己的账号中就能看到接受邀请人的名单，如图15-31所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团队项目图 15-31 团队项目拥有者账户中显示的接受邀请的名单2.从SVN 中获取团队项目如果团队项目放在SVN 中，例如，“192.168.

23、21.61SVN”，团队项目名称为“iPhone 7”，则执行【获取并打开团队项目】命令后，在打开的对话框中，要在【团队目录】文本框中输入“192.168.21.61SVN iPhone7”，而不是“192.168.21.61SVN”，如图15-32 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.3 获取团队项目图 15-32 输入获取团队项目的SVN 目录既可以从当前的RP 文档创建一个团队项目，也可以将一个团队项目导出为一个普通的RP 文档。当团队项目目录被移动或者想保存当前团队项目的一个状态时

24、，可以执行【文件】【导出团队项目到文件】命令，将当前的团队项目导出为一个独立的RP 文档，导出后的RP 文档与原团队项目以及它的副本之间没有任何关联。当然，还可以使用前面介绍的方法，再将导出的RP 文件转为团队项目文件。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.1 15.1 关于团队项目关于团队项目15.1.4 将团队项目导出为RP 文档打开本地团队项目副本后，如果没有执行【签出】命令，那么文档中的任何元件、母版和页面等都是无法编辑的，如果向页面中添加一个元件或者执行其他编辑操作，鼠标指针会变成标志，而且在页面视图右上角还会出现一个“签出”提示，如

25、图15-33 所示。单击这个签出提示即可执行【签出】命令，也可以执行【团队】【签出】（签出后面会加页面或母版名称）命令，将当前页面或母版签出。如果要签出所有页面或母版，则执行【团队】【签出全部】命令。页面或母版签出后就可以任意编辑和修改该页面或母版的属性以及页面或母版上的元件了。执行【签出】命令后会在页面或者母版缩略图中添加一个绿色圆形标志，如图15-34 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.2 15.2 使用和管理团队项目使用和管理团队项目15.2.1 签出和签入团队项目Axure RP 8 交互原型设计案例教程第第1515章章团队合

26、作项目团队合作项目15.2 15.2 使用和管理团队项目使用和管理团队项目15.2.1 签出和签入团队项目图 15-33 签出提示 图15-34 签出标志我们已经知道，项目组成员要编辑本地的副本文件必须执行【签出】命令，但是如果一个或多个页面或者母版已经被其他项目组成员签出，则在执行【签出】命令时会弹出图15-35 所示的【无法签出】对话框。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.2 15.2 使用和管理团队项目使用和管理团队项目15.2.2 编辑团队项目图 15-35【无法签出】对话框完成对页面或母版的编辑后，想将更新的内容上传到服务器中，并且

27、不想再继续编辑页面或母版，则需要执行签入命令而不是提交命令。但要注意，如果页面或母版已经被其他项目组成员正常签出或者强制签出，那么，在执行签入命令时会出现图15-36 所示的【强制签出】对话框。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.2 15.2 使用和管理团队项目使用和管理团队项目15.2.2 编辑团队项目图 15-36【强制签出】对话框在签出状态下，虽然能够对项目文件做任意修改和编辑，但是这只是在本地项目副本中的修改，并非在服务器中修改团队项目。如果要将修改的内容上传到服务器中作为团队项目的一部分并且想继续编辑副本，则需要执行提交命令而不是签

28、入命令。方法是：执行【团队】【提交（页面或母版名称）更新到团队目录】命令，该命令只是提交当前页面中的更新。如果要提交所有更改的页面和母版的内容，则执行【团队】【提交所有变更到团队目录】命令。另外，还可以在要提交的页面或母版中右击，从弹出的快捷菜单中执行【提交变更】命令。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.2 15.2 使用和管理团队项目使用和管理团队项目15.2.3 提交和获取更新通过管理团队项目命令，可以随时对页面、母版和文档进行签出、签入、获取和提交变更等操作，方法是：执行【团队】【管理团队项目】命令，打开管理团队项目对话框，在该对话框中

29、单击【刷新】按钮，可以在列表区域中显示相关的条目内容，如图15-37 所示。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.2 15.2 使用和管理团队项目使用和管理团队项目15.2.4 管理团队项目图 15-37 列出的条目内容在团队合作项目中，每个成员提交和签入的团队项目都会有清晰的记录，通过查看这些记录，可以随时查看每个项目成员签入的团队项目和说明文字，并且可以将某个成员签入的项目导出为独立的RP 文档。浏览团队项目历史记录的方法是：执行【团队】【浏览团队项目历史记录】命令。在【团队项目历史记录】对话框中指定开始和结束日期后，单击【获取】按钮，即可

30、获取指定日期范围内的签入记录。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.2 15.2 使用和管理团队项目使用和管理团队项目15.2.5 浏览团队项目历史记录在团队项目所在目录发生改变而团队项目中的文件没有被改动的前提下，可以重新指定该团队项目的目录。方法是：执行【团队】【重新指向移动位置的团队目录】命令，如果团队目录在Axure Share 中，则执行【重新指向移动位置的团队目录】命令会弹出如图15-38 所示的【重新指定团队目录】对话框。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.2 15.2 使用和管

31、理团队项目使用和管理团队项目15.2.6 重新指向团队项目图 15-38 重新指定位于Axure Share 中的目录如果需要重新指定的团队目录是在SVN 中，则执行【重新指向移动位置的团队目录】命令后会弹出如图15-39 所示的对话框。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.2 15.2 使用和管理团队项目使用和管理团队项目15.2.6 重新指向团队项目图 15-39 重新指定位于SVN 中的目录如果团队项目是建立在SVN 中，则在执行签入命令时，或许偶尔会遇到一条错误的提示消息：工作副本被锁定。导致这个错误的原因会很多，如连接服务器失败、计算

32、机操作故障、病毒扫描程序等。针对这个概率很小的问题，通常可以执行【团队】【清理本地副本】命令来解决。执行该命令后，会弹出【清理本地副本】对话框。在该对话框中清楚地告诉我们该如何解决“工作副本被锁定”的问题。需要我们操作就是第1 条和第2 条，即保存项目并将项目导出为RP 文档进行备份。Axure RP 8 交互原型设计案例教程第第1515章章团队合作项目团队合作项目15.2 15.2 使用和管理团队项目使用和管理团队项目15.2.7 清理本地副本本章总结本章总结通过本章的学习，读者应熟练掌握团队合作项目的原理和流程，并且能在Axure Share 和SVN中创建自己的团队项目；要熟练掌握团队项目签出和签入的作用，能够区分提交和获取团队项目的不同之处和各自的作用，能够通过管理团队项目快速实现签出、签入、获取和提交更新等操作；能够利用团队项目的历史记录准确查找到自己想要的某个团队项目工作状态；团队项目目录位置发生改变时，要熟练掌握重新指向团队目录的操作方法；最后，如果在签入团队项目到SVN 时，偶尔出现工作副本被锁定的错误，能够使用清理本地副本命令正确处理。THANKSA x u r e R P 8 交 互 原 型 设 计 案 例 教 程