阅读更多

4顶
0踩

非技术

转载新闻 前端工程师应该具备的三种思维

2014-09-09 16:31 by 见习编辑 u012797015 评论(0) 有8308人浏览

如果你是一个天才等级的工程师(马上可以离开),可以独立完成一个很多事情,你可以是一个怪咖,因为我相信没有一个人不会不佩服你。但现实归现实,多数人都不是天才,而我们在职场上也不是单打独斗,我们需要团队合作,需要协调和配合,需要考虑除了代码以外的更多事情。

 

前端工程师,也不仅仅只是负责接资料,捞数据,做个回应。当然只做这些也并没有不对,但我们需要和后端工程师沟通,我们也需要和设计沟通,也需要和 PM 沟通,怎么做才是对这三方都比较有好处?

 

逻辑思维

 

在开始写某一段代码的时候,想一下它会用在哪里,会重复用吗? 它以后会不会变,如果会变,那可以怎样变?一般网页结构的变化,虽然有很多但是也有一个根据,这个根据就是可以预先估计好的。没有一个案子,是不会「不改」的,很多时候你都是要一边做一边改,甚至可能会来个乾坤大挪移。当真的需要发生变动和修改的时候,你有什么对策?这些都是需要想好,并且建立在一个逻辑上。

 

通常专业的设计师,设计一个网页的元素都是同质性很高,等比或对比的,所以代码按理也是可以重复用的。所以为何你要学会用 CSS preprocessor (Sass,stylus,less),写一个 Mixin 或一个变量,一开始用你会觉得很麻烦,但是用了你就回不去了,不但提高你的效率还提高了你的准确率。

 

工程师的世界就如武林,大家都各自修炼,每天都有新的祕籍,大家都很好奇跑去修炼一下,希望有天成为武林高手。这也是提升你见识和专业的潜动力,如果你没有好奇心,看的和懂得东西太少,逻辑自然不会跟上时代。要保持不断的学习,来磨练自己的逻辑思维。

 

逻辑思维某程度,就是你的程序专业能力,除了能写出来还要可维护,可阅读。当事情建立在一个很好的逻辑上,那么出错几率就会比较低,和你工作的人也会比较愉快。

 

写道
可以把一件事做的很好,那是师傅;可以把一件事做好和预测未来的事,那才是专家。

 

商业思维

 

PM、老板或者客户,都会问你,「你需要多少时间」,如果说的太短,可能会做不完;如果说的太长,也不可能,这是一个怎么回答怎么死的问题。有时候,需要换一个立场,站在第三方的角度思考。我们的完成度,和他们的完成度可能是不一样的。

 

我们把案子的细节分成两种情况,一种是你已经有经验,可以预估时间的;一种是你没有做过或你很陌生的,你没有时间估计的基础。

 

那么提出一个,他们可以最低接受的标准,例如一个 App 网站,最低标准需要一个首页,和一个链接去下载 app 的 2 个按钮,这些都是可以预估的。而剩下的,你需要 Research 一下,之后再给一个比较有根据的时间。估计一个案子需要多少时间做完,是非常非常的重要,因为你消耗的是一组人的时间,不是你自己的(除非你自己一个人做,或者你是老板)。如果你估算错了,后面就会延期,做不出来没有很大的关系,最重要是把问题解决,提出你的解决方法,什么样的方法才可以达到解决问题的目的。

 

换一个立场提出解决方案,对事情是有帮助的,对公司或客户是有帮助的,客户不会在乎你解决不了手机网页看不到 20 个栏位的 table 那个问题,但是客户很乐意听你说,这样的 Table 不好看,可以换一个显示的方法。客户也不太在意你是用 Rails 还是 php(有些是很在意,他们假装他们懂),可以购物和发文就好。

 

前端工程师可能很容易接触到客户的投诉,所以有些东西没有想好,就会很麻烦。做个网站,换作你是网友或客户,你会满意你自己做的网站吗?

 

设计思维

 

很多时候,前端工程师本身也是设计师,但是也有很多是本身是前端工程师也是后端工程师,设计和前端是分割不开的。当然我这里说的设计,不是真的要你弄一个画面或完整的设计图。

 

Steve Jobs 写道
”It’s not just what it looks like and feels like. Design is how it works.”

 

前端的设计是指一个画面或元素,如何被执行和创造,移动或消除,这个设计在不同的宽度和高度,不同的装置看,效果是怎样,考虑进去就是你的设计思维,怎么把设计师的画面弄成一个活生生的网页,要用设计师的角度去思考,才能有办法把设计图的概念充分的表达出来。

 

话说早前,收到一个「设计图」,上面有一个「X」,我问客户这是什么,他说是「回上一页」,为何回上一页是「X」,这不是一个 popup 也不是一个 modal,同时这个图上还有很多不同颜色和大小的「X」,分别代表了「删除」、「关闭」、「滑下」,这是一个不太合理的设计。

 

设计的思维,会直接影响你写的代码结构和网页结构,因为你看不出设计的重点在哪里,怎么写才可以达到设计师要求的效果,你没有办法好好的组织你的结构和元素,就无法好好把网页拼凑出来。这不但大大降低了你的效率,做出来的东西也不会一致。可能一个网站,就出现几种本该一样,结果「很像」但是不一样的按钮,因为你用了几个 class 和不同结构来做。你一开始就没有好好思考设计。

 

你可以做什么

 

  1. 没事要练功,FB 逛几分钟就好,不需要留恋太久。
  2. 做好一个网站,自己玩一下,给你朋友玩一下,问一下他们的意见?多问几个。
  3. 多看设计图,看思考一下你会怎么做。

 

