我们一直想实现在手机小程序,打开就能拼积木,功能也尽可能的做到电脑拼搭的效果。

但是这件事的难度是真的很大。所以过去2~3年时间,我们一直在想办法技术突破,终于这件事做出来了!

在线拼搭入口:

打开网易新闻 查看精彩图片

现在,只要在底部导航点击“拼搭”,就能够进入拼搭广场,点击顶部宣传图就能进入工作区了。

打开网易新闻 查看精彩图片

在这里,我们就能够用上PC端几乎所有大家能想到的拼搭功能。接下来让我慢慢介绍。

添加零件:

打开网易新闻 查看精彩图片
打开网易新闻 查看精彩图片

点击底部菜单“添加”,即可看到零件表,选择需要的零件和颜色添加到工作台

添加套装零件:

打开网易新闻 查看精彩图片

如果是套内情况,零件范围会被套装零件限制,方面大家进行套内创作:

打开网易新闻 查看精彩图片

零件旋转

长按零件,就会出现三个轴的剪头。点击剪头拖动就可以旋转:

打开网易新闻 查看精彩图片

如果零件吸附在了铰链等上面,旋转范围会被限制,剪头会有相应提示:

打开网易新闻 查看精彩图片

零件打包

先长按空白位置,拖动绿色框,选中零件。

打开网易新闻 查看精彩图片

然后点击左下角“打包”:

打开网易新闻 查看精彩图片

就可以对这批零件进行子模型管理。

零件复制与粘贴

有了零件打包后,就可以批量复制黏贴,提高拼搭效率:

打开网易新闻 查看精彩图片

注意,套内的拼搭,复制黏贴会被零件表的数量限制。

分享拼搭模型(ldr)

拼搭完成,除了可以保存在云端,还能直接导出ldr格式的图纸,发送给“文件传输助手”。

打开网易新闻 查看精彩图片

高清渲染:

同时,小程序目前支持8K的高清渲染,效果如下:

打开网易新闻 查看精彩图片

虽然渲染效果不如PC,但是也够用了。(目前测试阶段,可能存在一些渲染的BUG,我们会逐步找出来并修复)。

最后,让我们看看从0开始,在小程序拼搭出30723套内校车,需要多少秒

现在,小程序已经全面更新,赶快点击下方进入小程序尝试拼搭吧:

打开网易新闻 查看精彩图片

其他一些分享:

最后分享下实现这个功能的一些过程难点。最复杂的当然就是性能调优。

小程序限制了代码尺寸和运行内存,而且还有阉割版本的webGL。这导致过去几年,我们一直重写整个渲染核心。光three.js我们就重写了很多次,最后用上了c++去重写打包wasm才终于实现了秒加载。

其次就是吸附功能。这几乎就是体力活,需要对积木颗粒每个特定位置标记凹凸点才能实现吸附。

之后,我们会基于这个拼搭做一些好玩的小游戏,也希望大家给给意见,看还需要什么功能,欢迎留言!

评论区来讨论下吧!!

积木圈子 每日提供最新玩具资讯!