网页的线框图是很是直观、可是也没什么技术上难点的东西。只须要你大概描出页面上须要的一些元素,好比头部、导航、页脚等等,最多再就是一些交互、内容区域什么的。但这对于任何网络应用的开发都是很是重要的。固然有不少种方法能够作这件事情,最简单的就是拿起纸和笔,可是在这篇文章中,咱们要介绍的是一些很是高效好用的在线原型工具,而且他们彻底免费。html
使用Lumzy你能够为你的应用建立原型图,还能添加一些交互事件。有了它,你能够建立弹出框,交互的页面导航,添加外部连接等等。他对于团队协做设计和交流提供了一个很好的平台,并且他彻底免费。web
MockupBuilder最近才发布,很值得期待。他有很是多的功能:UI模型,交互的线框图,页面布局,客户端原型甚至站点地图和屏幕导航。网络
固然,对于与客户和团队成员交流也是很是强大的。而且,他所有免费。数据结构
Tiggr的思想是给你须要作成最终稿的全部资源。你能够设计不少的元素,而后分享,其余的协做用户会帮你制做相应HTML/CSS代码,以达到最快生成。花10秒钟注册,你就能享用这个免费的东东了。app
FrameBox并无多么特别的特点。你能够拖放、设置大小、复制粘贴这些UI组件,可是他的特点在于你能够很是轻松的经过它的拖拽很容易就完成你的原型制做。想要用这个轻量级的免费的工具,也须要注册一下。composer
simplediagrams是一个很是小巧的Adobe Air程序,经过他你能够很是轻松的实现本身的想法。拖拽组件,添加图片或者便签,导出PNG图都是他的特点,经过添加一些小功能就能实现一个很是不错的原型图。iphone
在iPhone Mockup里面你可使用铅笔模式,也可使用图表模式的编辑器。无论你选择什么,功能都是同样的,均可以很简单很方便的生成iPhone上的应用原型。你也能够分享给别人,就算你更改了设计,别人经过那个连接也同样能够看到。编辑器
fluidIA是一个在线的可是能够下载的富用户界面原型设计工具。它基于面向对象的理念,可让你快速完善。它设计的基本思想是团队中的任何成员,不管是设计师仍是工程师均可以自由的设计本身的原型。最近fluidIA的更新稍微慢了点,可是它还是一个很是优秀的线框图工具。工具
Pencil Project是一个原型界面设计的Firefox插件,经过它内置的模板,你能够建立可连接的文档,并输出成为HTML文件、PNG、OpenOffice文档、Word文档、PDF。还有什么可说的呢?这么优秀的插件,是每一个设计师和开发人员必备啊。布局
CogTool是一个强大原型生成工具,他与别的工具还有一些不一样,他能够对你的设计自动根据人类认知模型进行评估。你能够经过一些图标啊按钮啊图片,生成一个描述,而后点击评估的按钮,他就会对你的设计进行人类认知模型的评估,他会告诉你通常人须要多久才能理解你的意图。CogTools有不少用户引导的文档,还有不少教程,论坛上也能让你很快的成长起来。
Prototype Composer可让你在真正的代码编写以前就看到网站是如何运行的。之前的那些无数的文字入口,复杂的数据结构以及技术含量不低的UML图,这个工具可让你很方便的协做完成一个看起来能运行的程序。
社区版本是免费的,他可让你以用户定义的一个项目作一个样例程序。
DENIM是一个跨平台的桌面程序。他本身的介绍是为早期网站设计提供帮助的非正式工具。
他有不少理念来自于纸笔设计原型。你能够快速的画出草图,保证重要的功能优先。可是跟纸笔的草图不一样的是,他还能够有交互和动画。