Web(网页)设计与开发过程中，导致团队协作低效的易暴露的基本功汇总

自己专注Web设计与开发已经有七八个年头，并不算是什么大神，我自认为还是一个行业菜鸟，从最原始的Flash，到当今的一些交互趋势、风格，都经历了过来。也做过一些线上线下分享和课程，目前一本关于设计规范的书籍也即将发布(过去2年半了，已经到了最终的发行阶段)。虽然自己还有很多很多不足，但是对整个Web市场环境和对一些Web UI设计和前端开发的底层探索和深入学习，并没有停止脚步。也经过自己的努力，得到过很多推荐和大大小小的奖项，也许，这是我梦想的必经的一个“弯路”。

有时候，团队之间协作能暴露更多的个人问题，只有当我们面对这些问题，从个人的角度去解决，才能优化团队，高效协作。

我自己做过工作室，单枪匹马干过，也有和团队一起奋斗过，在这坎坷的过程中，还是发现和总结了一些常见的问题，这些问题往往是有四五年甚至更多经验的设计师或者开发者容易存在的问题，当然我自己曾经也有这些问题，现在慢慢已经强迫自己去Fix了。不断完善自己，不断学习，才能够完成自己真正的梦想(如果你不是单纯为了打工或者做个项目而选择的这一行，我想，你知道你的梦想是什么，它的意义在哪儿)。

往往很多人，都会觉得自己很优秀，反而忽略了一些最重要的，容易忽视的基本功。或许你面对的是国内客户，或许你是在一个团队圈子中，无需面对众多的考验。但这些都不是理由，我觉得，只是没有真正找到你的梦想和上进罢了。每个人都会迷茫，甚至一直迷茫，迷茫该怎么做的更好，或者该怎么继续走下去。所以我非常有必要把这些常见的基本功问题做一个汇总。下面的这七个方面。

一.不会运用网格(栅格)系统

网格系统已经有深远的历史背景，对于网页来说，所有的网页都构建与一个网格体系下，不论你的设计有多“个性”，都离不开网格。(Sorry, 这里的个性是一个双重词汇，包含了褒义和贬义，大家可以自己去理解一下)。

前端利用良好的网格系统，对于响应式，元素的布局和比例把控，提高开发效率和质量，都具有重要的意义。我们可以参考Bootstrap的网格系统，对前端网格进行一个更深入的理解和研究，不难发现，网格对于开发的重要性。

对于设计师而言，网格不应该仅仅作为一个“装13”的工具，或者作为一个完成任务的工具，而应该从网格系统中，把控好不同分辨率下元素的比例（按钮，高度，文字大小，字体渲染，图片大小，图片比例，响应式的背书）等等，这是一个难点，也是一个拥有数年经验设计师容易犯，而且不易改正的错误。往往设计稿可以非常美观，但是对于元素的比例，在实际的前端开发过程中，往往能看出和原设计稿的差异有多大。为什么会存在还原度差异？因为代码是活的，页面时活的响应的，并不是一张图那种死的。所以设计噶，必须要运用网格考虑更加深入的比例关系。

运用好网格系统，前端开发能够快速肉眼测量设计比例，便于提高开发效率，同时便于响应式逻辑的梳理。

 

二.信息展示逻辑不符合普通人的思维

前端开发中，一个小小的交互效果，也许需要一个小时，也许需要一两天，一个小小的逻辑，可以造成无比巨大的时间投入。这是设计师不能够理解的（除非设计师对前端代码有深入的理解，注意是深入理解，而不是简单的了解）。为什么UI设计入门容易，想做到很厉害真的很难，因为你要面对的领域和知识深度是无限量的，你如果不去接受不去改变，你永远是一个只会做事的UI，没有真正的合理逻辑思想。

改变，是对于有经验的设计师和开发者提高的一种比较好的方式。

改变习惯，改变风格，改变操作方式，改变思维，改变目标群体，改变观念等等，都对一个人的提高起着极其关键的作用。

