每每見到一個(gè)尤其牛X的H5著作的情況下，是否特想要知道那誰是怎么保證的??！個(gè)性字體、美圖照片、動(dòng)漫、精致的配搭。。。強(qiáng)勁的視覺撞擊力震撼新手的膝關(guān)節(jié)。因此我把珍藏?cái)?shù)年的好商品展現(xiàn)出去，諸位小伙伴們記好哦！

字體樣式工具

藝術(shù)字在線轉(zhuǎn)化成工具

一般H5工具情景中并沒有帶來過多字體樣式，是由于手機(jī)上不兼容多字體樣式。

假如要想好幾個(gè)字體樣式，可以用藝術(shù)字生成工具，實(shí)際效果極大地！

選擇自己感興趣的字體樣式；例如隨意鍵入一詞或句子文章標(biāo)題瀏覽；轉(zhuǎn)化成圖片，下載另存；

除開能夠挑選字體效果外，大多數(shù)制作器還適用字體大小、字色及環(huán)境的選用設(shè)定，小伙伴們能夠按照自身的愛好或必須來調(diào)節(jié)。

轉(zhuǎn)化成圖片后（一般全是無環(huán)境png格式）就可同時(shí)導(dǎo)進(jìn)H5在線編輯器開展使用了。

下邊我們列出了一些常見的在線生成器，供各位查詢采用：

【毛筆書法在線生成器】毛筆書法在線生成器

【第一字體轉(zhuǎn)換器】書法藝術(shù)字體轉(zhuǎn)換器在線轉(zhuǎn)換

【QT86】藝術(shù)字體在線生成器 藝術(shù)字轉(zhuǎn)換器

文本擁有，很有可能你能為找不著適合的配圖圖片發(fā)愁，因此個(gè)人收藏好多個(gè)常見的圖片素材網(wǎng)也是很需要的。

圖片素材圖片

常見的搜圖網(wǎng)站

找圖片一般都是在瀏覽器搜索框立即輸入有關(guān)標(biāo)識(shí)，就能搜到許多 各種各樣的圖，例如百度搜索圖片檢索、搜狗、360搜圖等。可是一般獲得的效果圖是很不足的，畫面質(zhì)量也不一定抵達(dá)規(guī)定，更難堪的是有可能會(huì)涉及到版權(quán)問題哦。

設(shè)計(jì)方案一個(gè)著作的過程中必須的圖片素材圖片大多數(shù)超清、大幅面且頗具藝術(shù)創(chuàng)意、視覺沖擊，因此給大伙兒介紹一些比較技術(shù)專業(yè)或歸類非常齊備、圖片品質(zhì)較高的搜圖網(wǎng)站：千庫網(wǎng)： 千庫網(wǎng)_潛心完全免費(fèi)設(shè)計(jì)元素下載的網(wǎng)址500px：www.500px.com

Frickr：Filckr-storm、Compfight

圖蟲：圖蟲網(wǎng) - 最好是的攝像師都是在這

此外給人覺得較為文藝范兒的也有花瓣網(wǎng)、堆糖，沒事兒多去旅游觀光總是會(huì)有探索與發(fā)現(xiàn)。并且世界各國許多 付錢的網(wǎng)址圖片品質(zhì)是非常高的，我也是期待朋友們多多的適用圖片使用者，終究過日子不容易！

有關(guān)圖片縮小的工具還記得在前面【武器】一期有詳解，

在這兒再嘮叨一兩句吧：

智圖：智圖_圖片縮小線上工具

Tinypng：TinyPNG – Compress PNG images while preserving transparency

假如你還是需自身開展一些圖片制作，設(shè)計(jì)方案大神用Photoshop，普通用戶用光影魔術(shù)手也基本上達(dá)到，可是可是靜態(tài)數(shù)據(jù)的圖片很有可能太簡單，你還是必須一些動(dòng)態(tài)性原素，例如gif圖、flash動(dòng)畫等。

動(dòng)態(tài)圖片

GIF圖制作工具

提及動(dòng)態(tài)圖片大伙兒第一想起的或許會(huì)是手機(jī)微信、qq上滿天飛舞的表情圖，但H5的動(dòng)態(tài)圖不同于這些神情，展現(xiàn)是一種情景。GIF圖素材圖片的添加會(huì)使你的創(chuàng)作更為頗具轉(zhuǎn)變與炫酷，尤其是一些具備有趣的動(dòng)態(tài)圖片。

