不用是專(zhuān)業(yè)設(shè)計(jì)師，也能輕松駕馭的設(shè)計(jì)小工具。

不論是你的網(wǎng)站、網(wǎng)頁(yè)內(nèi)容、社群媒體，都一定會(huì)使用到圖片或是影片類(lèi)的素材，但是關(guān)于這些三不五時(shí)需要被更新的內(nèi)容，是不是時(shí)常搞得你心煩意亂：要用什么字體、顏色、尺寸大小，可不可以屏幕直接截圖直接標(biāo)示重點(diǎn)、加注文字，哪裡還有免費(fèi)的圖庫(kù)素材激發(fā)我的靈感、怎么簡(jiǎn)單地制作動(dòng)畫(huà)圖檔、找到符合的動(dòng)態(tài)圖、甚至到Logo設(shè)計(jì)……

這篇文章總結(jié)了十一個(gè)方面，分門(mén)別類(lèi)告訴你關(guān)于設(shè)計(jì)的實(shí)用線(xiàn)上小工具，更棒的是，這些大多數(shù)的線(xiàn)上工具其基本使用都是免費(fèi)的

一、字體
做網(wǎng)頁(yè)的時(shí)候常常不知道要使用哪種字體比較好看嗎？

Google Fonts可以綜覽不同的字體，并且在頁(yè)面上直接做篩選功能，如想要比較窄、比較寬或是斜線(xiàn)字體，又加上顏色的感覺(jué)如何，都可以透過(guò)Google Fonts在線(xiàn)上即時(shí)閱覽。

如果你想要知道，你所使用的字句若套用在不同的字體上的樣子，英文的字體可以使用wordmark.it 這個(gè)工具。

?
Tiff 是當(dāng)你有選擇障礙的時(shí)候，可以協(xié)助你的小幫手。你可以選擇2種字型，輸入4個(gè)英文字母，它會(huì)將兩種不同的字型疊在一起，讓你看到兩種字型的差異，同時(shí)你也可以透過(guò)遮罩功能，只讓一種字型出現(xiàn)。

若想要下載比較特別的字體，可以參考Da Font、1001 Free Fonts、Font Squirrel這三個(gè)網(wǎng)站。
?
Da Font提供的字體很特別，使用者也可以在網(wǎng)上提供字體供其他人下載。1001 Free Fonts則是會(huì)每天提供幾種不同類(lèi)型的字型給使用者下載，而支付約20美元的費(fèi)用，即可下載1萬(wàn)種不同的字型。Font Squirrel 提供的字體看起來(lái)就比較一般，網(wǎng)站上提供字體查詢(xún)（Font Identifier）的功能。


?
如果你想要知道一個(gè)網(wǎng)站它所使用的字體為何，可以下載What Font這個(gè)Chrome的外掛工具。

?
二、顏色
不知道網(wǎng)站的顏色要怎么搭配，Pictaculous 可以幫你！不知道這張圖的顏色是什么，它也可以幫你。只要上傳圖片或是某個(gè)你所希望用的主色調(diào)Pictaculous就像調(diào)色師一樣為你找出它的搭配組合，或是你的搭配組合建議。

?
想要快速知道網(wǎng)站所使用、圖片所使用的顏色，ColorZilla 一樣是Chrome的外掛小工具，讓你可以一“點(diǎn)”就知道它所使用的顏色。

?
如果你的筆記本電腦使用的是Mac，則可以使用command+空白鍵，輸入“color”，找到Digital Color測(cè)量計(jì)的功能，當(dāng)你的鼠標(biāo)移動(dòng)時(shí)，它就會(huì)顯示它的RGB色彩搭配色號(hào)，讓你不用再眼睛脫離屏幕地去比對(duì)究竟你想要使用的色彩搭配是什么色號(hào)。