来自: kimix
4
0
评论 共 0 条 请登录后发表评论

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • 现代前端技术解析 (前端知识体系与架构思维解析)

    这是一本以现代前端技术思想与理论为主要内容的书。前端技术发展迅速,涉及的技术点很多,我们往往需要阅读很多书籍才能理解前端技术的知识体系。...使读者获得成为高级前端工程师或架构师所必须具备的思维和能力。

  • [网页设计]前端工程师应该具备的三种思维

    如果你是一个天才等级的工程师(马上可以离开),可以独立完成一个很... 前端工程师,也不仅仅只是负责接资料,捞数据,做个回应。当然只做这些也并没有不对,但我们需要和后端工程师沟通,我们也需要和设计沟通,...

  • 一个合格的前端工程师应该具备怎样的能力?

    一个合格的前端工程师应该具备怎样的能力?下面和千锋广州小编一起来看看吧。 1、学习新技术的能力 无论你是一个入坑多年的老鸟还是刚刚入坑的菜鸟,心里都明白,前端技术的更新真的不是一般的快啊。如果想要做好...

  • 一个优秀的前端工程师应具备哪些技能?

    那么一名优秀的WEB前端工程师应具备哪些技能呢,我在这里分享一下,供大家参考: 第一:HTML超文本标记语言 1、HTML文件的结构 2、HTML文件的编写方法 3、HTML基本标记 4、文字与段落标记 5、框架 6、使用...

  • 前端工程师是怎样一种职业

    文章链接 : 前端工程师是怎样一种职业 前端工程师的英文名为front-end engineer,简称FE,下文将用FE来代称。现在意义上的前端(并非只制作网页),国内最早开始有大规模招聘岗位应该是2011年左右的事情吧,在此...

  • HTML5前端工程师需具备的能力

    好程序员HTML5培训分享HTML5前端工程师需具备的能力,互联网行业是现在就业的热门行业,如何成为一名优秀的前端工程师就是每一个前端工作者或者有意向入坑前端的朋友们,值得深度思考的一个问题,互联网行业的竞争也...

  • 什么是运维工程师?运维工程师应该具备的素质

    例如针对前端web server,我们就可以有很多种类型的监控,包括应用端口 状态监控,便于及时发现服务器或应用本身是否crash、通过icmp包探测服务器健康状态,更上层可能还包括应用各频道业务的监控,常用方法是采用面...

  • 前端工程师到底有哪些晋升和发展方向选择?

    不管从事哪个行业,在入行之前或者在进入行业的时候我们其实就应该对自己的职业道路进行一个科学合理的规划,你的每个阶段应该做什么?喜欢做什么?能够做什么?而不是等到没有时间的时候再去匆忙规划。提前做好职业...

  • 作为高薪Web前端工程师,需要掌握哪些能力呢?

    2020年因为疫情各行各业都暂时受到了...由于市场经济的逐渐复苏,企业之间的竞争日趋明显,对前端工程师的要求也日益提高,对于基础不扎实的小伙伴来说,面试成功率不似几年前那样火爆,本质原因还在于企业对人才的...

  • 牛人整理的前端知识体系大全与前端思维导图

    一张图足以让你了解web前端工程师需要做哪些工作以及需要掌握哪些技能。 前端知识结构图 下面就是牛人整理的前端知识体系大全,让各位APP设计师想要转行做前端开发的同学们提供一些参考的文案和网址。 布局框架: ...

  • HTML5前端工程师需要具备哪些能力呢?

    那么HTML5前端工程师需要具备哪些能力呢?下面,千锋上海小编就给大家介绍一下。  1、熟练而全面的掌握前端技术  优秀的前端开发工程师要在知识体系上既要有广度和深度。如果从业者的HTML、CSS(包括现在的...

  • 千锋web前端工程师头脑风暴:程序员逻辑思维养成记

    “逻辑思维”这个词,很多人会对它敬而远之。因为大多人,也包括我在内,我们这些并没有天生才智的人来说,似乎总认为这是自己不擅长的领域。   这4年前在网上突然出现了一档脱口秀节目,叫做《罗辑思维》,一个...

  • 制定CA6140车床拨叉的加工工艺,设计钻φ5孔的钻床夹具设计.rar

    制定CA6140车床拨叉的加工工艺,设计钻φ5孔的钻床夹具设计.rar

  • 128 基于STM32的儿童误锁车内远程报警系统【QT上位机源码】.zip

    这是 《128 基于STM32的儿童误锁车内远程报警系统【QT上位机源码】》 项目的Qt上位机上位机源码包。 这是一个Qt工程,采用QT5.12.6版本开发的源码。支持生成Windows系统运行程序。也支持生成Android手机APP。 对应项目的博客链接:https://blog.csdn.net/xiaolong1126626497/article/details/132015856 注意 注意 注意!!!: 如果不需要修改上位机源码,就不用下载本资源 (本项目的STM32源码包里就包含了上位机APP安装包,可以直接使用),在设计文档里也写了上位机的核心代码。 如果想学习本项目的上位机开发,学习上位机的源码,修改源。那么可以下载。 最好自己具备一定的Qt开发基础。

  • 水泥粉磨生产工艺流程图.zip

    水泥粉磨生产工艺流程图.zip

  • ParagonHFS+forWin v14.0.24 x64.rar

    WINDOWS系统读取苹果分区的利器,支持HFS+及APFS分区。

  • 基于Ryu 控制器和 Mininet 实现软件定义网络(SDN)负载均衡解决方案,用于网络模拟.zip

    基于Ryu 控制器和 Mininet 实现软件定义网络(SDN)负载均衡解决方案,用于网络模拟.zip

  • 20250415API翻譯

    20250415API翻譯

  • Git知识学习(尚硅谷)

    Git知识学习(尚硅谷)

Global site tag (gtag.js) - Google Analytics