建立大型网站的秘密:网站架构

SECL集团首席执行官Mykyta Semenov https://seclgroup.com。拥有超过15年的大型网络项目开发经验。我们的客户包括起亚汽车、达能、乐高、马自达汽车、托马斯库克集团等。

当我开始写关于网站架构的文章时,一个摩天大楼建设项目的想法出现在我的脑海中。我想到了一个巨大的摩天大楼,里面有餐厅、零售商店、办公室、健身房和住宅空间——一个独立、紧凑的大社区。来源:Bernt Rostad没有人会像这样开始建造摩天大楼的过程,直到一切都被适当的计划和绘制出来。

来源:史蒂夫Newfield我不是建筑建筑师,也不是建筑承包商,但我仍然能看出在进行施工之前需要制定的无数要求。

房间规划细节、优质建筑材料的采购、管理参与建筑施工的不同团队、分区许可、资金分配、地震时的自然灾害规划,等等等等。每个人都认为设计是事物的重要组成部分;无论是摩天大楼的设计还是你汽车的轮胎。设计不仅仅是给人们的生活带来便利、创新和舒适,在很多情况下,比如摩天大楼和你的汽车轮胎,人们的生活和安全都依赖于它。

我不是建筑师。我是一个IT人员。我是一个概念设计师更确切地说。

多年来,我一直在为非常大的、雄心勃勃的网站项目设计策略和进行研究。概念设计是一个健壮的网站架构的基础。就像建造摩天大楼一样,你需要有一个构建大型网站的良好蓝图。

在本文中,我将分享我们公司构建大型网站的过程。

网站架构师

让我们首先弄清楚谁在做这个叫做网站架构的事情。对我来说,这项工作是由一个网站架构师。我故意避免在这里提到UI/UX设计师和IA,因为网站架构超出了——或者更确切地说包括-网站的用户界面、用户体验和信息架构。

网站架构师需要对可用性有扎实的理解,对网站开发工具、在线营销技术有深入的了解,以及与网站建设和维护相关的一切。就像一个摩天大楼或住宅的建筑师,她必须精通工具,材料和施工过程,以便高效和有效地规划产品。这个人,我们的网站架构师,应该具有很强的逻辑思维,有分析头脑,对网站的商业方面很聪明,对细节很关注。

当然,对于保证质量的产品,架构师可以/应该咨询其他专家:设计人员、开发人员等。正如你所看到的,在我心目中理想的网站架构师应该是一个广泛的专家,因为,你很快就会在下面看到,这是无法逃避的。

网站架构过程概述

我将给你我的公司的网站架构过程的概览。

整个过程分为以下11个阶段:

  1. 项目介绍
  2. 网站的目标定义
  3. 明确目标受众
  4. 竞争对手分析
  5. 用户goal-problem-solution
  6. 场景的映射
  7. 思维导图
  8. 信息架构
  9. 原型设计
  10. 原型可用性测试
  11. 工程规范

正如您所看到的,所有这些阶段都是相互关联的,我们已经按顺序组织了它们。让我们讨论一下每个阶段。

第一阶段:项目概要

从客户和团队收集所需的数据通常需要2天时间。尽管你应该尽可能彻底,但也要记住,在网站架构过程的其他阶段,总是有细化和额外数据收集的空间,所以如果一些信息没有传递给你,不要太偏离轨道。

确定目标和预期结果

客户对这个项目的目标和预期结果是什么?她对项目的最终结果有什么设想?你应该清楚这些目标的评估标准和预期结果,以确保你们都在同一页。你必须尽可能具体;目标和结果应该是可量化和可衡量的。

与客户头脑风暴

让客户告诉你他在想什么。耐心地仔细听他说的话。做笔记。

关注他们在说什么,忍住插嘴的冲动。你的想法和评论可以稍后再说。如果客户对他的项目想法充满热情,他可以花几个小时谈论它,这是完全正常的。

当客户真正投入到项目中时,他会是一个很好的帮手,和他一起工作很愉快。

客户的想法总结

在头脑风暴会议结束时,你应该让客户总结所有的东西——如果他成功地把他的想法浓缩成一句话,那么这个想法就很清楚了。如果没有,你就需要更加清晰和专注。

确定目标受众

客户的目标受众是谁?谁将使用这个网站,他们将如何从这个网站获益?客户应该清楚谁是最终用户,这样我们才能为他们制作一个网站。

否则,这就像闭着眼睛玩飞镖:你知道目标在哪里,但几乎不可能击中它。你也可以开始讨论客户已经知道的目标人群信息:性别、年龄、位置等。

确定竞争对手

谁是网站的直接和间接竞争对手?客户和网站架构师应该意识到现有的竞争环境。总会有竞争者。