?
三、引用文字
在你網(wǎng)站上，可能會(huì)需要使用者見(jiàn)證，或是你喜歡透過(guò)勵(lì)志的“每日一句”來(lái)與你的讀者互動(dòng)，那么你可以試試Quozio和Quotes Covers這兩個(gè)免費(fèi)的工具。

Quozio可以讓你自己選擇喜歡的背景做搭配，你只要輸入欲引用的文字，以及說(shuō)該句話(huà)或是段落的人，它就會(huì)自動(dòng)生成一則貼文，讓你能直接分享到社群媒體平臺(tái)上。

?
Quotes Cover這個(gè)工具則是有許多使用者制作了“Quote”的圖片，你可以先在頁(yè)面上看看是否有符合你想要的風(fēng)格類(lèi)型，可以直接下載，或者是重新設(shè)計(jì)?；蚴峭高^(guò)3個(gè)步驟設(shè)計(jì)屬于你自己的引用風(fēng)格圖片。

同樣先是輸入你想要引用的字、是誰(shuí)說(shuō)的、你希望文字的排列方式、是使用在哪個(gè)社群媒體上、檔案的大小、畫(huà)素，接著進(jìn)一步到頁(yè)面的側(cè)欄進(jìn)行細(xì)部微調(diào)，選擇想要的檔案類(lèi)型下載儲(chǔ)存，就完成了！

?
?
四、免費(fèi)圖庫(kù)
如果你想要找比較有創(chuàng)意的照片，Compflight是一個(gè)不錯(cuò)的選擇。你可以直接在頁(yè)面上搜尋你想要的圖片類(lèi)型或是風(fēng)格。在搜索結(jié)果的圖片下若有藍(lán)色的底線(xiàn)，則表示可以直接下載；若無(wú)，則代表原作者可能沒(méi)有提供下載的檔案，若不需要太大的圖檔，你也可以使用前面提到的截圖工具。

?
如果你想要比較獨(dú)樹(shù)一格、具自我風(fēng)格類(lèi)型的照片，可以考慮在Unsplash上面找找。它的搜索設(shè)計(jì)有點(diǎn)類(lèi)似于Pinterest，頁(yè)面主要是以圖片的流行度和更新的時(shí)間做排序。幾個(gè)比較大的主題類(lèi)別包括商務(wù)、小清新、自然、科技、飲食、旅行、歡樂(lè)時(shí)光、光影變化。

?
懶惰的話(huà)，Hubspot有提供跟節(jié)慶有關(guān)的圖庫(kù)還有現(xiàn)成的圖庫(kù)。好處在于你不用連上網(wǎng)，就可以有一拖拉庫(kù)的圖片可以搜尋，壞處就是可能要花比較多的時(shí)間才能找到符合你想要的風(fēng)格的圖片。
?
?
五、Logo設(shè)計(jì)
設(shè)計(jì)網(wǎng)頁(yè)、公司、品牌的Logo沒(méi)有靈感？沒(méi)有大把的預(yù)算請(qǐng)?jiān)O(shè)計(jì)師幫忙？那么你可以尋求以下幾個(gè)Logo制作的網(wǎng)站：

1.Logo Garden。
你可以從圖庫(kù)裡面搜索符合你的概念的圖示、更改顏色、加上文字與簡(jiǎn)單的效果。網(wǎng)站上已經(jīng)有超過(guò)200萬(wàn)個(gè)Logo設(shè)計(jì)，付費(fèi)的版本是39.99美元。


2.Logo Maker Ucraft?
有點(diǎn)像專(zhuān)門(mén)為做Logo的小畫(huà)家，你可以先在資料庫(kù)裡面找尋你需要的圖標(biāo)，再進(jìn)行各種排列組合的客制化、變換顏色、寫(xiě)入文字，而這個(gè)軟件是完全免費(fèi)的。


