使用GUI Design Studio进行原型设计如何制作界面图在实际开发中，我们常常会用很多工具，绘制界面图。用于描述我们的产品的某个功能对应的界面，将来会是什么样子。可以使用的工具很多（visio、smartdraw等），也有用excel画框图，来标明程序的各个区域的。其实使用gui design studio，可以很容易的话界面图。不仅轻松，而且十分的真实，既获得一个很好的效果，也能削减沟通上的一些不便。不仅可以向非开发人员展现，也可以向开发人员展现你的设计。1、新建设计打开gui design studio，其默认会打开welcome工程。由于我们只是做一个界面效果图，所以不会用到工程那一块的功能。我们就直接使用File菜单下的new菜 单项（CTRL+N）新建一个设计。2、添加界面控件 右边的面板叫设计器面板，它由多个页签构成。分别对应的功能是：工程面板、元素面板、图标面板、注释面板、故事板、备注面板。而我们要用的是其次个 面板“元素面板”。在这个面板上分为上下两部分，上部分是一个分类列表，下部分为各个分类下的元素。当你选择一个分类后，下面的面板就会显示该分类的元 素。要将元素添加到设计文档中，有两种方法。1）用鼠标双击要加入的元素 2）用鼠标单选要加入的元素，不要放鼠标左键，将对应的元素拖拉到文档中。整个设计文档中间有一个红色线条围成的矩形，这个区域代表屏幕区域。在这个区域里的元素，在模拟器运行中将显示在屏幕中，对于不在这个区域的元素将 不会显示。那么其他区域到底放什么呢，主要是放置在作为大事等动作，触发后被切换进入屏幕区的元素。我们拖拉一个窗体作为整个设计的开头，你会发现这个窗体边缘有淡淡的绿色。这个绿色表示是整个设计的主元素，默认的情况studio认为第一个就是 主元素。当然你也可以使用F10或使用右键菜单来指明主元素（此时淡绿色会变为深绿色）。主元素是模拟器作为显示的起始元素，也是当该设计作为其他设计文 档的组件时候，展现的起始元素。如下图所示：好了我们模拟一个制作一个登录界面。双击拖出的主窗体，则会弹出属性编辑器（全部的设计元素，双击后都会弹出属性窗体，当然你也可以选择点右键菜单来完成该工作），我们输入“xxxx 协同办公系统”，其它属性不用修改。依此类推，我们放入标签和文本输入窗，来完成用户名和密码。最后加入一个按钮，将它的文本改成登录。效果如下：3、添加图标登录按钮看上去比较平淡，一般的程序在按钮旁都有图标的。所以我们也想加入图标。这里我们直接使用studio自带的图标。我们选择设计面板的第三 个页签(Icons),这个页签主要是上中下三部分构成，上部分是分类列表，中间是过滤条件（可以通过文件大小和颜色深度来过滤），下部分则是图标列表。 我们选择toolbar类别在里面拖一个人物图标出来。在图标列表上方有个工具条 分别是“新建图标、编辑图标、刷新列表、和删除图标”。也就是说我们在这里可以维护这个图标库，可以通过studio供应的工具，自己来加入图标和修改现 有的图标。 4、重用已有程序的界面元素其实我们很多的设计都不是白手起家，一般的情况都是修改原有的界面或基于原有的界面做改进。那么从新使用studio，一个一个元素的拖拉和摆放还 原原先的界面的话，工作量是惊人的，细节调整工是巨大的。有没有什么好的方法重用原有的界面呢？答案是有！最好的方式就是截图。在这里有三种方法使用屏幕截图，第一种：使用截图软件先将图截好，然后通过design菜单下的add Bitmap菜单命令，完成图片的插入。其次种方法：将截后的图片放在工程名目下，然后直接拖动出来。第三种：现截现用，就是截完图后，使用工程面板下的 paste img from clipboard命令，存放在工程名目下，然后拖动到设计中。 我这里演示的是拷贝的左边背景图，其它界面是类似的，只要先前规划好界面大小即可。4、导出图片当我们的界面设计好后，要放入设计文档中，此时我们可以将我们先前制作的gui文档，导出成图片，然后就可以插 入到设计文档中了。 打开设计好的gui文档，选择File下的Export菜单项。在弹出来的导出窗体，选择导出路径及文件名。studio支持导出的格式有：BMP、GIF、JPG、PNG、EMF这些在制作文档方面是够用了。总结到此我们就利用gui design studio完成了界面图的制作，做界面效果图基本上不用总是麻烦美工了，而且也是十分的快速和具有比较真实的效果。这些也只是利用到了 gui design studio的一些皮毛功能。GUIDESIGNSTUDIO3中文帮助(1)-欢迎使用 GUI Design Studio 3.0 2009-06-28 12:02:44标签：GUI Design Studio 中文 欢迎推送到技术圈 Design设计 Specify简略规格 Prototype原型 Demonstrate演示 Document文档GUI Design Studio是一个给应用软件设计图形用户 界面（GUIs）的专业工具。它是一个不需要软件开发和编码的完整的设计工具。屏幕上的一切都通过图形方式创建，你可以设计整个应用程序或单个窗体，对话 框和组件。并组合它们来创建更多的设计，和典型界面。我们也可以将它们链接在一起做为一个故事板，然后通过模拟器来运行，形成交互原型。GUI Design Studio 将会支持全部基于微软 Windows 平台的软件环境。这个意味着，你可以先自由的设计，设计完后再选择实现工具。 依据这种方法，你可以快速聚焦到应用程序设计中，而不会被实现细节干扰。. GUI Design Studio 可以被用于，任何你需要画程序界面，或着想展现这些界面是如何流转和协作的时候，例如： 设计整个应用程序 文档化产品创意 创建项目建议 需求捕获 创建模拟界面 给开发者的产品简略规格说明 注解现有产品的可用性 给现有产品供应建议 构建用户手册时候的临时屏幕截图 + 更多其它用途我们可以创建如下的报告给用户、主管甚至是自己：: 验证设计 展现候选方案 评估不同的使用场景gui design studio 3 中文帮助（2）-猎取帮助 如果你在使用GUI Design Studio时有困难或想需要更多信息。下面有几条可以获得帮助的途径 ：?Context Help上下文帮助?Online Reference联机参考?Online Tutorials联机教学?Web Site网站?Customer Support客户支持上下文帮助也被称为“这是什么”的帮助。实际上用户 界面都被关联了帮助信息，这些信息告知你它是什么或它能干什么。它们消失在如下类似的弹出窗体中。在联机参考中，主题和与其相关的主题或页面都链接在一起。 上下文帮助 可以依据你需要帮助的地方，使用多种方式访问：1.在对话框里，可 以被如下访问:? 在你需要帮助的控件上使用右键（这项在有右键菜单的编辑控件上无效）。?在控件获得输入焦点的时候，按F1键。?点击标题栏上的帮助按钮，进入“这是什么”的模式，然后点击控件。2. 在标题栏上没有“这是什么”帮助按钮的属性编辑对话框：?在你需要帮助的控件上使用右键（同样这项在有右键菜单的编辑控件上无效）。?在控件获得输入焦点的时候，按F1键。?点击标题栏上的帮助按钮，猎取一般帮助信息。3. 用户界面的其他地方:?在窗体或菜单上时候，当控件获得输入焦点的时候，按F1键。?按 Shift+F1 进入“这是什么”的模式，然后点击控件。?使用帮助菜单中的 Whats This?命令，进入“这是什么”的模式，然后点击控件。?点击工具条上的 Whats This?按钮，进入“这是什么”的模式，然后点击控件。联机参考这就是你现在阅读的帮助文件。这是获得在使用软件时候如何操作简略内容概览的好途径。帮助菜单包含了文件索引和内容的链 接。如果你在内容中找不到你要的，可以尝试使用索引。如果你任然找不到你想要的，可以试着使用关键字查询。联机教学如果你是使用GUI Design studio的新手，我们强烈推举你使用帮助菜单中的Quick Start Tutorial.这个教学掩盖了很多基本内容，能让你在简短的时间内生疏软件的很多方面。 更多的教学将会被制作并可以到 Caretta Software网站 下载.这些将掩盖在使用软件进行GUI设计的一些特定方面。网站如果你尝试使用上下文帮助、翻遍联机参考、学习了在线教学，仍然无法找到你想要 的信息，你可能会在Caretta Software网站 上有所收获。.客户支持当以上全部方法 都无效的时候，请使用邮件联系我们的客户支持部门（） 获得进一步的帮助 。gui design studio3 中文帮助（3）-用户界面 （上） 2009-07-12 22:13:07标签：gui design 用户界面 中文推送到技术圈 用户界面下面就是 GUI Design Studio 工作区。向下滚动滚动条看简略的说明。多文档你 可以在同一时间里打开和编辑多个设计文档，并可以通过如下方式，轻松的切换：使用工具条下的文档标签；使用Ctrl+Tab激活队列中的下一个文 档；Shift+Ctrl+Tab激活队列中的上一个文档。全部打开的文档也可以通过 window菜单来选择和激活。 设计工具条 设计工具条可以被停放在主程序窗口的左边或右边，也可以通过view菜单来设置成为浮动。每一个面板供应了访问制作设计的不同元素，简略如下：Project工程用于访问工程中的全部设计文档和图片文件.Elements元素分门别类的摆放着GUI设计中的各个组成部分，其中包括窗体和控件。Icons图标用 于访问，可以被用于设计中的工程图标和其它类别的公用图标。.Annotations注 释使用浮动文本框、高亮的圈和其它标记注释你的设计中的各个部分。t boxes, highlight rings and other markers.Storyboard故事板通过在设计中构建流程掌握，来实现模拟原型。.Notes备注用 于记录关联到设计文档的备注。.gui design studio3 中文帮助（4）-用户界面 （中）-工具面板 2009-07-19 10:42:54标签：gui 用户界面 design 中文 面板推送到技术圈 工具面板工程面板设计工具条上的工程面板，可以访问工程全部设计文档和图片文件。在 这里你可以快速做如下事情：创建新的工程名目来组织你的文件；创建新的设计文档；复制已有的设计和从剪贴板上导入图片。你 也可以加入其它工程和文件夹得链接，来获得访问它们的全部设计文档和图片文件。这个功能，在你使用库工程的公共组件或使用