设计师妹纸，北漂两年半的转行经历（一）-从平面设计师到UI

末，想写一篇文章关于楼主这几年的北漂职场经历，只想给各位纠结于是否应该去北上广，是否应该转行设计师，怎么转行等等问题的伙伴们一些参考，因为这些楼主都经历过（因为后台问楼主的人实在太多，写出来统一回答大家）。当然，北漂所经历的找工作、职业技能提升、人脉重新积累、租房、被催婚等等问题，楼主都经历过或者说正在经历着。

起因

2014年夏天，当楼主在武汉想从一个平面设计师转行为UI设计师，提高自己的职场竞争力，跑遍整个武昌区，却发现没有一个靠谱合适，并且愿意接纳新人的地方。也许是当时楼主段位低，也许是武汉互联网氛围不够浓，不管怎样，楼主在某招聘网站投出的200多封简历都以帮助楼主认清武汉市场的结果而告终。

正好一位在北京读研的大学同学来到武汉，他给楼主提一个建议，不如去北京试试。这一建议，让楼主灵光一闪，不如去试试吧，还这么年轻，说不定开开眼界也是一件好事。当跟父母商议这件事之后，他们只说了句“那你就去呗”。后来楼主才知道，他们的用意是想让楼主去趟北京吃些苦之后，然后安心回武汉嫁人生子，没想到楼主这一去就呆在帝都短时间内不想回去了。

曲折而又幸运的工作经历——第一份工作由平面设计转向UI设计师

分析优劣势

去北京前两个月，楼主就开始想去了之后应该怎样转行？经过在武汉的一些面试，发现企业需要的是实实在在有工作经验的UI设计师。于是楼主开始分析自己的优势与劣势，扬长补短。楼主的优势是在武汉有着两年的平面设计经验，美术功底还是有的；二是楼主是工业设计专业毕业，这个专业转UI设计还是不难的，因为有着产品设计的思维。

关于劣势，就是，没有工作经验！于是楼主翻开各大招聘网站，仔细研究招聘要求，总结出几点要求：界面设计工作经验（移动端以及web端）、会画图标、良好的审美、注重用户体验、会合作（当时想到的就只有这些，当然找工作光有这些也是不够的，随着楼主经验的积累，再一点点更新）。

2.准备工作

经过分析之后，感觉前两者是楼主的硬伤，便在武汉最热的两个月，关在家每天开始临摹图标，和移动端界面，在网上搜索一些教程，自己学着设计网站，HTML、div+css语言，每天其实都处于一种很忙碌的状态，只为两个月后上战场。还有一件事，就是楼主也在网上接一些小的UI设计的私活，一是为了有实战经验，二是为了准备好去北京的盘缠和前几个月的花销。附上几张楼主当时临摹的图标，还是比较粗糙的。

3.去北京

八月底，夏天已经没有那么咄咄逼人了，楼主想现在北京也应该不热了，是时候去到处跑了。于是提前一个礼拜在招聘网站上投出简历，附上楼主这两年的平面设计的作品集和这两个月接到的几个项目的实战方案，临摹的几十个图标等等，分类清楚，然后一起打包发给各个公司。

当然楼主也会量力而行，就是简历投向的是UI设计和平面设计都需要做的岗位，公司正在发展中或者初创时期的，这样感觉概率比较大。工作地点也不挑，但偏向更市区一点的地点，太偏僻信息交流更新都没有城区集中，对个人成长发展不利。这些信息都可以在网上查找出来。就这样大概接到了几个面试通知，于是约定好下周去面试。

楼主选择了礼拜五去北京，卧铺直达（别问楼主为什么不选择高铁...），第二天上午到。大学同学来接我，送我到表姐家落脚，地点是亦庄（帝都的朋友们都知道是南六环）。选择礼拜五去，是楼主还有两天的时间去处理一些杂事，比如办理公交卡，熟悉附近的公交线路，调整简历，准备面试问题等等，时间不多，但足够了。

4.开始面试

礼拜一开始面试，现在已经记不清第一家具体是哪家公司了（因为当时面试太多）。只记得那天跑了两家，上午一家在健德门，下午一家在刘家窑。早上坐两个小时的地铁去面试，中午吃个三明治，然后奔向另一家。一天下来，在路上的时间花费五六个小时，下午五点回到亦庄。总结今天自己的问题出在哪，完善简历，继续UI基本功的练习，然后继续投简历。

接下来的四天基本上一天都会面试个2~3家，职位从UI运营设计师、游戏UI设计师、APP UI设计师、网页UI设计师等等一路了解面试下来，其中自己也了解了一些工作的内容倾向。因为楼主有个习惯，就是每次面试之前就会将面试的公司的网站都查一遍。如果官网信息做的特别清晰的，说明这家企业比较正规，楼主了解职位信息也越多，楼主准备也能越充分。

