這種動態二維碼是怎麼實現的？

01-06

參考：百度動態GIF版「夢幻二維碼」我也很想做這麼一個炫酷的二維碼，那位大神了解怎麼實現嗎？

我的方法有點麻煩，期待有人找出更簡便的方法。

但是我這個方法可以插視頻啊，完全自己定製樣式，可選性更高一點，配合gif壓縮工具還是可行的。

知乎gif不會動，點這裡看效果圖lijinyao.github.io 的頁面

不出問題的話掃描結果是：

Fancy QR Code

用到的軟體：Ps, Pr

首先，準備好一張二維碼（解析度要高），比如這張：

還有一個背景視頻，之後要注意使用這個視頻要確保二維碼能被掃描。

然後在ps中新建一個文件，寬度高度都是1000，背景選白色。

建好之後把準備好的二維碼拖進ps中，再在二維碼上新建一個圖層：

然後切換回二維碼的圖層（選中上圖中那串數字的圖層），切換到魔棒工具。點擊一下二維碼以外的地方。

點了之後接著右鍵-》選擇相似：

然後切換回鏤空二維碼圖層，填充白色或者其他你想要的顏色。

然後將其他圖層隱藏：

最終效果如下：

把它保存為PSD文件。

接下來打開Pr。新建項目

然後新建序列：

接著選擇序列，序列設置，按照下圖修改：

然後導入剛才做好的PSD文件和你的視頻背景，像下圖中拖入到序列的軌道上：

你可以在每條軌道上前後拖動，讓視頻和PSD文件的長度一樣就可以。時間不要太長，像這樣：

好看一下效果如何：

Fancy QR Code (二維碼自動識別)

好！接下來我們把它導出為GIF，文件-》導出，按照下圖設置：

(我這樣設置導出文件有點大，可以減小寬度和長度還有幀速率就可以減小文件大小)

Fancy QR Code (二維碼自動識別)

好啦！這樣我們就得到了一個會動的二維碼啦！

就是個GIF。知乎對上傳圖片處理了，沒法直接上傳gif圖。。。

百毒搜索：GIF在線製作，u can get it.

作者：野鹿志

鏈接：知乎專欄

來源：知乎

著作權歸作者所有。商業轉載請聯繫作者獲得授權，非商業轉載請註明出處。

1、首先我們需要準備一個純黑白的二維碼，注意！不是公眾號後台下載的中間帶logo那種哦！

http://weixin.qq.com/r/UDrawgXE01isrUGh929C (二維碼自動識別)

由於公眾號後台下載二維碼都是自帶Logo的，這裡給大家安利一個網站：

草料二維碼

http://cli.im/

我平常製作簡單的二維碼幾乎都用它，由於它不是今天的主角，所以詳細功能改日再介紹，先看看如何用它準備純黑白的二維碼吧！

首先打開草料二維碼網站：

點擊右上角紅色的更多

然後點擊生成工具中的微信二維碼

這裡只要輸入微信公眾賬號

就可以自動生成二維碼啦！然後直接點擊下載即可！

http://weixin.qq.com/r/UDrawgXE01isrUGh929C (二維碼自動識別)

準備好純黑白的二維碼以後，接著我再給大家安利另外一個網站：

第九工廠

http://www.9thws.com/

這個網站有不少不錯的二維碼模版，有些是付費的，可以簡單方便的幫你把土得掉渣的黑白二維碼美化的不要不要的...具體操作這裡不再贅述，有興趣的童鞋可以去試試。

hello world (二維碼自動識別)

這裡我隨便選擇一個哥斯拉的模版來製作，點擊上傳普通二維碼

http://weixin.qq.com/r/UDrawgXE01isrUGh929C (二維碼自動識別)

這樣我們就可以得到一個漂亮的靜態二維碼了

http://weixin.qq.com/r/UDrawgXE01isrUGh929C (二維碼自動識別)

以上，已經得到一個不錯的二維碼了，接下來是要做成動態的，例如圖中的汽車、消防車、火焰、以及怪獸，怎麼樣讓他們動起來呢？

有人說：用美圖秀秀把這些元素摳出來、抹掉，再加進去就行啦！

這樣野郎覺得太麻煩啦！我的辦法是用ppt！

首先把二維碼以圖片的形式插入幻燈片中，我覺得三個角的碼眼不好看，直接用二維碼覆蓋。

http://weixin.qq.com/r/UDrawgXE01isrUGh929C (二維碼自動識別)

