Coding，做一个有情怀的产品

估计很多人一看这个标题就要骂了，“情怀”这么烂大街的词语，还拿出来卖？是的，我确实要讲情怀，并且我找不出更好的词语来形容这样的感觉：对内心想象的追求。

“情怀”的泛滥是从老罗今年的发布会开始的，一时间情怀红遍了互联网。我确实很喜欢老罗的那场发布会，以至于我看完一遍以后，又组织公司集体看了一次。虽然锤子手机现在发展的不咋地（我买了一台，个人感觉是 Android 手机中做工最好的，系统也很不错，但是锤子发货慢了，错过了时机），但是那场发布会确实让我有很多的共鸣。

Coding.net 是今年三月份开始做的，7 月份上线，只有四个月的时间，套用我党的描述就是“时间紧，任务重”，技术，产品，设计都是从零开始。今天我要讲的，无关技术，我们来聊聊产品和设计。一直以来，大部分给程序员用的产品，都很难看，很丑，谁说码农就没有审美？我自己也写了十几年程序，现在作为 Coding 的首席产品经理，我想做一个好看又好用的产品，希望给到用户的体验是爱不释手。

LOGO，绕了一圈还是自己来

相信所有的创业者都面临过几个头疼的问题：公司名称/LOGO，产品名称/LOGO。产品的名称我也想了很久，最后由于拿下了 Coding.net 域名，所以产品名称就定了 Coding。公司名称取了个音译“扣钉”，完全没有重名，工商局的系统中一次通过有木有！设计 LOGO 才是头疼的问题，我一开始打算将这个工作外包，找了几个服务商，折腾了将近两个月，木有满意的方案。我有想过花比较大的价钱，请一个知名的机构来做设计，但是苦于囊中羞涩。后来我跟公司的设计师说，要不我们自己来设计吧。我想象中的 LOGO 有一个大致的思路：LOGO 由两部分组成，左边是图形，以猴子为原型，右边是文字，由 Coding 的英文字母组成，但是得有些变化，要大气。我跟设计师基本上翻遍了所有英文字体，木有满意的，一时间灰心丧气。于是，拆了一盒巧克力。事实证明，心情不好的时候吃点巧克力有助于激发灵感。我猛然发现此巧克力品牌的 LOGO 不错。

于是立马跟设计师商量，我们能不能仿照这个 LOGO 的字体试试？于是我们照着 Godiva 的感觉自己画了 Coding 的字体。第一版的效果是出来了，但是太死板，于是我们又融合了其他英文字体的元素，比如 D 改成不封闭的，N 改成不连接的，改了几十个版本，最终定稿：

请注意，那个 I 上面的三根线段是点睛之笔，定稿前折腾这个 I，基本穷举了所有的样式 =.=

到此，LOGO 才完成了一半，我们还差一个猴子的图案。为什么是猴子？因为我们是给“程序猿”用的产品。于是我们的设计师开始画猴子，各种猴子，以下是手稿之一：

我在众多猴子里面，选了一个猴头，也就是照片中左下角那个。后来经过润色和修饰成了我们现在的 LOGO，由于头型像洋葱，设计师给它取名“洋葱猴”：

我们的同事都很喜欢这个猴子，甚至还要求设计师出了几张壁纸（ https://coding.net/about ）。我对这个猴子也很满意，手机桌面，微信封面都换成了洋葱猴壁纸。后来我们做了一批洋葱猴的抱枕，一时间供不应求，所有人见到我都问我能不能送个抱枕，甚至还有人要问我买，我有时候觉得我们是不是应该改行去卖抱枕？两个月下来，我们俨然已经成了“东半球最好的 IT 抱枕厂商”，其实 Coding.net 只是我们的副业……

非专业的产品和设计？ 大学里没有一门专业叫“产品经理”，这是为什么呢？现在这个产品为王的年代，开一个产品专业应该很吃香：）老实说，我在做 Coding 之前也没有正儿八经做过什么严肃的产品，所以我也算是现学现卖。不过，对于 Coding 我脑海中的想象已经很久了，我要做的就是把 Coding 按照我脑海中的想象实现出来。我们的设计师，90 年的小姑娘，计算机专业出生，虽说毕业两年一直在做设计，不过要论专业，我想她也是个半路出家。所以，就我们两个人非专业人士，想要做一个碉堡了的产品。

首先从功能上讲，我们在同类产品中应该是明显领先，但是一个碉堡了的产品光有功能是不够的，我们要给人眼前一亮的感觉。我们原本想要原创一套自己的风格，后来发现在目前有限资源的情况下，这明显是一个吃力不讨好的决定，于是我果断放弃了这个想法。我们借鉴了国内外同类产品的设计，再加上自己的一些想象，形成了现在 Coding 的风格。

