真大神!利用一部手机,成功实现 "跨界" 复制粘贴 ,这位设计师把 AR 玩出了新花样!

聪明的人确实是可以做很多事的。

近日,一位身兼数职的斜杠青年 Cyril Diagne 设计了一个复制粘贴的工具,只要你拥有一个支持 AR 功能的智能手机,在手机上预装这款名为  AR Cut & Paste 的工具,然后拍下你想复制的东西,便可将图像复制粘贴进 Photoshop。

真大神!利用一部手机,成功实现

图自:网络

这里是视频链接:http://t.cn/A6A6NL1q 。

真大神!利用一部手机,成功实现

真大神!利用一部手机,成功实现

真大神!利用一部手机,成功实现

图自:视频截图

正如上面几张图片所示,这款工具什么都可以一键复制,设计师们再也不用担心素材不够用了!不过,目前该工具的剪切延迟大约为 2.5 秒,粘贴延迟大约为 4 秒,流程还可以进一步加速。

令人期待的是,作者还给大家留了一个小惊喜:下周将会发布另一个 AI+UX 原型!

平面设计师的福音

也许是设计师出身的缘故, Cyril Diagne 总是有很多出人意料的想法。

比如,他曾经研究出一种人脸涂鸦工具,借助 Tensorflow.js、FaceMesh 和 Three.js 即可在网页浏览器上使用 AR 对脸部进行涂鸦。

真大神!利用一部手机,成功实现

图自:github

还有一款可在 Instagram 个人主页图像上添加 3D 效果的 chrome 扩展程序,效果生成类似于 Facebook 3D 照片功能,让 2D 照片也能呈现多角度的景象。

真大神!利用一部手机,成功实现

图自:github

那么,这款工具又是如何实现将现实照片直接复制进 Photoshop 的呢?

据作者上传到 github 的资料显示,AR Cut & Paste 工具是一个 AR+ML 原型(prototype),它可以从周围环境中拷贝固定对象,并粘贴在图像编辑软件中(Photoshop)。不过,这款工具目前只适用于  Photoshop 软件,未来可能支持处理不同的输出。

该原型作为 3 个独立模块运行:即移动应用、本地服务器和显著性检测和背景去除服务。

具体使用方法如下:

首先,你需要在手机上预装这款工具;

npm install

其次,你需要更新一下 IP 地址,并指向你的本地配置;

3: const URL = "http://192.168.1.29:8080";

最后,显著目标检测和背景移除由外部服务执行(即 BASNet 技术)。

curl https://download.pytorch.org/models/resnet34-333f7ec4.pth -o resnet34-333f7ec4.pt

docker build -t basnet .
docker run --rm -p 8080:8080 basnet

BASNet 是什么?

BASNet 是一种关于边界的显著性检测,其聚合了多层深度特征的网络,它更关注整个图像的全局对比度上,而不是局部或像素特征,所以,相比其他的显著性检测方法,能够大大减少误差。

在架构上,主要分为两个模块:

真大神!利用一部手机,成功实现

图自:BASNet : Boundary-Aware Salient Object Detection 论文

预测模块:设计成编解码网络,因为这种结构能同时捕获高层次的全局上下文和低层次的细节。编码器有一个输入卷积层和由基本res块组织称的六部分。为了更进一步捕捉全局信息,在编码器和解码器之间加了一个桥接块,包含三个卷积层。解码器与编码器基本对称,每个阶段的输入是解码器的前一阶段的上采样和编码器相应阶段输出的级联。取最后一层精度最高的图作为预测模块的输出。

优化模块:通过残差块优化粗糙的显著图。粗糙包括:1)模糊有噪声的边界;2)不均匀预测的区域概率。实际的粗糙预测图两种都包含。残差优化模块最初被提出用来用于边界优化,然而,由于设计的模块很浅,难以捕获高级信息进行优化。RRM采用残差编解码器架构,包含输入层,编码器,桥接层,解码器和输出层,编码器和解码器包含4个阶段,每个阶段只有一个卷积层。

总的损失等于每个输出图的损失的加权和。共有 8 个输出,7 个来自预测模块,1 个来自优化模块。

真大神!利用一部手机,成功实现

每层的损失包括三个部分:BCE loss、SSIM loss 和 IoU loss。

真大神!利用一部手机,成功实现

这样一来,就能获得高置信度显著图和清晰边界。

然后,利用 OpenCV SIFT 找出手机在电脑屏幕上对准的位置。只需要一张手机照片和截图,就可以得到准确的 x, y 屏幕坐标系。

这就是这款软件的全部使用细节及技术细节,感兴趣的童鞋可以自己输入代码尝试下。

需要注意的是,该设计的作者也表示,目前这只是一个研究原型,但根据 Diagne 视频的回复,似乎已经有数家公司在开发类似的软件。相信在不久的将来你可能会在应用商店看到类似的工具。  

而这项设计的深远意义则在于它巧妙地颠倒了通常的增强现实范式,不是将数字图像投射到物理世界,而是将物理世界带入数字世界。

雷锋网雷锋网(公众号:雷锋网)雷锋网

参考来源:

[1]https://www.hindustantimes.com/tech/googler-shows-the-future-of-copy-and-paste-functionality-using-augmented-reality/story-bUw5GUnfRatsYoK5C0FlSL.html

[2]https://github.com/cyrildiagne/ar-cutpaste

[3]https://www.theverge.com/2020/5/4/21246386/augmented-reality-ar-copy-cut-paste-real-world-photoshop-demo

[4]http://openaccess.thecvf.com/content_CVPR_2019/papers/Qin_BASNet_Boundary-Aware_Salient_Object_Detection_CVPR_2019_paper.pdf

雷锋网原创文章,未经授权禁止转载。详情见转载须知

真大神!利用一部手机,成功实现

(完)