碼眼替換是不會影響二維碼掃描的

（關於二維碼的構造，如果大家感興趣的話，可以後台撩我哦，我會根據大家的反饋情況進行分享！）

接下來就是要把圖中的汽車、消防車、火焰、以及怪獸給去掉，方法也很簡單，直接插入圖形-矩形，然後填充白色，無線條，將這些元素覆蓋就可以了！

當然，雖說方法簡單，要一個元素一個元素的覆蓋也是個細緻活啦！大家可以看到野郎上面這張圖上覆蓋了多少矩形，不過相對於一個元素一個元素的摳出來再抹去，這個辦法算是簡單的啦！最後再將所有元素組合，我們就得到了這張圖：

http://weixin.qq.com/r/UDrawgXE01isrUGh929C (二維碼自動識別)

這個時候我們就要發揮一些想像啦！例如：

圖畫里首先應該出現的是一些汽車

http://weixin.qq.com/r/UDrawgXE01isrUGh929C (二維碼自動識別)

汽車在城市中正常行駛

http://weixin.qq.com/r/UDrawgXE01isrUGh929C (二維碼自動識別)

突然城市裡來了一些怪獸

http://weixin.qq.com/r/UDrawgXE01isrUGh929C (二維碼自動識別)

怪獸在城市裡大肆破壞，於是著火了緊接著怪獸越來越多

著火處也越來越多

消防車也趕來救火

http://weixin.qq.com/r/UDrawgXE01isrUGh929C (二維碼自動識別)

於是，按照這個思維方向和邏輯，我做了12張圖片：

然後再打開美圖秀秀，利用更多功能中的閃圖功能

選擇自定義閃圖，將12張圖片全部添加幀，最後再適當的調節一下速度：

最後我們再來看一看成果吧：

http://weixin.qq.com/r/UDrawgXE01isrUGh929C (二維碼自動識別)

長按之後正常識別，沒毛病！

怎麼樣！

不能和設計師相比，糙是糙了點

不過野路子方法也挺好用啦

感興趣的話趕緊去試試吧！

如果你有更簡單的方法

歡迎後台撩我哦！

本文由「野鹿志」發布

歡迎分享，轉載請註明出處

----------------------------------------------

Keep Curiosity Keep Learning

公眾號ID：yeluzhi666

微信ID：maluyelang666

1、準備素材：做背景的GIF 和不帶LOGO的二維碼（展示效果更佳）

PS：百度【草料二維碼】- 更多功能 - 微信，可生成不帶LOGO的公眾號二維碼，當然此軟體還可以將文本/網站/圖片等生成二維碼形式，並能製作不同形狀的二維碼

2、打開PPT，插入二維碼和GIF（GIF置於底層），點擊二維碼，在工具欄中選擇【圖片工具】- 設置透明色，選取二維碼的黑色為透明，完成後效果如下：

3、將PPT另存為視頻

4、打開視頻轉GIF軟體，小官這裡用的是【若水GIF動態截圖】，可去百度下載

5、打開剛剛保存的視頻和「若水」軟體，點擊「若水」里的【區域截圖模式】，框出視頻里想要截取的範圍後，點擊「若水」下方的【開始錄製】按鈕，在3秒倒計時後開啟視頻播放，在想要結束的地方點擊「若水」的【停止錄製】，最後保存預覽調整

關注「沒品內容官」（微信號：mpnrg1987）

好好學習，天天向上

很簡單，現在有個在線二維碼製作網站可以直接生成。只要上傳gif圖片就可以。Q碼的網站地址是：http://www.qmacode.com

sylnsfar/qrcode_win

最快最好的動態二維碼製作教程

個性動態二維碼，是你吸粉的利器【內有教程】

你問題的鏈接404了~

最近工作中剛接手了一個公眾號，恰好需要做二維碼創意圖，找到了個傻瓜式的方法（不用PS更不用Flash）。按照下面的步驟，你也可以做一張屬於自己的二維碼動圖啦！

https://mp.weixin.qq.com/mp/profile_ext?action=home__biz=MzU4NDM0MzgzNA==#wechat_redirect (二維碼自動識別)

（下方是動圖，點擊體驗↓↓↓）

[動態不動的話點這裡戳開] ?

https://mp.weixin.qq.com/mp/profile_ext?action=home__biz=MzU4NDM0MzgzNA==#wechat_redirect (二維碼自動識別)

一、事前準備

①準備二維碼