即使网站的想法是完全独特的,至少有间接的竞争对手。

满足决策者

会见那些做决定的人。讨论截止日期、预算限制、资源可用性等等。组织很重要,物质。

结果和交付

你的其他一些问题需要在网站架构过程中等待回答。你从项目简报阶段得到的将是基本数据,只是对客户已经了解的项目有一个大致的感觉。在这个早期阶段了解客户的需求和期望,并在起跑线上为项目选择正确的方向是至关重要的。

如果你没有在这个简单但关键的第一阶段投入足够的时间,那么你所付出的代价将随着网页架构过程和网站制作的进展而成倍增长。一个项目概要模板。来源:docstoc.com简报阶段的交付物是客户和决策者提供给您的包含详细信息的书面文件。

该文件应得到客户的批准和验证。可以是a的形式设计简单的

第二阶段:网站目标定义

一个网站需要目标。客户的目标可能是:使站点货币化,通过在线营销增加线下市场份额,更好地吸引在线客户,等等。目标决定了整个事业的方向网站制作过程

除了确定网站的目标,你还需要定义成功的标准据客户说。建立目标的一个好方法是使用聪明的标准。也就是说,每个目标应该是:

  • 具体的
  • 可衡量的
  • 可以实现的
  • 有关
  • 有时限的

例如:

  • 5年内通过广告、电子书等信息产品和付费订阅计划创收5万美元
  • 协助用户选择养什么宠物
  • 为用户提供关于宠物问题的建议
  • 打造宠物产品营销平台

结果和交付

因此,你会得到一个包含两个列表的文档:

  • 项目目标列表
  • 客户目标的列表

该文档需要客户/决策者的签字。

第三阶段:定义目标受众

这个阶段包括研究目标受众。我们需要确定将访问网站的用户类型,并定义每个组的需求。

收集特征数据

我们需要为每个组创建一个共同的角色。用户界面的设计很大程度上取决于这一阶段的结果。首先,我们需要定义用户的共同特征是什么。

定义socio-demographic特点:我们应该弄清目标受众的性别、年龄、教育程度和职业。

针对青少年(15-18岁)的网站与针对60岁以上人群的网站有所不同。

定义心理特点:我们要确定目标受众的生活方式、性格、气质、动机、价值体系、哲学等。就用户界面设计而言,这些信息甚至比社会人口特征更重要。

例如,如果我们的用户是早期采用者,那么用户界面和试生产的策略将与其他网站不同。

定义想要/需要的特征我们应该弄清楚为什么我们的用户想要注册我们的网站,他们希望通过我们的网站解决什么问题,等等。我们定义他们的痛点,并致力于通过我们的网站解决它。这些信息是至关重要的,尽管很难找到。

如果你正在做一个网站设计项目中,客户端可能已经拥有该信息(如果有的话)用户反馈工具在的地方。有时竞争对手也可以拥有它(但要想让他们与你分享它就得碰运气了)。在这种情况下,您需要执行用户研究并进行调查。

地理位置特点:国家、城市、地区、大陆——这些都是有用的信息。

在线并不能完全消除地理位置因素。有时区域定位是在创建全国性网站、政府网站或任何与地点相关的网站时首先要考虑的事情。此外,网站内容和网站文案很大程度上取决于观众的位置。

当你在信息架构(IA)阶段。

创建用户角色

当目标受众画像得到明确定义后,我们就可以进行创建了角色

角色的例子。来源:uxmag.comweb架构师的主要目标是确定所有可能的用户组,从最大的(核心)组开始,到最小的组结束。

然后我们为每个组创建一个角色。你开发的每个角色都应该有:

  • 名与姓(不要使用真人姓名,以免歪曲事实)
  • 照片
  • 年龄
  • 位置
  • 占领
  • 婚姻状况
  • 爱好
  • 技能
  • 他们需要解决的问题
  • 个人及专业经验

为了更好地了解你的目标用户,你可以采访潜在用户。这是关于市场调研的。

结果和交付

完成这个阶段后,你现在应该有两个东西:

  • 描述目标受众的一般特征的文件
  • 角色

第四阶段:竞争对手分析

为了确保项目的成功,你需要了解你的竞争对手,并对如何超越他们有好的想法。你应该发现他们的优点和缺点。有几种方法涉及到指挥竞争对手分析调查,包括市场参与者调查,以及互联网和纸媒研究。

如果你正在创建一个本地网站,不要只局限于你的国家。看看那些做类似事情的国际网站。最有可能的是,世界上有类似或类似的项目正在运行。

其中一些项目可能相当鼓舞人心。例如,我们一直在为俄罗斯的一个客户开发一个宠物爱好者的社交网站。我们在当地市场上没有找到直接的竞争对手。