3.Free Logo Design?
只要輸入公司的名稱(chēng)、在目前可以挑選的36個(gè)產(chǎn)業(yè)類(lèi)別里選擇合適的產(chǎn)業(yè)類(lèi)別，它就會(huì)提供你一系列的免費(fèi)樣式參考。選擇一個(gè)你喜歡的Logo之后，就可以進(jìn)入到編輯頁(yè)面增加新的icon、做Logo的疊加、加入文字、其他圖案的方塊設(shè)計(jì)出屬于你自己的Logo。很棒的是，你可以將每個(gè)疊加的圖示局部拆解，配上自己想要的顏色，非常方便好用！但是如果你需要專(zhuān)業(yè)的Logo-高畫(huà)質(zhì)的檔案，則需要付費(fèi)約60美元。


4.Logotype Maker?
不論是在搜索功能或是在界面設(shè)計(jì)上都很豐富，你可以從36個(gè)分類(lèi)去找跟你的產(chǎn)業(yè)相關(guān)的Logo 模板。輸入公司名稱(chēng)，將想要參考的5個(gè)Logo放入Wish List，它就會(huì)自動(dòng)從你所選的風(fēng)格跟文字上去搭配生成不同排列組合的Logo樣式供你挑選?；镜臉邮绞敲赓M(fèi)的，只能從模板中挑選Logo，基本的收費(fèi)方案是24.99美元，包括200種以上的字體、60萬(wàn)種形狀和進(jìn)階的模板可以任君挑選，進(jìn)階的付費(fèi)方案是39.99美元，可以做無(wú)限次的修改。


5.Logaster的網(wǎng)站看起來(lái)很有設(shè)計(jì)感。
想要生成你的專(zhuān)屬Logo，只需要4個(gè)步驟就能完成，跟前面幾個(gè)網(wǎng)站很像。首先，輸入你的公司名稱(chēng)和產(chǎn)業(yè)類(lèi)別，接著選擇你的Logo理念，再進(jìn)階做細(xì)部編輯，最后就完成了！費(fèi)用則根據(jù)你使用Logo的需求而有不同的收費(fèi)方式，完整的打包帶走約30美元（支持中文?。?br />

6.Logojoy
Logojoy的操作方式是先輸入你的公司名稱(chēng)或是想要制作Logo的名稱(chēng)，接著選擇5種或是以上的風(fēng)格設(shè)計(jì)、9宮格的顏色、輸入Slogan、透過(guò)搜索列選擇合適的icon，最后挑選演算法為你設(shè)計(jì)出的Logo。在預(yù)覽功能的頁(yè)面，你可以看到實(shí)際的Logo印制在名片上、文件、衣服、手機(jī)殼以及大型廣告墻上的樣子。更棒的是，你還可以重新再將公司名稱(chēng)、標(biāo)語(yǔ)、icon更換字型、顏色、版面位置顏色置換成自己想要的樣子?；镜氖召M(fèi)是20美元，進(jìn)階方案是65美元，加入設(shè)計(jì)師諮詢(xún)時(shí)間1小時(shí)則是165美元。


7.DesignEvo
DesignEvo也是一個(gè)免費(fèi)的工具，有多樣化的字體選擇（并且提供中文支援），同時(shí)還有數(shù)百萬(wàn)個(gè)圖示供挑選，以及多種范例。在內(nèi)部的介面操作滿(mǎn)容易的，可以透過(guò)圖示和形狀搜尋想要的圖案，文字也提供許多參考的樣式，重點(diǎn)是不需要注冊(cè)也不用付費(fèi)，只要分享在任意的社交媒體平臺(tái)上即可下載！

免費(fèi)制作Logo的網(wǎng)站還有很多，大家可以多多利用Google 強(qiáng)大的搜索功能，為你找到“免費(fèi)制作logo 推薦”。
?
六、圖片大小調(diào)整
有時(shí)候你可能找到的圖不符合網(wǎng)站的需求，那么就會(huì)需要重置圖片的大小。但是要如何才能在不會(huì)使用繪圖軟件的情況下做到這件事呢？Simple Image Resizer 可以直接將圖的比例調(diào)整縮小，或是如果你知道你想要重新設(shè)置的圖片尺寸大小，也可以直接輸入尺寸。




