@ 2014.05.20 , 11:07
34

Google的3D魔方涂鸦是怎么做出来的?

5月19日Google在首页发布了有史以来最酷的涂鸦:一个3D互动魔方。

[-]

3D魔方也是Google公司处理过的最有难度的涂鸦,魔方的成功要归功于CSS技术的进步和Google工程师们的聪明点子。制作这个拥有5.19X10^20种组合的魔方互动程序共耗去Google公司2个月的时间。

[-]
点击图片可进入魔方页面(耐心等待加载)

Google公司在重要的节日或纪念日发布涂鸦已经有14个年头,2年前Google发布了Moog合成器电子琴涂鸦,让全世界音乐爱好者为之疯狂,2010年的时候Google推出吃豆人涂鸦纪念吃豆人游戏推出30周年。我们可以看出最棒的涂鸦都是艺术和技术的累积——魔方也是如此。但在此之前,因为技术原因, Google无法将可互动魔方web化。Google魔方涂鸦团队的负责人莱恩·吉米克说:“魔方涂鸦这个点子一次次被提出,但是我们觉得技术还不足以将魔方推向web。”

这种情况在最近几个月内有了变化,Google创新实验室的理查德称赞魔方涂鸦是“目前Google在技术上最宏大的项目之一”。CSS3D转换在越来越多的浏览器上的普及,意味着web魔方的可行性。

“CSS3D转换让魔方在3D空间显示成为可能,这与栅格化2D显示不同。”团队领队工程师克里斯托弗·霍姆说,“3D显示会让魔方看起来更生动,随着你移动鼠标,你可以亲眼看到魔方在3D空间中旋转。”

吉米克说,制作3D魔方最大的困难在于捕捉魔方的简洁设计。“从设计方面看,我们希望设计的尽量简单简洁,最大程度简化了魔方的UI。”

Google还向外界放出了魔方的源代码,还在Chrome Experiment发布了几个数字互动魔方程序,同时还与美国著名的自由科学中心合作了一个实时互动展示项目,以纪念魔方诞生40周年。

以前较早的Google魔方涂鸦:

[-]

[-]

[-]

[-]

[-]

视频:

本文译自 Wired,由译者 王大发财 基于创作共用协议(BY-NC)发布。


给这篇稿打赏,让译者更有动力
支付宝打赏 [x]
您的大名: 打赏金额:

4.6
赞一个 (3)

TOTAL COMMENTS: 34+1

  1. pushit
    @4 years ago
    2413297

    看个锤子

  2. 2413298

    李彦宏叫来程序员啪啪就是几个耳光:“看看人家做的,再看看你自己做的!”

    [353] XX [4] 回复 [0]
  3. 虚原
    @4 years ago
    2413299

    反正扭不过来……

    [22] XX [0] 回复 [0]
  4. 2413303

    有点好玩

  5. 织田尼采
    @4 years ago
    2413304

    不知道谷歌内部各种大神都有没有女朋友···

    [60] XX [3] 回复 [0]
  6. 普拉内托斯
    @4 years ago
    2413305

    昨天玩了好久~

  7. 牡丹
    @4 years ago
    2413307

    还有那天google首页的链接么

  8. 2413309

    @织田尼采: 谷歌员工平均年薪12.7万美元。

    [62] XX [0] 回复 [0]
  9. 疯狗
    @4 years ago
    2413314

    #别人家的程序员#

    [113] XX [0] 回复 [0]
  10. 2413315

    大概是快到中国互联网日北京联通什么google都上不去,连Gmail都是用basic HTML勉强开开…

  11. 灯泡小队长
    @4 years ago
    2413316

    只会层选法。。我是菜菜

  12. 木云北
    @4 years ago
    2413321

    好后悔没有玩!我看见了的明明看见了的!!!!!!!!!!!!!

  13. 德特
    @4 years ago
    2413325

    真的是用css3做的?
    我还以为是用canvas呢。。

  14. 嗚哇~
    @4 years ago
    2413332

    @y: 稅後拿到8萬, 每個月房租+水電網3k, 剩下少得可憐啊

    [2] XX [18] 回复 [0]
  15. sishill
    @4 years ago
    2413334

    可爱 也会太短?

  16. 2413338

    马化腾叫来程序员:给我复制粘贴一份。

    [155] XX [2] 回复 [0]
  17. 喜萌国王
    @4 years ago
    2413341

    = = 都不知为了啥···就展示一天···就没了···花那么多精力···

    不过谷歌持之以恒的首页涂鸦的确让人佩服··

    [15] XX [2] 回复 [0]
  18. 奇一
    @4 years ago
    2413355

    昨天试了下,就拼出一面,唉

  19. tentacle
    @4 years ago
    2413404

    我可不可以恶意揣测下其实这玩意就是几个图形学大牛写了套纯矢量代码然后优化优化优化做出来的玩意?

  20. 吐了一裤子
    @4 years ago
    2413415

    李彦腾说其实他记住了所有注册用户的生日——如果你填了。

  21. 勇者
    @4 years ago
    2413429

    玩不起。。。

  22. 的撒范德萨发
    @4 years ago
    2413437

    昨天玩了几下,本来就不懂怎么玩,立体的就更不会了。

  23. forvord
    @4 years ago
    2413447

    google,科技的领引者。希望自动驾驶汽车尽快普及

  24. 欧耶
    @4 years ago
    2413450

    @tentacle: 不是把,看代码是div旋转变形然后拼接的,基本上就是用js写了个3d引擎然后用div加上class当贴图。

  25. 2413452

    买一个不就好了 = = 好吧,我承认我不会玩

  26. 阿了个乐
    @4 years ago
    2413476

    不好用啊,不好用啊,反正扭了半天都不是多扭了就是扭不动

  27. 2413622

    @y: 我可以负责任的告诉你对于程序员来说有木有妹子还真和工资没关系,我自己是这行的,收入还行吧,单身。我认识非常多这行的(都在30以下),大部分收入都在当地算是不错的,但是大部分都是单身。

  28. 2413623

    @牡丹: https://gstatic.com/logos/2014/rubiks/iframe/index.html

  29. 2413704

    源码在哪里?

  30. 2413783

    很难操作

  31. charon627
    @4 years ago
    2413784

    求码!!

  32. charon627
    @4 years ago
    2413801

    有源码吗,能解释一下怎么做到的吗

  33. 十一哥
    @4 years ago
    2413993

    程序员和单身也没有必然联系吧

  34. 2414205

    说起这个,Google每逢节假日或伟人诞辰等等的不平凡节日都制作精美的设计真的很赞

发表评论


24H最赞