在 Coding 上线前的测试阶段，我总是看着界面感觉奇怪，后来仔细研究发现，一个界面，如果有大量匿名头像，就会显的难看，任何布局都有这个问题。所以我们自己画了一套水果头像，所有的新注册用户都会自动分配一个水果头像。这样就杜绝了匿名头像的出现。同样，项目图标也有类似问题，我们又画了一套插画，自动分配给没有图标的项目。

（Coding 部分水果头像）

（Coding 部分项目图标插画）

瞬间，网页顺眼了很多 ^_^

（网页效果对比图 1）

（网页效果对比图 2）

（网页效果对比图 3）

（网页效果对比图 4）

我一向认为很多项目管理系统复杂的让人崩溃，其实很多人想要的只是一个 TODO List。Coding 最初的项目管理就是围绕这个 TODO List 做的。项目间成员可以相互指派。我们在这个功能上费了很大的力气，我这里例举一二。

（Coding 项目任务 - 未完成）

上图是一条任务，包含了任务内容，执行者等等信息。在不跳转界面的情况下，用户可以编辑内容（点击任务内容），更换执行者（点击右侧头像会有下拉列表），标记完成（左侧方框），删除任务（右侧红色按钮）。但这里有一个问题，就是任务内容如果包含链接的话，打开链接会非常麻烦，因为任务内容本身可以直接编辑，所以不能做超链接。这个问题最后不是我解决的。我还没来得及看这个问题，开发这个功能的工程师已经解决了这个问题，就是任务内容下方的几个链接图标，还用颜色区分了站内和站外。他说他实在受不了这个链接的问题了，于是顺手解决了……可见，当一个开发懂产品的时候，其效率是可怕的。作为一个 TODO List，我觉得这样的功能接近完美，多了都显得累赘。我相信绝大多数 10 个人以内的团队，用这些功能就够了。Coding 现在接近 30 个人了，我依然觉得这些功能足够用。能够把简单的东西用到极致，效率会大大提高。

做产品最重要就是让用户爽，iPhone 那个 home 键就特别爽，不管在那里，一按必定有响应，按一下，屏幕立马切换到桌面的体验让人觉得很有控制力，很有安全感。我一直认为 TODO List 那种做完后打钩的动作很爽，操作很爽，心理上也很爽。所以我在 Coding 坚持保留这种操作，就是任务左边的框，做完打钩（注意，必须是打钩，画圈，打叉都不行），并且本条任务被横线划掉，很有成就感的样子~

（Coding 项目任务 - 已完成）

很多时候，用户选择一个产品往往是因为某些小细节。Coding 的用户登陆以后，右上角有自己的头像，由于 Coding 的功能比较多，所以我们做了一个小功能就是当用户的项目有更新的时候，头像的呼吸灯会亮起。这个头像是全局的，所以不用来回切换不同的界面查看是否有项目更新了。还有，程序员都知道 Ctrl + Enter 有木有？所以我们所有的输入框都支持 Ctrl + Enter 提交。（我原本还想支持 QQ 的 Alt + S 操作，后来被鄙视了一通以后，不了了之了）我们还有很多这类细节设计，希望能在不知不觉中提高用户的生产力。

再来一杯情怀

虽然我本人比较土，但这丝毫挡不住我对美好事物的追求，比如 酒，所以把这节标题取为“再来一杯情怀”。我们刚刚推出的一个功能，甚至不能算是功能，是纯情怀主义。我们通过国内的摄影社区，向国内的摄影师们购买了一批高质量照片的版权，用来做 Coding 登陆的背景，每周轮换。我必须承认，搞这些高大上的照片，自以为会把 Coding 的逼格提升一个档次，但我更希望的是程序员们每天来 Coding 的时候心情舒畅，哪怕只为看看今天是啥美图也好。以前我在 Oracle 工作的时候，我们那个部门每周一上午会在办公室提供精美早餐，先到先得，所以周一的准时出勤率特别高……我希望 Coding 的每周一图能给程序员带去一周的神清气爽。我们还在不断购买高质量的照片，如果你希望你的照片出现在 Coding 的网站上，欢迎你联系我们。

（Coding 登陆背景样例）

所谓性情中人，就是为情怀买单的人。我做产品，希望它有血有肉，不管目标有多难，有多遥远，我们坚持每天进步一点点，做一个让用户爱不释手的产品。

Coding 官方技术博客 : http://blog.coding.net/

Coding 云端协作开发平台： https://coding.net