然而,有一些外国网站和间接的本土竞争对手。它们是:

竞争对手 特征
www.dogster.com 国际流行,质量
www.dogster.ru 俄罗斯项目,颇受欢迎,质量令人满意
www.catster.com 国际流行,质量

你网站的竞争对手可以是直接竞争对手,也可以是间接竞争对手。

  • 直接竞争对手可以定义为为相同的用户基础和提供类似产品的任何网站。例如,微软Windows的直接竞争对手是苹果Mac OS。
  • 间接竞争对手是提供类似产品,但只部分满足目标受众需求的竞争对手。

SWOT分析

有不同的方法来识别和分析竞争对手。我喜欢SWOT分析最好的。SWOT——意思是年代实力,Weaknesses,O机会,THreats -帮助你指出竞争对手的强项和弱项,更重要的是,帮助你找到项目机会。

SWOT矩阵。

来源:wikipedia.org在分析竞争对手的同时,你可以发现有用的网站功能和想法,值得应用到你自己的网站上——通用的,通用的网站功能,如评论系统,网页表单等。在这些情况下,没有必要重复工作。你在竞争对手分析阶段所产生的所有好想法都将用于思维导图阶段(我们将在后面讨论)。

结果和交付

你现在应该有:

  • 直接和间接竞争对手的名单
  • 对每个竞争对手的SWOT分析
  • 研究总结(产生的想法,市场机会等)

阶段5:用户目标-问题-解决方案

从我们已经开发的角色开始,我们可以开始致力于目标-问题-解决方案。

用户目标

每个人都有短期和长期的目标。也可以有子目标。例如,一个人可能想要改善他的事业,但首先他需要找到一份工作。

子目标是找到一份工作,以达到改善他的职业生涯的目标。对于我们的网站项目,我们确定一个人的目标,问题,我们期待为他们提供解决方案。所有的目标都应该设计好。

模糊的目标不会有帮助,因为不可能在一个网站解决所有的问题。专注于主要的目标,保持目标列表的简短。一些客户认为,如果用户在线听音乐,他们的网站也应该提供这样的服务,即使他们的网站并不打算解决这个问题。

我们添加的功能越多,我们的核心目标就越容易被稀释。

用户的问题

当我们有了一系列具体的目标,我们就能确定具体的问题。例如,在我们的网站上,一个用户的目标可能是找到一个可以建造他的建筑项目的承包商。这个目标比看起来要复杂得多:我们如何为用户的特定建筑项目找到合适的承包商?

承包商的位置靠近建筑项目是否重要?我们如何让他们快速评估众多候选人?由于这些问题,你会很容易产生想法。

我们的解决方案

当我们确定了目标和问题后,就该通过网站架构设计来设计和开发解决方案了。这个过程给网站架构师带来了巨大的满足感,因为她在寻找解决用户的痛点。

结果和交付

因此,我们将为网站开发的每个角色设计一个目标-问题-解决矩阵。

阶段6:场景映射

场景映射是专门用于揭示可能的用户流的阶段。

用户体验的映射。来源:adaptivepath.com再一次,我们需要像终端用户一样思考,为他在我们网站上的行为创造可能的场景。

每个角色的每个目标都有自己的一套场景映射。这些场景有助于揭示我们现有想法和知识中的弱点。场景还可以帮助网站架构师后期开发良好的用户流。

结果和交付

我们应该为我们在前一阶段建立的关键站点目标制定出场景。下面是一个场景示例:用户目标:选择一只狗场景:

  1. 转到主页
  2. 去网站的“动物百科”部分
  3. 在“动物百科”部分,找到关于狗的品种的话题和讨论
  4. 阅读感兴趣的话题和讨论
  5. 转到阅读部分,它位于主题的最后,因为那里有更多的信息
  6. 选择3个喜欢的狗品种
  7. 返回"动物百科"顶层网页
  8. 阅读更多
  9. 找到出售这些品种的狗的人的链接
  10. 做出明智的最终决定
  11. 去宠物店买一只宠物

当我们写出这个场景时,我们最终添加了这些网站功能:

  • “Zoopedia”加红字标题者
  • ”还“小部件
  • 宠物商店和狗狗销售商在品种信息页面的链接

正如你所看到的,场景帮助我们找到改进的机会。

参见:

阶段7:思维导图

当我们有一堆想法时,当我们开始将它们形象化并相互联系起来时,它会变得很有帮助。的思维导图Stage致力于创建一个逻辑连接的想法的坚实系统,也帮助我们删去不必要的东西。这是一个流行的设计概念化工具。

要创建思维导图,我们应该使用Xmind

