XX科技产品原型设计规范v11(产品经理).docVIP

圣尊科技产品原型设计规范 v1.0 文档历史记录 日期 名称 版本 状态 签名 2017.11.07 圣尊科技产品原型设计规范 1.0 1 季莹莹 备注：状态表示为：1.新建 2.完成未审 3.完成已审 4.完成归档  文档修改记录 编号 版本 描述 （包括：日期，变更的图、表、段落号，标题或简单描述） 修改类型A，M，D 1 1.0 2017.11.07 新增内容XXX A 2 3 4 5 6 备注：修改类型表示为： A - 增加 M - 修改 D - 删除 目 录 圣尊科技产品原型设计规范 1 文档历史记录 2 文档修改记录 3 目 录 4 1. 引言 5 1-1. 目的及意义 5 1-2. 假定和约束 5 2. 全局规范 6 2-1. 原型设计原则 6 2-2. 主流设计工具 6 2-3. 原型大纲 6 3. 原型设计详细规范（针对产品经理和交互设计师） 8 3-1. 原型尺寸规范 8 3-1-1. iOS（iPhone） 8 3-1-2. Android（主流机型） 9 3-1-3. web 10 3-2. 原型界面 10 3-2-1. 界面命名问题 10 3-2-2. 界面大小及位置问题 11 3-2-3. 界面控件问题 13 3-3. 原型标注 13 3-3-1. 跳转问题 13 3-3-2. 按钮状态问题 13 3-3-3. 其他规则问题 14 Android（主流机型） web 屏幕常用分辨率：1280px*768px 主体设计内容宽度：1200px（常用宽度：1190px，1170px，1100px，1200px） 首屏高约：750px 其他设计建议 PS中新建文档宽要大于主体设计内容的宽度，目的为了表现设计意图，展示背景效果，左右宽度最少200px，主体内容要是想要适应所有用户必须低于1000px 原型界面 界面命名问题 原型界面的命名规则需要保持全局一致，同时对可能混淆的页面名称要加以区分。 以下图为例： 图中有两个“新增”，在沟通时不好辨别，建议以功能排序，按下图命名，沟通时可以直接说编号： 界面大小及位置问题 除特殊情况（如信息流长界面等）外，相同界面框架的大小和位置在同一原型文件中要保持一致，且尽可能展现实现效果。例如下图对比： 界面控件问题 尽可能的使用正确的控件，例如列表框使用“列表框控件”，主要目的也是避免信息传递出现偏差，保证目的的情况下可灵活。 原型标注 跳转问题 除默认跳转外，必须注明跳转方式、是否有loading、loading形式等，便于开发人员及UI设计后续工作。 按钮状态问题 特殊按钮状态必须在原型上注明，便于开发人员及UI设计后续工作。 常见案例有：注册登录界面，前端判断当前用户名或密码的输入状态，按钮“正常”、“突出显示”、“禁用”、“已选中”不同状态的不同条件与展示需求。 例如下图中某种情况： 其他规则问题 “排序”、“随机性”等数据逻辑必须注明详细规则，例如：排列顺序、随机库、随机概率等。 规范说明书 1 山东圣尊网络科技有限公司 4