5.拿到offer

就这样，面试持续了半个月，接到了3~4个等通知的状态，最后收到两家的offer，楼主比较之后，选择了一家在五道口的创业型公司，设计师就楼主一人，负责公司所有的平面+UI，暂时就叫它L吧。其中表姐也给了我不少建议，主要是对北京整体情况的介绍，以及对某些公司的运营情况的分析。

面试结束之后，楼主统计了一下简历投递情况和面试公司的具体数。简历投递了有600多封，面试也有快30家。也许伙伴们会又开始喷楼主，这样的数量才面试上一个，可楼主能说的是，楼主当时水平恐怕真的只有这样吧，让伙伴们失望了。从一个武汉小康之家的富养大小姐，到帝都的草根女屌丝，楼主已经很拼了！比楼主吃过更多苦的人大有所在，现在想来也确实没什么。

但楼主清楚地记得当时拿到offer，开心地在回亦庄路上哭出来的场面，这第一步，楼主算是迈过去了。

面试心得：每个企业在招人这一块都花费了大量的精力的，企业也想找到自己所需要的人才！作为新人，首先能收到面试通知，已经需要感谢企业能给自己这样一个去让企业了解自己，以及自己了解行业的机会。接着，做好自己该做的事，给企业充分的尊重，多去想想对方需要什么样的人才，这些包括职业技能（能干活）、沟通能力（省心省事）、人品考察（靠谱，值得信任）。最后，双方没有达成合作意识，不需要否定自己，可能只是双方发展程度不一致，导致暂时匹配程度不高，双方需求不一致的原因。心态上，要冷静分析，然后面对情况，缺哪补哪。

6.总结

打仗就要有打仗的阵势，从粮草准备，到攻略，再到实施，根据反馈调整战略，这一步步都是自己成长的契机。

可以看到楼主并不是什么设计天才，所有做的这些都只是因生活所迫，让自己变得更好。这一点，也让后来的楼主在学习一颗怜悯之心。

今天先写到这里，接下里的一篇楼主将更新，在国内创业型公司L，楼主怎样从平面设计师到全能设计师的前半年经历，以及楼主第一次在帝都的搬家~踏出第一步就意味着胜利了一半，帝都后来对楼主的磨砺让楼主成长更多~周末愉快~

Sophia的tips：

试试看各种挑战，会发现自己比想象中更加优秀~

作者简介：Sophia的玲珑阁，一枚爱折腾，爱健身的交互设计妹纸。

职场设计技能，更多教程抢先看，请关注作者的微信公众号：Sophia的玲珑阁

管你是工人阶层还是服务行业，是否想过转行IT，转行IT后肯定会选择一门编程语言进行深入学习，很多转行的人基础都不是太好，不是科班出身，甚至有的是专科乃至中专，前端的HTML和CSS相对其他的编程语言来说比较简单，是相对哦，不是绝对的简单

为什么前端相对要简单呢

？首先前端是由HTML和CSS组成，当然还有JavaScript。HTML和CSS在写的过程中你可以立马看到效果，比如你写一个div，定义一个宽和高，

在给一个背景颜色是吧，打开浏览器立马就能看到是什么样的，我们都知道中国人大部分都很在乎眼前的利益，如果是今天有个事情，你去做了之后立马就能给你钱，他会马上去做，但是你说有个事情，你得坚持做一个月，才能给你钱，这个时候他就开始犹豫了，想做不想做的样子。

这个就是中国的人习惯。前端与这种类似，写一个属性，刷新下浏览器，图形变了，感觉很不可思议，勾起来好奇心会继续研究下去。但是像Java、Python等，刚开始学习都是基于控制台的，各种语法，学起来枯燥无味，没有耐心的人很难坚持下去，所以那些想转行的人如果自身文化水平不高的话，当然会选择一个相对来说简单的去学，前端就是一个很不错的选择，能起到立竿见影的效果。

前端虽然入门简单，门槛低，但是要想深入可不简单了，在前几年学习前端或许还可以，但是近几年前端发展非常快，各种框架层次不穷，从浏览器的脚本发展到了服务器端的脚本，用NodeJS就能写服务器，同时触角也深入到了移动端，比如用React Native就能写APP，小程序，H5的小游戏等等。

我自己是一名从事了多年开发的web前端老程序员，目前辞职在做自己的web前端私人定制课程，今年年初我花了一个月整理了一份最适合2019年学习的web前端学习干货，各种框架都有整理，送给每一位前端小伙伴，想要获取的可以关注我的头条号并在后台私信我：前端，即可免费获取。

