女朋友想学习UI设计, 咱作为全栈工程师给她来一套方法论吧~

首先, 我们作为程序员想要学习一个新东西是非常简单的, 尤其是我们熟悉的互联网领域, 我们通常接触的知识面是其他的互联网同僚们要很久才能接触到的, 是因为“信息差”这个有趣的东西; 那我的女朋友想0基础学习ui设计的话, 那我肯定到了最拿手的事情了, 作为一名老前端开发, 我和设计师的沟通(battle)是在日常工作中最多的, 所以这篇文章我会自己梳理学习ui设计的思路以及ui概念, 再到互联网企业中的ui设计到底需要会什么, 还有大家非常关心的薪资情况, 希望各位设计师读者多多指教哈~

认识一下这个职位是什么

很多人对ui,ux这些名词太陌生了, 所以通常都会造成一些误解,会认为ui/ux设计师就和装潢设计师一样需要下工地去做工程图, 就像外界对于程序员的看法都是“黑客”, “盗号”, “格子衫”一样. 所以无论是我们设计新手如何理解ui/ux概念还是如何向外行人解释这个职位, 我们都需要彻底了解职位本质, 我觉得这非常重要, 至少是比学习软件更重要.

UI

ui指的是(user interface), 程序员表示看到interface就不困了, 意思是用户+界面, 你可以简单理解为使用者(人)和界面(产品)之间用来沟通的, 其实在很早以前也有类似的知识(即广义上的ui), 只不过它们都不是电子产品/屏幕, 它们被称之为“人体工学”, 人体工学的核心理念就是使用者(人)和机器/环境的交互/沟通学科; 所以细细想想它们还是蛮相近的; 二战时期中战斗机的驾驶舱的操控设计, 通常都是把所有的按钮直接怼到你面前,有时因为飞行员的误操作造成了很多的空难意外, 人们也慢慢意识到用户和机器是需要更流畅更便利的交流, 所以才诞生了人体工学的学科概念, 那发展到现代, 我们往往接触的都是电子设备, 使用到的网站/app/系统应用也和人体工学一样需要有更好的交流, 这就是ui设计师的职责.

UX

ux指的是(user experience)用户经验/体验, 我个人会认为“体验”更贴切一点; 在大多数你能看到的企业的招聘需求中会把ui和ux放在一起讨论, ui&ux设计代表了设计师需要把流程和外观都要调整到最符合特定用户, 从前端工程师的角度出发, ux可以单纯的指动画/手势/字体/布局/跳转等等, 是需要研究特定人群才能得出的设计论, 而不是埋头苦干地做图. 在一些大型企业中, 你可能会看到专门招聘ux的岗位, 在这种岗位通常都会需要你具备: 研究用户心理, 分析产品易用性等等, 所以对于外观设计(ui)的要求不是那么高.

如何选择

如果你更偏向设计出nice的界面, 而不是专门研究用户心理, 分析产品等等, 你就可以选择ui这个方向了, 但是一个优秀的ui设计师是需要同时具备基础的ux能力的, 那么反之你不想去关心界面喜欢研究用户行为而且不愁就业问题, 那么你可以专心研究ux方向;

互联网团队的基础结构构成

如果你是一个还没入互联网圈子的朋友, 那么你大概率还不了解设计师在团队主要担任什么角色, 那么这个部分我就简要地概括一下团队构成, 让你有一个大概的认识吧. 首先一个互联网产品, 我们就以一个app来举例, 是需要分为需求方和产出方的, 需求方(甲方)一般是我们的老板和上级, 他们会规定app的大需求方向以及业务场景;

比如沈老板说: “我们下一个季度要开发一个应用, 名字就叫[小绿书], 照着小红书抄就可以了”

这个时候团队中会有一个产品经理(PM), 来整理老板的需求和方向, 并且产出文字性/图形化的东西, 用来给设计和开发表达需求; 产品经理这一步非常关键, 他所产出的东西必须要和老板的需求足够贴合, 并且得到老板的认可, 因为如果不这样, 开发和设计都会按照产品经理的错误产出进行研发, 会导致团队项目停滞崩溃;

产品经理小刘说: “老板, 收到, 我的需求已经和你确认过了, 那我就去和设计和开发同学开会了”

我们的设计师角色会根据产品的产出, 设计app的ui界面, 并且关联每个页面(比如a页面要跳转到b页面), 当然设计师并不是直接上手设计的, 通常他们都会调研背景, 适用人群以及竞品的方案, 会设计多个版本的ui和产品/老板进行交流协调, 最终拍板决定之后, 这个设计稿才会到我们的开发同学这里了.

