开发说这个需求做不了,他在骗你么?

小奈:我想学习写代码?
大仁:为什么?
小奈:有时提出的需求技术说不会做,但在其它平台已经实现了。
小奈:他是不是骗我?
大仁:我等下和你解释,不过非要学也可以。
大仁:那我建议你学下html,上次和你说的输入url后,货品其实就是网页,现在教你写网页。

村姑:html

html是个乡下来的的丫头,她有基本的骨架和血肉。至于它的结构,我们可以把它想像成盒子,盒子套着盒子。


image.png

html非常单纯,比如说<h1>表示大标题,<p>表示段落,<img>表示段落。
html还有个非常有趣的标签,<a href='url'>某个链接</a>, 链接标签,我们可以在一张网页里写上很多链接,这样子就很方便了。就像一张网一样,所有的网页跳转都变得很方便。
在互联网早期,网页都十分简陋。

禁用css后

在早期,大家就是这样子忍受的。后来大家都抱怨了,但是HTML只负责展示内容和结构。
好吧,后来浏览器大叔劝福它稍微打扮下,大家伙给她申请了手镯之类的装饰品,之后就有了size(尺寸)、color(颜色)、align(对齐)等,哎呦,稍微好看点。


化妆后

村姑后来就发脾气了,妈呀,天天出门都要打扮,很累耶。

化妆师 :css

没办法,只能请专门的化妆师了。css真的是很神奇,把html打扮的美轮美奂的。

法宝1:选择器

面对着一个村姑,化妆师开始想办法了,首先是把整个html的结构定位出来。例如要找标题,html>head>title这样子才找到,化妆师直接规定 html head title 以后就是定位title了,类似的其它部件的定位也是如此。


image.png

部件都可以定位到了,定位到了之后就开始化妆了,例如把这个变成红色,字体20。
h1 {color:red;size:20}

法宝2:盒子

上面我们看到,盒子都是倒在这边去了,盒子和盒子间的距离不行,这样子排版很丑耶,所以给这些盒子添加了支架,固定它们的位置。

  • 边框(border): 可以设定宽窄,样式,颜色
  • 内边距(padding): 内容到边框的间距
  • 外边距(margin): 边框到相邻元素的间距
image.png

我是邪恶的代码分割线

简单例子

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>产品经理的技术课堂</title>
</head>
<body>
<h1>产品经理的技术修养</h1>
<p>产品经理的第一行代码</p>

</body>
</html>

用代码做自己介绍

<!DOCTYPE html>
<html>
<head>
</head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<pre id="jack" class="saying"></pre>
<div style="display:none" id="w">
hello 大家好 我是jack,我想让技术变得有趣,
今天教大家用代码介绍自己。
首先要先介绍几个东西,html标签,
大家可以把它想像成箱子套箱子。

html 它本身最大的箱子
head 它的头部
body 它的身体
div 这个就是真正的箱子,可以一个套一个

经常有产品新人问我技术问题。
像是前后端的区别?数据库是怎么样的?如何和研发沟通?
回答的多了,就想系统化的回答,写一本书,
让技术变得通俗易懂、有趣。
6年间,从技术小白到工程师再到后台、数据产品经理,
2000多个日夜,为代码、需求绞尽脑汁、也在创业路上走过,
百感交集。
本书以小说故事的形式、场景化讲解技术,让枯燥的技术变得有趣。
/div> 这个箱子需要用这个来启动<>
</div>

<script language="javascript">
var index=0;
var word;
function type(){
var typePanel = document.getElementById("jack");
typePanel.innerText = word.substring(0,index++);
if(index % 3 == 0){
typePanel.className = "";
}else if(index % 3 == 1){
typePanel.className = "saying";
}
}
window.onload=function(){
word=document.getElementById("w").innerHTML;
setInterval(type, 200);
}

</script>
<style>
.saying:after {
content: "|";
font-family: Arial, sans-serif;
font-size: 1.2em;
line-height: 0;
display: inline-block;
vertical-align: baseline;
opacity: 1;
animation: caret 500ms infinite;
}
</style>
</body>

如何与开发沟通?

小奈:产品经理面对开发时,需要懂技术到什么程度,怎么样才能合理沟通?
大仁:和你说实际案例吧,有两个技术出身转的产品,一个是我,一个是某大公司的。我刚转产品的时候,很自然的会想技术细节,这时候其实开发是反感的,有种侵犯他们领域的感觉。
  另一个的那位产品经理则是装不懂,实际上他技术比开发还牛。所以还是尊重开发、相信他们的专业能力(菜鸟除外)。

小奈:有时提出的需求技术说不会做,但在其它平台已经实现了。
大仁:这个还是沟通问题,其它平台和自家平台,在架构以及阶段等很多方面可能不一样,开发能力也不一样,你是想知道他有没有骗你?你可以问另一个开发,但我建议你和他搞好关系。

建议

1、产品经理要懂技术,这样才能理解开发,在一些功能实现可能性做取舍,和开发无障碍协作,顺利推进工作。
2、产品经理的沟通能力很重要,入职第一件事是融入团队,有点像地头蛇,大家都比较喜欢她/他。
3、提出清晰明确需求,与开发沟通好进度。
4、非要写代码的话建议从html和js学起,会技术的产品经理可以随时验证自己的想法

推荐阅读更多精彩内容