10個有毒的設計神器

這篇文章一口氣為大家帶來10個有毒的設計神器 ，毒性有多強？包你上癮！

以下神器都是在線工具，無需下載。由於擔心大家過目就忘，本人親身試毒，製作了超多案例，希望能給大家一些幫助。

一、雙色圖片生成器

開發團隊：ShapeFactory

工具地址：duotone.shapefactory.co

Duotone，中文是雙色調的意思，一種歐美雜誌慣用的設計風格。顧名思義，這個神器能讓你一鍵無痛生成酷炫的雙色畫風！完全不用開 PS！

工具的界面如下圖， 左側是調色板，右側是默認推薦的圖片，素材都是來源於大名鼎鼎的免費可商用圖庫 Unsplash ：

除了可以選用默認推薦的圖片，你還可以上傳自己的，直接把圖片拖拽進工具即可：

你還可以隨意修改配色，所見即所得：

1. 案例參考

現在，當你再看到下方這樣的設計時，是不是已經毫無壓力了呢？

受這些作品啟發，我在 #PPT365# 打卡時也用神器做了幾張雙色 PPT，拋磚引玉一下。

2. 隱藏彩蛋

這個神器其實還有一個彩蛋，就在左上角的開發團隊里，點擊一下試試。

你會發現原來除了 Duotone 之外， ShapeFactory 旗下還有其他三個小工具。篇幅原因就不詳細介紹了，帶大家瀏覽一下吧。

LOGO：輸入文字就生成 LOGO 的生成器

Pigment：一個騷氣的色卡生成器

Gradient：一個騷氣的漸變色生成器

二、故障藝術生成器

開發團隊：Airtight Interactive Inc.

工具地址：photomosh.com

《銀翼殺手》、《攻殼機動隊》等科幻電影構建了一個風格獨特的賽博朋克（Cyberpunk）世界，也成功催生了一種名為故障藝術（Glitch Art）的設計風格，近年越來越受到設計師的追捧。

說人話，就是一種你家電視壞了 / 你手機屏幕碎了的效果，在國內也被稱為抖音風。

網上有很多一鍵生成故障藝術的工具，但 PhotoMosh 是最厲害的一個。使用方法很簡單，直接把圖片拖拽進工具即可：

PhotoMosh 一共提供了27種故障特效，如果你有選擇困難，點擊下方的隨機按鈕「MOSH」就能一鍵把你的屏幕摔壞啦：

另外，它居然還支持靜圖 / 動圖 / 視頻三種格式的導出：

如果你對特效不滿意，除了可以繼續點擊「MOSH」切換，還可以在右側列表調整參數：

27種特效，通過排列組合你肯定能找到自己想要的效果。

1. 案例應用

每一種特效都值得你去深挖。比如這個叫「wobble / 搖晃」的效果，可以瞬間讓你的圖片扭動起來，感受一下：

如果把這種扭動效果保存為動圖或視頻應用到 PPT 中會怎樣呢？

再比如這個叫「Jitter / 抖動」的效果，看起來是不是很抖音呢？

於是，我們工作室 AbleSlide 把這種特效直接應用在了抖音的發布會上，偷偷劇透給你們看：

未來我們還會在官方微博 @AbleSlide 做詳細的設計復盤喔，歡迎關註：

2. 隱藏彩蛋

在 PhotoMosh 的特效列表中，你會發現一個熟悉的名字：Doutone。

是的，你沒猜錯，功能和上文推薦的第一個神器一模一樣！也就是說，以後我們有 PhotoMosh 就夠了。

三、炫光生成器

開發者：Ben Matthews

工具地址：codepen.io/tsuhre/full/BYbjyg

這是我在 CodePen 社區上偶遇的一個生成器，雖然它只是工程師 Ben Matthews 的一個編程練習，但我們可以利用它生成各種各樣的炫彩背景。毫無操作可言，點擊滑鼠就隨機生成一張圖，就這麼簡單粗暴。

另外，這些光帶會根據瀏覽器窗口的尺寸來自動填充，你可以拉伸窗格來獲得不同密度的背景：

直接右鍵就能保存到一堆酷炫的背景素材啦。

1. 案例應用

如此百搭的圖片素材，不用來做背景實在有點浪費，繼續拋磚：

