如何製作藝術二維碼

來自專欄《設計自學手冊》

先嘰嘰歪歪幾句。

知識無價，用知識創造的產品才具備價值。作為製作者，希望看到的是分享而不是拿來稱斤論兩。所以，不要再去報二維碼的相關課程了，這篇教程足夠。

最後圖效如下：

生成源文件

微信自帶的生成二維碼是不行的，解析度不夠，需要重新找到源文件，這裡我推薦用「草料」來導出二維碼的源文件，具體步驟如下。

1/ 點擊微信，在輸入框內輸入你的微信賬號。

3/ 自動生成，這裡有一個其他格式，下載SVG格式。

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

重置尺寸

1/ 將下載的二維碼文件導入AI內，更改屬性——單位——像素。

注意：如果黑色方塊的大小是1：1的比例，那麼我們把比例放大到50：50（pt）的比例，整個馬賽克就是1850*1850的大小。

2/ 選中二維碼圖層，設置寬高數值。

3/ 選中工具欄中的畫板工具，按Shift+Alt鍵將畫板（圖中白色區域）放大到合適大小。

信息中心點

注意：每個二維碼是由碼眼和信息素組成，碼眼用來判斷是否是二維碼，而信息素用來鏈接內容。

但不是每個小方塊都是有效信息。方塊的中心點才是有效信息，在50*50px的方塊中，中心點的有效信息一般是10——16（px）。

2/ 我在這裡用橢圓工具做一個的是直徑為12ptx像素點。把每個點都種在小方塊上，操作如下。

3/ 把中心點改成前景色紅色，並種在小方塊的中心，當圓點挪到方塊中心時會出現紅色輔助線，自動調整成中心位置，入下圖。

4/ 把每個方塊都種一個圓點，操作如下圖，數值50px，點擊「複製」。

5/ 這時候不要點其他地方，繼續按Ctrl+D，複製相應個數的圓點。

結果如下圖。

6/ 打開右側圖層列表，在二維碼的圖層右側，點擊小鎖形狀。

7/ 對紅點進行全選，反鍵選擇移動。數值如下。

8/ 繼續Ctrl+D填充完整，效果如下。

9/ 全選紅點，給紅點編個組，改個名稱「焦點原圖」。

10/ 選擇紅點的圖層，回到屬性面板，降低焦點原圖的透明度，改30％。

11/ 再複製一層焦點原圖，命名為「焦點坐標」，改成黑色，透明度改成100％。這裡為了方便觀察，我把底圖的二維碼改成了灰色。

12/ 鎖住紅色焦點坐標的圖層，取消掉黑色焦點坐標的編組，刪掉二維碼焦點坐標中白色區域的黑點。

13/ 至此所有的準備工作的都做好了，這種方法適用於所有的藝術二維碼的製作。最後結果如下：

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

注意：這裡需要注意的是，紅色圓點就是非作圖區域，也就是我們無論繪製什麼樣的二維碼，都不能觸碰到紅色圓點，否則無法識別，而黑色的圓點是必須作圖區域，我們所做的畫面必須覆蓋這些黑點，而白色區域就是供我們自由發揮的區域。

構圖

1/ 我想做一個類似於下面這種插畫

2/ 先拉一個寬為12px的圓角矩形。

3/ 沿黑線填充碼眼

4/ 複製兩個，放到二維碼相應位置。這裡需要注意的是，盡量避開紅點區域。

5/ 大致的構思一下畫面，這裡我分了三個區域，一個地平線，一個水平線，分為地面，水面，水下。

7/ 開始繪製第一個房子。

8/ 第二個房子

9/ 依次繪製，並時刻關掉紅點，掃描二維碼，檢驗是否能識別。

10/ 中心的區域繪製完成後，添加其他的畫面元素來填充版面，例如樹，雲等等。

11/ 依然用圓角矩形來繪製水面的物體，如船，波浪等等。

12/ 最後繪製水下下的物體，如各種類型的魚，水草，氣泡。

13/ 時刻記得邊做邊測試，先用手機掃一遍，再截圖下來，用圖片識別。最後用一些矩形填充其他還未填充的黑點，保持畫面的一個完整性和整潔度。

注意：這裡我偷懶了，一是因為填充完天空，發現畫面已經非常飽滿了，再水面填充一些元素，畫面會顯得擁擠，索性直接不填充了，也省了一道工序。最後的效果如下圖。

這裡需要提醒兩點：

1、內容元素越多，二維碼越難識別，所以填充所有的空白區域只留下紅點區域是基本不能識別的。

2、二維碼中有7%，15%等等的容錯率，也就是當二維碼中的紅點被「不小心」覆蓋了百分之7的紅點，也能識別，而容錯率越高識別的越慢，但我們也可以利用適當的調控我們的做圖區域。

源文件鏈接：https://pan.baidu.com/s/1dwcUZRCG7dbhO4uZQp98eg 密碼：ws9a

個人公眾號：一百天之旅

推薦閱讀：