UI设计师面试时，笔试题怎么做？

Sponsor

前言：UI设计师愈发越多，为了准确招聘到优秀的、符合条件的设计师，通常是有多轮面试，在第一轮面试通过后，第二轮HR很可能会发一下考试题给应聘者来做，这是最关键的一轮面试，那么UI设计师即使做笔试题呢？建议参考本文的分享，会有不少的收获。

在面试中，如果面试官最终跟你说类似「我们这个岗位有测试题应该做」或者「我们会留测试题给你」的话术，那么恭喜你，一面通过了。接下去就是HR或者面试官会把测试题打包成ZIP或者RAR或者PDF的格式发到你作品集上的邮箱，收到后邮件后，仔细阅读要求！仔细阅读要求！仔细阅读要求！！非常是标红的文字，有的设计师不看要求直接就去做，反而适得其反。那么测试题的邮件具体长什么样子呢，就是以下这个图：

为什么要做笔试题呢？

针对公司来说

考察面试者的真实能力，近些年陆陆续续作品集造假太多了，如果没有考试题，面试者进入公司做的东西和作品集相差甚远，那么公司付出的费用会是众多很多。这方面主要考量的是公司人力成本。

针对自身而言

在做笔试题的过程中，可以知道到相关业务，包括对产品的理解，架构，熟悉产品，走查产品的过程，还无法帮助团队未看到的难题，自己在做笔试题的过程中看到后，提案到面试题中，是不是只是一个能力的凸显呢。

之前也收到过测试题，也有老师让我看过测试题，同时也给面试者发过测试题。大多数高级设计师的测试题基本就是一张照片，JPG

的格式就发过去了，怎么说呢，个人不太建议如此做，太简单了。如果我是面试官，我期望看到的是你全局的一个构想及其对一个产品以及需求的理解，其实测试题只是一个需求，那么最好的方法就是以

PDF

的方式提交，如果会做动画（前提是动画效果极致入微，不乏味；即使你的动画相当硬或者仅仅会动，那么不建议去做，这样暴露了你的软肋），那么就是

PDF+MP4的方式提交。

设计工具

UI做测试题的话，现在中国大厂基本都在用Sketch+蓝湖，但是部分大厂早已开始用Figma了，我只是最近才接触Figma，已经感受到了它的超强，未来趋势差不多只是Figma没跑儿了，那么简要的说一下Figma的强大在哪儿：

1.Sketch缺点

之前用了两年

Sketch，毛病太多；第一，更新太经常，组内每位朋友使用的版本都不一样，如果互传源文件的话，版本低的是不是很吃亏，打不开！并且源文件过大的话，传输速率太慢，有之后由于网络问题中止，影响强度。第二，有之后太卡了，导致软件崩溃，你之前做的都白做了。第三，上传蓝湖后，新版的蓝湖

14天后，链接失效，是不是还得再次给？项目多了，找半天，效率又低了吧？

2.Figma优势

第一，快速；然而界面和

Xd用上去有点类似那样感觉，而且目前不会卡死。第二，同时多人在线编辑，这几乎是Figma

最大的优势了，没有什么设计硬件是同时多人在线编辑的，便于实时反馈信息，收集信息，加强团队沟通成本。第三，只应该一个工具，就能完成PM需求–

UX交互–UI设计–研发的过程，是不是很爽。

只是最终还是要讨好团队用哪个设计工具。

例如你要做一个某音乐类App的首页改版设计的测验题，切忌拿到题目马上开始撸图。首先要明确什么前提？

1.充分的进行思考

拿到笔试题，首先先看需求，我们做笔试题毕竟只是在做一个需求，然后大概浏览一下原型图结构，明确需求后，再开始做。这里应该指出一点是：如果看需求后有问题，一定要去和面试官主动沟通，不要不懂装懂，自以为是，结果提交出来的提醒题不尽人意，切忌不要害羞，要主动大胆的去说明自己的问题。

2.品牌色

切忌改人家的品牌色，是哪个色彩就用哪些颜色，如果没有给你提供色值，你就打开App用吸管吸就行。品牌色是表现一个App属性最终要的方式之一，不要轻易改动。