強(qiáng)烈推薦gif動(dòng)態(tài)圖片庫資源：GUIFFF – Animated Dribbble GIFsGIF動(dòng)漫改動(dòng)制作工具【Ulead GIF Animator】

Ulead GIF Animator——友立公司出版發(fā)行的動(dòng)漫GIF制作手機(jī)軟件，內(nèi)建的Plugin有很多現(xiàn)有的效果能夠 直接套入，可將AVI文檔轉(zhuǎn)成動(dòng)漫GIF文檔，并且還能將動(dòng)漫GIF圖片預(yù)設(shè)值，能將你放到頁面上的動(dòng)漫GIF圖檔減肥瘦身，便于使人可以更迅速的網(wǎng)頁瀏覽。Ulead GIF Animator實(shí)際操作簡易，假如你不怎么會(huì)應(yīng)用ps制作gif圖片，提議應(yīng)用這款手機(jī)軟件。

在這里我禁不住要提及的一款武器是：微信對話制作器

比如說轉(zhuǎn)化成微信對話的工具，在微信朋友圈搞網(wǎng)上代購的人可能最熟練，你懂得的，也有轉(zhuǎn)化成微信朋友圈情況關(guān)注點(diǎn)贊的工具。轉(zhuǎn)化成微信對話的可以用下邊這一：

（濃濃的招數(shù)有沒有~~/(ㄒoㄒ)/~~）

ps：若有須要能夠在百度搜安卓版哦~

文本、圖片都是有了，姿勢都加上好啦，很有可能你也必須一首適合的BGM!

音樂背景工具

BGM下載與制作

一般 在挑選歌曲的時(shí)候會(huì)期待用這些超好聽的流行曲或電影配樂及舒緩音樂，可是通常這些音頻文件都非常大且無法立即上傳入H5在線編輯器內(nèi)，因此尋找文件格式尺寸適宜的背景音樂也須要費(fèi)些時(shí)間。百度搜索搜索音樂 ，歌曲名字 手機(jī)鈴聲，下載那類500kb、mp3格式的歌曲；音效網(wǎng)下載（站長素材）：聲效 音效素材 音效網(wǎng) 聲效下載留意！音樂背景最好是把控在500KB尺寸上下很大載入的過程中會(huì)較慢！但這種聲效很有可能并不可以符合要求，又特期待應(yīng)用自身關(guān)注的歌曲，那么就必須親力親為制作音樂背景：簡單一點(diǎn)的如：酷狗鈴聲制作工具（如下圖），針對一些簡易音樂剪切基本上媽達(dá)到；

升階一些的如 :Goldwave ,一個(gè)功能齊全的數(shù)據(jù)音樂編輯器，是一個(gè)集聲音編輯、播放視頻、視頻錄制和轉(zhuǎn)化的聲頻工具。它可以對聲頻信息開展轉(zhuǎn)換視頻格式等解決。

有歌曲了也許還不符合，有時(shí)還期待加一些小視頻這類的素材圖片，可是一般糖在H5著作中添加過長的短視頻是會(huì)影響到載入與訪問的，如確實(shí)必須或是必須做好視頻剪輯解決。

視頻工具

視頻剪輯與制作

除開一些常見視頻平臺(tái)能夠下載視頻，一些專業(yè)給予視頻素材的網(wǎng)址想來更對焦、更方便快捷。

如一些搜圖的平臺(tái)也給予視頻：我圖網(wǎng)

高清視頻網(wǎng)站：Pexels Videos

對收集來的材料開展解決下邊介紹好多個(gè)工具：

新手入門：愛剪輯視頻，簡易實(shí)用，輕輕松松入門，解決基本的視頻剪接每日任務(wù)充足了；升階：繪聲繪影，能夠開展圖片、歌曲、文本等素材圖片組成、制作、實(shí)際效果加上這些，高級(jí)：PR/AE，二者相結(jié)合應(yīng)用可以制作出史詩大面積，自然這種必須一些專業(yè)技能，實(shí)際操作也比較繁雜，必須細(xì)心。

表格工具

回收利用數(shù)據(jù)信息與問卷調(diào)查