另一個(gè)網(wǎng)站Picresize則可以讓你調(diào)整圖片的尺寸大小之外，還能讓你直接加入特效功能，對(duì)于喜歡使用特效并且需要圖片壓縮功能的使用者來(lái)說(shuō)，算是滿(mǎn)便利的線(xiàn)上工具。



七、圖片編輯
說(shuō)完了圖片的尺寸，接著就是圖片編輯。在不會(huì)使用或是不想要透過(guò)Photoshop、Lightroom這種比較專(zhuān)業(yè)的軟件做圖片調(diào)整，或是Powerpoint、Office的內(nèi)建修圖，你還有哪些選擇？

如果你想要重新將你的圖片上色、加上框線(xiàn)、文字、其他的圖片，并且不使用需要安裝的軟件，PicMonkey是一個(gè)你可以考慮的工具，它同時(shí)提供翻轉(zhuǎn)、裁剪、大小調(diào)整等調(diào)整圖片的基本功能。



若你喜歡很酷炫、很復(fù)古、或是像Instagram在編輯圖片時(shí)可以有很多濾鏡功能的話(huà)，則可以使用Befunky這個(gè)線(xiàn)上工具。它有基本的免付費(fèi)版本，也有小額付費(fèi)的進(jìn)階版本。除了編輯圖片之外，你也可以在線(xiàn)上制作邀請(qǐng)函、名片、菜單等其他類(lèi)型的文件。



移動(dòng)裝置的App則可以選擇VSCO Cam或是Snapseed。

Photocollage這個(gè)基本的工具可以讓將多張圖片做拼貼，你可以自己排列圖片，或是先上傳想要拼貼的照片之后，選擇“Template”，它就會(huì)自動(dòng)顯示不同照片張數(shù)所搭配的版型，最多可以到25張照片；或是也可用Photovisi這個(gè)免費(fèi)的軟件，你可以選擇要制作卡片或是圖片拼貼，它提供簡(jiǎn)單的版型設(shè)計(jì)和裝飾的小圖案，整個(gè)使用的頁(yè)面上“看起來(lái)”比較簡(jiǎn)約干凈，但視覺(jué)上的調(diào)整就相對(duì)沒(méi)那么專(zhuān)業(yè)（位置、快捷鍵）。


?
八、動(dòng)態(tài)圖
說(shuō)到動(dòng)態(tài)圖.gif，你就絕對(duì)不能不知道Giphy這個(gè)工具。除了可以直接到官方網(wǎng)站上搜尋和下載相關(guān)的動(dòng)態(tài)圖示以外，Giphy也有提供chrome的外掛小工具，供喜歡使用動(dòng)態(tài)圖檔的使用者做搜尋和下載。你也可以直接上傳Youtube影片，截取一小段作為動(dòng)畫(huà)圖檔，非常方便！


若你時(shí)常需要這個(gè)功能，則可以安裝MakeGif這個(gè)chrome的擴(kuò)充工具，讓你在看影片的同時(shí)就可以馬上將影片段落轉(zhuǎn)成Gif檔案并即時(shí)分享。

Imgplip也可以讓你將影片中的片段做成gif檔或是圖片。你只要簡(jiǎn)單提供影片的網(wǎng)址或是上傳影片，選擇你想要的片段，再加上客制化的文字與標(biāo)題和其他微調(diào)的內(nèi)容，就可以分享你的動(dòng)態(tài)圖了！


而Gifmaker.me 是一個(gè)可以讓你自己創(chuàng)造Gif檔的線(xiàn)上工具，你只要上傳幾張照片，調(diào)整每張照片的大小、播放速度，還可以加入Youtube的音樂(lè)鏈接，就可以做成一個(gè)簡(jiǎn)單的動(dòng)畫(huà)、影片。動(dòng)態(tài)圖檔的集大成之老大哥則是Make a gif。它可以讓你把自己的照片、Youtube的影片、Facebook的影片、自己的影片、視頻、或是原本就是Gif的檔案，再制成Gif動(dòng)態(tài)圖檔。