3.分析原型图

切忌做原型的美工，意思就是你把别人的原型图照搬过来，上个色就完事了，那就要ui干啥！你必须梳理当中的交互逻辑或者跳转逻辑，还有功能，原型图中用途点的放置是否也有最优方法，举个实例：

我们要对于原型图的设计，来设计可以缓解用户问题的UI设计，也就是所谓的最优解法：

4.不要轻易增删东西

不要提高和删除别人测试题里的东西，一个都不行！！即使真心有自己的创意点，建议你根据别人的出一版，随后将你的创意点再出一版，而且要表明为何如此做）

5.视觉第一还是落地第一

这个仔细审题就行，一般题目里会提到，比如有几个关键词会表现：如果发生类似“大胆发挥”、“不囿于于现有视觉方式”、“突破当前风格”这种，那么你就可以适度的去突破一下视觉层面的东西，这个的含义就是让你充分发挥自己的设计优势，在当前测试图页面上做个视觉突破。

测试题需要详细细化到哪些程度呢？

个人觉得主要要做下面几个个别，也可以理解成几个页面，顺序是这样来的：

第一步：找竞品

找市面上音乐类

AppTOP前三，然后把首页图片下来，分析它们的视觉特征和用途特性；要切记：目的是做竞品分析，不是让你去抄他们的设计，要分析他们那里做的好，哪里做的不好；然而找竞品的过程也有给自己一个熟知的过程，除了中国TOP三外，国外的也可以找回来进行分析，这是一个必要的过程，往文档内贴图的之后，也要切记一下排版，不要随随便便就放出来了，要明白，测试题不光看页面，任何地方都在表现着一名设计师的基本功。

第二步：做一些精致的东西

根据题目，绘制icon（分金刚区和导航区），为什么要单独拿出来说呢？这里要提的一点是：icon一定要好好画，而且要优雅，icon是表现UI设计师基本功的一个重要的点，切忌不要去下载，有之后你下载的或许统一！UI的考试题，肯定有icon的个别，是否出彩，是否能博人眼球，在此处会表现一下，比如我自己的排版：

第三步：开始做图

首先要搭大框架，从上方状态栏仍然到顶部导航栏，这里要做几个统一：

1.如果没有非常的要求，一般用iPhoneX尺寸来做，明确好状况栏、Navbar、内容区、底部导航栏的高度（上面导航3-5个按钮，要分布好对齐关系）

2.页面边距，一般都是16或者20。

3.统一图标字重行高间距（以2倍图为例，一般最小字号24，以4逐渐递增，那么就是24、28、32这样，最小注释差不多就是20的样子，特殊状况除外。间距通常是8的倍数递增，8、16、24以这种推）

4.统一卡片（卡片圆角、卡片间距）

5.统一标题与正文的图标与间距（标题通常是加醋，字号没有固定形状，看详细需求）

做图的过程中，我们尽量去考量那些地方可以考虑有一些时尚，比如今天流行的毛玻璃icon风格，就可以融入一些等等。

特别注意的是：我们在做完界面的之后，最好在包装的之后，写明界面里的一些点，你是怎样思考的，最好用浅显的文案描述清楚，有理有据，说明状况，可以让面试官一目了然。

第四步：找图

这步可以和第三步并行。俗话说三分在画，七分在表。那么界面可以说是三分在做，七分在图了，特别是戏剧类很多有专辑图的界面里，所以找一些高级感的图来提高品质感，这里经常涉及一个审美的问题。

或许又有人问我如何来提升审美？

虽然强化审美一方面是基本功到位的状况下，随着阅历的提醒而提高；即使不是科班出身，那么可以下载几个好的App、或者有好的设计杂志、或者用Eagle可以收藏众多精致的照片来提升自己的审美感。

以下我放几个自己做的App界面，图是不是可以撑起来整体气质呢？以下放一些我自己做的UI：

以上UI设计里的照片，是不是可以撑起来整个UI的质感呢？

第五步：细节决定成败

