這次回歸,一口氣為大家?guī)?lái)10個(gè)有毒的設(shè)計(jì)神器 ,毒性有多強(qiáng)?包你上癮
以下神器都是在線(xiàn)工具,無(wú)需下載。由于擔(dān)心大家過(guò)目就忘,本人親身試毒,制作了超多案例。所以文章比我還長(zhǎng),?喜歡就好。
》開(kāi)發(fā)團(tuán)隊(duì):ShapeFactory
》工具地址:duotone.shapefactory.co
Duotone,中文是雙色調(diào)的意思,一種歐美雜志慣用的設(shè)計(jì)風(fēng)格。顧名思義,這個(gè)神器能讓你一鍵無(wú)痛生成酷炫的雙色畫(huà)風(fēng)!完全不用開(kāi) PS!
工具的界面如下圖, 左側(cè)是調(diào)色板,右側(cè)是默認(rèn)推薦的圖片,素材都是來(lái)源于大名鼎鼎的免費(fèi)可商用圖庫(kù) Unsplash :
除了可以選用默認(rèn)推薦的圖片,你還可以上傳自己的,直接把圖片拖拽進(jìn)工具即可:
你還可以隨意修改配色,所見(jiàn)即所得:
》案例參考:
現(xiàn)在,當(dāng)你再看到這樣的設(shè)計(jì)時(shí),是不是已經(jīng)毫無(wú)壓力了呢:
受這些作品啟發(fā),我在 #PPT365# 打卡時(shí)也用神器做了幾張雙色PPT,拋磚引玉一下~
》隱藏彩蛋:
這個(gè)神器其實(shí)還有一個(gè)彩蛋,就在左上角的開(kāi)發(fā)團(tuán)隊(duì)里,點(diǎn)擊一下試試~
你會(huì)發(fā)現(xiàn)臥槽原來(lái)除了Duotone之外, ShapeFactory 旗下還有其他三個(gè)小工具!篇幅原因就不詳細(xì)介紹了,帶大家瀏覽一下吧~
● LOGO:?輸入文字就生成 LOGO 的生成器:
● Pigment:?一個(gè)騷氣的色卡生成器:
● Gradient:?一個(gè)騷氣的漸變色生成器:
》開(kāi)發(fā)團(tuán)隊(duì):Airtight Interactive Inc.
》工具地址:photomosh.com
《銀翼殺手》《攻殼機(jī)動(dòng)隊(duì)》等科幻電影構(gòu)建了一個(gè)風(fēng)格獨(dú)特的賽博朋克(Cyberpunk)世界,也成功催生了一種名為故障藝術(shù)(Glitch Art)的設(shè)計(jì)風(fēng)格,近年越來(lái)越受設(shè)計(jì)師的追捧。
說(shuō)人話(huà),就是一種你家電視壞了 / 你手機(jī)屏幕碎了的效果,在國(guó)內(nèi)也被稱(chēng)為抖音風(fēng)…
網(wǎng)上有很多一鍵生成故障藝術(shù)的工具,但 PhotoMosh 是最屌的一個(gè)(不接受反駁)。使用方法很簡(jiǎn)單,直接把圖片拖拽進(jìn)工具即可:
PhotoMosh 一共提供了27種故障特效,如果你有選擇困難,點(diǎn)擊下方的隨機(jī)按鈕【MOSH】就能一鍵把你的屏幕摔壞啦:
另外,它居然還支持靜圖 / 動(dòng)圖 / 視頻三種格式的導(dǎo)出:
如果你對(duì)特效不滿(mǎn)意,除了可以繼續(xù)點(diǎn)擊【MOSH】切換,還可以在右側(cè)列表調(diào)整參數(shù):
27種特效,通過(guò)排列組合你肯定能找到自己想要的效果:
》案例應(yīng)用:
每一種特效都值得你去深挖。比如這個(gè)叫【wobble / 搖晃】的效果,可以瞬間讓你的圖片扭動(dòng)起來(lái),感受一下:
如果把這種扭動(dòng)效果保存為動(dòng)圖或視頻應(yīng)用到 PPT 中會(huì)怎樣呢?會(huì)很騷:
再比如這個(gè)叫【Jitter / 抖動(dòng)】的效果,看起來(lái)是不是很抖音呢?
于是,我們工作室 AbleSlide 把這種特效直接應(yīng)用在了抖音的發(fā)布會(huì)上,偷偷劇透給你們看:
未來(lái)我們還會(huì)在官方微博@AbleSlide 做詳細(xì)的設(shè)計(jì)復(fù)盤(pán)喔,歡迎關(guān)注:
》隱藏彩蛋:
在 PhotoMosh 的特效列表中,你會(huì)發(fā)現(xiàn)一個(gè)熟悉的名字:Doutone
是的,你沒(méi)猜錯(cuò),功能和上文推薦的第一個(gè)神器一模一樣!也就是說(shuō),以后我們有 PhotoMosh 就夠了。
》開(kāi)發(fā)者:Ben Matthews
》工具地址:codepen.io/tsuhre/full/BYbjyg
這是我在 CodePen 社區(qū)上偶遇的一個(gè)生成器,雖然它只是工程師 Ben Matthews 的一個(gè)編程練習(xí),但我們可以利用它生成各種各樣的炫彩背景。毫無(wú)操作可言,點(diǎn)擊鼠標(biāo)就隨機(jī)生成一張圖,就這么簡(jiǎn)單粗暴:
另外,這些光帶會(huì)根據(jù)瀏覽器窗口的尺寸來(lái)自動(dòng)填充,你可以拉伸窗格來(lái)獲得不同密度的背景:
直接右鍵就能保存到一堆酷炫的背景素材啦:
》案例應(yīng)用:
如此百搭的圖片素材,不用來(lái)做背景實(shí)在有點(diǎn)浪費(fèi),繼續(xù)拋磚:
而且這種抽象的炫光通過(guò)復(fù)制、水平翻轉(zhuǎn),就可以拼接出一張大氣的超寬屏素材啦,很適合應(yīng)用到發(fā)布會(huì)設(shè)計(jì):
》隱藏彩蛋:
每個(gè)神器的背后總是隱藏著一個(gè)大神,你總能順藤摸瓜摸到一堆其他的工具。比如這位作者?Ben Matthews?,你會(huì)發(fā)現(xiàn)在他的 CodePen 主頁(yè)中還有其他小玩意,自己去淘寶吧:
》開(kāi)發(fā)者:Yuri Vishnevsky
》工具地址:weavesilk.com
作為在線(xiàn)生成器的鼻祖之一,Silk 早在 2010 年就發(fā)布了,而且效果至今無(wú)人超越。
打開(kāi)工具后,你只需要用鼠標(biāo)瞎畫(huà)就能生成一組非常對(duì)稱(chēng)的炫光圖形了,就是這么簡(jiǎn)單:
參數(shù)設(shè)置也很簡(jiǎn)單,個(gè)人比較常用的有這些:
其中修改漸變色的方式有點(diǎn)萌,需要你拖拽一個(gè)色塊去勾搭其他色塊:
有了這個(gè)神器,我們又解鎖了一類(lèi)超炫的背景素材了?。。?/p>
甚至!我們可以利用這個(gè)神器的對(duì)稱(chēng)性來(lái)畫(huà)畫(huà)!
不好意思放錯(cuò)圖了,我們來(lái)看看其他大神們的作品吧:
另外,你還可以取消【鏡像對(duì)稱(chēng)】選項(xiàng),這樣鼠標(biāo)就變成一支自由控制的畫(huà)筆了,再來(lái)看看大神的作品吧:
》案例應(yīng)用:
大神離我們太遠(yuǎn),我等凡人可以怎么開(kāi)腦洞呢?其實(shí)我們可以利用鏡像對(duì)稱(chēng)來(lái)繪制一些簡(jiǎn)單的結(jié)構(gòu)圖,看,是不是比 PPT 自帶的 SmartArt 酷炫一百倍?
》隱藏彩蛋:
眼尖的同學(xué)肯定會(huì)發(fā)現(xiàn),這個(gè)神器還有app版:
Silk 一共出了兩款付費(fèi)應(yīng)用,比在線(xiàn)版多了更多參數(shù)調(diào)整和玩法,這里就不展開(kāi)啦,有興趣的同學(xué)可以買(mǎi)來(lái)玩玩:
》開(kāi)發(fā)者:Fabio Ottaviani
》優(yōu)化者:@pissang
》工具地址:codepen.io/pissang/full/geajpX
看過(guò)我打卡教程的同學(xué)都知道,在PPT中可以利用 iSlide 插件快速生成這樣的漸變層:
本以為這已經(jīng)是最快的生成方式了,直到我在 CodePen 社區(qū)上遇到這個(gè)神器……居然直接用鼠標(biāo)拖拽就能搞定,來(lái),想要多少層隨便點(diǎn):
而且提供超多調(diào)整參數(shù),調(diào)整過(guò)程本身就是一種視覺(jué)享受,比如調(diào)水平方向的弧度:
比如,調(diào)垂直方向的弧度:
當(dāng)然,還有每個(gè)神器的標(biāo)配功能【隨機(jī)生成】:
遺憾的是神器本身不能直接保存圖片,但好基友@pissang 在源代碼基礎(chǔ)上加了一個(gè)下載SVG格式的功能!這意味著我們不僅可以下載圖片,還能下載到矢量格式,拖進(jìn)PPT里取消組合就能一層一層一層地剝開(kāi)它來(lái)編輯:
》案例應(yīng)用:
沒(méi)啥好說(shuō)的,你平時(shí)怎么用色塊就可以怎么玩這個(gè)神器:
》開(kāi)發(fā)者:Karim Maaloul
》工具地址:codepen.io/Yakudoo/full/rJjOJx/
嗯,看這不正經(jīng)的網(wǎng)址就猜到,這又是 CodePen 上另一位大佬的編程練習(xí)。他說(shuō)盯著這些流動(dòng)的漸變層看一分鐘就會(huì)有凝神靜氣的奇效……但,為什么我越看越騷動(dòng)!
如此養(yǎng)眼的配色提供的調(diào)整參數(shù)卻不多,個(gè)人使用最多的就是這倆選項(xiàng):
如果你需要靜態(tài)背景的話(huà),直接右鍵就能另存高清圖了,看這溢出屏幕的騷氣嘖嘖:
如果你需要?jiǎng)討B(tài)背景,建議你使用錄屏工具直接錄制 Gif 或者視頻,強(qiáng)烈推薦一款叫 HoneyCam 的軟件,不僅可以調(diào)整時(shí)長(zhǎng)和尺寸,還可以逐幀編輯:
》案例應(yīng)用:
錄制好后,直接應(yīng)用到 PPT 中就能做出這樣的頁(yè)面啦:
》開(kāi)發(fā)者:Marpi
》工具地址:demo.marpi.pl/biomes
你能想象封面這個(gè)背景你也可以一鍵生成么?用的是國(guó)外 WebGL 大神 Marpi 的一個(gè)工具:Biomes,可以隨機(jī)生成抽象的體素地形:
這個(gè)工具提供調(diào)整的參數(shù)也不多,但對(duì)于這種不規(guī)律的隨機(jī)圖形,我們有【隨機(jī)】按鈕就夠了:
由于配色經(jīng)過(guò)特殊優(yōu)化,隨機(jī)生成的每張圖片都看起來(lái)好好吃……嚴(yán)重懷疑這是馬卡龍植入了廣告,你們感受一下:
》案例參考:
于是,我們又又又解鎖了一類(lèi)背景素材啦,做兩頁(yè)P(yáng)PT慶祝一下:
》隱藏彩蛋:
值得一提的是,Marpi大神還有自己的個(gè)人主頁(yè),里面全是他的 WebGL 作品喔~~你會(huì)驚嘆,這是一位把瀏覽器用成了 C4D 的男人。
》開(kāi)發(fā)者:@pissang
》工具地址:pissang.github.io/voxelize-image
終于講到我最?lèi)?ài)的男人(之一)了!
Voxelize Image 十分簡(jiǎn)單易用,你只需要往右下角的方框拖拽一張圖片,它就會(huì)自動(dòng)把圖片轉(zhuǎn)換成這種立體的體素效果:
你看,這比剛刷完的廁所地板還要亮麗的效果,居然是一個(gè)在線(xiàn)工具一鍵生成的,完爆那些打開(kāi)都要半天的專(zhuān)業(yè) 3D 軟件!!
Voxelize Image 還提供超多參數(shù)配置,但個(gè)人用得比較多的是金屬材質(zhì)選項(xiàng):
如果你覺(jué)得金屬感太強(qiáng),可以試試把【roughness】參數(shù)調(diào)大,畫(huà)風(fēng)馬上就突變了:
比起 blingbling 的金屬質(zhì)感,這種畫(huà)風(fēng)在日常設(shè)計(jì)中更常用,比如,我把一張PPT拖拽進(jìn)來(lái),一秒鐘就生成了一張3D海報(bào)了:
放大看看細(xì)節(jié),少了金屬反光的刺眼,多了幾分樸實(shí)的像素感:
即使放大到局部,細(xì)節(jié)也不會(huì)丟失,反而更加豐富:
如果你導(dǎo)入的是一張色彩豐富的圖片,層次感就更加鮮明了:
放大讓你們感受一下:
再換個(gè)8倍鏡,一張抽象的背景素材秒 get:
》案例參考
現(xiàn)在你還擔(dān)心自己的 PPT 配圖不夠酷炫嗎?我們都能冒充3D大神了:
》開(kāi)發(fā)者:@pissang
》工具地址:pissang.github.io/papercut-box-art
前不久,我和@pissang 不約而同地迷上了這種層次分明的剪紙風(fēng)格:
有段時(shí)間我的打卡都是長(zhǎng)這樣的:
當(dāng)我興致勃勃地拿著PPT去跟@pissang 吹牛逼時(shí),發(fā)現(xiàn)他……他做了個(gè)剪紙風(fēng)格生…生成器……是的,一鍵生成那種:
帶著挑剔的目光打開(kāi)工具,發(fā)現(xiàn)……還真特么好用??!很多細(xì)節(jié)都可以在右側(cè)的參數(shù)面板微調(diào),個(gè)人用得比較多的是這幾項(xiàng),供大家參考:
以前我們制作這樣的背景圖片至少花半小時(shí),現(xiàn)在只需要一分鐘:
》案例參考
好看的背景素材總是那么百搭,PPT張手就來(lái):
》隱藏彩蛋:
@pissang 其實(shí)是百度 ECharts 團(tuán)隊(duì)的其中一位大神,平時(shí)主要活躍在 Twitter 以及全球最大同性交友社區(qū) GitHub ,經(jīng)常會(huì)發(fā)布各種各樣的小玩具,有興趣的同學(xué)可以關(guān)注一下喔:
Twitter:twitter.com/pissang1
GitHub:github.com/pissang
》開(kāi)發(fā)者:@亞賽大人
》工具地址:wangyasai.github.io/Stars-Emmision
這是一款效果比名字更浮夸的生成器,可以一鍵生成小米海報(bào)這種背景效果,大大節(jié)省了我們的設(shè)計(jì)時(shí)間:
一打開(kāi)工具就會(huì)有一堆射線(xiàn)迫不及待地向你射來(lái):
個(gè)人常用的參數(shù)如下,供大家參考:
直接右鍵就能另存高清圖:
》案例參考:
恩,這是我們今天解鎖的最后一類(lèi)素材:
當(dāng)然,你也可以錄制成動(dòng)圖 / 視頻,效果會(huì)酷炫一百倍:
》隱藏彩蛋:
夢(mèng)想成為一名 processing 大神的亞賽同學(xué),一般活躍在 Instagram,在這你能看到她每天的編程打卡,喜歡她的同學(xué)可以關(guān)注一下喔,你會(huì)發(fā)現(xiàn)會(huì)編程的設(shè)計(jì)師是多么有魅力:
ins:www.instagram.com/yasaisai
@亞賽大人和 @pissang 還有很多超酷的小工具,在未來(lái)我會(huì)為他們分別寫(xiě)一篇專(zhuān)題,記得催更喔~~~
以上就是今天所講的10個(gè)神器,你都中毒了嗎
1】阿文是怎么找到這么多神器的?
其實(shí)在去年的同一天,我寫(xiě)過(guò)一篇深度劇透,里面有我找神器的所有方法。如果你碰巧沒(méi)看,請(qǐng)戳:好玩的神器去哪找?
當(dāng)然,想及時(shí)看到最新鮮好玩的神器,歡迎關(guān)注我的微博打卡活動(dòng) #PPT365#,目前打卡的同學(xué)已經(jīng)累計(jì)推薦了近百個(gè)設(shè)計(jì)神器了。
2】為什么網(wǎng)上有這么多設(shè)計(jì)生成器?
以上推薦這些神器的作者,大部分都是衍生藝術(shù)(Generative Art)的發(fā)燒友。他們也是設(shè)計(jì)師,只是熱衷于用編程語(yǔ)言(如 Processing)來(lái)創(chuàng)作,這種代碼帶來(lái)的有規(guī)律的隨機(jī)性可以讓作品產(chǎn)生無(wú)數(shù)種可能。你看,即使是一個(gè)練習(xí)稿都能讓我們這群門(mén)外漢慘叫連連……噢不,嘖嘖稱(chēng)奇。
與其把自己圈在 PPT 中坐井觀天,整天妄想著逆襲 PS 逆襲 AE,不如保持好奇心,跳出來(lái)看看外面的世界,因?yàn)椤?/p>
希望每次回歸,都能讓你高潮。
我們下期見(jiàn),以上
來(lái)源:https://weibo.com/ttarticle/p/show?id=2309404231253195911223
]]>