?
九、社群媒體做圖
你是不是常常要在不同的社交媒體上發(fā)文配圖？或是要制作投放廣告的圖？Canva有基本免費(fèi)的工具可以協(xié)助你做到這件事，并提供非常多模版而Pagemodo則是一個(gè)主要和Facebook結(jié)合的應(yīng)用軟件，你可以在界面上設(shè)計(jì)粉絲專(zhuān)頁(yè)的貼文、封面、排榜、制作廣告內(nèi)容、以及設(shè)計(jì)側(cè)欄項(xiàng)目的內(nèi)容等。



Fotor則是結(jié)合了上一個(gè)主題的圖片編輯，以及這個(gè)主題的社群媒體做圖功能。過(guò)去它只有英文版本，現(xiàn)在也有簡(jiǎn)體中文的版本了，若需要將制作社群媒體的圖和后制的搭配，個(gè)人認(rèn)為是個(gè)滿(mǎn)實(shí)用的小幫手。


?
十、資訊圖表
前面提到的Canva，它也可以作為資訊圖表的工具。但比較專(zhuān)業(yè)制作的資訊圖表工具還有Venngage、Infogram、Pikochart、Visme、Ease.ly。

Venngage有超過(guò)1000種的資訊圖表范例，主要分成八大主題，分別為商務(wù)、行銷(xiāo)、教育、飲食、人力資源管理、科技、旅行和社交媒體。而除了資訊圖表之外，其他類(lèi)型的資訊圖像化，像是專(zhuān)案、報(bào)告、海報(bào)、推廣文宣，你都可以參考網(wǎng)站上的設(shè)計(jì)。

免費(fèi)的功能比較差些，以月計(jì)的升級(jí)付費(fèi)版本有19美元和49美元的兩種不同方案。

Infogram主要是圖表和資訊圖表的制作，它可以整合外部的Google表單，是一個(gè)將圖表視覺(jué)上美化非常好的工具，強(qiáng)項(xiàng)在于使用者可以和資訊圖表互動(dòng)。

免費(fèi)的版本可以使用的基本圖表類(lèi)型與其他付費(fèi)版本相同，付費(fèi)版本可以使用500種以上的地圖視覺(jué)工具原型，免費(fèi)的則可以使用兩種，資料庫(kù)的使用比率也相對(duì)小很多。若有大量圖表之制圖需求，或是圖表常需要使用到地圖的使用者則可以選擇infogram作為資訊圖表使用的投資。付費(fèi)的版本是19美元和67美元，團(tuán)隊(duì)共用則是119美元，大型的企業(yè)則有定制化方案。



若在使用上有任何疑問(wèn)，也可以透過(guò)它們的線(xiàn)上客服尋求協(xié)助。

Pickochart 是在資訊圖表的平臺(tái)中，費(fèi)用看起來(lái)比較友善的。你可以透過(guò)它來(lái)制作資訊圖表、報(bào)表、海報(bào)或是投影片。免費(fèi)的版本可以使用10種不同的資訊圖表模板，其他種類(lèi)的檔案做圖也在5～8種不等。在圖表工具的操作上也十分便利，你可以直接在界面上看到圖表的類(lèi)型，輸入數(shù)值以后修改內(nèi)容，算是非常直覺(jué)的設(shè)計(jì)。


Visme有超過(guò)500種以上的資訊圖表模板，超過(guò)6000個(gè)icon以及百萬(wàn)張圖片，不需要任何的設(shè)計(jì)背景都可以輕松使用制作出你的資訊圖表，在圖表上能加入外部連接，比較特別的地方在于可以自訂標(biāo)簽和設(shè)定動(dòng)畫(huà)效果。在價(jià)格方面也非常經(jīng)濟(jì)實(shí)惠，分成月付10美元、20美元，以及團(tuán)隊(duì)共同使用的60美元方案。


