balsamiq网站制作教程 第1篇
Balsamiq Mockups register organizationName serialKey
用提供的一系列关键信息注册 Balsamiq Mockups
Balsamiq Mockups unregister
从这台电脑上注销 Mockups
对于某一个Mockup，最大的画布大小是多少？
最近已经上传完毕！
一个 Mockups 最大的画布大小是 4056x4056 像素。Mockups 会自动调整画布大小来适应您的内容。这是 Adobe AIR 应用允许的最大画布大小。如果在将来框架允许我们增大画布尺寸的话，我们会那么做的。
如果您的线框超过 4056 像素边框出现不平整情况，您可以用断裂线来表示延续。这就是设计者对线框规格经常做的事。Mockups 在浏览器，矩形，几何形和水平尺控制中都支持断裂线。
图片 image
如何找到你的本地数据存储文件夹？
最近已经上传完毕！
balsamiq网站制作教程 第2篇
工具栏包含一系列的图标用来在其他用户接口的区域执行操作。
第一个图标集如下所描述。
图片 image
1.在 Mockups,资产，标志和垃圾箱间导航 2.展示/隐藏左边的面板 3.用一个缩略图显示你的实物模型 4.创建一个新的实物模型 动作（重命名等）和在实物模型间（当左边面板被隐藏时展示）导航 6.到下一个或前一个实物模型（当左边面板被隐藏时展示）
图片 image
工具栏最右边的最后一部分包含了快速添加工具，UI 库，属性检视视图和项目信息面板的切换图标，和一个进入全屏展示模式的图标。
图片 image
工具栏的顶部展示了项目的名字，你可以双击来重命名（或者到菜单中的 Project > Rename Project...）。
图片 image
balsamiq网站制作教程 第3篇
lorem
在 Paragraph 或 Text Area 输入 lorem 来使用我们的 Lorem Ipsum 发生器。
图片
在 Label, Text, Title 或者 Subtitle 控件中输入 {mockup-name} (所有小写字母) 会显示当前 mockup 的名字。
使用数据网格／表格
最近已经上传完毕！
数据网格控件的功能与其它基于文本的控件相似。它使用逗号分隔列，使用换行分隔行。一个基本的三列两行表会像这样：
First Name, Last Name, Email Address firstname, lastname, email@
你可以在属性检视视图中选择是否将第一行作为表头来显示，同时也可以指定行高、颜色和网格线。
balsamiq网站制作教程 第4篇
像在 Mockups 视图中那样，在 Assets 视图中有一个上下文菜单,你可以在导航栏或者下拉菜单中右键单击来打开。这样你可以重命名、克隆、丢弃或者下载你的图像。
图片
在上下文菜单中使用重命名图像会改变你的项目中资源的名字。这不会影响到你的本地文件，因为图像是添加到项目中的一个副本。重命名图像会在你的 mockups 中更新，所以并不需要手动的更新它们。
你同样可以使用上下文菜单来从项目中删除图像。正如你的 mockups,删除将会把图像移至回收站，从那里你可以永久地删除或者是还原它们。值得注意的是从 mockups 画布上删除它们并不意味着从工程中删除它们。
你可以在上下文菜单中使用 _Download_ 选项来将图像从工程保存到本地，这样你可以从工程中提取出图像来做其他事情。
使用标记
最近已经上传完毕！
标记是 UI 库中一个特殊的组件，它用来添加注释、评论和解释说明性文字。
通常情况下使用的标记有：箭头/下划线，插图编号，记事贴，红叉和花括号。下面的截图显示了 UI 库中提供的可选标记按钮面板，和在页面上的标记组件。
图片
balsamiq网站制作教程 第5篇
如果相比于原始的 mockup，你更喜欢另一种 alternate 的话，你可以将其“升级”到官方版本，这将会代替并重写原始版本。
图片
注释：通过撤销指令(CTRL/CMD + Z)，你有三次撤销该命令的机会。
已升级的 alternate 会被保留，以防你想要将其保存至变化历史记录中。否则的话，你可以将其删除掉。
balsamiq网站制作教程 第6篇
有一些图标集用来补足手绘风的 Mockups。这个在 Tips Blogger 的博客列举了一些更手绘风的图标集，可能会有用。
有些图标设计者已经开始创建图标包，兼容我们的命名体制。这里有一些我们知道的。
如果想使用这些图标包，只需要解压图标文件，并把它们拖拽到你的 Assets，像之前描述的那样。如果你正在使用 myBalsamiq，可以通过 Assets 对话框上传图标文件。
balsamiq网站制作教程 第7篇
在你阅读教程之前，我们假设你已经具备了基本的原型设计的相关知识。
Balsamiq Mockups 3 简介
Balsamiq Mockups 3 是我们将近一年的埋头编码创造出来的产品，这个产品不仅是我们的客户一直提出要求希望我们做的，也是我们自己一直想要做的。
最显著的改变是人们从一开始就一直提出需求的两个“要点”：项目支持（打包文件，多窗口）和去除 “浮动属性页面”（属性检视视图）。
但正如同我们通过后台的实现让软件运行的更快更智能并且通过不断的改进用户体验的每个部分一样重要的是，我们希望能够更好的使用 Mockups。
在这篇文章中你将找到有关哪儿去下载它，最新情况的信息，当然，还有怎样导入已存在的文件。如果你刚接触 Balsamiq Mockups 或者在读完这篇文章后想要更深地钻研下去，你可以看以下的文档目录和应用程序概述。
这里是一个版本 3 的简短 5 分钟视频介绍。
balsamiq网站制作教程 第8篇
你能够使用在项目菜单中的 Import/Export Mockup JSON 命令来快速从一个项目拷贝 mockups 到另一个项目。导出至 Mockups JSON (Project > Export > Mockup to JSON) 命令将拷贝选中的 mockup 的 Balsamiq Mockups 代码至剪贴板。要将这个 mockup 创建在一个新的项目中，就要切换至这个项目，并且在 Project > Import 菜单中选择 “Import Mockup JSON…” 并且粘贴复制好的代码。
balsamiq网站制作教程 第9篇
有些人喜欢在电子表格比如 Excel 中准备表格。你可以直接从 Excel 中复制和粘贴一些列表格到 Data Grid/Table 组件中。只需要复制/粘贴，它就可以完成了。也可以逆向使用，从 Mockups 到 Excel。
注释：如果你的表格中有逗号，你可以使用斜杠来显示它们，像这样: 1\,000\,000
组件默认逗号和 tab 是定界符。其它所有的都必须在表格之中。
使用图标
最近已经上传完毕！
Balsamiq Mockups 3 包含令人难以置信的 Font Awesome 的图标集。包含了超过 500 个图标，而且种类丰富，从极小到很大的图标都有。而且它还频繁地更新，我们计划无论何时我们发布的新版本都要保持同步更新（了解更多我们为何转换）。
图片
之前版本 Balsamiq Mockups 中的图标已经重新绘制成新图标。了解在 Balsamiq Mockups 3 项目中如何使用旧图标。
balsamiq网站制作教程 第10篇
快捷键
新的空白模型
CTRL + N
复制当前模型
CTRL + SHIFT + N
新项目
CTRL + ALT + N
打开项目
CTRL + O
保存为...
CTRL + SHIFT + S
给该模型重命名
CTRL + ALT + R
关闭当前项目
CTRL + W或者CTRL + F4
导出该模型的JSON
CTRL + E
导入该模型的JSON
CTRL + SHIFT + E
导出快照到剪贴板
CTRL + SHIFT + C
导出快照为PNG格式
CTRL + R
将所有快照导出为PNG格式
CTRL + SHIFT + R
导出为PDF格式
CTRL + P
退出Balsamiq Mockups
CTRL + Q
浏览模型中打开的桌面文件
CTRL + Page Down以及CTRL + SHIFT + Page Up
balsamiq网站制作教程 第11篇
你可以将 mockups 以 PDF 的形式导出到你的项目中，你可以用来打印或是发送邮件，或呈现给用户，或是在互联网上发送。如果你的 mockups 包含链接，同样可以用 PDF 的形式进行导出，并且允许你自行设计创建一个单击原型。（要了解更多有关链接的信息，请查看Linking Mockups Together。）
注意：当导出 PDF 至 myBalsamiq 时，请查看 myBalsamiq 文档中的 Managing Projects。
导出 PDF 时，选择项 Project > Export to PDF...菜单命令（快捷键：CTRL/CMD + P ）。每一个 mockup 将会在 PDF 中独立的一页中显示。mockup 将会和项目中的顺序保持一致，所以在导出前请安排还他们的顺序。
PDF 导出选项显示如下：
图片 image
balsamiq网站制作教程 第12篇
图片 image
这个视图展示了所有你的实物模型的缩略图，这对于获得你项目的整体预览是有用的。它允许你立刻看见更多的有关实物模型，而且是一个非常好的用来重排序和整理（例如，重命名和移动到垃圾箱）的视图。
缩略图在查看实物模型和资产时可获得，而且是仅有的垃圾箱可获得的视图。
使用 UI 视图
最新更新！ 这个页面已经被更新为 Balsamiq Mockups 3。旧文档在这里。
balsamiq网站制作教程 第13篇
Balsamiq Mockups 第三版使用了一种新的文件格式，而这种格式与这里的很多工具不能兼容。所以如果你想使用它们，你应该阅读有关的导入和导出 BMML 文件。
请注意，我们不是这些工具中任何一个的运营商，我们不能保证他们会按需要继续支持工作。
Web
Flash
Images
其他应用
想要在一个服务器上通过命令行运行 Mockups？创造这些源文件脚本的 Ian Norton 将可以提供帮助。
balsamiq网站制作教程 第14篇
一句话概括，很多！这些是你应该知道的“亮点”：
最后，你不仅对于不同组别的 mockups 有各自单独的窗口，而且所有属于项目的“东西”（mockups，标志，图像，图标）都会在一个文件中。这使得它发送和移动文件，归并所有东西要简单得多。
图片 image
图片 image
你的项目被自动保存了。不需要手动保存。当你重启实物模型时，所有在你离开时候的东西都会完好无损。
令人厌烦的四处出现的属性检视视图已经消失啦！现在你在左边拥有实物模型，右边拥有属性。简单，可预测并且快速。UI 库位于它一直所在的顶部但是现在它有一点紧凑。
图片 image
图片 image
当然，你可以使用面板的图标隐藏所有的面板，使你进入美妙的线框天堂。
图片 image
使用工具栏中的图标四处浏览和进行普通的操作是简单的。
图片 image
1.在 Mockup，资产，标志和垃圾箱中导航。 2.展示/隐藏左边的面板 3.用一个缩略图中显示你的 mockups 4.创建一个新的 mockup 动作（重命名等）和在 mockups 间（当左边面板被隐藏时展示）导航 6.到下一个或前一个 mockup（当左边面板被隐藏时展示）
在 Mockup 中所使用的字体控制自从开始以来已经成为最需要的功能之一。之前自定义字体是使用一个复杂的配置文件来得到的，但我们现在允许你在新的项目信息面板中设置项目字体。是的，你现在可以简单地使用任何你已经在你的 mockups 中安装的字体。你也能为它设置一个默认的大小。
图片 image
我们也把皮肤转换选项移动到了新的项目信息面板中，这使得它们更加明显（许多人从来不知道我们的线框皮肤）。最后，默认的选择颜色在新的面板中也是可配置的。
在之前的版本中我们把标志称为一个“先进的特征”。但是，我们不再这么说了。标志现在是对于所有人来说的。标志允许你创建模板，作品，和其他可重复使用的成分来节省时间和保证一致性。它们对于大项目和自定义控件来说是尤其有用的，而且是我们 Mockups To Go 页面 的核心。
balsamiq网站制作教程 第15篇
UI 库，或者 UI 控件，是工具栏下的 UI 控件的长条地带。它罗列了所有 Mockup 和资产，图标和标志的 UI 控件的类型。UI 库的主要目标是让你添加 UI 控件到实物模型画布，但是你也能使用它来为你的实物模型获得灵感。
图片 image
为了添加一个新的 UI 控件到画布，选择你想要添加的控件类型，然后可以拖动它到下面的实物模型画布，或是简单地双击它，Balsamiq Mockups 将为你把它放到实物模型画布中。
balsamiq网站制作教程 第16篇
当你在模型画布中选中一个符号，你将看到两个符号属性出现在属性检视视图中： Break Apart 和 Edit Source。
图片 image
_Break Apart_ 将把符号中的空间和选中的符号本身的连接打断，意味着它不再是一个符号（尽管原始符号完好）。你对分解后的符号的任何改变都不会在其他地方更新，你对一个符号的任何改变在它的分解处也都不会被更新。
图片 image
balsamiq网站制作教程 第17篇
图片 image
这对于我们来说是一个巨大的改变所以我们十分乐意地想要知道您是如何考虑的。如果你找到任何问题或者有任何评论，请使用 Mockups 中的 Help > Send Feedback 菜单来在新的 Balsamiq Forums 中评论。我们将在那看到你！
版本过渡指南
感谢试用我们最新的 Balsamiq Mockups 版本！我们认为你将真正喜欢所有的版本升级并且觉得它使用起来非常简单。为了了解更多新特性，你可以读一读 Balsamiq Mockups 3 简介或者阅读我们的完全文档。
这篇文章是可以解答一些你可能会有的从前一个版本转换到当前的 Balsamiq Mockups 3 的问题。
balsamiq网站制作教程 第18篇
快捷键
Enter或F2
增加选中内容
按住SHFIT键并单击
选中切换
按住CTRL键并单击
CTRL + A
全部反选
CTRL + SHIFT + A
将/不将选择作为标记
CTRL + SHIFT + M
大小/位置
快捷键
调整保持纵横比
按住SHIFT键
移动或调整过程中禁止捕捉
按住CTRL键
加大字体或图标大小
CTRL + ]
减小字体或图标大小
CTRL + [
选择微调1px
↑↓←→
选择微调 10px
SHIFT + ↑↓←→
选择微调大小1px
CTRL + ALT + ↑↓←→
选择微调大小10px
CTRL + ALT + SHIFT + ↑↓←→
选择自动调整大小
CTRL + ALT + 0
平移画布（手形工具）
按住SPACE BAR键并选中拖动画布
置于顶层
CTRL + SHIFT + ↑
置于底层
CTRL + SHIFT + ↓
前移一层
CTRL + ↑
下移一层
CTRL + ↓
按住ALT键并拖动
balsamiq网站制作教程 第19篇
想要转换外表风格，要到项目信息面板并且将外表设置为 _Wireframe_。
图片 image
这个特性允许你使用粗糙的外表风格来显示你的想法，然后再通过菜单选择外表风格，来将你所有的控件转换为干净的风格。其中包括图标的所有元素都会被转换。
图片 image
balsamiq网站制作教程 第20篇
使用项目菜单中的 导入/导出 Mockup JSON 命令你可以快速的从一个项目中拷贝 mockups 至另一个项目。导出至 Mockups JSON(Project > Export > Mockup to JSON) 命令将拷贝选中的 mockup 的 Balsamiq Mockups 代码至剪贴板。要将这个 mockup 创建在一个新的项目中，就要切换至这个项目，并且在 Project > Import 菜单中选择 “Import Mockup JSON…” 并且粘贴复制好的代码。
balsamiq网站制作教程 第21篇
当你浏览 mockup 没有选中任何一个控件时，你将在 mockup 注释的下面看到一部分 Property Inspector 面板，名为 _Alternate Versions_。
图片
图片
图片
这将会创建一个当前 mockup 的拷贝作为 alternate 版本供你修改。但是默认的它将被自动命名为 _Alternate_ 加一些随机数和字母来确保名字是唯一的。
图片
alternate 版本的下拉列表中会提示你当前你所工作在 mockup 的哪一个版本。你可以创建任意个 alternates。
balsamiq网站制作教程 第22篇
如果你想在你导出的 PNG 图片或者 PDF 中显示或隐藏，只需要像上述那样选择标记可见并导出即可。
使用符号
最近已经上传完毕！
Balsamiq Mockups 支持符号的概念。一个符号是一组只有单一功能的控件。它通常用于部分用户的界面，并出现在多个屏幕上。有的其他软件称这个特性为模板，母版页，自定义组件或部件。
从本质上来说，符号让你创建可重用元素，你可以在不同的 Mockups 上使用这些元素。
balsamiq网站制作教程 第23篇
快捷键
进入全屏
CTRL + F或者F5
退出全屏
ESC
隐藏/显示工具箱
隐藏/显示设置面板
隐藏/显示链接提示
隐藏/显示大箭头光标
隐藏/显示标记
缩小以适应
隐藏/显示检察员面板
平铺画布
SPACEBAR
下一个模板
Page Down
前一个模板
Page Up
控件的使用
使用文本控件
最近已经上传完毕！