而且這種抽象的炫光通過複製、水平翻轉，就可以拼接出一張大氣的超寬屏素材了，很適合應用到發布會設計：

2. 隱藏彩蛋

每個神器的背後總是隱藏著一個大神，你總能順藤摸瓜摸到一堆其他的工具。比如這位作者 Ben Matthews，你會發現在他的 CodePen 主頁中還有其他小玩意，自己去淘寶吧。

四、鏡像炫光生成器

開發者：Yuri Vishnevsky

具地址：weavesilk.com

作為在線生成器的鼻祖之一，Silk 早在2010年就發布了，而且效果至今無人超越。

打開工具後，你只需要用滑鼠瞎畫就能生成一組非常對稱的炫光圖形了，就是這麼簡單：

參數設置也很簡單，個人比較常用的有這些：

其中修改漸變色的方式有點萌，需要你拖拽一個色塊去勾搭其他色塊：

有了這個神器，我們又解鎖了一類超炫的背景素材了。

甚至，我們可以利用這個神器的對稱性來畫畫。

不好意思放錯圖了，我們來看看其他大神們的作品吧：

另外，你還可以取消「鏡像對稱」選項，這樣滑鼠就變成一支自由控制的畫筆了，再來看看大神的作品吧：

1. 案例應用

大神離我們太遠，我等凡人可以怎麼開腦洞呢？其實我們可以利用鏡像對稱來繪製一些簡單的結構圖。看，是不是比 PPT 自帶的 SmartArt 酷炫一百倍？

2. 隱藏彩蛋

眼尖的同學肯定會發現，這個神器還有 app 版：

Silk 一共出了兩款付費應用，比在線版多了更多參數調整和玩法，這裡就不展開了，有興趣的同學可以買來玩玩。

五、漸變層生成器

開發者：Fabio Ottaviani

優化者：@pissang

工具地址：codepen.io/pissang/full/geajpX

看過我打卡教程的同學都知道，在 PPT 中可以利用 iSlide 插件快速生成這樣的漸變層：

本以為這已經是最快的生成方式了，直到我在 CodePen 社區上遇到這個神器，居然直接用滑鼠拖拽就能搞定。想要多少層隨便點：

而且提供超多調整參數，調整過程本身就是一種視覺享受，比如調水平方向的弧度：

比如，調垂直方向的弧度：

當然，還有每個神器的標配功能「隨機生成」：

遺憾的是神器本身不能直接保存圖片，但好基友在源代碼基礎上加了一個下載 SVG 格式的功能。這意味著我們不僅可以下載圖片，還能下載到矢量格式，拖進 PPT 里取消組合就能一層一層地剝開它來編輯：

1. 案例應用

沒啥好說的，你平時怎麼用色塊就可以怎麼玩這個神器：

六、流動漸變層生成器

開發者：Karim Maaloul

工具地址：codepen.io/Yakudoo/full/rJjOJx/

看這不正經的網址就猜到，這又是 CodePen 上另一位大佬的編程練習。他說盯著這些流動的漸變層看一分鐘就會有凝神靜氣的奇效，但為什麼我越看越騷動。

如此養眼的配色提供的調整參數卻不多，個人使用最多的就是這兩個選項：

如果你需要靜態背景，直接右鍵就能另存高清圖了。

如果你需要動態背景，建議你使用錄屏工具直接錄製 Gif 或者視頻。強烈推薦一款叫 HoneyCam 的軟體，不僅可以調整時長和尺寸，還可以逐幀編輯：

1. 案例應用

錄製好後，直接應用到 PPT 中就能做出這樣的頁面了。

七、體素生成器

開發者：Marpi

工具地址：demo.marpi.pl/biomes

你能想像到封面這個背景也可以一鍵生成么？用的是國外 WebGL 大神 Marpi 的一個工具——Biomes，可以隨機生成抽象的體素地形。

這個工具提供調整的參數也不多，但對於這種不規律的隨機圖形，我們有「隨機」按鈕就夠了：

由於配色經過特殊優化，隨機生成的每張圖片都看起來好好吃，嚴重懷疑這是馬卡龍植入了廣告，你們感受一下：

1. 案例參考

於是，我們又解鎖了一類背景素材啦，做兩頁 PPT 慶祝一下：

2. 隱藏彩蛋

