规划Web应用程序

Question

我即将开始构建新的创业公司，所以我需要一些指导方针。

什么是规划网站的最佳方式？我不认为“首先设计，然后是数据库关系，然后开始开发”，但是“如何规划应用程序的工作方式”？

是否有一些经过验证的方法，比如使用某种工具或其他方法做网站“蓝图”的最佳方式？

我需要尽可能多的反馈，因为人们可以给我，这对我来说非常重要。

链接，经验，一切都欢迎=）

我想一些工具能够得出类似

页的过程 - 如果登录 - 做 - 如果没有登录 - 这样做2

Answer 1

写下来。在一张纸上。在相关部件之间画线。

冲洗并重复必要的操作。

我是认真的。工具，花哨图表，流程图对于管理来说都非常漂亮，但它们阻碍了真正了解你的应用程序的工作方式。如果它太复杂，你无法在一张纸上看到它们，做一个大的图片视图，然后做每个小节。

如果你可以得到一个巨大的白板或一块屠夫纸，它甚至更好。出于某种原因，拥有大量工作空间对于解决问题来说是非常棒的。

Answer 2

我曾经做过很多规格的单词......百页以上。我不再相信这一点，因为一旦你写下来，它可能会改变（你的想法，特征等）。相反，我建议你看看叫做SketchFlow的MS产品（它带有Blend）。这使您可以快速，无需编写任何代码将工作线框，网站地图和模拟对齐在一起。虽然您可以创建高保真度（它的功能和看起来非常接近真实的东西），但我建议您将注意力放在创建低保真模拟上。这些草图样式看起来像手绘UI元素。通过这种方式，您可以完全专注于您的产品的工作方式，而不用多说它的外观。如果模拟出的“完成”太多，你会挂上“蓝色大按钮”综合征，人们更关心按钮的外观，而不太关心它的功能。

我写了四篇关于线框，模拟ups等的文章，并提出了各种工具以及为什么选择SketchFlow。然后我开始在SketchFlow中构建一个模拟。

http://dotnetslackers.com/articles/aspnet/Building-a-StackOverflow-inspired-Knowledge-Exchange-Sitemap-and-wireframes-with-Expression-Blend-3-and-SketchFlow-part-1.aspx

http://dotnetslackers.com/articles/aspnet/Building-a-StackOverflow-inspired-Knowledge-Exchange-Sitemap-and-wireframes-with-Expression-Blend-3-and-SketchFlow-part-2.aspx

http://dotnetslackers.com/articles/aspnet/Building-a-StackOverflow-inspired-Knowledge-Exchange-Sitemap-and-wireframes-with-Expression-Blend-3-and-SketchFlow-part-3.aspx

http://dotnetslackers.com/articles/aspnet/Building-a-StackOverflow-inspired-Knowledge-Exchange-Sitemap-and-wireframes-with-Expression-Blend-3-and-SketchFlow-part-4.aspx

希望这可以帮助你！

Answer 3

首先开发您的数据模型。即使你不愿意使用UML，也要了解你的数据将如何表示。

想出一些用例来验证您的数据模型。它不一定是完美的，但它应该是99％，以避免将来的痛苦。

一旦你有一个数据模型和用例，你的界面需要（在你的情况下，你的网站）将变得更加清晰。当然，我从纯粹的后端角度来看待这一点。

一旦你有一个可行的界面，聘请一位好的UX专家为你完成细节（工作流程和实际界面）。

Answer 4

这是一个很大的问题。我最好的建议是先从你的用户身上思考，他们的目标是什么等等，然后画出一些人物角色。角色是描述将使用您的网站的典型人物。一旦你有你的角色，你可以开始计划你的网站。

http://en.wikipedia.org/wiki/Personas

一旦你有你的角色，你可以计算出用户的旅程 - 这些人基本上是流程图，详细说明用户将如何实现你想帮助他们的任务。

http://www.boxesandarrows.com/view/an_introduction_to_user_journeys

从用户出发，可以计算出你需要在一个网站地图的形式来创建页面。

http://en.wikipedia.org/wiki/Site_map

然后最后你可以算出来的页面为线框的内容。

http://en.wikipedia.org/wiki/Website_wireframe

有工具负载在那里：PC和的OmniGraffle（http://www.omnigroup.com/applications/OmniGraffle/）为Mac的Visio（http://office.microsoft.com/en-us/visio/FX100487861033.aspx）。这两种工具都可以在网上免费下载网页设计模板。还有一个很棒的在线工具叫做Balsamiq（http://www.balsamiq.com/products/mockups），它可以让你摆放页面而不必使用设计工具。首先，尽管笔和纸是您需要的唯一工具。

一旦这些细节进行排序，你可以开始考虑数据模型，图形设计等等等等，但是这整个过程是迭代的，你可能会说将永远不会结束:)

祝你好运！