你是如何为大型网站制作原型的？

Question

我正在重写一个基于VB6的大型应用程序。我们正在使用ASP .Net从Windows Forms迁移到基于Web的部署。大约有50个核心用户，都是公司内部的。

我们需要一种有效的方法来尝试不同的设计，以便研究网站的信息架构，工作流程以及整体外观。理想情况下，原型看起来很好，可以向用户显示以收集反馈。

一些ajax风格的下拉菜单或控件可用于演示我们的想法，但不以牺牲快速原型为代价。

打破Visual Studio感觉为时尚早，我们需要的不仅仅是笔和纸或Visio ......有什么建议吗？

Answer 1

杰夫·阿特伍德（Jeff Atwood）有一篇不错的文章回忆起这件事：

http://www.codinghorror.com/blog/archives/001091.html

我们使用Visio作为最后一个项目，而Visio文档屏幕看起来几乎与最终结果相同，我建议不要做一个像素完美的原型。简单的矩形和简单的着色更好，使设计和Web开发人员更自由。

在我们的案例中，有些屏幕是由一个人在不了解网络应用程序限制的情况下开发的。根据团队成员的不同，这可能会导致无休止地讨论什么是可能的，什么不可能。

Answer 2

您是否看过优秀的Balsamiq？

Answer 3

我使用JustProto.com - 它非常简单但工作速度非常快。我很遗憾没有现成的组件可供使用，但您可以创建自己的主人。

无论如何 - 我用JP制作了一些原型，对我来说这很好。

Answer 4

在过去，我们使用了整页图形 - 来自我们设计团队的漂亮设计，或者只是Visio / PowerPoint（不要问）模型 - 作为背景放入HTML页面然后添加了ImageMap链接并删除了一些顶部的动态控件 - 下拉菜单，弹出菜单/手风琴菜单等将大多数菜单链接在一起。

这对我们的用户进行A / B可用性测试非常有效 - 有些人对这些漂亮的设计版本感到有些困惑，因为它们看起来更像是可用的网页，但他们很快就掌握了它。

Answer 5

对于大型系统，您确实需要具有主人/模板的东西。 SO上有两个很好的主题：

1. 有哪些工具： https://stackoverflow.com/questions/156937/balsamiq-mockups-alternative-for-building-wireframes

2. 为什么使用模型工具代替IDE： Whats the best way to create interactive application prototypes?

这是我所知道的最完整的模型工具列表： http://c2.com/cgi/wiki?GuiPrototypingTools

（我是这个人的作者：MockupScreens）。

Answer 6

您可以使用Balsamiq模型，这是一款非常好的软件，易于用于原型设计，模型可以提供您所需的动态和复杂性，而且价格不贵，并且具有评估版和在线限制版。

如果你想要一个更复杂的软件有组件和功能，你可以使用Axure是一个非常完整的原型设计软件，你可以在浏览器中导出和测试原型的所有功能，我邀请你去官方那里的页面你可以找到例子。

Balsamiq链接：http://balsamiq.com/products/mockups/

Axure link：http://www.axure.com/