「老文补发」写在GitBubble上线之后

“在一个晚上我的母亲问我今天怎....么不开心”
“我说在我的想象中有一个小游戏...摩擦摩擦...”
（神经病 -_-|||）

事情是这样的，2014 年 11 月底的某一天傍晚，我正在电脑前思索如何增长我们 GitCafe 的微信粉丝数，一直一来，我们 GitCafe 的微信公众号粉丝数其实徘徊在 2000 左右，基本上我们的粉丝每天仅保持着 10-20 的增长。在我们的「程序员会生活」系列专题面世之前，我们在微信的内容运营上不是这个活动就是那个活动的信息发布，订阅我们微信公众号的小伙伴也是知道这点的。

没错，可以说是相当的单调、枯燥。而此时距离 2014 年的圣诞节恰好还有一个月。

“我们 GitCafe 是不是可以来一发什么有意思的东西呢？”

伴随这个想法，我脑子里突然就回想起当年的一个奇葩游戏——“围住神经猫”，这个游戏上线 48 小时以来，PV 达 1026 万，IP 达 241 万，而它的开发时间仅一天半，美术一人，程序一人。

想想就shi了是吧，当时我内心的真实心理活动是这样的：“我们也来做一个小游戏看看咯，试试看病毒营销怎么样？不管最后它会不会火会不会有效，试试总不会有错的咯！” 而事实上呢，我在加入 GitCafe 之前做了 2 年的 Java 程序汪，来 GitCafe 之后才转型作了市场，在这之前对于什么是市场并不没有深刻的认知，对 “病毒营销” 这个名词都也只是 “大概就是那么回事儿” 的水平。可是这些都无法抑制我心中的一团热火，感觉这件事，在这个时间点，我们应该去做，而且相信一定会做得好。

怀揣这股热情我马上在一张 A4 上手绘了一个简陋的效果图，并写了几个大概的规则。我们的老大 Thomas 和市场总监 Richard 看完草图并听完我的想法后也表示了支持，并示意鼓励我们放手去做。（这里也要感谢托尼玛在工作上给予的极大自由度）。

第二天我带着那张原始的草图把我的想法告诉了 G-Room 的小伙伴们（G-Room 是 GitCafe 内部的神 (xie) 迷 (jiao) 组织，有机会下次给你们介绍），他们也表示了强烈的支持。而特别幸运的是，我们的前端工程师 Ryan 具有相当丰富的移动端开发经验，开发一个基于 Html5 的游戏对他来说根本就不是个事儿。当天晚上我开始画起了 GitBubble 的原型图。但毕竟我不是作设计出身，再加上 Ubuntu 狗找不到什么好的原型设计软件，所以...我是用金山的 WPS Presentation 画的，是的，就是这么任 (diu) 性 (ren)。

大家可以看下当初的原 (cu) 型 (cao) 设计：

这里有个小插曲：为了给我的PM演示我到底要什么效果，我不得不在Presentation里一个个加好动画效果，使它看起来像那么回事儿，下面是当年的效果(说多了都是泪)。

原型视频地址:
http://v.youku.com/v_show/id_XODUzODYwNzY4.html

第二天我拿着这套Presentation去给Ryan演示效果，获得了肯定的回复“能做，不难。”接下来的事情就像是一场线下的Hackathon那样，我拿着我的Idea和原型依次说服了我们的前端王子Ryan、型男插画师Kawi来作我的搭(da)档(ye)。当然，一个项目要进行的顺利需要一个PM，我厚着脸皮邀请Gina帮助我在项目任务分配及进度管理上多费点心。
这里要再次感谢我们的前端小王子Ryan，那个时候他还在忙于我们GitCafe Enterprise版本的前端工作，但是在看完Presentation后没几天，他就做出了第一个基于html5的GitBubble原型，你们感受下。

大家其实已经可以看出这个原型虽然还非常朴(chou)素(lou)，但是在游戏机制上已经初见雏形。为了丰富整个游戏的质(B)感(ge)，免得上线上被大家吐槽成过于low的游戏，我又对于一些规则做了细化，这里给出部分设计文档内的内容，由于我们GitCafe团队成员骨子里那股对产品快速迭代的追求，其中有部分内容已经和现在大家手里玩的GitCafe有所出入：

