(产品规范)互联网产品规划规范

互联网职业人第一终身定制服务平台XX产品规划制度与规范XX有限公司编号名称xx产品规划制度与规范版式编制：制定：XXX 批准：生效日期目录1.产品策划流程 (3)2.项目前期准备 (4)2.1市场调研 (4)2.2结点 (4)3.项目策划原则 (4)3.1盈利性原则 (4)3.2务实性原则 (4)3.3差异性原则 (5)3.4适度创新原则 (5)4.项目策划要点 (5)4.1明确网站项目需求 (5)4.2整理网站信息架构 (5)4.3制作原型界面 (5)4.4技术实施方案 (5)4.5清晰的项目需求文档 (5)4.6用户体验优化 (6)5.原型的要义 (6)5.1原型的意义 (6)5.2原型的使用 (6)6.axure原型制作规范 (7)6.1基本规范 (7)6.2构件规范 (7)6.3母版制作规范（参考） (7)6.4站点地图制作规范 (8)6.5Annotations注释规范（参考） (9)6.6整体制作要求 (9)7.axure操作小技巧 (10)7.1解决中文输入的问题 (10)7.2超快速移动工作区 (10)7.3快速放大缩小页面 (11)7.4规范化地平移组件 (11)7.5穿透控件选取下层的组件。

(11)8.结语 (11)1.产品策划流程公司下达任务部门主动发起市场调研需求文档大纲网站项目首页不通过内部评审通过详细需求文档网站整体框架不通过公司评审通过辅助制作和技术实施项目跟踪运营和销售培训产品管理2.项目前期准备2.1市场调研⑴网络调研从互联网了解熟悉项目市场情况是比较便捷的方法，一方面可通过行业市场专家的文章首先从宏观上把握项目发展趋势；另一方面观察研究同业竞争者进一步明确项目的性质以及策划过程中需要着重顾及的要点。

⑵市场访谈通过客户访谈、销售部门同事座谈会验证网络调研的结果，根本访谈映像去调整前一阶段的ID，使项目框架出具雏形。

有条件的可以组织焦点小组访谈和市场调查。

2.2结点这个阶段需要明确：⑴项目定位项目的用户对象是谁，项目的市场价值所在。

⑵项目前景项目的盈利模式，今后公司所能采取的运营模式。

⑶全局观念培育对整个项目的宏观认识，从整体上对整个项目的策划制作以及后期运营要点都了然于胸。

3.项目策划原则3.1盈利性原则需要有明确的盈利性途径，尤其在产品设计上需要首先将商业利益摆在第一位，项目上市之后需要以几何级倍数回报公司的人力物力投入。

3.2务实性原则策划阶段的每一个步骤都需要考虑今后运营的着手点，从公司运营的实际出发，避免一味追求天马行空式的想象。

3.3差异性原则新项目必须和目前市场上现存的竞品有明显的不同，客户从项目本身就能区分彼此。

3.4适度创新原则遵循互联网日新月异的市场需求动态，追逐互联网产品发展趋势，但具体落实到策划阶段则需要把握好创新的幅度，步子迈大了容易扯着蛋。

4.项目策划要点4.1明确网站项目需求包括客户需求和市场价值所在，勾画清晰的产品和服务。

4.2整理网站信息架构网站的频道设置、栏目设置，如果是定位于某一行业的，则需要第一时间整理出合理的分类目录。

4.3制作原型界面从频道——栏目——列表——内容单页——功能的思路出发，制作一目了然的原型界面，需要精确到每一个细节。

4.4技术实施方案各个栏目的数据调用、频道和栏目推荐位子的信息调用、主要功能模块的技术实现、辅助性功能涉及到的关键词和字段，都需要我们在策划的时候考虑到。

4.5清晰的项目需求文档这相当于整个项目的蓝图，需要凭借我们自身的积累写作深入浅出的需求文档，标准是让每一个阅读过文档的人都能对本项目有一个较为全面的认识。

4.6用户体验优化遵循品牌建设规则的网站项目的实名、域名，协助制作人员和技术人员进行操作体验上的优化，精致、细致是这一阶段的目标。

5.原型的要义5.1原型的意义原型是一个有价值的设计工具。

在项目开发的整个过程中，有利于评估设计的可行性。

在初步设计阶段，能够探究和测试用户。

在实际设计布局和更详细的交互问题，能够评估和测试。

之后的高保真模型，可以用来提供一个最终软件的演示。

原型可以有多种实现方法。

目前本司采用行业内流行的axure原型设计软件制作，采用该工具制作的原型特别适合web应用程序和屏幕序列的探讨。

其他诸如visio、mockups等软件虽也可实现原型制作，但非经公司上级要求不可用于替代axure。

5.2原型的使用5.2.1高保真原型高保真原型可用于向上级管理者或同事展示，因为它传递了最终产品的许多特点，比如视觉设计。

它们也适合于正式的可用性测试：①给予用户/同事书面任务完成所需数据②要求用户/同事边想边说出5.2.2工具①所见即所得的编辑器（或你选择的任何其他编辑——不过所见即所得更快）②一个或多个浏览器测试原型③图形工具④设计元素库（一旦设计元素库建立，有助于形成一致的外观和加快开发速度）⑤图形库或其他屏幕元素（有助于在其他事情重复利用屏幕元素（screen elements））5.2.3优势更好的交互，尤其是有益于评价屏幕变化很好展现软件的设计或者可能的设计测试和最终编码之间，还有时间来作出改进6.axure原型制作规范6.1基本规范6.1.1交互设计模式以规范化，交互UI库为基础，及主流交互设计范本（如QQ，SINA，163,等用户普遍熟知的界面及交互设计）——交互设计模式，为主要选择。

