ui工作流程（如何快速告别职场小白）

ui工作流程（如何快速告别职场小白）当然，对于设计稿中的特殊设计样式，比如动画、交互，就需要手动标注说明，但总得说来，利用摹客标注交付后，前端call我的次数明显降低很多，页面还原度也提高了不少。而在与前端交付的过程中，标注、切图也能利用摹客很高效地完成。首先是标注，摹客的自动标注可以解放设计师的双手，它能够自动识别设计稿中的切图，当鼠标hover在某个元素上时，它会自动显示该模块的宽高、间距、颜色等属性，并且摁住Alt键，还能查看百分比标注。而在与前端的对接中，你给他们提供的设计标注和素材将在很大程度上影响你设计稿还原的情况。在我之前的工作中，标注往往是导致设计还原翻车的推手！因为即使标注做得足够详细，但还是很难实现面面俱到。前端总会找到你问：这里的间距为什么没标？这个icon宽高是多少？经过我这一年的不断试错，在这里给各位即将入行的萌新们推荐一个设计协作平台——摹客，它能高效地帮助你与产品经理、前端工程师展开协作。往往设

算算日子，成为一名UI设计师已经有一年多的时间了。最近身边好几位朋友都打算转行UI设计，在跟他们聊完我的转行经验后，我也打算用文字记录下我这一年的心得体会。一方面希望可以帮助到更多准备转行的朋友，另一方面也能mark一下自己踩过的坑，充分吸取经验吧。

尝试借助团队的力量

经过这一年多工作的 折磨 锻炼，我对这一点感触颇深：在一个团队中做设计，和自己闷头做设计是非常不同的，最大的区别点在于需要和团队中的其他人（包括但不限于产品经理、前端工程师）展开协作，共同推动项目前进。

比如，设计师在根据原型图出高保真设计稿时，很容易在设计的边界问题上翻车——需要细致的地方设计不足，而不需要花费精力的地方过度设计。这种时候，就需要保持和PM同学的沟通顺畅，避免做无用功。

而在与前端的对接中，你给他们提供的设计标注和素材将在很大程度上影响你设计稿还原的情况。在我之前的工作中，标注往往是导致设计还原翻车的推手！因为即使标注做得足够详细，但还是很难实现面面俱到。前端总会找到你问：这里的间距为什么没标？这个icon宽高是多少？

经过我这一年的不断试错，在这里给各位即将入行的萌新们推荐一个设计协作平台——摹客，它能高效地帮助你与产品经理、前端工程师展开协作。

往往设计初稿改动都比较大，在评审这一版设计稿时，在线评审一定是最高效的方式。你只需要将设计稿上传至摹客平台，产品经理可以先进行一轮在线评审，标记出需要修改的内容，你再根据评审建议快速改稿即可，效率会更高。

而在与前端交付的过程中，标注、切图也能利用摹客很高效地完成。首先是标注，摹客的自动标注可以解放设计师的双手，它能够自动识别设计稿中的切图，当鼠标hover在某个元素上时，它会自动显示该模块的宽高、间距、颜色等属性，并且摁住Alt键，还能查看百分比标注。

当然，对于设计稿中的特殊设计样式，比如动画、交互，就需要手动标注说明，但总得说来，利用摹客标注交付后，前端call我的次数明显降低很多，页面还原度也提高了不少。

另外，从切图这一part来说，在设计稿中对所有素材都做好标记切图后，上传至摹客平台，前端可以在这份设计稿中，根据自己的需求，自主下载不同平台（iOS/Android/Web）、不同倍率、不同格式（PNG/WebP/SVG/JPG）的切图，再也不用call我给他重新打包切图了。

合理利用工具，将整个设计工作与各个岗位打通，与产品经理、前端工程师高效地协作，提高工作效率，这是我工作一年来感触最深的地方！

设计的灵魂——色彩搭配

色彩搭配不夸张的说算是设计灵魂了，网上关于色彩搭配的教程很多，所以今天我想就单色配色跟大家分享。之前我看过一位大厂的设计师分享的单色配色实操方法论，秉承60/30/10法则，能设计出很有质感的高级配色。

这个60/30/10法则具体就是网站中60% 的应用由主色调组成，30%的是辅助色，剩下的10%是强调色。

利用单色限制你的调色板，避免因为颜色过多而带来设计难度和“颜色混乱”，通过60/30/10的方式，调整主色的亮度，从而能让整个设计稿显得更加干净和高级。单色配色对设计小白来说非常实用，大家可以多多练习，快速提高自己的审美能力！

积极锻炼自己的开发思维

一定要多和前端沟通交流，如果你能从他们身上学到前端的知识，这对你产出高质量设计稿是非常有帮助的。各位萌新千万不要被网上的段子所迷惑，说什么前端与UI设计的关系如同水火，天天吵架…

至少我所接触的前端都很nice，他们也很乐意教我一些前端的基础知识，比如，设计看起来很简单的一些版式，前端都需要用盒子模型重新搭建，实际上会大量使用外边距（margin）和内边距（padding）来还原设计稿中的距离关系。

对UI而言，多了解一些前端知识，可以让你在设计时更好地考虑页面实现的问题，也能与开发进行交流，避免出现被他们牵着鼻子走的现象

抽出空余时间打磨作品集

作品集是最直观展示设计师个人能力和审美的东西，它不仅可以作为设计师对自己创作和成长的总结，而且更是面试时招聘单位对你进行评判的重要依据。所以拥有一份优秀的作品集，对每一名设计师而言都至关重要，因为它不仅决定着你能有多少机会，还可能决定着工资的金额~

那么，反复打磨作品集这一定是常规操作。我通常每一个月都会对之前的作品进行优化，其中包括工作项目和自己随手画的素材。作品集我都上传在摹客平台，到时直接通过公开链接的形式分享出去，别人就能查看我完整的作品集了。

这是我在网上看到的一位设计大佬分享的经验方法，让作品集形式变得新颖一些，可以有效增加面试的机会~

持续输入，保持学习

无论你是做设计，还是其他岗位，持续地学习必不可少。毕竟在现在这么卷的就业环境中，你不努力前进，那迟早都将面临被淘汰~

我的输入方式分为两种，一是日常逛行业网站，二是临摹优秀作品。我每天都会花20分钟逛逛站酷、UI中国、追波、Behance等网站，虽然每天的时间不长，但坚持下来，量变总会影响质变嘛！

另外，周末我会花时间临摹一些优秀的界面、动效、小icon，主要还是为了提升设计和审美能力，在持续不断的练习中，我发现现在操作熟练度也提高了，哈哈哈！

好啦，以上就是我工作一年来的心得分享，我踩过不少坑，现在终于慢慢走上了正轨，希望这篇文章能对大家有帮助啦~如果有疑问的小伙伴，欢迎评论区提问，看到都会回复的，伙伴们加油！