聰明的人確實(shí)是可以做很多事的。

　　近日，一位身兼數(shù)職的斜杠青年 Cyril Diagne 設(shè)計(jì)了一個(gè)復(fù)制粘貼的工具，只要你擁有一個(gè)支持 AR 功能的智能手機(jī)，在手機(jī)上預(yù)裝這款名為 AR Cut & Paste 的工具，然后拍下你想復(fù)制的東西，便可將圖像復(fù)制粘貼進(jìn) Photoshop。

圖自：網(wǎng)絡(luò)

　　這里是視頻鏈接：http://t.cn/A6A6NL1q

圖自：視頻截圖

　　正如上面幾張圖片所示，這款工具什么都可以一鍵復(fù)制，設(shè)計(jì)師們?cè)僖膊挥脫?dān)心素材不夠用了！不過(guò)，目前該工具的剪切延遲大約為 2.5 秒，粘貼延遲大約為 4 秒，流程還可以進(jìn)一步加速。

　　令人期待的是，作者還給大家留了一個(gè)小驚喜：下周將會(huì)發(fā)布另一個(gè) AI+UX 原型！

　　平面設(shè)計(jì)師的福音

　　也許是設(shè)計(jì)師出身的緣故，Cyril Diagne 總是有很多出人意料的想法。

　　比如，他曾經(jīng)研究出一種人臉涂鴉工具，借助 Tensorflow.js、FaceMesh 和 Three.js 即可在網(wǎng)頁(yè)瀏覽器上使用 AR 對(duì)臉部進(jìn)行涂鴉。

圖自：github

　　還有一款可在 Instagram 個(gè)人主頁(yè)圖像上添加 3D 效果的 chrome 擴(kuò)展程序，效果生成類似于 Facebook 3D 照片功能，讓 2D 照片也能呈現(xiàn)多角度的景象。

圖自：github

　　那么，這款工具又是如何實(shí)現(xiàn)將現(xiàn)實(shí)照片直接復(fù)制進(jìn) Photoshop 的呢？

　　據(jù)作者上傳到 github 的資料顯示，AR Cut & Paste 工具是一個(gè) AR+ML 原型（prototype），它可以從周圍環(huán)境中拷貝固定對(duì)象，并粘貼在圖像編輯軟件中（Photoshop）。不過(guò)，這款工具目前只適用于 Photoshop 軟件，未來(lái)可能支持處理不同的輸出。

　　該原型作為 3 個(gè)獨(dú)立模塊運(yùn)行：即移動(dòng)應(yīng)用、本地服務(wù)器和顯著性檢測(cè)和背景去除服務(wù)。

　　具體使用方法如下：

　　首先，你需要在手機(jī)上預(yù)裝這款工具；

npm install

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

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

　　最后，顯著目標(biāo)檢測(cè)和背景移除由外部服務(wù)執(zhí)行（即 BASNet 技術(shù)）。

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 是一種關(guān)于邊界的顯著性檢測(cè)，其聚合了多層深度特征的網(wǎng)絡(luò)，它更關(guān)注整個(gè)圖像的全局對(duì)比度上，而不是局部或像素特征，所以，相比其他的顯著性檢測(cè)方法，能夠大大減少誤差。

　　在架構(gòu)上，主要分為兩個(gè)模塊：

圖自：BASNet: Boundary-Aware Salient Object Detection 論文

　　預(yù)測(cè)模塊：設(shè)計(jì)成編解碼網(wǎng)絡(luò)，因?yàn)檫@種結(jié)構(gòu)能同時(shí)捕獲高層次的全局上下文和低層次的細(xì)節(jié)。編碼器有一個(gè)輸入卷積層和由基本 res 塊組織稱的六部分。為了更進(jìn)一步捕捉全局信息，在編碼器和解碼器之間加了一個(gè)橋接塊，包含三個(gè)卷積層。解碼器與編碼器基本對(duì)稱，每個(gè)階段的輸入是解碼器的前一階段的上采樣和編碼器相應(yīng)階段輸出的級(jí)聯(lián)。取最后一層精度最高的圖作為預(yù)測(cè)模塊的輸出。

　　優(yōu)化模塊：通過(guò)殘差塊優(yōu)化粗糙的顯著圖。粗糙包括：1）模糊有噪聲的邊界；2）不均勻預(yù)測(cè)的區(qū)域概率。實(shí)際的粗糙預(yù)測(cè)圖兩種都包含。殘差優(yōu)化模塊最初被提出用來(lái)用于邊界優(yōu)化，然而，由于設(shè)計(jì)的模塊很淺，難以捕獲高級(jí)信息進(jìn)行優(yōu)化。RRM 采用殘差編解碼器架構(gòu)，包含輸入層，編碼器，橋接層，解碼器和輸出層，編碼器和解碼器包含 4 個(gè)階段，每個(gè)階段只有一個(gè)卷積層。

　　總的損失等于每個(gè)輸出圖的損失的加權(quán)和。共有 8 個(gè)輸出，7 個(gè)來(lái)自預(yù)測(cè)模塊，1 個(gè)來(lái)自優(yōu)化模塊。

　　每層的損失包括三個(gè)部分：BCE loss、SSIM loss 和 IoU loss。

　　這樣一來(lái)，就能獲得高置信度顯著圖和清晰邊界。

　　然后，利用 OpenCV SIFT 找出手機(jī)在電腦屏幕上對(duì)準(zhǔn)的位置。只需要一張手機(jī)照片和截圖，就可以得到準(zhǔn)確的 x， y 屏幕坐標(biāo)系。

　　這就是這款軟件的全部使用細(xì)節(jié)及技術(shù)細(xì)節(jié)，感興趣的童鞋可以自己輸入代碼嘗試下。

　　需要注意的是，該設(shè)計(jì)的作者也表示，目前這只是一個(gè)研究原型，但根據(jù) Diagne 視頻的回復(fù)，似乎已經(jīng)有數(shù)家公司在開(kāi)發(fā)類似的軟件。相信在不久的將來(lái)你可能會(huì)在應(yīng)用商店看到類似的工具。　　

　　而這項(xiàng)設(shè)計(jì)的深遠(yuǎn)意義則在于它巧妙地顛倒了通常的增強(qiáng)現(xiàn)實(shí)范式，不是將數(shù)字圖像投射到物理世界，而是將物理世界帶入數(shù)字世界。

　　參考來(lái)源：

　　[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

總結(jié)

以上是生活随笔為你收集整理的一部手机，成功实现 "跨界" 复制粘贴 ，这位设计师把AR玩出了新花样的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。