尽量减少独立编写及体验创新。

体验，交互，界面的创新依据产品特点而定，尽量减少用户的操作成本，尽量避免让用户去思考“这东西该怎么用”。

6.1.2交互表现某构建的静态截图-借以表现交互需求。

6.1.3设计规范包括，字号，图片大小，颜色，质感等需要统一化，一致性的要素。

6.2构件规范6.2.1布局构件负责界面布局的部分，通常为头部,左边栏, 右边栏,内容, 底部6.2.2交互表现依据“交互设计模式”制作静态截图-代表交互需求，附注演示连接。

6.2.3快速复用通过最少的更改实现，大小，多少，方向等变化。

通常为删减。

6.2.3交互命名如果构件能内部完成交互，在制作时就要加上交互的命名，减少后期的操作。

6.2.4遵循设计规范自行制作的构件必须大体遵循设计规范。

制作新的构件所使用的基本元素也要从设计规范中产生。

6.3母版制作规范（参考）公共区域（具体指页头、页脚、导航条、页面内的公共元素），要求采用母版，以减少修改量；位置固定的布局母版置为：Place in Background根据设计规范，制作本站通用master（如四连显图片，10连行文字）6.4站点地图制作规范页面要求规范单个页面的命名规范命名用可用中英文结合，力求表达准确。

频道及栏目综合页面统一以“user_页面名称”为顶层页，表示这是用户使用的页面。

使用admin为管理员的管理页；使用statistics为数据统计功能页子页面增：Create删：Delete改：Edit查：View汇总页：List修改分类：Recatalog 重命：Rename复杂业务要求单独提供用例及流程图，展示页面的业务逻辑和判断条件6.5Annotations注释规范（参考）注释的内容描述功能说明说明该对象的主要完成的功能交互效果说明该对象的交互动作以及产生的交互结果；此处应该包含各种判断的说明优先级也可以理解为重要性。

标明该控件在交互中的重要性关联关系包含触发方式（默认显示/ 被动触发），以及其他对象/数据的关联关系。

对于同时拥有管理后台、用户后台的地方，需要说明数据关系测试用例提供测试方法及测试应该使用的数据注意事项设计和制作时需要注意的其他事项备注可以针对各个特殊控件、组件自定义其他注释6.6整体制作要求6.6.1完整性要求任何一个完整的产品，包括3部分，这3部分在原型需要独立展示：⑴用户前端页面用户在不登陆、登陆情况下进行浏览的页面；用户自行管理数据/帐户的页面。

⑵管理员的管理页主要数据的增删改查、审核。

⑶数据统计功能主要包括流量统计（IP、PV、UV、登录用户数、活跃用户数）6.6.2保真度（仅针对前端页面）(参考)：1) 创新型产品、产品改版：为了体现新产品的业务逻辑，或展示产品的改进功能，本类原型要求高保真原型。

具体包含：a) 所有页面有完整的链接提示；b) 任何交互均需要考虑完整的流程和结束；c) 关键功能、创新点要上色，不得使用自带的灰白色、黑色；d) 按钮的点击变化能实时体现：文本框、输入框、文字、层的变化。

e) 使用条件判断，并根据条件做不同的提示。

f) 对于各个控件有完整的说明文档；2) 传统产品、新增功能：可以使用一般的线框图，使用黑白灰原型。

具体包括：a) 对于页面大部无改进，可以直接截取静态图；b) 对于无关或者传统功能，可以部分忽略跳转和交互效果；c) 提供关键的条件判断。

d) 不要求完整的说明文档；3) 具体保真度，还可以参考产品文档的使用人员的知识结构、工作经验、配合默契度等灵活掌握。

7.axure操作小技巧7.1解决中文输入的问题目前Axure对中文的一些输入法（如微软拼音、搜狗拼音、智能ABC等）支持得不好。

在组件里输入文本时，经常输了拼音却出不来相应的汉字。

很多交互设计师认为比较便捷的方法就是打开一个记事本，在记事本中输入内容，然后“Ctrl+C”、“Ctrl+V”到Axure中。

现在有个更便捷的办法，只要更换你的输入法皮肤（不是默认皮肤）就基本支持中文输入，有时还需要鼠标光标停留在文字区内才可输入中文。

7.2超快速移动工作区当设计的页面画面较大不能完全显示时，为了选取不同位置的对象，必须经常使用垂直与水平的滚动条，这会使得选取对象的动作变慢。

用“空格+鼠标拖动”就可以用来抓着画面任意移动，而且不会打乱任何对象的位置，轻松愉快。

互联网职业人第一终身定制服务平台7.3快速放大缩小页面Axure工具栏上有页面显示比例的选项，点击这里可在下拉菜单中选择相应的显示比例。

但在画图过程中，这些操作都极有可能打断我们的思考流。

所以，不妨用Ctrl+“+”、Ctrl+“-”，或“Ctrl+鼠标滚轮”来缩放页面，显示合适的比例。

7.4规范化地平移组件在制作原型过程中，经常需要保证移动组件的距离是固定值，用鼠标移动组建时，很难感觉到移动了几个单位距离。

可以采取以下方式来明确平移组建时的间距：“方向键”——每次移动1个像素；“Shift+方向键”或“Ctrl+方向键”——每次移动10个像素。

7.5穿透控件选取下层的组件。

当组件形状类似并重叠时，很难选取到下层的组件。

这时可用鼠标左键选中上层组建上停留1 秒钟以上，放开鼠标左键，再原地单击，即可穿透上层组件，选取到位于下层的组件。

8.结语工欲善其事必先利其器。

axure是一个工具，帮助我们更好地表达。

但是，没有必要为了做一个完美的axure文件（rp文件），而浪费大量的精力。