……

规则:

1.戳破（手指点击）带有Git/GitCafe 命令的泡泡即可得分
    1-1.点击任意带有GitCafe命令泡泡 + 100分
2.戳破空白泡泡会扣减时间
    2-1.目前设定 - 1s 
        (所以玩家可以选择牺牲时间来戳破若干白色泡泡 有机会去戳另一个带有相同命令            的泡泡获得加成得分) 
    2-2.点击白色泡泡 没有分数 （或者扣50分 这个在模块里先做成 - 0 分就好）
3.连续戳破相同有效泡泡会得分加成
    3-1.得分公式  f(cnt) = 100×2^(cnt-1)
    3-2.cnt: 同命令泡泡连击数 (所以靠相同泡泡刷分能很厉害！)
4.吃到带有GitCafe泡泡会加时间
    4-1.目前设定 +5s
5.泡泡会从小变大，最后会自动爆炸
6.泡泡变大速度会变快（意味着爆炸会越来越快）
    6-1.f(s) = 2^(s/2)
    6-2.s:泡泡存在时间(秒)
7.随机出现Shake事件：
    7-1.Shake事件出现时，其他事件暂停：
        7-1-1.泡泡出现、变化的速度会变得很慢不会出现、变大、消失
        7-1-2.计时停止
    7-2.Shake事件得分：
        7-2-1.上下晃动手机
        7-2-2.得分公式：f(times)=10×sqrt(2^times)
        7-2-3.times=Shake期间 手机晃动次数
    #此时需要摇晃手机进行刷分
8.Game Over后出现的界面：
    8-1. [关注GitCafe]：引导用户关注GitCafe微信公众号
    8-2. [晒一晒]：晒分数到朋友圈
    8-3. [再来一发]：重新开始

……

在对这些细节做了进一步的规范化后，GitBubble的可玩性又上升了一个档次，但是我们的界面依然很朴(chou)素(lou)对不对？

所以说，人有时候不得不承认自己是多么的 Too young, too simple, sometimes naive

那天上午从Slack上看到Kawi给出下面2张图的瞬间，房间里每个人嘴里只蹦出了2个字--“卧-----槽------！”，你们再和当初我设计的原型比较下，是不是有股屌丝逆袭高富帅的感觉

慢慢地，Tips 画面、泡泡爆炸效果、得分效果、Shake 界面动画、结束画面......这些元素一个个从 Kawi 神奇的脑袋中跑到了现实，再由 Ryan 以一个个 document.getElementById() 和 function 去赋予生命。由于我们的素材非常精美，所以我们又不得不得对运行效率问题表示担忧。我们不断的去寻找各类手机作性能测试，虽然在主流机型上上表现非常不错，但是在一些老旧机型上一些动画效果并不能很好的展示，对于这些用户我们真的表示非常抱歉，我们寻找了很多方法试图做到优雅降级，但很遗憾的是对于那些过于老旧的机型——“臣妾真的做不到啊T^T”。

….

很快，时间来到了 2014.12.19 。

这是一个值得纪念的日子，GitBubble 实装了所有的得分、扣分、加时间、Shake 事件的功能，仅分享功能尚未实装，这意味着什么？一个最最接近完整版的 GitBubble 完成了！

我异常兴奋地拿着这个版本的 GitBubble 给几个同事去试玩，其中最厉害的那位玩出了当时的最高分 31W。

但是问题也来了：
a.点击泡泡后，得分在泡泡内显示，导致 “戳破” 的效果有延迟
b.增加时间的 GitCafe 泡泡与普通泡泡无差异，不具备强烈的用户品牌认识度
c.本因作为彩蛋出现的 Shake 事件刷分收益过高，远高于戳泡泡收益，影响平衡，还不如叫 GitShake……
…….

——系列的问题摆在我们面前，怎们办？

“怪我咯？” 各个改呀！

作为程序员出身的我非常理解 PM 汪频繁更改需求的感受，当时真的生怕我刚一开口向 Ryan 提需求就被回一句 “U can u up,No can no BB” -_-|||。但是我们的前端王子 Ryan 非常爽气地就开始着手修改代码，并告诉我现在就是让大家多挑刺，多挑刺多修改多迭代才能让我们的产品是拿得出手的！碰到这样的程序猿还有什么好说的，我要是个女的分分钟给他生孩子啊！

