如何包裝一份200万的项目设计稿?

分享到:更多 ()

接了一个200万的单,最后给甲方几张PNG?当然不行,学会包装设计稿是一个设计师最基础的技能,让甲方看懂你的设计,体验你的用心,才不会无休止地改改改,过稿率也能迅速提高。今天@庫倪Qoli 做了一份详尽的教程,从设计理念到色彩、细节、展示都有方法,学起来!

作为一个主要以接项目的设计师,包装一个项目是很重要的。

我们分几个内容来说明一下吧。

目录

  1. 为什么需要包装?
  2. 设计如何包装?
  3. 举个例子,以我最近的一个项目;
    1. 说明设计理念;
    2. 色彩运用;
    3. 细节说明;
    4. 界面展示。

为什么需要包装

在生活中,我们无时无刻不在面对包装。

例如,超市的洗发精、饮料;外卖食品;新的电子产品。

我们会因为这些包装而购买,也会因为这些包装而不想购买。

这是我看到包装就忍不住购买的洗发精。

面对设计元素,也同样道理。我们也需要包装我们的设计产品。你试想一下,你作为甲方,支付了 5 万元的一个项目,拿到只是一堆 PNG 格式的图片,这种心情,是什么样子无奈。

甲方收到的一堆 PNG

设计如何包装

设计如何包装,这是我们的问题。

在我习惯上,我习惯了为甲方提供一份包含 PDF 说明档案的档案包。

应该提供的档案包。

「档案包」的档案夹结构

  • 请先阅读
    • PDF 说明档案(由 Keynote 自动生成,以免甲方在 Windows 下无法打开);
    • Keynote 档案
  • 预览图形
    • 所有界面屏幕所组成的大型预览 PNG 档案;
  • 所有屏幕
    • 每一个界面的单独 PNG 输出。

PDF(Keynote)说明档案

这是「包装」中的重中之重,我会使用 Keynote 制作,加上合适的幻灯片切换动画以及部份构件的进入动画,说明一下设计理念、色彩运用、界面细节等之类的东西。

若面对面时候,则用我的 Macbook Air 来展示(Keynote 使用 1080P 分辨率),若邮件传送,则输出为 PDF,以保证一致的显示质量。

以例子来一起学习一下

XX(为防同学们误认为软文,此处皆替换为XX,见谅)是我最近的一个设计元素,我为他们提供了界面、交互以及少量产品上的专业支持。它是一个 Wechat 智能娱乐助手,能够推荐你附近好玩、好吃的地方。

XX,一个微信智能娱乐助手(我的例子项目)

主要设计理念

既然,XX是一个关于「娱乐」的项目。我第一个的想法就是,要多姿多彩、色彩丰富、不应该单调在一个颜色上。接着,对于整体来说,却又应该简洁明了,恬静舒适,以保持整体控制在色彩丰富但是又不会觉得隆重,凌乱的感觉。

恬静、舒适是XX的真实追求。

色彩运用

上文以及提及到了,我们应该「色彩丰富」。所以,我确定一个鲜艳的「Carnation」作为高亮色调,接着,其他饱和度相对低的,作为辅助色彩。

(一般来说,如果是单色调项目时候,应担搭配上灰度色调)

XX:色彩运用的方面

FMS:色彩运用的照片档案

界面细节

我们讨论完,主概念、色彩,是时候来说一下「界面细节」了。

界面细节,在包装中,更习惯使用一个一个的描述线来说明。这个看看例子就马上明白了。

XX:主界面细节说明

XX:设定界面细节说明

细节说明这个,你可以多做 4 ~ 5 个页面,来把一些你值得注意的地方,放大说明。或者这个 icon 你很用心去绘制,更要放大说明。千万不要把你的心思,埋没在一堆 PNG 之中。

界面展示

完成了理念、色彩、细节,我们做一个大 PNG 来一个 Happy END 就可以了。

不过由于 PPT 一般放不入长条的大型 PNG 组合界面显示,往往我会放一个好看的说明图,来告诉「甲方」应该打开哪个档案来浏览。

XX:主要界面组合显示

XX:长条形界面的单独组合

享受

或许花了 30 分钟,你把自己的 Keynote 制作出来了。不要心急给甲方发过去,先自己 Enjoy 一下,检查检查一下有没有错字、写得不够好的地方。自己给自己多播放几次,感受一下自己要演讲一样的样子。

感觉一切没问题,就给他们发过去把。

结语

其实,我一开始做外包时候,也和大家一样,就交一堆 PNG 给甲方,就这样完事了。但是,那个时候,往往甲方会不理解,不明白,老是要我修改这里,修改哪里。我就需要很用力地,解释为什么这些是这样做的,为什么那里不能修改。

经过一次看那些什么文章「你看看别人是怎么拿到 200 万的设计」,我突然感受所悟。

自此之后,我每次的设计工作,无论项目还是版本递进修改,都会产生一份说明的 Keynote 档案,并且输出一份 PDF。

同时也因为这样,甲方的过稿率就大大提高了。我要乱来修改的项目也减少了不少。因此,我认为,好的包装,是实力的证明。

原文地址:zhuanlan.zhihu
作者:@庫倪Qoli

最美UI|学ui设计联盟|一起努力学设计!

最美UI zuimeiui.com 学ui设计最值得关注的UI学习教程交流平台! 每天发布高质量的设计教程和分享设计经验,帮助喜欢UI设计的初学同学快速转型,我们给大家提供更多免费学习ui的机会,想成为设计师的你赶快加入吧! 给最美UI点个赞!有你的支持是我们前进的动力! 猛点这里 >>

最美ui微信公众号zuimeiui要养成关注干货好习惯哦!

[ 最美特色栏目推荐 ]
设计导航:全球顶尖设计网站推荐,设计师必备导航! → 猛戳这里
设计欣赏:收集海量精选APP截图,让你设计灵感小宇宙大爆发!! → 猛戳这里
设计师:三人行必有我师。在这里可以交到良师益友哦!还不赶紧加入? → 猛戳这里

【最美UI 原创文章 投稿邮箱:tougao@zuimeiui.com | 期待您的投稿!我们将一一答复!】

未经允许不得转载:最美ui » 如何包裝一份200万的项目设计稿?

0
分享到:更多 ()