UI团队文件及版本管理规范

### UI团队文件及版本管理规范知识点详解 #### 一、概述 本文档旨在为创业团队提供一套关于UI设计文件及版本管理的规范指导。通过遵循这些规范，可以有效提升团队协作效率，确保设计成果的质量与一致性。该文档适用于UI设计师及相关工作人员。 #### 二、设计工具介绍 1. **Adobe Photoshop (PC & Mac)** - 适用于图像编辑、合成等工作。 - 是处理像素图形的主要工具。 2. **Adobe Illustrator (PC & Mac)** - 主要用于创建矢量图形。 - 适合制作标志、图标等需要放大不失真的设计元素。 3. **Sketch 3 (Mac)** - 一款专注于UI设计的专业软件。 - 提供了高效的界面设计工具，特别适合快速布局。 4. **PsPlay (iOS & Android)** - 实时预览PS设计内容的移动应用。 - 方便设计师即时查看设计效果。 5. **MarkMan (PC & Mac)** - 设计图标注工具，用于精确标注设计稿中的尺寸、颜色等信息。 6. **TortoiseSVN (PC) / Cornerstone (Mac)** - SVN版本控制系统客户端。 - 用于团队成员之间的文件同步和版本控制。 7. **Photoshop插件** - Rounded_Rectangle_Radius_Resizer - 调节矩形圆角半径，操作简单且稳定。 - CornerEditor - 支持多边形圆角半径调节，功能强大但可能存在稳定性问题。 - GuideGuide - 辅助线插件，支持数值设置、分栏等功能。 - Kuler - 配色方案插件，提供搜索、自定义等功能。 #### 三、素材与文档管理 1. **素材管理** - 包括UI示例、Icon参考、字体等。 - 应保持良好的分类和组织结构，便于查找和使用。 2. **文档资料** - 设计相关的书籍、文档等。 - 有助于设计师学习和参考。 3. **软件工具** - 设计相关的软件工具等。 - 维护最新版本的软件工具库。 #### 四、设计资源分类 1. **识别规范** - 公司VI（logo、名片）等设计内容。 2. **应用资源** - 应用内使用的附加资源，如角色形象等。 3. **UI设计** - 应用UI设计文件，按照项目名称加版本号进行整理。 4. **运营推广** - 线上或线下运营推广所需的活动图片设计。 5. **网页设计** - 公司网站或其他最终结果为网页的设计。 #### 五、UI设计文件整理规范 1. **主文件夹命名** - 格式：应用名称版本号&增量标记。 - 版本号表示法： - 2.1.1 - 首位变化新建完整版本； - 二位变化新建增量版本； - 第三位变化时仅新建修改版本文件。 2. **子文件夹一级命名** - 模块名称，例如：“首页”、“登录页”等。 3. **子文件夹二级命名** - [切图][Android] - [切图]切图PSD文件。 - [Android]Android平台适配版本。 4. **文件命名规范** - 切图PSD文件命名：控件类型_位置&功能描述v版本.后缀 - 示例：Btn_TabbarDiyBgv2.1.1.psd - 切图资源文件命名：控件类型_位置&功能描述&部件类型_状态.宽高.后缀 - 示例：Btn_TabbarDiyBg_normal.160x98.png 5. **常用状态词** - normal（正常）、pressed（按下）、selected（选中）、disabled（禁用）、visited（已访问）、hover（悬停）等。 6. **控件&部件** - 控件：较独立的可操作界面元素。 - 部件：描述属于某控件的一部分。 7. **补充描述** - 上中下排序：Top（顶部）、Middle（中间）、Bottom（底部）。 - 次数排序：First（第一）、Second（第二）…Last（最后）。 - 位置排布：Header（页头）、Footer（页脚）。 #### 六、总结 本文档提供了一套全面的UI设计文件及版本管理规范，覆盖了从设计工具的选择到设计资源的分类、命名等多个方面。通过遵循这些规范，不仅可以提高设计效率，还能确保设计的一致性和可维护性。对于初创团队而言，建立良好的文件管理系统是十分必要的，这有助于减少沟通成本，提高工作效率。希望本文档能帮助团队建立起高效的设计流程。