举个例子，一个设计稿，信息切换复杂多变，一个页面信息重复毫无比重感，动效无止尽，对于一个普通的用户，或者客户来说，这个网站的体验是极其差的。不论一开始你做的有多牛，最后都要摒弃很多“无用的东西”。如何解决这个问题？把自己当一个普通用户，别把自己当做一个专业的设计师或者开发者，看看自己使用时会带来哪些问题，如果连自己都觉得“晕”，那这个设计就是天马行空。团队协作过程，只会给前端开发带来无止尽的工作量和返工量。

至于前端开发的逻辑，主要依赖于长期的积累和思维。不仅仅是交互的理解，更多的还是对用户，对体验的洞察力，需要不断地积累。

三.代码没有灵魂

就拿自己稍微熟悉的前端开发来说，一个网站的代码有没有灵魂，我认为主要在于代码的规范和造轮子能力，什么是轮子？如果不了解的可以去科普一下。

现在已经不是十年前了，入境开发都将就合理利用身边的资源，提高质量和效率，当然，前提是有一定的基本功，前端开发有着众多的领域分工，不论哪个领域，都需要具备模块化的一些思维和习惯。而这些思维和习惯，是需要强迫自己去改变的。你如果无法“让别人更好的使用你的代码”，那只能说明你写的代码没有自己的灵魂，不能够与别人对话。

举个例子，你的代码是否用了国际认可的BEM命名规范，就连谷歌都在用的命名规范，然后代码每个模块之间的代码，是否能够快速剥离和重构（使用Webpack或者Gulp等自动化工具打包后的代码除外，这里主要是指打包前的原代码）。能够看出你的产品化思维比重占了多少？

我个人觉得，代码是给人看的，也是给人用的，不仅仅给自己看给自己用，特别对于团队协作，更需要的是让别人能够理解和充分调用每个不同的模块的代码。时代在进步，只有不断掌握各种新工具和技术，比如自动化开发，自动化测试等等，才能跟上“梦想的脚步”。我觉得，考验自己代码灵魂的方式，就是开源到github上，看看有多少人会和你的代码互动。我自己也有一套前端开发的Kit工具包，目前也处于不断优化升级的过程，大家感兴趣可以去了解一下—— Uix Kit.

四.不注重基本的设计规范

对于设计师而言，设计规范至关重要，规范并不是束缚设计的东西，而是约束设计，并为设计提供一个更长远的发展空间的东西。关于网页UI的设计规范，包含了非常多的底层知识，大家也可以通过我的新浪微博的#网页设计技巧#标签去查看我平时的一些分享，也可以购买即将发布的专注底层设计规范的一本书籍。：）无耻的做了一个广告，哈哈，其实不然，这些确实是我的汗水和心血。

我个人觉得，底层规范直接关系到了设计中的方方面面，不论你是做多规范普通的布局，还是多创意另类的风格，都有底层规范存在，那些属于底层规范呢？我大概列一些，比如中英文字体的相关知识，网格系统，屏幕尺寸和分辨率(关系到响应式设计)、安全宽度和安全高度、色彩、图标格式、命名等等，都属于任何网页都需要注重的基本中的基本。我把它们列入底层规范的范畴。然后，就是实践中的规范操作，比如PSD命名，图层归总，PSD大小控制，页面字体的选择，字体数量，统一的间距，常用的比例控制，动态信息的布局控制等。

由于这些是一个长期积累和学习研究的过程，大家可以在不断实践的过程中去体会，任何运用这些规范。我说的规范，并不是按钮，窗口改多大？比例该多大？而是比它们更加原始的一些更基本的规范。

对于有些项目来说，很多客户或者团队是不注重规范的，因为能够“成交”。而对于某些项目来说，规范是非常强制而且明显的一个要求，最基本的都无法通过，你怎么和客户“成交“？我觉得想要提高自己，必须强制去改变自己的习惯，养成一个学习规范和运用规范的能力。如果一个设计师仅仅认为规范就是束缚，那我觉得这样的设计，永远是虚无缥缈的，天马行空的，是前端开发绝对不喜欢的。

注重基本的设计规范，能够让前端开发更加直观的编写统一的代码，可重复的代码，兼容性更强的代码，从而提高协作效率，减少返工。反之亦然~

 

