<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>阿斯猫的兵工厂 &#187; 软件推荐</title>
	<atom:link href="http://www.arscat.com/tag/%e8%bd%af%e4%bb%b6%e6%8e%a8%e8%8d%90/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.arscat.com</link>
	<description>Arsenal,  Arsene Wenger, Arshavin and Arscat.</description>
	<lastBuildDate>Mon, 06 Feb 2012 15:59:54 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.1.3</generator>
		<item>
		<title>好用的涂鸦风格原型设计工具</title>
		<link>http://www.arscat.com/2009/11/11/a-freaking-prototype-tool-from-balsamiq-studios/</link>
		<comments>http://www.arscat.com/2009/11/11/a-freaking-prototype-tool-from-balsamiq-studios/#comments</comments>
		<pubDate>Wed, 11 Nov 2009 07:02:17 +0000</pubDate>
		<dc:creator>木鱼猫</dc:creator>
				<category><![CDATA[设计体验]]></category>
		<category><![CDATA[Balsamiq Mockups]]></category>
		<category><![CDATA[mockups design]]></category>
		<category><![CDATA[prototype design]]></category>
		<category><![CDATA[ue]]></category>
		<category><![CDATA[原型设计]]></category>
		<category><![CDATA[软件推荐]]></category>

		<guid isPermaLink="false">http://www.arscat.com/?p=1050</guid>
		<description><![CDATA[今天发现了一个很好用的原型设计工具，叫做Balsamiq Mockups，来自Balsamiq Studios。和常用的Visio、Axure RP等软件相比最大的特点就是涂鸦风格，并且使用起来非常简单，完全不需要了解太多技术就可以做出一个可审阅的原型图，非常适合快速设计简单的原型，同时支持即时讨论标注。 Balsamiq Mockups的界面非常简单，大量的自带元素和图标，包括网页、桌面程序中常用的各种控件元素，甚至还包括iPhone的界面控件元素。 我用过Axure RP和Visio来设计原型图。毫无疑问，要设计一个可交互的原型使用Axure RP是最合适不过的，而设计桌面应用程序（例如windows平台软件）原型则使用自带了N多Windows标准控件的Visio。但如果你只是想在头脑风暴或讨论前快速准备一个可审阅原型的话我建议你使用Balsamiq Mockups，因为它用起来十分便捷。和Axure RP 下图就是我使用在线版的Balsamiq Mockups花了5分钟不到画出来的豆瓣电台的原型图，对了，我自己还加了一个新功能选项（有奖竞猜：哪个功能是我新加的？）。 还有个简单的iPhone界面： iPhone Balsamiq Mockups优点非常多： 易操作：从 Balsamiq Mockups 自带的元素里可以很方便地拖拽，效果图轻易形成；元素对齐很贴心； 可偷懒：根据 Balsamiq Mockups 提供的 Wiki 风格的代码规则，画图时可以「偷懒」，输入文本符号则能生成图标。因此相比其它繁琐的软件操作，Balsamiq Mockups 也能更快地完成画图任务。 控件足：Balsamiq Mockups 软件包括 50 多个控件， 70 多个图标。基本自带了所有常用的小控件，并在导航处进行分类；图标设计赏心悦目。要是 Balsamiq Mockups 允许用户导入自定义的控件就更好了，当然现有的也足够了 -:) 新风格：让人眼前一亮的涂鸦风格，很能还原手绘效果； 可中文：在菜单栏 View 里将 Use System Fonts 勾上，就能完美支持中文输入（注：非 Balsamiq Mockups 中文版）； 其它点：Balsamiq Mockups 使用 xml [...]<table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="5"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">无觅猜你喜欢：</font></b></td>
    </tr>
    
        <tr>
                <td width="96" valign="top" style="padding: 5px !important; margin: 0 !important;">
                    <a target="_blank" title="交互设计与程序设计" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.arscat.com%2F2008%2F04%2F14%2Finteraction-design-and-programming%2F&from=http%3A%2F%2Fwww.arscat.com%2F2009%2F11%2F11%2Fa-freaking-prototype-tool-from-balsamiq-studios%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 90px !important; height: 90px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="90px" height="90px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 96px !important; font: 12px/15px arial !important; height: 40px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">交互设计与程序设计</font>
                    </a>
                </td>
                <td width="96" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="[UE]User Research Training Material" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.arscat.com%2F2008%2F04%2F02%2Fhow-to-do-user-research-in-design-process%2F&from=http%3A%2F%2Fwww.arscat.com%2F2009%2F11%2F11%2Fa-freaking-prototype-tool-from-balsamiq-studios%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 90px !important; height: 90px !important;" src="http://static.wumii.com/site_images/2012/01/04/13407929.gif" width="90px" height="90px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 96px !important; font: 12px/15px arial !important; height: 40px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">[UE]User Research Training Material</font>
                    </a>
                </td>
                <td width="96" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="马化腾关于产品设计的演讲" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.arscat.com%2F2009%2F12%2F10%2Fa-presentation-about-ue-and-product-design-from-tencent%2F&from=http%3A%2F%2Fwww.arscat.com%2F2009%2F11%2F11%2Fa-freaking-prototype-tool-from-balsamiq-studios%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 90px !important; height: 90px !important;" src="http://static.wumii.com/site_images/2011/05/17/8760674.jpg" width="90px" height="90px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 96px !important; font: 12px/15px arial !important; height: 40px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">马化腾关于产品设计的演讲</font>
                    </a>
                </td>
                <td width="96" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="以用户为中心的设计原则(1)——来自MS Windows User Experience" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.arscat.com%2F2008%2F12%2F18%2Fuser-centered-design-principles-from-ms-windows-user-expeirence-1st%2F&from=http%3A%2F%2Fwww.arscat.com%2F2009%2F11%2F11%2Fa-freaking-prototype-tool-from-balsamiq-studios%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 90px !important; height: 90px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="90px" height="90px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 96px !important; font: 12px/15px arial !important; height: 40px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">以用户为中心的设计原则(1)——来自MS Windows User Experience</font>
                    </a>
                </td>
                <td width="96" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="以用户为中心的设计原则(3)——来自MS Windows UX" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.arscat.com%2F2008%2F12%2F22%2Fuser-centered-design-principles-from-ms-windows-user-expeirence-3rd%2F&from=http%3A%2F%2Fwww.arscat.com%2F2009%2F11%2F11%2Fa-freaking-prototype-tool-from-balsamiq-studios%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 90px !important; height: 90px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="90px" height="90px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 96px !important; font: 12px/15px arial !important; height: 40px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">以用户为中心的设计原则(3)——来自MS Windows UX</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="5" align="right">
            <a style="text-decoration: none !important;" href="http://www.wumii.com/widget/relatedItems.htm" target="_blank" title="无觅相关文章插件">
                <font size="-1" color="#bbbbbb" style="display: block !important; font-family: arial !important; padding: 5px 0 !important; font-size: 12px !important; color: #bbb !important;">无觅</font>
            </a>
        </td>
    </tr>
</table>]]></description>
			<content:encoded><![CDATA[<p>今天发现了一个很好用的原型设计工具，叫做<a href="http://ecvip.org/archives/786">Balsamiq Mockups</a>，来自<a href="http://www.balsamiq.com/" target="_blank">Balsamiq Studios</a>。和常用的Visio、<a href="http://www.axure.com/" target="_blank">Axure RP</a>等软件相比最大的特点就是涂鸦风格，并且使用起来非常简单，完全不需要了解太多技术就可以做出一个可审阅的原型图，非常适合快速设计简单的原型，同时支持即时讨论标注。</p>
<p>Balsamiq Mockups的界面非常简单，大量的自带元素和图标，包括网页、桌面程序中常用的各种控件元素，甚至还包括iPhone的界面控件元素。</p>
<p><img src="http://arscat.com/pika/readimg.php?src=http%3A%2F%2Flh6.gouride.com%2F_xolacdOPHS8%2FSvkVnFtI5QI%2FAAAAAAAABuw%2FwOcYzz7sJ4g%2Fs400%2FBalsamiq_Mockups.PNG" alt="Balsamiq  Mockups" /></p>
<p>我用过Axure RP和Visio来设计原型图。毫无疑问，要设计一个可交互的原型使用Axure RP是最合适不过的，而设计桌面应用程序（例如windows平台软件）原型则使用自带了N多Windows标准控件的Visio。但如果你只是想在头脑风暴或讨论前快速准备一个可审阅原型的话我建议你使用Balsamiq Mockups，因为它用起来十分便捷。和Axure RP</p>
<p><span id="more-1050"></span></p>
<p>下图就是我使用<a href="http://www.balsamiq.com/demos/mockups/Mockups.html" target="_blank">在线版的Balsamiq Mockups</a>花了5分钟不到画出来的<a href="http://www.douban.com/music/" target="_blank">豆瓣电台</a>的原型图，对了，我自己还加了一个新功能选项（有奖竞猜：哪个功能是我新加的？）。</p>
<p><img src="http://lh6.ggpht.com/_xolacdOPHS8/SvkVnYHT7SI/AAAAAAAABu0/XcsJbT1bhMc/s800/Douban Radio.png" alt="" /></p>
<p>还有个简单的iPhone界面：</p>
<p><a href="http://lh4.ggpht.com/_xolacdOPHS8/SvpfFkC7ObI/AAAAAAAABvE/NRnNeb4S6Mw/s800/iPhone.png" onclick="return hs.expand(this, {captionId:'caption_1257923086421'});" class="highslide-image"><img src="http://arscat.com/pika/readimg.php?src=http%3A%2F%2Flh4.gouride.com%2F_xolacdOPHS8%2FSvpfFkC7ObI%2FAAAAAAAABvE%2FNRnNeb4S6Mw%2Fs288%2FiPhone.png" alt="image" title="Click to enlarge" /></a>
<div class="highslide-caption" id="caption_1257923086421">iPhone</div>
<p>Balsamiq Mockups优点非常多：</p>
<blockquote>
<ul>
<li><strong>易操作</strong>：从 Balsamiq Mockups 自带的元素里可以很方便地拖拽，效果图轻易形成；元素对齐很贴心；</li>
<li><strong>可偷懒</strong>：根据 Balsamiq Mockups 提供的 Wiki 风格的代码规则，画图时可以「偷懒」，输入文本符号则能生成图标。因此相比其它繁琐的软件操作，Balsamiq Mockups 也能更快地完成画图任务。</li>
<li><strong>控件足</strong>：Balsamiq Mockups 软件包括 50 多个控件， 70 多个图标。基本自带了所有常用的小控件，并在导航处进行分类；图标设计赏心悦目。要是 Balsamiq Mockups 允许用户导入自定义的控件就更好了，当然现有的也足够了 -:)</li>
<li><strong>新风格</strong>：让人眼前一亮的涂鸦风格，很能还原手绘效果；</li>
<li><strong>可中文</strong>：在菜单栏 View 里将 Use System Fonts 勾上，就能完美支持中文输入（注：非 <strong>Balsamiq Mockups 中文版</strong>）；</li>
<li><strong>其它点</strong>：Balsamiq Mockups 使用 xml 记录，方便移植、二次利用；可导出为 png 格式图片。</li>
</ul>
<p>另外还有跨平台与多版本两个优点：</p>
<ul>
<li><strong>跨平台</strong>：Balsamiq Mockups 是基于Adobe Air平台的 ，因此在 Windows、Mac OS 及 Linux 下都可以使用；</li>
<li><strong>多版本</strong>：包括桌面版本，以及集成于 Confluence、JIRA、XWiki、FogBugz 中的版本；</li>
</ul>
</blockquote>
<p>这么好的软件可惜不是免费的，在线版仅提供简单试用，正式的桌面版要价$79，未注册版每隔几分钟就会跳出注册提示并且无法保存。</p>
<p>不过如果你是个人使用的话可以试着申请免费的License key，Balsamiq Studios公司提供了5 种免费获得 license key 的机会，其中之一就是像我这样的Blogger，只要写一篇介绍这个工具的文章并把文章地址提交给他们就能得到官方送出的一个免费License key。</p>
<p>官方网站：<a href="http://www.balsamiq.com/">http://www.balsamiq.com/</a></p>
<p>在线试用：<a href="http://www.balsamiq.com/demos/mockups/Mockups.html">http://www.balsamiq.com/demos/mockups/Mockups.html</a></p>
<p>下载：<a href="http://www.balsamiq.com/products/mockups/desktop#download">http://www.balsamiq.com/products/mockups/desktop#download</a></p>
<table class="wumii-related-items" cellspacing="0" cellpadding="3" border="0"  style="clear: both;">
    
    <tr>
        <td colspan="5"><b><font size="-1"  style="display: block !important; padding: 20px 0 5px !important;">无觅猜你喜欢：</font></b></td>
    </tr>
    
        <tr>
                <td width="96" valign="top" style="padding: 5px !important; margin: 0 !important;">
                    <a target="_blank" title="交互设计与程序设计" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.arscat.com%2F2008%2F04%2F14%2Finteraction-design-and-programming%2F&from=http%3A%2F%2Fwww.arscat.com%2F2009%2F11%2F11%2Fa-freaking-prototype-tool-from-balsamiq-studios%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 90px !important; height: 90px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="90px" height="90px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 96px !important; font: 12px/15px arial !important; height: 40px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">交互设计与程序设计</font>
                    </a>
                </td>
                <td width="96" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="[UE]User Research Training Material" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.arscat.com%2F2008%2F04%2F02%2Fhow-to-do-user-research-in-design-process%2F&from=http%3A%2F%2Fwww.arscat.com%2F2009%2F11%2F11%2Fa-freaking-prototype-tool-from-balsamiq-studios%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 90px !important; height: 90px !important;" src="http://static.wumii.com/site_images/2012/01/04/13407929.gif" width="90px" height="90px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 96px !important; font: 12px/15px arial !important; height: 40px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">[UE]User Research Training Material</font>
                    </a>
                </td>
                <td width="96" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="马化腾关于产品设计的演讲" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.arscat.com%2F2009%2F12%2F10%2Fa-presentation-about-ue-and-product-design-from-tencent%2F&from=http%3A%2F%2Fwww.arscat.com%2F2009%2F11%2F11%2Fa-freaking-prototype-tool-from-balsamiq-studios%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 90px !important; height: 90px !important;" src="http://static.wumii.com/site_images/2011/05/17/8760674.jpg" width="90px" height="90px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 96px !important; font: 12px/15px arial !important; height: 40px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">马化腾关于产品设计的演讲</font>
                    </a>
                </td>
                <td width="96" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="以用户为中心的设计原则(1)——来自MS Windows User Experience" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.arscat.com%2F2008%2F12%2F18%2Fuser-centered-design-principles-from-ms-windows-user-expeirence-1st%2F&from=http%3A%2F%2Fwww.arscat.com%2F2009%2F11%2F11%2Fa-freaking-prototype-tool-from-balsamiq-studios%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 90px !important; height: 90px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="90px" height="90px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 96px !important; font: 12px/15px arial !important; height: 40px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">以用户为中心的设计原则(1)——来自MS Windows User Experience</font>
                    </a>
                </td>
                <td width="96" valign="top" style="padding: 5px !important; margin: 0 !important; border-left: 1px solid #DDDDDD !important;">
                    <a target="_blank" title="以用户为中心的设计原则(3)——来自MS Windows UX" style="text-decoration: none !important; cursor: pointer !important;" href="http://app.wumii.com/ext/redirect.htm?url=http%3A%2F%2Fwww.arscat.com%2F2008%2F12%2F22%2Fuser-centered-design-principles-from-ms-windows-user-expeirence-3rd%2F&from=http%3A%2F%2Fwww.arscat.com%2F2009%2F11%2F11%2Fa-freaking-prototype-tool-from-balsamiq-studios%2F">
                        <img style="margin: 0 !important; padding: 2px !important; border: 1px solid #DDDDDD !important; width: 90px !important; height: 90px !important;" src="http://static.wumii.com/images/blogWidget/wordpress_default.gif" width="90px" height="90px" /><br />
                        <font size="-1" color="#333333" style="display: block !important; line-height: 15px !important; width: 96px !important; font: 12px/15px arial !important; height: 40px !important; margin: 3px 0 0 0 !important; padding: 0 !important; overflow: hidden !important;">以用户为中心的设计原则(3)——来自MS Windows UX</font>
                    </a>
                </td>
        </tr>
    
    <tr>
        <td colspan="5" align="right">
            <a style="text-decoration: none !important;" href="http://www.wumii.com/widget/relatedItems.htm" target="_blank" title="无觅相关文章插件">
                <font size="-1" color="#bbbbbb" style="display: block !important; font-family: arial !important; padding: 5px 0 !important; font-size: 12px !important; color: #bbb !important;">无觅</font>
            </a>
        </td>
    </tr>
</table>]]></content:encoded>
			<wfw:commentRss>http://www.arscat.com/2009/11/11/a-freaking-prototype-tool-from-balsamiq-studios/feed/</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</item>
	</channel>
</rss>