找到你的想法列表,并将它们按逻辑分类。例如,假设我们正在开发一个房地产网站。

房地产网站的部分可能是:

  • 财产目录
  • 社区论坛
  • 文章/新闻
  • 信息中心

把你所有的想法映射到这些类别中。如果一个想法适合多个类别,选择最适合它的。头脑风暴可以帮助你筛选出无用和不需要的功能、网页等。

网站的每个部分都应该合理规划。不要忘记与节相关的特性(例如,在我们的示例中,用户能够对每个属性进行评级)。用箭头标记此连接以记住依赖关系(在我们的示例中,它将转到Property Catalog)。

您可以设计自己的符号来表示不同的功能部分。例如,如果网站架构师不确定某个网站功能属于哪一部分,她可以用问号标记它。如果项目很大,这些符号就非常重要。

结果和交付

因此,我们有一个鸟瞰图的相互联系的网站功能和部分。

阶段8:信息体系结构

现在我们有了一个详细的网站思维导图,我们可以开始网站的信息结构,这将是网站原型的基础。

网站的IA可以在流程图软件的帮助下创建矢量绘图软件

结果和交付

在此阶段之后,您应该得到一个信息体系结构(IA)设计。

参见:

9:阶段原型/线框图

在这个阶段,您将需要原型软件。我建议Axure尽管还有许多其他类似的项目。

首页原型并不一定要先被原型化。例如,在在线商店或博客的情况下,产品页面或博客帖子页面应该放在首位,因为这些是关键页面,通常是站点上大多数用户的登陆页面。

网站架构师将依靠思维导图和信息架构图来开发这个原型。在创建每个网页原型时,你应该关注用户如何实现他/她的目标。在创建原型之前,您应该使用站点架构过程中的前面几个阶段来刷新您对目标用户的了解。

创建主导航菜单的原型

首先要创建的是主导航菜单。我们需要计算出菜单项的数量和下拉菜单的数量。

创建标题部分的原型

然后我们设计头部分通常包含以下内容:

  • 主导航菜单
  • 搜索表单
  • 联系信息
  • 网站的标志

原型上下文区域

现在我们开始设计上下文区域,这取决于你的原型网页。我们将制作内容块,其中一些对每个页面都是不变的,一些则不是。

创建网站页脚的原型

页脚在每个网页上通常保持相同。通常,页脚复制主菜单。它还包含辅助信息,如网站的隐私政策、社交网络链接、联系信息、版权信息等等。

客户反馈

第一个网页原型应该展示给决策者,应该向他们解释布局的原因。客户可能会修改并提出一些调整建议。没关系,因为在低保真度的原型上做这件事比在高保真度的原型上做要容易得多。

在第一个页面被批准之后,我们可以转向下一个原型。我们思维导图中的所有想法都应该在这些原型中找到。重要的是不要忘记最小的细节,因为如果你这样做了,从长远来看,它会变成地狱。

根据场景映射测试原型

我们的场景将帮助测试模型,以确保每个操作的逻辑顺序。这是这个阶段最耗时的部分,需要很多耐心和注意力。就大型网站而言,可能有超过100个独特的界面原型。

结果和交付

这个阶段之后的交付成果是所有网页类型的低保真原型/线框。例子:

上面的示例项目有90个这样的原型。如你所见,每个原型都被详细分解了。

这样,在设计功能原型和完成网页设计的过程中,就不会出现任何问题和不确定性。

阶段10:原型可用性测试

这是快速验证网站架构有效性并在事情进一步发展之前做出更改的最佳方法之一。Axure从原型生成HTML让他们互动并准备在用户身上进行测试。

这个阶段的可用性测试将帮助您注意到体系结构中的差距和缺陷。

为了测试目的,我们邀请了一些目标受众的代表,并观察他们如何到达站点内的某些页面和结果。然后,用户可以就网站的总体情况进行采访。在可用性测试之后,我们进行最后的修正。

结果和交付

结果是,我们验证并改进了我们的网页原型的用户友好性,我们对用户将如何与网站进行交互有了更好的了解。

第11阶段:项目规范

网站架构过程的最后一个阶段是创建工程规范文档。这应该包含网站架构过程的每个阶段的详细描述。项目规格说明是您所经历的所有阶段的结果。

它通常包含每个原型、用户流等的详细描述。规格应该是完整和明确的。要详细和彻底,但也要尽可能保持简洁和简洁。

项目说明书应包含网站所需的软件和网络技术的所有信息。设计要求应该明确。一旦项目规范被批准,网站开发就开始了。

相关内容

WebFX职业

加入我们的使命,为全球的企业提供业界领先的数字营销服务,同时建立您的个人知识和个人成长。

我们招聘! 视图30 +职位空缺!