您如何对软件 UI 进行原型设计?
你有什么经验?
你能和我分享一下吗?
提前致谢!
6 回答
我使用 Balsamiq http://www.balsamiq.com/
这很棒。
笔和纸或白板。更喜欢模型与最终产品的外观和感觉合理分离。在讨论交互以及完成一项工作需要多少次点击时,更改纸质模型非常快,而且很明显,这并不代表最终产品即将完成。
几年前,我参与了一个项目,我们制作了一个非常详细的 GUI 模型,甚至还有一些代码来模拟事件流。让软件的用户提供反馈和输入真是太棒了。这对于该项目来说绝对是一场噩梦,因为我们总是落后于用户期望我们达到的目标,毕竟他们已经看到它非常有效,对吧?
最糟糕的是,一些一次性代码最终被包含在发布的产品中,并且是后来维护的噩梦(最初没有太多考虑构建它,因为它是一次性的,然后用户已经看到了行为并且它成为系统主要部分逻辑的事实上的实现)。玉。
我使用 Visual Studio 创建 html 页面。这很容易是 Dreamweaver、FrontPage、NotePad++。对我来说,这有利于 CSS 和 html 在我完成模型时几乎完成。通常,在您计划用于创建可交付成果的工具或技术中制作原型会更容易、更高效。
您可以使用诸如 NetBeans IDE、QtCreator IDE 或 Xcode IDE 中的 GUI 编辑器来创建 GUI 模型,而无需为所有 GUI 事件实现处理程序。然后可以评估此 GUI,并可能重新设计。一旦 GUI 看起来应有的样子,就可以正确处理事件。
我使用了多种工具来制作 UI。如果我正在测试静态外观和感觉,那么我会使用纸和白板草图的组合。一旦您开始进行更详细的设计,这些操作很快就会被丢弃。就像“Hamish Smith”所说,你希望你的模型和最终产品之间有一定程度的分离。
当我想测试我的设计的交互性时,我以前使用过纸质模型,但我更喜欢使用 PowerPoint,它为用户提供了一种更好的方式与应用程序交互,而不是不断地让我向他们展示一个按钮的页面草图将带他们了解某些功能的工作原理。我只是进行了设置,因此单击 PowerPoint 幻灯片上的按钮或链接会将您带到与该按钮将您带到实际应用程序中的位置相对应的幻灯片。
目前我一直在玩 Microsoft 的 SketchFlow,它是 Expression Blend 的一部分,它令人印象深刻。虽然我没有经常使用它,所以我还不知道它可能带来的任何限制。此外,我尝试了 Balsamiq,它似乎也是一个不错的应用程序,但我再次使用它的次数还不够多,无法找到它的局限性。我想澄清一下,虽然我只是将它们用于交互性测试来代替 PowerPoint,但我仍然认为静态模型最好用纸和白板来完成。
我最近在一个项目中使用了http://www.guuui.com/issues/02_07.php的 visio 插件。该项目有大约 60 页,这使得绘制屏幕非常容易。