在之前基本上每个写后端的人都要会点前端，不然是没有办法写的，前几年微服务还没有出现，更没有前后端分离的项目，项目都是传统的单体架构模式，看到这里很多可能就有疑惑了，什么是单体架构？你可以理解为所有的东西都是写在一个项目里边，而微服务架构呢就是把项目里边的模块按服务拆分，每个模块是单独的一个服务。

而现在前端能接触到的范围也是非常的广，所以选择学习前端是一个很不错的选择，深入学习后可以自己基于Node写一套网站，同样也能写后端，而且前端的发展是非常快的，纵观历史的长河，前端的兴起才短短的几年，就已经发展到了如今的地步。前端非常适合女生，在IT这个行业中，前端的女生能占行业的百分之四十左右，包括我之前待过的公司，前端的×××姐也有三个，是整个技术部门的宝了。

所以呢，想转行学习前端，第一个是因为他效果显著，就算你是刚开始写Hell World，简简单单的几个样式都让你感觉到不可思议，第二个就是入门门槛低，能激发你的学习兴趣，不管你是中专还是大专乃至本科，都是可以学的。而且前端现在工作岗位是非常多的，大家可以去所在的城市智联招聘上看看，就知道了.

天我们说下HTML标签中的div、span和图像标签。其实div和span是上一节就要讲的标签内容，但是当时时间比较晚了，就没有说。

<div>和<span>是没有语义的，就是一个盒子，用来装内容的。这和android开发中的font很像，也是一个个的盒子，将内部包起来。可以这么来写:

<div>这是头部</div> <span>我是内容</span> 两个都是双标签。

div是division的缩写，表示分割分区(竖着); span意为跨度、跨距(横着)。div单独占一行，实例如下: 理解为一个大盒子

看下HTML代码:

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<div>我是一个div标签，我自己独占一行</div>

</body>

</html>

可以看到，写了两个<div>标签，一个占一行

<span>一行可以放很多个标签，理解为小盒子，举例如下:

代码如下:

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<div>我是一个div标签，我自己独占一行</div>

<span>我是一个span标签</span>

</body>

</html>

效果如下:

接下来说一个很重要的标签---图像标签

HTML标签中，使用<img>标签用于定义HTML页面中的图像，是一个单标签。img是image的缩写，src是<img>标签的必须属性，用于指定图像文件的路径和文件名。属性，指的是属于这个图像标签的特性。对于图片，需要将图片和html文件放到一起。

代码图示：

代码如下:

<!DOCTYPE html>

<html>

<head>

</head>

<body>

</body>

</html>

效果如下:

如果我们再加入同样的一行代码，看看显示(加上换行)

代码如图:

代码内容如下:

<!DOCTYPE html>

<html>

<head>

</head>

<body>

</body>

</html>

效果如下:

可以看到<img src="xxx"> 后面不写 / 也是可以的，<br />后面不写斜杠也行，即使都是用单个的情况。src是source的缩写。

接下来说下图像标签的其他属性:

alt 替换文本，图像不能显示的文字

title 文本，提示文本，鼠标放到图像上，显示的文字，类似于 hover

width 像素，设置图像的宽度(和android中的差不多)

height 像素，设置图像的高度(和android中的差不多)

border 像素，设置图像的边框粗细

具体我们看下实例:

代码如下:

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<br />

alt替换文本，图像显示不出来的时候用文本代替<br />

</body>

</html>

看下展示效果:

发现 alt后替换文本并没有起作用，图像还是显示的。这是为什么呢？

其实原因很简单，就是先判断src后的图像是否存在，如果存在，就展示图像，如果不存在，就展示文本。上面语句中，图像的地址是正确的，所以会展示图像。可以将图像地址进行修改。我们再试下

代码如下:

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<br />

alt替换文本，图像显示不出来的时候用文本代替<br />

</body>

</html>

我们来看看效果，alt后的文本是否能展示

说明我们的测试是正确的。

2.title 提示文本

先看效果:

看下代码和代码展示：

<!DOCTYPE html>

<html>

<head>

</head>

<body>

title提示文本<br />

<br />

</body>

</html>

好的，今天先到这里，一会我们继续。

在线咨询

上一篇：分享8个难忘的HTML5炫酷动画
下一篇：在网页开发中，我们需要掌握的常用HTML标签有哪些？

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

整合营销服务商

设计师妹纸，北漂两年半的转行经历（一）-从平面设计师到UI

作者简介：Sophia的玲珑阁，一枚爱折腾，爱健身的交互设计妹纸。

职场设计技能，更多教程抢先看，请关注作者的微信公众号：Sophia的玲珑阁

您的项目需求