晚上下班的时候我在地铁里再次打开我们的 GitBubble，又有了新的意外，GitBubble 的素材大小将近 1MB，地铁里的信号基本只能维持 10 几 K 的速度，甚至还有部分 CSS 加载不完全导致画面奇葩无比的情况。但你要知道地铁恰恰是我很看中的一段碎片时间，地铁行径两站平均花费 2min，而 1 局 GitBubble 的游戏时间正好处在 [1,2] min 这个区间之内。

怎么取舍？

无奈，我再次询问 Ryan 和 Kawi 是否可以进一步压缩素材材质寻找一个素材精度和素材体积的平衡点。当时 Ryan 的一句话立刻打消了这个念头——“我们做的是一个游戏，是一个有质量的游戏。” 真是醍醐灌顶，确实，我们宁愿让我们的玩家多话几秒钟下载好素材去体验一个有厚度的游戏，也不愿意随随便便塞给用户一个粗制滥造的小作坊作品。在产品质量的打磨上，无论是对于 GitCafe 这个主线产品还是对于 GitBubble 这个支线附属物，我们都同样重视，这是我司逼格。

你们可能以为事情到这里就 Happy Ending 了，那句话怎么说来着：理想是丰满的，现实是骨感的。

2014.12.23 冬至

我们计划的上线时间是 2014.12.23 下午 4 点，或者说是对外公布的时间更加准确。我在 22 号的下午开始陆续联系了几家关系不错的小伙伴希望上线后能帮我们推一下这个小游戏。作为我们 GitBubble 云主机服务的提供商 UCloud 自然成为重点内测伙伴。在暗搓搓的保密协议下，UCloud 的小伙伴们很积极的成为了我们的首批内测用户。

事实证明我们的内测用户都非常给力而且十分专业。欣怡，UCloud Mkt一姐，你们别看她整天朋友圈说自己是脑惨儿童欢乐多自黑小霸王其乐无穷，关键时刻这种牛逼人物表达专业看法的时候一点都不含糊。试玩结束后马上就一通电话告诉我们游戏在市场策略上考虑不周的几点，并提出了许多非常宝贵的建议，老实说一开始我也是蛮固执的没听进去，但是回头想想她说的很有道理，自己真心图样图森破，感谢欣怡感谢 UCloud。恩，今年托尼马还有 32 场裸奔秀（伪） ，你要不要拿张观摩券？（大误）

哦对，然后又是一场项目迭代的修罗场，Ryan 不哭站着撸。
…...

再后来，GitBubble 就长成了各位现在看到的样子，和其他游戏相比，我们在游戏质量上完全有自信有底气说 GitBubble 一点都不必它们差，甚至比他们要好得多。GitBubble 是 GitCafe 做的第一个移动端小游戏，也可能是最后一个。它能活多久我不知道，它会不会火起来我也不知道，但是我知道在这开发的期间，我们经历过的那些点滴。我们遇到了许许多多未曾想到的问题，我们有的选择了克服有的选择了妥协，但最终，我们把它实现了。如果说 Ryan 赐予了 GitBubble 骨骼与血肉，那么 Kawi 则赋予了 GitBubble 极佳的气质与长相。感谢两位一直以来的辛苦工作把我的一个小小 Idea 变成了现实，感谢 Ryan 每一个工作到凌晨 2-3 点的周末，感谢 Kawi 在繁忙的工作中还能作出如此完美的视觉设计，也感谢我们的 PM在整个 GitBubble 项目周期中给与的建议与支持。

最后附上 GitBubble 的地址：
http://gitbubble.gitcafe.com/
推荐使用移动端微信浏览器打开，你懂的。(请点击「阅读全文」)

今天是 2014.12.24 ，我们的 GitBubble 刚刚正式上线 1 天，在这个平安夜，希望我们的 GitBubble 能给各位带来一丝温暖和欢乐，感谢各位。

Merry Christmas & Happy New Year！

最后附上GitBubble的地址：http://gitbubble.gitcafe.com
推荐使用移动端微信浏览器打开，你懂的。

--- GitCafe 专业打杂 George @Gu_Bonjour