五.不注重基本的代码规范

前端开发过程中，也存在一些非常明显的，容易犯的低级规范错误。比如命名。如果一个开发使用了拼音或者一些毫无根据的英文字母，这会让其它开发者难以分辨，难以维护。开发是给人看的，也是给人维护的，这个人，不仅仅只是对于开发者本身。

再比如，开发过程中，文件和目录的结构，页面结构，缩进，js代码的空格，CSS代码的格式等等，都是一些最最基本最容易犯下的问题。恰恰这些基础问题，会造成大量的“垃圾代码”，每做一个项目就结束了，没有任何升级和重复包装利用的价值。

我个人非常看重代码的可重复利用性，可升级扩展性，阅读性，虽然我并不是专业前端开发，只是一个为了辅助设计而专研的前端小菜，但是我对于把代码写“漂亮”，是非常注重的。只要是自己觉得不好的习惯，我就会强制自己去改变，去修正，而不是将就，一错再错。或许，我的目标不仅仅是能够做项目，也不是能做点国内的不注重规范的项目，我更多的是想让别人喜欢我的开源代码。

再次声明哦，我不是码农，前端开发只是属于我的附带必须的技能~ 当然，我也不是一枚UI，我更多专注的整套产品的把控和设计开发，甚至运营。难度虽高，但是，这更有助于我实现我的各种小梦想。

 

六.综合能力欠缺

或许很多人认为全栈是一种啥都会，啥都不精的行为，其实不然，这种人挺多的。而且也是未来的一种人才需求，越来越多的优秀企业，都会要求一个web设计师具备深入的前端知识掌控能力，对前端而言，也要求具备很多自动化工具的运用能力。行业之间都存在互补的特征，同一行业，不同的技能也是一种互补和提升。你只有了解你不了解的，你才能提升。

否则，可能就只是一个眼高手低，只是一个“只能依托于团队”的份子。想想当你离职以后，你自己能做什么，能抗住什么压力？一个人，必须提高自己的综合能力，学习很多自己不喜欢，甚至讨厌的知识，任何人的成长，都是在不喜欢中成长起来的。不要排斥任何行业，也不要排斥任何技能，因为，一个小小的技能，可能让你失之千里。

一个人会很多技能，而且有很多技能都能很溜，这种人，真的挺多的~ 跨出团队的圈子，你才知道，你会有多菜~ 当然，每个人的追求不同，找到自己合适的目标，才是最重要的。

我们这里谈的是团队协作，当你的综合能力比较突出的时候，团队协作自然而然，会高效，会和谐很多。

 

七.没有共同(≠相同)的目标

有时候团队人员之间是否和谐，是否有一个不谋而合的想法，表现为是否存在共同的目标。比如我想要拿到Awwwards类似奖项，而其它人没有这个追求，那仅仅只是我自己去按照Awwwards的基础标准去提炼自己，而真正的写作过程中，由于项目或者产品的不可控性，往往最后是达不到Awwwards标准的。

因此，我为了提升自己，常常会将自己的一些私人项目列入比赛范畴。我觉得工作，就应该有自己的空间，这是提升自己，发现自己的一种途径，而不是为了拿工资而去做那点点事，那样会被束缚，找不到自己真正想要做的事，找不到真正的目标。一段时间后，也许，你会厌倦你做的工作，或者厌烦你的工作，或者换一份可能让你厌倦的工作。

当然，奋斗的同时，一定不要忽略了自己的身体，多锻炼，才能实现你的目标！

志同道合有多重要，也许，我已经举了一个很明显的例子了。不只是做产品或者创业的志同道合，我只是举了一个团队协作的志同道合。

 

结束语：

好了，我暂时汇总了这7个自己亲身体会到，经常遇到的小问题，它们其实也算是大问题了，或许也是长时间影响一个人发展的问题。多多扎实基本功，多多改变自己，多多学习，去创造自己的梦想，并实现它吧。因为我也是一个扎根梦想而前行的人:) 感谢大家读到最后。如果喜欢，可以关注我的个人中文博客哦。