Easel.ly 的理念是希望能鼓勵(lì)人們將想法以視覺(jué)化的方式呈現(xiàn)。希望能讓人們的想法、意見(jiàn)、建議、設(shè)計(jì)、專(zhuān)案、目標(biāo)等抽象的思維透過(guò)資訊圖表的方式更具體地讓其他關(guān)注相同議題的人理解。


它的資料庫(kù)有超過(guò)十萬(wàn)張以上的圖片和資訊圖表的模板，有線(xiàn)上即時(shí)的小幫手可以協(xié)助你，還有許多博客文章能夠讓你自己學(xué)習(xí)如何將資訊視覺(jué)化做得更好?；镜墓δ苤荒苷罩扔械哪０遄鑫⒎恼{(diào)整，可以使用的圖示非常有限，進(jìn)階的付費(fèi)功能是36美元。

如果你想要看看自己的履歷轉(zhuǎn)換成資訊圖表的樣子，可以到Visualize.me，綁定你的LinkedIn帳號(hào)，它就會(huì)自動(dòng)同步到平臺(tái)上以圖示的方式展現(xiàn)。所以，如果想要直接使用這個(gè)功能的話(huà)，就先到LinkedIn把你的履歷內(nèi)容制作地完善一些吧！

?
十一、其他
如果你是專(zhuān)業(yè)的UI/UX設(shè)計(jì)師，你可能會(huì)需要Invision和Marvel這兩個(gè)小幫手。不論你是在設(shè)計(jì)網(wǎng)站或是app，你都可以透過(guò)這兩個(gè)線(xiàn)上平臺(tái)和設(shè)計(jì)師或是工程師協(xié)作調(diào)整整個(gè)架構(gòu)與排版。你可以將設(shè)計(jì)好的元素通通放在平臺(tái)上，并且測(cè)試實(shí)際的使用情形，又平臺(tái)提供語(yǔ)法檢視，因此可以在討論時(shí)直接請(qǐng)工程師協(xié)助你將版面或是設(shè)計(jì)調(diào)整成設(shè)計(jì)師想要的樣子。


Marvel的費(fèi)用范圍有免費(fèi)的、12美元一個(gè)月的進(jìn)階版本，56美元的4個(gè)共同協(xié)作版本以及企業(yè)的客制化版本。Invision的進(jìn)階付費(fèi)則分成15美元、25美元、5個(gè)共同協(xié)作者的99美元以及客制化的企業(yè)方案?？梢钥垂镜囊?guī)模大小及協(xié)作需求購(gòu)買(mǎi)合適的方案。

若只是想知道你的圖片設(shè)計(jì)放在不同的移動(dòng)裝置上的樣子，則可以使用Placeit檢視，讓你不需要再一個(gè)個(gè)透過(guò)預(yù)覽的功能，就可以直接看到所有裝置上，圖片擺上去以后合不合適。




如果想要有夜店風(fēng)格、看起來(lái)很酷炫的特效，你可以使用Hypno 這個(gè)app，為你錄制類(lèi)似瘋狂或是斷片效果的影片，只需要先擺出幾個(gè)簡(jiǎn)單的表情之后，Hypno就會(huì)自動(dòng)幫你加油添醋，讓你看起來(lái)“煥然一新”！

【結(jié)語(yǔ)】
找不到什么工具，不知道什么東西怎么做，Google就對(duì)了！這篇文章為你整理了許多線(xiàn)上的實(shí)用設(shè)計(jì)小工具，是不是讓你有點(diǎn)眼花撩亂?。空业侥阈枰墓ぞ哳?lèi)別，選擇一個(gè)你看順眼的、覺(jué)得合適的軟件鉆研，相信你不必是設(shè)計(jì)專(zhuān)業(yè)出身，也可以成為設(shè)計(jì)小達(dá)人喲！