浅谈设计师如何优雅的管理设计文件

小玄画画

小玄画画

2016-02-16 20:24

下面图老师小编要向大家介绍下浅谈设计师如何优雅的管理设计文件,看起来复杂实则是简单的,掌握好技巧就OK,喜欢就赶紧收藏起来吧!

始终相信作为一名设计师,所有经由我手产出的东西,都必须是被我精心设计过的不仅仅是最终的视觉稿或标注,而是在整个工作流程中,每一份文件都应该做好接收众人审视的准备。让自己的工作更有逻辑性,更高效,也让拿到你文件的同事或者客户一秒看懂你的文件结构找到他们需要的东西,易于修改和补充,并且露出哇看起来好专业的星星眼。

本文为作者授权优设发布,未经作者本人授权请勿转载,图老师正在联系作者转载,如果不允许转账请告知,会第一时间删除,感谢作者。

为新项目建立 6 个文件夹

如果是一个完整的新项目,我一定会一开始就设好这几个文件夹,不过对于一些日常迭代的需求,则会做适当删减。

docs:放置需求文档、多语言文案、产品数据、竞品分析、邮件归档

spec:交互文档

mockup:视觉源文件

output:截图、展示用的完整视觉稿、change log

measurement:视觉标注

assets:切图

JJ Ying 提到每个文件夹里都可以再有一个archive的子文件夹,用于存放旧版或不再需要的文件,这是个非常棒的建议。

再建立 4 种不同用途的源文件

1、标准文件名_for_me.sketch:(给自己的工作台)

这是创作过程中的文件,我会按照主流程的顺序,一个环节放在一个page;把自己需要用到的一切素材和灵感放在叫 Mood Board 的page里(个人觉得用工具不如全部拖进sketch里来的直观);那些实验性的创作半成品则放在一个叫 EX 的page里,总之,这是给我自己看的文件,就像有些混乱的工作台,把所有需要的东西都放在触手可及的位置。

浅谈设计师如何优雅的管理设计文件,PS教程,图老师教程网

2、标准文件名_measurement.sketch:(视觉标注)

这是为开发者准备的文件,我会从设计稿中提取通用的组件做统一标注,再针对单独页面,分别从纵向布局、横向布局和视觉样式的三个维度来说明一个页面。

浅谈设计师如何优雅的管理设计文件,PS教程,图老师教程网

3、标准文件名_mockup.sketch:(正式视觉稿)

这是为所有人准备的文件,当需要和同事合作或向团队展示进度时,我会从自己的sketch文件中把确定的界面整理到这里,每个页面按照版本号排列。

浅谈设计师如何优雅的管理设计文件,PS教程,图老师教程网

4、标准文件名_style_guide.sketch:(Style Guide)

设计完成后,制定 Style Guide,不仅说明规则,也列举出可以多次复用的组件,方便自己和团队高效的完成后续的迭代,同时保持设计的一致性。

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/pmsj/)

浅谈设计师如何优雅的管理设计文件,PS教程,图老师教程网

文件命名规则

说完文件夹结构,再来看看文件和文件内的命名规则 没办法,我强迫嘛。

文件名

交互文档:产品名_平台_产品版本号_ui_spec_文档版本号/文档修改日期.pdf/sketch

例:ae_android_4.0_ui_spec_20150101.pdf

视觉稿:产品名_平台_产品版本号_mockup_文档版本号/文档修改日期.pdf/sketch/jpg/png/psd.ai

例:ae_ios_4.0_mockup_v2.4.sketch

(如果不同平台的设计或不同版本的放在了一个源文件中则做适当删减就好)

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/pmsj/)

页面名 & 画板名

页面可以根据主流程或者版本号或者其他维度来区分。

画板则最好遵守文件一样的命名规则:流程/场景_操作/说明_状态,这样方便将画板随时导出,不必慌慌张张的批量改文件名。

浅谈设计师如何优雅的管理设计文件,PS教程,图老师教程网

图层名

把每一个屏幕的内容按照功能分区,一个个 group 起来,排排坐,吃果果。注意同一组件在不同平台里可能叫法不一样。比如 Web 端我们有 header、main content 和 footer,但是iOS 里的 navigation bar 是在天上的,Android 里却是指地上的那三个原生按钮。

熟记好不同平台的结构,不然跟工程师 buddy 手舞足蹈说了半天才发现在说不一样的东西。(当然也可以直接叫 top 和 bottom,这样就比 header 和 nav_bar 都要简短也不易混淆)

同时熟练地利用 sketch 里的 symbol 功能,要会聪明的偷懒。

浅谈设计师如何优雅的管理设计文件,PS教程,图老师教程网

DOs & DON’Ts

使用小写和下划线(或减号,只要和你的工程师保持同步就好),不要出现空格和特殊字符

使用简短的单词描述功能/属性而非样式,比如「btn_pressed」而非 「btn_blue」

用具体日期或者版本号做为后缀,不要随意写成「修改1」「修改2」「最新」「最新新」「最最新」

~设计工作流程是我非常着迷的东西,不仅仅要拿出有说服力的作品,整个创作过程也应该处处散发着 专业 的精神,如果你有任何想法都请随时与我探讨~

展开更多 50%)
分享

猜你喜欢

浅谈设计师如何优雅的管理设计文件

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
浅谈设计师如何优雅的管理设计文件

浅谈设计师应该如何拓展设计思维

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
浅谈设计师应该如何拓展设计思维

什么是极简主义 如何打造极简风格家居

家居设计 装修设计
什么是极简主义 如何打造极简风格家居

浅谈如何展示设计师的设计方案

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
浅谈如何展示设计师的设计方案

浅谈设计师如何找到合适的设计团队

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
浅谈设计师如何找到合适的设计团队

2017榻榻米书房设计装修效果图 榻榻米书房设计图片

榻榻米 书房 装修设计 书房设计 平面设计
2017榻榻米书房设计装修效果图 榻榻米书房设计图片

浅谈设计师如何提高自己的设计水平

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
浅谈设计师如何提高自己的设计水平

设计师的知识管理

设计
设计师的知识管理

2017春夏女装风衣外套流行趋势

服装设计 平面设计 设计 服装搭配
2017春夏女装风衣外套流行趋势

44个酷炫的黑暗主题网页设计欣赏

44个酷炫的黑暗主题网页设计欣赏

给你灵感的扁平化UI设计作品收集

给你灵感的扁平化UI设计作品收集
下拉加载更多内容 ↓