一、目录结构规范
一个好的原型设计不仅仅是画出满足业务需求的原型页面,而是让浏览者清晰的明白这个项目的背景和业务逻辑以及整个产品结构,而这些基本都是通过目录来引导的

1.需求规格说明书&产品结构导图
目的:介绍整个项目背景及产品形态等,通常以《需求规格说明书》的形式展示。




一般用思维导图和架构图来展示说明,以上两个页面主要告诉阅读者项目背景,产品功能形态。
2. 项目开发流程&基本流程图
项目开发流程图主要介绍整个项目开发过程中各部门角色之间的协作流程,有的公司偏向于敏捷开发,有的公司走传统的需求,评审,设计&开发,测试,验收,上线的路线,相关流程都应该体现在流程图里,方便阅读者知晓。

产品设计过程中每一个涉及到业务逻辑和功能逻辑的流程都需要在基本流程图里提现,当遇到复杂的业务逻辑的时候,流程图往往比原型页面更加直观。

3. 原型封面&版本控制
原型封面主要介绍作简要的产品描述和归属标识,作为原型设计完整性的一部分,不是必要的。

版本控制主要作为产品更新迭代记录以及设计周期的一个时间标识。

4. 全局框架设计规范&全局控件设计规范&原型注释规范
不仅是专业的UI设计需要遵守设计规范,产品设计也需要定义一定的设计规范,方便自己设计产品随时复用,也方便其他人接手时能尽可能的在保持设计样式整体一致的前提下,快速上手。
二、产品设计规范
产品设计规范具体体现在:全局框架设计规范,全局控件设计规范,原型注释规范这三个方面。
1. 全局框架设计规范
关于后台系统框架:1)系统功能区 2)菜单区 3)数据/功能区

当然三个区域可以进行很多灵活的设计,无论选择哪种都需要保持所选框架下所有页面的整体一致性。




2. 全局控件设计规范
控件设计规范在系统设计之前很重要



品设计过程中可以参考一些优秀的UI框架,例如:品设计过程中可以参考一些优秀的UI框架,例如:Bootstrap,Flat UI ,jQuery UI 等。,Flat UI ,jQuery UI 等。
Axure很使用的功能:母版和控件样式

3. 全局注释规范
于Axure 的,并非借助于PRD文档。对于PC端的原型设计,我更倾向于用Axure 原生的注释功能来描述。分别为:业务逻辑,需求说明,功能逻辑,视觉(交互)逻辑,技术逻辑,备注等。

“我们的混乱,是逃避秩序前无力掌控的毁灭性混乱”

网友评论