设计师小蕾说: “昊哥, 我在figma (一个ui设计协作工具) 已经把ui确定了, 你们现在可以开发了”

这个时候前端同学昊哥拿到设计师提供的ui设计稿之后, 就吭哧吭哧进行开发啦, 这个时候会有一个角色叫做后端, 那么前端和后端是开发环节中最核心的部分, 前端负责把设计稿还原成代码而且负责和后端进行交互, 让app能够被使用 (被使用的意思就是可以登陆, 点赞, 评论), 那么登陆, 点赞, 评论的服务实现代码就是由后端同学完成的.

我们文章标题所说的“全栈工程师”广义上指的就是同时掌握多种技术的开发工程师 (技能不限于前端后端), 开发同学写完代码之后, 会由测试工程师进行质检, 在质检期间会发生很多很多“bug”, 所以测试工程师往往要和前后端进行协调改进产品, 最后一个被检验合格的app小绿书就正式上线了!

我们来梳理一下, 一个最基础的互联网团队的闭环:

老板(甲方) -> 产品经理 -> 设计师 -> 前端同学 -> 后端同学 -> 测试同学

学习什么设计工具

在这个部分, 仅仅代表我个人的看法, 学什么工具并没有什么鄙视链, 你需要结合你想工作的城市用人需求以及你的电脑系统. 我们简单梳理一下几款流行的设计软件:

ps (懂得都懂, 如果你是windows用户, 那么ps将会成为你的设计必修课)
sketch (音译: 死开吃) (如果你是mac用户, sketch就是你的必修课)
figma (音译: 飞格马) (它是一个独立的设计工具, 也是目前世界最新潮的设计平台, 被国内外很多大厂投入使用, 最重要的是它不会在意你的电脑是windows/macos)
mastergo (音译: 马死特儿狗) (它是一个类似figma的国产工具, 也是今年刚刚上线不久的, 在国外技术垄断的情况下, 如果你喜欢figma但是因为种种原因不能使用, 那么它也是一个非常好的选择)
ae (选修且难度颇高)
c4d (选修且难度颇高)

个人建议: 无脑选择figma, 因为figma和sketch很像, 你可以做到学一个通二个, ps你可以作为选修

要使用什么电脑

在知乎和各大论坛上, 程序员群体常常会因为是使用macos还是windows电脑而有很多讨论, 那么设计师群体我是真的没见到过.
请无脑选择macos (优先m1芯片-macbook pro), 不要选择屏幕大的mac笔记本, 因为公司肯定有外接显示器/公司土豪会给你准备一个imac, 那玩意屏幕大
如果你学习figma, 在学习期间, 你没有必要买一个mac电脑, 但是为了以后你的职业发展, 你以后的主力设计机器一定要是mac (让公司花钱, 自己花那钱干嘛)

想学设计的女同学千万不要误解了, 这个是mac苹果电脑, 可不是口红品牌啊

如何自学

如果你看我这篇文章之前, 有想过自己报班学习, 那么请你看完以后不要有这样的想法了; 报个班2/3w, 都够你买3个mac笔记本了, 你就把你手机上的游戏抖音卸载了, 好好自学个一年半载, 懂了吧, 这个板块就给你讲如何自学的, 我自身是程序员, 但是道理都是一样的, 我不指望和我一样6点起床学一天, 你就每天花2,3小时每天学一下, 完全就够了.

习惯

你需要保持几个好习惯, 在最初学习设计时, 我们首先要定期浏览设计咨询和文章, 来源的地方有很多, 除了我们熟知的知乎, 站酷, 优设, bilibili, (别以为我会提花瓣和千图, 这几个平台少看)等国内平台, 我们仍然需要关注几个国内外的平台 (有的打开会很慢, 有条件的同学可以翻墙上外网, 外网很有必要, 可以获得第一手资料):

https://dribbble.com/ 看完灵感爆棚
https://www.pinterest.com/ 配图绝了
https://www.behance.net/ 超级有设计感的图集网站
https://www.feeeedin.com 国内的设计资讯聚合, 一站式预览
http://www.webdesignfile.com/ 一些优秀的网站设计
https://muuuuu.org/ 同上
https://siiimple.com/ 同上
https://ui8.net/ 同上
https://miro.com/signup/ 同上

设计同学要和前端同学打交道, 所以我们也有必要了解一下开发同学的组件库, 即阿里, 腾讯等大厂的设计规范(主要面向程序员), ui同学过个眼熟就行

https://ant.design/components/button-cn/ 阿里的antdesign组件库
https://youzan.github.io/vant/#/zh-CN/button 有赞的vant组件库, 移动端顶呱呱
https://semi.design/zh-CN 抖音的semi组件库, 够新够酷