H5內(nèi)嵌的表格基本上達(dá)到了活動(dòng)推廣、邀約、包含一些問卷調(diào)查作用等，且一般都兼顧數(shù)據(jù)分析作用。但比較于致力于表格行業(yè)的一些工具，很有可能并無法符合所有的消費(fèi)者的要求。因此給予下面好多個(gè)強(qiáng)勁的工具服務(wù)平臺(tái)產(chǎn)考：

麥客：組件化的設(shè)計(jì)方案、可對所需項(xiàng)開展拖動(dòng)設(shè)定、且有模版可供采用開展更換或自定；

金數(shù)據(jù)：對手機(jī)微信的適用比較好，尤其是手機(jī)微信提高包，十分強(qiáng)勁；業(yè)務(wù)流程偏重營銷推廣行業(yè)；會(huì)依據(jù)選定領(lǐng)域配對模版；

妙趣問卷調(diào)查：致力于問卷調(diào)查行業(yè)，

當(dāng)全部的材料都是有了，可便是對界面沒什么感覺，看起來花里胡哨實(shí)際上雜亂無技巧，例如排版設(shè)計(jì)與色彩搭配等，那這時(shí)你也許須要一個(gè)配色工具來融洽輔助全部界面了。

配色工具

純度對比很重要

要讓創(chuàng)作更為融洽，看上去舒適或更具有視覺沖擊色彩搭配不可或缺，那有關(guān)顏色的平臺(tái)有以下幾條：

Kuler ： http://kuler.adobe.com/

0to255：0to255 a€“ A simple tool that helps web designers find variations of any color

HTML Color Codes ：http://html-color-codes.info/

NIPPON COLORS - 日本の伝統(tǒng)色 ：http://nipponcolors.com/

Adobe Kuler - 最技術(shù)專業(yè)，最好用

Adobe 家的 Kuler 了，其幾十年在廣告設(shè)計(jì)行業(yè)的雄厚積淀，促使這款配色運(yùn)用擁有 充足的技術(shù)性份量。技術(shù)專業(yè)、功能強(qiáng)大，也許是很質(zhì)樸的語匯，但描述這款 App 再適合但是了。

http://EyeDrop.me - 視覺設(shè)計(jì)師的好幫手

作為一名視覺設(shè)計(jì)師，在計(jì)劃方案之際，常常會(huì)為怎樣作出一套好的配色計(jì)劃方案而擔(dān)心，根據(jù)一張漂亮的風(fēng)景相片從這當(dāng)中提煉出多個(gè)顏色開展配搭，便是一種非常常用的作法。

1. 可以查詢特定網(wǎng)址的配色

2. 順手照相，轉(zhuǎn)化成與眾不同配色表

3. 配色能夠推送Photoshop。

RealHex - 拾色器還能夠這樣用！

RealHex 做為一個(gè)撿取顏色并紀(jì)錄顏色變量值的運(yùn)用，不僅是室內(nèi)設(shè)計(jì)師，美術(shù)家，攝像師的專利權(quán)，所有人都能夠創(chuàng)造性應(yīng)用它，挖掘你不曾發(fā)覺的奇妙主要用途！

此外，在挑選衣服褲子、PSps修圖，乃至染頭發(fā)、做美甲、畫妝時(shí)都可以用上，防止形成偏色。

假如之上的輔助工具拿手中，是不是你感覺H5制作so easy了！

最終只需加上一個(gè)H5制作工具，將你的idea轉(zhuǎn)換為好看的著作。

輕輕松松制作H5

看過那么多，我沒有功績還有能者多勞(⊙o⊙)哇，你沒關(guān)心下嗎？

H5互動(dòng)推廣

填補(bǔ)：配色的輔助工具實(shí)際上也許多 ，例如:

Adobe Color CC

實(shí)際上本人感覺，H5也罷，人機(jī)交互、平面圖也罷，最后反映水平的是一種關(guān)愛，對客戶的關(guān)愛，裝x的講法便是說白了核心理念了。

可是對一個(gè)制作者而言，反映其水準(zhǔn)工作能力和使用價(jià)值的是最后結(jié)果，boss or leader全是注重成果的。

服務(wù)平臺(tái)與工具僅僅方式，頁面與互動(dòng)僅僅方式，主要表現(xiàn)與內(nèi)容則是心態(tài)，身后的需求才算是實(shí)質(zhì)！