模塊封面圖設計規(guī)范和教程

為了維護APICloud模塊store對外形象，提高開發(fā)者模塊的對外展示效果，提高銷量和轉(zhuǎn)化，所有發(fā)布到APICloud的模塊封面圖和運行圖必須達到標準，才可發(fā)布，請開發(fā)者嚴格執(zhí)行規(guī)范標準。

封面圖基本規(guī)范：

1. 圖片尺寸為250*179。圖片要清晰，不變形，不模糊。字體選用不建議使用特殊字體，可參考UIEaseChat模塊封面圖的字體。字號建議18或20px,不宜過大或太小。
2. 圖片能正確反應模塊功能。
3. 圖片必須美觀（無設計基礎(chǔ)的開發(fā)者，配色排版可參考模版。建議找相關(guān)專業(yè)人士幫助設計。）

運行圖基本規(guī)范：

1. 運行圖應使用手機運行模塊，然后進行豎屏截屏。應盡可能全面準確的反應模塊的功能或效果。 在非手機的特殊設備使用的模塊，可以使用拍攝圖。
2. 不帶UI，只回調(diào)數(shù)據(jù)的模塊，可以展示接口運行時回調(diào)的數(shù)據(jù)。
3. 運行圖要求清晰美觀，不變形，盡量不要有模塊無關(guān)的UI效果。

若無ps經(jīng)驗，可以使用在線網(wǎng)站設計工具。

推薦1、https://www.chuangkit.com/designtools/startdesign

推薦2、https://mybrandnewlogo.com/

推薦3、https://www.iconfu.com/

以下為ps設計教程（模板psd文件及示例圖片可在本文檔底部下載）：

一． 功能類模塊

1， 以模塊“gyroscopeSensor” 為示例

1) 首先創(chuàng)建一個新的文件，寬度250px、高度179px，分辨率72px（也可以直接打開“模塊封面模版（功能類）-psd“ 文件上修改）

2) 百度搜索陀螺儀相關(guān)的圖片，截圖粘貼到ps新的圖層，“ctrl+T“調(diào)整圖片大小到合適位置（同時按住shift+ALT等比例縮放）

3) 填充背景圖為圖片底色，效果即為一體。

選擇背景層，填充顏色 ALT+del （前景色），ctrl+del（后景色）。點中前景色可以吸附已有的圖片顏色，填充即可。

4) 選擇文字工具，輸入模塊功能簡稱（字體：蘋方/黑體、常規(guī)體、20點、白色（淺色背景可以是黑色/灰色）），移動到合適的位置。

5) 打開泡泡裝飾圖層，效果如圖。

6) 最后選擇圖片存儲為png格式就大功告成了。

2， 以模塊“JPG功能類模塊”為示例（可以直接打開模版在原有圖層修改）

二． UI類模塊（具體步驟參考“一”）以下主要介紹布局策略

（1）UI功能模塊的相關(guān)截圖，選擇較為美觀的局部或全部

（2）可以配模塊描述也可不配

（3）選擇好看的背景顏色，突出UI效果圖

三． 第三方類模塊（具體步驟參考“一”）以下主要介紹布局策略

（1）第三方logo+文字描述

（2）第三方logo+第三方官網(wǎng)相關(guān)配圖組合

（3）第三方logo+背景圖

模板psd文件及示例圖片下載