Google七夕情人节Doodle背后技术揭秘

jopen 11年前

        七夕佳节,习惯了玫瑰、巧克力包围的西方情人节,终于轮到了纯真的中国式浪漫。Google 今天也应景推出了一个新的 Doodle,而且还是个小游戏。

        这个小游戏暗藏了三道关卡,需要用户在限定的时间内将各种颜色的小喜鹊放到与其颜色对应的圈圈中,从而为牛郎织女搭起鹊桥,而且游戏难度会随着关卡的深入而逐渐上升。

Google七夕情人节Doodle背后技术揭秘

        也许你觉得这种小游戏太简单太幼稚,但如果你够细心,就会发现看似简单的背后隐藏着不少的亮点与秘诀,比如第一关一只喜鹊搭桥,第二关两只喜鹊 双宿双飞,第三关两只大喜鹊和一只小喜鹊组成桥洞,相信这是每个人所期待的大团圆结局,甚至还有调皮的小喜鹊不愿意乖乖地待着,即便被抓住也会趁你不注意 时偷偷飞走,让鹊桥无法迅速搭好。

        通关之后,牛郎织女相聚鹊桥,同时响起背景音乐“花好月圆”,这就是每个人心向往之的“有情人终成眷属”吧。

Google七夕情人节Doodle背后技术揭秘

        和之前的很多 Google Doodle 一样,这里也是体现新的 Web 技术的地方。据了解,这其实是一款基于 HTML5 技术的网页游戏,Google 采用了贝塞尔曲线和 CSS3 来实现喜鹊飞行的途径和方向,31 颗闪烁的星星则都采用正弦曲线规则创作,每个星星闪耀的亮度、步调、速度都不一样。

        此外,这个 Doodle 还利用了 Sprite 技术和资源分阶段下载,加快载入速度,比如 200 多张图片就通过 Sprite 技术合成为 4 张,大大减少网页下载时间。

        Doodle 中的不少动画,比如人物走动、人物落水、喜鹊飞行姿态、飞行路径等,通过一个中央控制器完成的,以减少 CPU 消耗。

Google七夕情人节Doodle背后技术揭秘

        这个七夕 Doodle 可以在中国大陆、香港、台湾、韩国、新加坡、马来西亚等地的 Google 首页上看到,其他地区如果设置为简体中文也能找到。

        顺便说一句,百度今天也换标了,但只是个简单的图片。差距啊……

Google七夕情人节Doodle背后技术揭秘

        Google 近来的其他中国特色 Doodle:

Google七夕情人节Doodle背后技术揭秘

        大闹天宫

Google七夕情人节Doodle背后技术揭秘

        2013 蛇年 Doodle

Google七夕情人节Doodle背后技术揭秘

        纪念李时珍诞辰 495 周年

来自: 驱动之家