值得一提的是，Marpi 大神還有自己的個人主頁，裡面全是他的 WebGL 作品。你會驚嘆，這是一位把瀏覽器用成了 C4D 的男人。

八、圖片體素化生成器

開發者：@pissang

工具地址：pissang.github.io/voxelize-image

Voxelize Image 十分簡單易用，你只需要往右下角的方框拖拽一張圖片，它就會自動把圖片轉換成這種立體的體素效果：

你看，這比剛刷完的廁所地板還要亮麗的效果，居然是一個在線工具一鍵生成的，完爆那些打開都要半天的專業 3D 軟體。

Voxelize Image 還提供超多參數配置，但個人用得比較多的是金屬材質選項：

如果你覺得金屬感太強，可以試試把「roughness」參數調大，畫風馬上就突變了：

比起 blingbling 的金屬質感，這種畫風在日常設計中更常用。比如，我把一張 PPT 拖拽進來，一秒鐘就生成了一張 3D 海報。

放大看看細節，少了刺眼的金屬反光，多了幾分樸實的像素感：

即使放大到局部，細節也不會丟失，反而更加豐富：

如果你導入的是一張色彩豐富的圖片，層次感就更加鮮明了：

放大讓你們感受一下：

再換個8倍鏡，一張抽象的背景素材秒 get：

1. 案例參考

現在你還擔心自己的 PPT 配圖不夠酷炫嗎？我們都能冒充 3D 大神了：

九、剪紙風格生成器

開發者：@pissang

工具地址：pissang.github.io/papercut-box-art

前不久，我和 @pissang 不約而同地迷上了這種層次分明的剪紙風格：

有段時間我的打卡都是長這樣的：

當我興緻勃勃地拿著 PPT 去跟 @pissang 吹牛逼時，發現他做了個剪紙風格生成器，還是一鍵生成那種：

帶著挑剔的眼光打開工具，發現還真的好用。很多細節都可以在右側的參數面板微調，個人用得比較多的是這幾項，供大家參考：

以前我們製作這樣的背景圖片至少花半小時，現在只需要一分鐘：

1. 案例參考

好看的背景素材總是那麼百搭，PPT 張手就來：

2. 隱藏彩蛋

@pissang 其實是百度 ECharts 團隊的其中一位大神，平時主要活躍在 Twitter 以及 GitHub ，經常會發布各種各樣的小玩具，有興趣的同學可以關注一下。

Twitter：twitter.com/pissang1

GitHub：github.com/pissang

十、萬箭齊發背景生成器

開發者：@亞賽大人

工具地址：wangyasai.github.io/Stars-Emmision

這是一款效果比名字更浮誇的生成器，可以一鍵生成小米海報這種背景效果，大大節省了我們的設計時間。

一打開工具就會有一堆射線迫不及待地向你射來：

個人常用的參數如下，供大家參考：

直接右鍵就能另存高清圖：

1. 案例參考

這是我們今天解鎖的最後一類素材：

當然，你也可以錄製成動圖 / 視頻，效果會酷炫一百倍：

2. 隱藏彩蛋

夢想成為一名 processing 大神的亞賽同學，一般活躍在 Instagram，在這你能看到她每天的編程打卡，喜歡她的同學可以關注一下，你會發現會編程的設計師是多麼有魅力。

ins：www.instagram.com/yasaisai

以上就是今天所講的10個神器，你都中毒了嗎？

後記

1. 阿文是怎麼找到這麼多神器的？

其實在去年的同一天，我寫過一篇深度劇透，裡面有我找神器的所有方法。如果你碰巧沒看，請戳：《好玩的神器去哪找？》

當然，想及時看到最新鮮好玩的神器，歡迎關注我的微博打卡活動 #PPT365#，目前打卡的同學已經累計推薦了近百個設計神器了。

2. 為什麼網上有這麼多設計生成器？

以上推薦這些神器的作者，大部分都是衍生藝術（Generative Art）的發燒友。他們也是設計師，只是熱衷於用編程語言（如 Processing）來創作，這種代碼帶來的有規律的隨機性可以讓作品產生無數種可能。你看，即使是一個練習稿都能讓我們這群門外漢連連稱讚。

與其把自己圈在 PPT 中坐井觀天，整天妄想著逆襲 PS 逆襲 AE，不如保持好奇心，跳出來看看外面的世界，因為…