作为前端, 我筛选了3个你需要了解的组件库, 那么同样的, 你还需要了解一些图标组件/规范, 这一类的设计规范有很多, 我就列举一个国内最好的:

https://www.iconfont.cn/

同样的, 还有字体规范, 我们在设计中需要很多特殊的字体, 就可以到这里去下载, 也是国内最好用的字体平台:

https://www.hellofont.cn/

我们提供了这么多的链接, 就是想要教会你如何去获取资源, 在有外网的条件下, 你完全可以去更牛逼的平台获得最新的潮流资讯, 拿到第一手信息, 获得信息差, 提高行业竞争力. 我们只需要每天花半个小时, 把这些平台逛一逛, 文章读一读, 如果你有多余的精力, 完全可以把新东西用在你的作品中, 并且进行总结在社区发表文章, 这可以提高你的社区影响力 (和程序员一样)

视频资源

ohhh, 这就很值得考究了, 通常我们学习ui设计, 我们要多半学习软件的操作, 这也是培训班会教你的东西, 他们不会培养你的审美感, 大多数都只会教给你软件的使用方法. 那么在看这部分内容之前, 我相信你已经心中有数, 要学哪个软件了, 我就以figma为例, 给大家简单推荐几个教程作为入门.

https://space.bilibili.com/15741969/channel/collectiondetail?sid=255058 b站搜像素范figma
https://space.bilibili.com/108104104 b站挺火的figma宝藏up主

除了软件的教学, 我也希望你能观看一些著名设计师的演讲/公开课, 那么这些资源你可以在极客时间/掘金/知乎/优设中找到, 尤其在优设中你可以看到很多大厂的设计师分享的各种习惯, 尽管我觉得没多大用对于新手, 但是也能让你多少学一点东西.

书籍推荐

和程序员一样, ui设计师同样需要阅读一些著作, 这些著作不会短时间的提高你的设计水平, 而是会陪伴你的职业生涯, 是你之后迈向更高层级的资本

ui设计黄金法则
大话设计师
腾讯传

如何高效率的自学

这个部分和ui设计没有关系, 我会推荐我在学习编程时, 把我觉得好用的工具链和习惯分享给你

notion (笔记软件, 超高颜值且免费, 如果你是外网环境请优先使用它作为笔记软件)
印象笔记/wolai/语雀/腾讯文档 (wolai是notion的国内替代品, 如果你没有外网就可以考虑使用wolai)
所有的视频资源请第一时间去youtube上查询, 因为youtube的视频质量往往会比较高
避免使用百度, 请使用谷歌, 并且关键字检索时, 尽量避免使用中文 (你需要学到最国际化的设计理念, 而不是二手的国内知识)
你需要一个严格的作息时间, 即每天几点到几点是学习时间, 这个时候谁也不能打扰你, 也不要做转移注意力的事情, 比如刷抖音/小红书
尽量早睡早起, 早上5 6点起床是大脑非常清醒的, 只要你睡的够早, 就可以把晚上低效率的时间挪到早上
你需要分类你的浏览器标签, 把你每天所看到的有趣的, 添加到不同领域中
你要善于产出, 不管是视频还是文章, 无论你的好坏, 你都可以发布到自己的博客/朋友圈/其他设计平台, 便于纠错, 营造成就感, 让别人给你查漏补缺
作为设计师新手不像程序员, 要做很多很多项目, 其实不然, 你要做的就是接触更多领域的设计规范, 你可以去参加比赛, 或者接外包快速提高自己的水平, 不一定非要一个完整的项目
尝试加入一些小圈子, 比如互联网程序员圈子, 设计师圈子, 乱七八糟的群多加一点, 这样你有各方面的问题, 都有渠道去解决, 同理你也可以把你的疑惑发布到社区中

关于卷

别听TM任何一个人看你学习, 就说你卷, 我特别不喜欢这个词, 你就学你自己的, 都是为了以后未来, 咋没人说考研人, 考公人卷, 都是一些老傻逼双标人了, 不要理他们. 更何况你是0基础学习ui设计, 你需要一个干净轻松的自学环境, 不要被周围的环境影响了, 如果你坚持不下去, 就可以去报班去学习ui设计; 我的很多朋友都是从编程培训班出来的, 我也或多或少听说过一些, 有些培训班的环境很差很差, 可能不仅不会帮助你建立氛围, 还会影响你的心智 (抱着娃来学ui设计你敢信, 销售小姐姐也在学, 所以竞争蛮大的).

就业情况