公眾號：登錄後台公眾號，點擊右上方公眾號頭像或者名字進入公眾號設置，選擇二維碼下載（最小尺寸）即可；

個人微信號：點擊底部菜單最右【我的】，然後點擊最上方微信頭像和昵稱，新頁面點擊二維碼名片，最後右上方點開保存到手機即可。

②找一張GIF背景圖

我直接用了戰狼2的素材，你也可以在其他網站通過「關鍵字+GIF」的字樣搜索到自己喜歡的圖片。比如堆糖網（https://www.duitang.com）搜索「GIF」

下載好的動圖你先看一下大小（通過滑鼠右鍵-屬性查看），因為微信公眾號上只能使用2MB之內的動圖。這張圖片的大小是2.72MB，這就需要我們進行壓縮。

③壓縮GIF圖片大小

在soogif動圖壓縮網站（http://www.soogif.com）——工具製作——GIF壓縮里選擇「＜2M公眾號」里上傳你的圖片，進行壓縮，保存。壓縮後圖片變為1.58MB。

二、將二維碼進行解碼

①選擇第三方工具

進入模板碼（http://www.mobanma.com/store.html）

http://weixin.qq.com/r/8EQOFjvEDWZyrX919xHi (二維碼自動識別)

在「免費模板」中隨便點一個模板，進入後點免費領取（購買成功，關閉頁面）。

http://weixin.qq.com/r/8EQOFjvEDWZyrX919xHi (二維碼自動識別)

②上傳二維碼

點「二維碼生成器」—上傳二維碼——選擇二維碼圖片，上傳自己的二維碼。

③二維碼解碼

解析解碼成功，點右下角藍色的美化二維碼。

選擇剛才購買的模板，點一下進入，應用模板。

http://weixin.qq.com/r/8EQOFjvEDWZyrX919xHi (二維碼自動識別)

等3-5秒生成圖片

對右側生成的圖片用QQ或者360瀏覽器工具進行截圖保存。

http://weixin.qq.com/r/4ziSigvEYlYdrU-p923x (二維碼自動識別)

最後選擇網頁最上方右側【解碼】

進入下面界面

在「選擇二維碼圖片處」把剛才的截圖進行上傳。

得到解析結果，選中，複製備用。

三、製作動圖二維碼圖片

進入動態二維碼製作網站（http://www.mobanma.com），上方有二維碼生成方式，選擇第一行第二個全視覺。

進入網頁後，點「上傳二維碼背景圖」，把一開始前兩步中下載的動圖上傳。

把「二維碼內容」粘貼成剛才複製（第③步最後）的，選擇喜歡的碼眼、元素，開啟提高識別率前面打勾。

點擊最下方生成二維碼。生成結果在右側出現。點擊「查看記錄」—點擊下載圖片即可保存到電腦。

http://weixin.qq.com/r/5DoxKRjEZ0UYrVxK92-2 (二維碼自動識別)

最後留給懶人黨，有人需要這個戰狼素材或者別的需求的都可以私信我。有空我會多做一些模版然後分享出來給大家。

喜歡看電影的朋友也可以掃一下二維碼支持支持哦，關注會送摩拜月卡和美團餓了么紅包哦！

https://mp.weixin.qq.com/mp/profile_ext?action=home__biz=MzU4NDM0MzgzNA==#wechat_redirect (二維碼自動識別)

[動態不動的話點這裡戳開] ??????

動態二維碼實現的發法有很多種。

1、直接用PS來做，這個當然需要有PS基礎的才可以製作；

2、利用在線的動態二維碼製作工具來做微信動態二維碼在線生成器_二維碼製作_微助點

這裡介紹第二種動態二維碼的製作方法，利用二維碼工具來生成動態的二維碼圖片

步驟一：

打開二維碼製作的頁面 微信動態二維碼在線生成器_二維碼製作_微助點

步驟二：選擇自己需要的動態二維碼背景圖

http://weixin.qq.com/r/jkhOVuzEf7EArag19x2c (二維碼自動識別)

步驟三：點擊【開始製作】按鈕進入二維碼上傳頁面

http://weixin.qq.com/r/jkhOVuzEf7EArag19x2c (二維碼自動識別)

步驟四：選擇左側的【點擊選擇圖片】按鈕

上傳自己的二維碼

步驟五：生成動態二維碼頁面，然後滑鼠直接另存為保存到電腦桌面就可以了。

萌妹子教程--個性動態二維碼gif製作|動效設計|UI|香雪糯米條 - 原創設計作品 - 站酷 (ZCOOL)