创业公司设计师怎样从0到1设计一款APP(六)——整理和交接工作

系列文章第六篇,收到许多读者的反馈,大多数是正面的,一部分读者给楼主提意见,想让楼主再写细致一点。这也在楼主的计划之中,先是概述整个设计的过程,接着针对过程中遇到的每一个小点进行细致地扣,从整体到局部,从概述到细节,从表象到本质。

一方面是让读者有更多的收获,另一方面是整理自己的思维,逼着自己将事情做到极致,而不是差不多的程度。所以,小伙伴们耐心等待一下楼主的更文~

言归正传,今天说说APP的视觉规范整理完成之后,接下来,设计师的主要任务吧。视觉规范整理之后,咱们要针对现在完成度比较高的文件进行整理、图片资源的输出、和开发人员的项目对接。

文件整理

整理的目的一方面是为了让自己和团队查找文件更加方便;二是让自己的思维更有逻辑性,工作更加高效;三是楼主有属于设计师的强迫症(开个玩笑,可以忽略)~

文件的整理分为文件夹和最终Sketch文件的整理。

先说文件夹吧,一个项目建立起来时,楼主会根据项目进展的时间顺序,将文件夹分为以上几个大的分类。
01 Wireframe即low-fi文件的地址,
02 Visual Flow是Hi-fi地址,

01与02里面的分类又有相似的地方,可根据版本再进行一次分类,不需要迭代的可以单独使用一个文件夹,如下图。


03 UI Kits是图片资源输出的地址(比如说icon)
04 Documents并不是产品文档,而是APP里面需要的一些文档,比方说《服务条款》等;
05 App icon即APP的icon在各个平台上需要的尺寸图和它的源文件,尺寸常备1024x1024px,512x512px,167x167px,152x152px,120x120px,80x80px,58x58px(可以参考相关iOS规范);
06 Video Templates是有视频文件的情况下放置视频;
07 AppStoreScreenShot专门为screenshot进行准备的,因为安卓平台实在太多了;
08 Lauch Card因为在UI层面上需要耗费的时间比较多,一般在改版的时候放在比较靠后的需求,所以也可以单列出来。

整体文件夹的架构如下图

大家可以看到,规律就是每个大分类的阶段性的文件都放在该版本里面需要标注版本号,除了更新频率比较低的或者说不同版本需要共用一个文件夹的地方不会区分版本号,如03和05。

Sketch文件一般按照页面进行功能模块的分类进行整理,symbol是统一以上page所有控件的地方,如下图

图片资源的输出

图片资源的输出主要有几类,一是icon类,二是图片类。icon的大小一个APP里面尺寸是固定的几个大小,一般是以PNG的形式输出

因为在hi-fi作图的时候一般采用二倍的图,即750x1334px的大小进行icon的绘制,所以只要icon或者图片的尺寸数在设计的时候不是单数,那么放到像iPhone 7 Plus这样三倍的屏幕上也是没问题的。输出的时候开发一般2倍和3倍的图都需要。

另外一个就是图片要注意压缩。因为现在一个APP的安装包很容易就到了几十兆的体积。对于用户来说当然是希望安装包越小越好,一是节约下载时间(可能也有流量),二是解压后所占手机内存更小。所以作为设计师也要配合工程师进行这方面工作的优化。将图片进行压缩,楼主一般采用软件ImageOptim或者在线网战TinyPNG(适合图片透明区域比较多的情况)。

和开发的对接

在hi-fi文件定下来之后,需要跟开发童鞋集体过一遍。这个时候首先要召开一下集体的会议,参会人员包括PM、设计师、开发童鞋、TPM,Boss可能也会参加。

设计师不能松一口气,这个时候开发童鞋可能会提各方面的疑问和意见,当然产品到了这个阶段大方向是不会改变了,设计师可能在最后hi-fi的基础上补充一些细节内容。大会过后,产品就会进入开发阶段。这个时候设计师也不能完全松一口气,因为会有开发人员随时来问你一些Corner Case(也就是边缘情况)的考虑。

开发人员一边开发,QA(测试工程师)将完成后的代码进行测试,两者同时进行,设计师此时的精力除了要放在这个版本功能的完善之外(还包括实现效果的核对),可能要和PM(产品经理)进行下一个版本讨论的问题了。这样的工作一轮一轮不断地进行。

当然在对接的过程中也会有很多细节,比方说现在楼主接收到的挑战,将统一产品线的三个APP全部统一到一个Sketch文件标注出其中的相同点和不同点,方便开发和QA童鞋进行翻阅等等问题,针对这些细节,楼主再一点点更新。

总结,在Hi-fi和视觉规范整理完成后之后,设计师的任务还没有百分百完成,估计也只完成了60%,也千万不能松口气,知道等到APP真正产出的那一瞬间才是暂时阶段性完成一个任务的时期。设计师除了要负责好设计自己的方案之外,还需要跟踪设计方案落实到位的过程。当然那一时刻的成就感不亚于自己得了一个什么奖章,不信试试看!

Sophia的tips:
事情不分大小,每个阶段都有它自己的使命!

相关文章
《创业公司设计师怎样从0到1设计一款APP(五)——UI规范整理》
《创业公司设计师怎样从0到1设计一款APP(四)——Hi-fi输出(上篇)》
《创业公司设计师怎样从0到1设计一款APP(三)——Low-fi输出》
《创业公司设计师怎样从0到1设计一款APP(二)——立项》
《创业公司设计师怎样从0到1设计一款APP(一)——概述》

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,542评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,596评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,021评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,682评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,792评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,985评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,107评论 3 410
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,845评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,299评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,612评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,747评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,441评论 4 333
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,072评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,828评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,069评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,545评论 2 362
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,658评论 2 350

推荐阅读更多精彩内容