Archive

Archive for the ‘html5’ Category

记录一下 5 月 28日 的 Google HTML5训练营

May 29, 2011 3 comments
28号星期六。我是26号经 杜欢 提醒,才想起来这回事。之前看过这个消息没报名。然后26号半夜发报名申请邮件。27号没消息,然后找Google China 的HR 帮忙问了下,相当于走后门提申请了。最近一直构思着做一个在线的劲乐团。我期待着过去之后的 hackathon 环节,能找些人一起做一下。
28号的上午一直在家做一些准备工作。劲乐团的音符数据,都是从一个开放的Be-Music Script 格式转过来的。另外,网上也有不少 O2Jam note file(.ojn, .ojm) 资源,都是二进制文件,而且不一定是开放格式,所以先不考虑了。转数据的脚本最开始是参考 github 上的一个项目 O2.js,不过这个项目现在很草稿,里面的解析脚本有问题。一上午在家,把BMS 转成 frame 位置到音符的映射表。基本可以让音符自己往下掉了。做的过程中也遇到了不少坑。比如,O2Mania 游戏中,对按键键位的定义,跟原始的BMS 格式定义不一样,导致解析后音符错位。折腾到12点半才出门。活动一点钟开始的,我估计坐公交换地铁,肯定会迟到了,于是直接打车过去。
下车之后,问人才找到地方,在一个小区里,场地是一个咖啡厅,两个房间。人挺多,看起来报名的人都有一两百,当然没全来,还有没报名现场直接签到的,有是多个人。我扫下名单,没我名字,然后在后面加上去了。我去里面房间,找一个位子坐下了。现场有免费的饮料、点心。刚好中午没吃饭,于是吃些点心充饥。我谁都不认识,刚开始也没怎么跟别人聊。过了好一会儿杜欢才来,然后讲座开始。第一个讲座是淘宝的李晶将怎么用 HTML5 做网站,讲了不少兼容性问题,我站后面跟杜欢听了下。第二讲是杜欢的,关于 HTML5 的游戏开发。第二讲和第三讲我都没仔细听。因为音乐和音符出现明显的不同步,发现了脚本生成的数据中,BPM(beats per minute)不对。然后改脚本,大概是那时候BPM解析的问题解决了。
讲座完了之后,就是传说中的 hackathon 环节了。我直接过去找杜欢,结果他说可能没空参与… 还好杜欢旁边坐着的是上上次创新工厂的 HTML5 交流会上认识的邱迪,然后我把我的想法跟他说了一下,顺便邀请另外两人一起做。项目介绍花了好长时间 =,= 后来觉得费时,我直接说分工了。4个人,我继续解决音乐和音符的同步问题,邱迪做游戏流程控制,男A做 canvas 效果,女B 做canvas 外部的页面… 我的代码直接放 github 上的,男A 用 mac,可以直接 clone git 项目,邱迪和女B 木有 git,只好用U盘…… hackathon 在紧张的气氛中开始了……
Hackathon 过程中,我做的事情基本上是 数值的调整以及代码合并。计算 frame 位置的公式是我昨晚推导出来的。直接按照公式,音符下落的速度很快。也不知道是公式的问题,还是实际fps 不准,我把生成数据脚本中的 fps 参数,从32 改到128,下落速度基本ok了;然后是调初始帧的数值,都是很细节的东西,不一一说了。后来合并代码,邱迪的开始界面写了两个,一个是 HTML,一个是用 canvas 画出来的。合了号半天才成功。女B做的东西改了canvas 的宽度,引发一系列问题,后来直接放弃了… 她住的似乎比较远,代码给我之后她提前回家了。男A的代码是做按键时的渐变效果。我看他是先自己写测试页面再来改我代码…… 靠谱。合代码也不顺利,一开始效果不理想,然后叫杜欢帮忙看,他也查文档做调整,还是实现了预期效果。代码合好了之后我才松口气吃饭去…… 对了,Google 连晚餐都提供了……
作品展示。我还是挺紧张,台下是想的东西到了台上都忘了说。3个小时,刷几道算法题还可以,做游戏的话时间太短。而且感觉是 Hackathon 的参与者大多比较小白,我也算一个吧…… 然后是作品评分,然后就有了一个二等奖。领奖时还是紧张了,CCTV都谢了都没谢Google… 奖品是一个音响,由于开发基本上是我主导,我就把奖品独吞了…… 回去的地铁上跟男A聊了下,男A同学在读研,创新工厂实习,做豌豆荚的;本科居然是学的经管,挺靠谱的一人,赞一个…
回来之后再仔细看这个活动博客:http://www.enjoyhtml5.com,才发现活动是 Google Chrome 技术推广部组织的。我也顺便推广下 chrome 。我笔记本 Ubuntu 11.04 上,我都把自带的 firefox 4 都删掉了。普通使用的话,firefox 没有不能被 chrome 取代的地方;firefox 的程序框架也比chrome 厚重;稳定性和易用性也是 chrome 胜出。即使是对于咱们程序员而言,研究出chromium 的安全漏洞可以拿悬赏奖金,你看firefox 代码有这好处么……
update at 5.31:
在 github 上建立了一个 project page, 可以看 sample: http://liruqi.github.com/gin-samples/o2/ 可能会后续做完善。
Categories: html5