互联网行业的各个岗位都是处于半饱和状态, 而且今年的形势不容乐观, 在这个部分我会简单介绍西安的就业情况, 如果你想着重了解一线城市的薪资, 那就在这个西安的基础上加5k-8k, 可以供你参考. 设计行业不像程序员看中学历和学校, 相反会看中你的工作年限和技术能力, 所以我觉得对于学历不是那么好的同学是一个很大的好处, 除了大厂的ui设计师是有严格的学历要求(统招本科/硕士等), 在普遍的企业中基本没有这样的要求; 而且个人觉得大厂的员工并没有比其他非大厂的员工高人一等, 甚至大厂的某些部门做的业务是很差很差的, 所以希望刚刚入门学习设计的同学不要好高骛远, 也不要过度的追求大厂岗位, 提高自己的硬实力才是最重要的.

哪所城市

个人推荐几个还不错的城市(排名不分先后):

苏州
杭州
南京
成都
重庆
西安

薪资问题

以西安举例子, 也结合了一些设计师朋友给的建议, 给出了一个可参考的薪资范围, 在给定一个学历(大专-硕士)硬性条件之下, 有了下面这个表格:

在校实习生 (2-3k)
一年工作经验 (4-6k)
二年工作经验 (7-8k)
三年工作经验 (10-15k)

在西安的设计行业, 15k+是很难达到的, 除非你进大厂或者干到设计总监.
但是不可否认的是如果你能力特别突出, 是肯定可以突破这个薪资范围滴, 而且我们需要在工作期间尽可能的保持每天学习, 仅仅会一个技能是不够的, 你需要同时提高你的审美水平, 其他软件的技能, 以及硬实力和软实力.

招聘jd中的技能树

figma, ai, ps
有些公司会让你有可视化大屏的设计经验 (这玩意西安老火了)
设计思路良好, 基本功扎实
有些傻逼公司会让你掌握html,css,js(前端知识), 要小心让你去写代码, 慎重
3dmax加分项
c4d加分项
ae加分项

如何挑选好的实习岗位

如果你是在西安的一本二本普通大学, 请不要相信学校承诺的包就业, 2022年了就别信这一套了, 咱们就自己多学点提前找, 不要等着快毕业才开始学开始找, 那就完蛋了, 晓得吧. 你走学校的校招也是个人比较推荐的, 但是通常我会建议同学们在校招之前自己去外面公司面试, 因为有3个好处:

有更多的面试经验
有更好的工作机会
可以提前知道自己值多少价

那么如何挑选公司呢, 你就记住以下的公式就可以了:

大厂 > 自主创业公司 > 大外包公司 (西安中软等这一类的) -> 小外包公司

去大厂之前先要询问做什么产品, 什么部门, 一个大厂履历对你以后职业生涯很有帮助
自主创业公司指的就是自己独立的产品, 无论公司大小, 只要你认为是不错的产品, 就值得一去
大外包公司, 项目很多, 加班基本都很多, 通常一个做完就下一个继续做, 和电子厂没区别, 有些公司福利也不好
小外包公司, 通常不仅有大外包公司的所有毛病, 还比不上大外包的福利, 去个锤子?

作为一个新人, 只要不倒贴钱, 建议不要太在意薪资, 只要不是太夸张, 我毕业第一份工作就是1.2k(非实习), 干几个月就跳槽不就得了.

面试须知

在面试的时候, 你不仅需要提前做好表达和简历, 还要准备一份精美的作品集, 用于展示你的能力. 此时你就需要挑选你之前做的demo/项目/比赛作品, 关于作品集, 我这里就不推荐了, 因为我也没做过, 但是网上有很多范本, 集中在优设/站酷等网站, 它们会告诉你怎样设计作品集

请不要编造简历, 这是不诚信的行为, 尤其是编造年龄/工作经验, 要不然试用期3个月你就每天活在胆战心惊中
面试要自信, 你和面试官是平等的, 不要唯唯诺诺恳求
记得真诚的要面试反馈, 如果好的面试官, 会给你下一步的方向, 还是很不错的
不要透露自己的理想薪资(对面试官和hr), 砍价都砍过吧? hr就是这样砍价的, 所以你就不要说你的薪资需求, 简历写“薪资面议”
一般来说, 设计师的简历是要自己设计的, 如果你懒得设计就去超级简历, 不要写word了, 求求你们了, 写word的简历直接丢垃圾桶
问好五险一金, 是否大小周, 加班费, 节假日福利, 这些都问好, 作为参考价值, 是属于工资之外的附加条件

结束

暂时想这么多, 如果有想知道其他方面, 就给我评论发消息吧, 设计的文章我以后基本也不会出了, 干编程老本行吧~~~