大家在工具里做完界面后，一定要在手机里预览一下，Sketch可以从AppleStore里下载Mirror，Figma可以在AppleStore里下载Figma，直接搜就行；Ps好像还有，最笨的方法就是导出2倍图在手机里查看最终效果，来走查一些UI细节问题那么必须走查的细节都有哪里呢？

1.字体字号字重（字号不要达到3种，字重不要达到2种，特殊状况除外）

2.间距是否统一。

3.卡片圆角是否统一。

4.金刚区icon或者导航icon视觉尺寸是否一致。

5.整体品牌色渗透是否足够。

6.是否有创意点（一个即可）

第六步，测试题包装

牛逼的界面做完了，那么并不是就完事了，需要进行包装一下（型号1920*1080px），显得完整、专业一些，证明你的心态也是很真诚而且也有对本次面试的一种仔细。那么怎样包装呢？控制在10页内就行，以下是包装过程：

1.封面（1页）

封面主要考量你的版式能力和视觉基础，个人觉得简单就好，不用做的非常复杂～

2.竞品分析（1-2页）

把你做检测题前提调研的过程，得出的剖析结论（必定是恰当的推断）放出来，简单一些，不用写很多冗余的文字。控制在2页就行。

3.规范类（1-2p）

放一些你做的别致图标，出彩的东西，比如金刚区按钮，功能类图标；但是再加一些辅助线，证明专业性。同时可以放一些色彩规范，字体规范，栅格规范等等。

4.主界面（要加分析，2-3p）

先放设计好的界面，这一页要加一些你的反思，也就是说在这个页面里，你为什么如此做，一些理论根据，可以加一些站在客户角度探讨的点。

如果测试题邮件里发了旧的页面，让你改版设计，那么这一页你可以左右布局，左边放旧页面，右边放新设计的页面，形成左右对比可以让面试官一眼能看起来差异，同时也要放一些文案说明，写一下那里设计的好，为什么这样做。

5.页面单独包装（1p）

可以下载一些精致度很大的样机，把你设计的页面包装一下，模拟真实画面下的使用场景。

6.尾页（1p）

也就是“谢谢”“期待您的联系”这类的话语，明确一点就是：最好从封面开始到后面页到结束，每页都要与首页的色彩有关联，有始有终，版式设计上要讲究。

第七步：导出-文件命名

我们在工具里做完后，需要整合成PDF形式，推荐AdobeAcrobat，里面自带压缩，最好保证在10M内，5M内极佳。文件命名为：测试题名字-姓名-日期。

AdobeAcrobat的压缩模式，下图：

第八步：发送邮件

以为第七步就完事了对吗？那大大错了！第七步也是很重要的，标题这块，一定要写，有的朋友不写标题；也有的不写正文；更离谱的写了标题正文，附件竟然忘了上传。那么准确应该是这种的：

-邮件标题：******测试题

-正文格式（参考）：

您好，笔试题在附件中，请查收下载～

期待加入***公司**设计部，谢谢～

*记得要上传附件！记得要上传附件！记得要上传附件！

第九步：微信/电话/邮件建立沟通

这才是最终一步！面试官真的是太忙了，一天筛几百份作品集不说，估计急招一天大约面试5个人，从早到晚，很忙很忙，这里我建议倘若加了微信，发完短信直接微信告知，如果没有，邮件里必然有电话号，那么我不建议打电话，发邮件告知即可，如果2天内没回复，可以打个电话问问情况。

关于笔试题基本就是那些情况，做到面面俱到，专业素养没问题，沟通能力到位，那么剩下的就看运气了，其实面试和考试题，有一个别真的是运气成份占了这些，所以你们不要认为一次的口试失败以及面试题失败就认为自己不行，如果自己真的素质达到要求了，却没有通过，那么就不是你自己的问题了，就是公司甚至部门或者面试官那里的难题。好的公司如此多，总有一个会成功的～

作者|Ericlee的脑洞

来源|RaDesign（id:rddstudio）

推荐：查看最受欢迎的301个设计网站→

交流：为设计新人提供的设计交流群，请加入UI设计交流群，分享心得、接单、求职、聊设计。