不編程朋友圈H5微場景製作方法?

隨著朋友圈的風靡全國,朋友圈裡面的H5微場景的應用也越來越多,可是製作朋友圈H5微場景方法還是有很多人不知道,下面就億展秀為例為大家做一個教程。

一款非常強大的HTML5創作工具,無需編程即可製作含各種特效和交互的移動手機頁面。讓人人都能輕鬆做出電影特效一般的炫酷特效。我經常會使用做微信公眾號內的圖文推廣,當然,我們在微信公眾號,朋友圈等也經常可以看到其他用戶製作的億展秀作品。那麼,對於新手來說,該怎麼學習使用億展秀呢?怎麼用做一款漂亮的微信H5?下面讓我來給大家介紹下使用教程吧。

工具/原料

電腦+網絡+億展秀

方法/步驟

1. 註冊\登錄

1. 註冊入口:點擊首頁右上角“註冊”按鈕進入登錄界面;2. 登陸界面:輸入有效註冊的個人賬號信息:郵箱、密碼;您也可以選擇QQ等第三方登錄。3. 密碼找回:進入賬戶登錄界面,點底部點擊“忘記密碼?”,按提示重置密碼;

不編程朋友圈H5微場景製作方法

2.新建項目

項目是您使用本平臺製作的H5作品。本平臺讓您一分鐘上手,五分鐘創作屬於自己的酷炫H5。

1. 新項目添加:在項目列表按鈕“新建項目”,創建您的新項目;

2. 進入模板中心,選擇億展秀內置模板或創建一個空白模板即可開始你的作品編輯。

不編程朋友圈H5微場景製作方法

不編程朋友圈H5微場景製作方法

3.編輯模式

1、全新億展秀提供固定模式和自由模式兩種編輯模式。2、在固定模式中,你可以通過簡單地替換文字和圖片快速創作精美項目。3、在自由模式中,你可以自由添加和拖動元素,最大程度地滿足用戶個性化創作需求。

不編程朋友圈H5微場景製作方法

4.新建頁面

1、點擊編輯器左下角“+”可新建頁面。

2、億展秀提供海量精美單頁模板,圖文模板、表單模板、數據模板、特效模板應有盡有,任君選擇。您可以隨意挑選滿意的模板進行創作。3、 除此之外,您也可以添加空白頁面。

不編程朋友圈H5微場景製作方法

5.元素編輯

1、編輯器的元素包括背景、文本、圖片、形狀、按鈕和圖標。2、點擊現有元素,編輯器右側會出現該元素的編輯選項,你可以把它變成你想要的樣子。3、點擊編輯器上方的各元素按鈕可新增元素。

不編程朋友圈H5微場景製作方法

6.背景

1.替換背景:點擊編輯區的背景,點擊右側“替換背景”按鈕,上傳本地圖片或使用億展秀圖庫的圖片,可將背景替換成你選擇的圖片。建議上傳與選擇的圖片尺寸大小為640*1008像素。2.背景編輯:在這裡,可根據用戶喜好裁剪背景,調節背景圖片的顏色、透明度等。3.翻頁效果:可修改頁面的翻頁效果,億展秀提供近10種頁面翻頁效果。

7.文本

1.新建文本:點擊編輯器上方“新建文本”按鈕,可在頁面中添加一個文本。2.文本編輯:點擊文本,可在右側修改文本的內容、顏色和字體樣式,也可修改文本框的背景色、透明度、陰影、圓角、旋轉等屬性,也可拖動文本框的兩側改變文本框的長度。

不編程朋友圈H5微場景製作方法

8.圖片

1.新增圖片:點擊編輯器上方“圖片庫”按鈕,可打開億展秀圖片庫,其中包含系統圖片和自己上傳過的圖片,選擇圖片即可將圖片添加到頁面中。2.圖片編輯:點擊圖片,可在右側修改圖片的尺寸、透明度、圓角、陰影、旋轉、邊框等屬性,也可拖動圖片的四角改變圖片的大小。

不編程朋友圈H5微場景製作方法

不編程朋友圈H5微場景製作方法

9.形狀

1.新增形狀:點擊編輯器上方“形狀元素”按鈕,可選擇形狀添加到頁面中。2.形狀編輯:點擊形狀,可在右側修改形狀的顏色、樣式、透明、旋轉等屬性,也可拖動形狀的四角改變形狀的大小。

不編程朋友圈H5微場景製作方法

10.按鈕

1.新增按鈕:點擊編輯器上方“按鈕鏈接”按鈕,可在頁面中添加按鈕。2.按鈕編輯:點擊按鈕,可在右側修改按鈕的鏈接、文本內容和顏色、按鈕背景顏色、透明度、陰影、圓角、邊框和旋轉等屬性,也可拖動按鈕的兩邊改變按鈕的寬度。

11.表單

1.新增表單:表單為特定模板中才有的元素,故添加表單時需添加表單模板。點擊左下角“+”,點擊“表單”,選擇一個表單模板,可新增一個表單頁面。2.表單模板:目前億展秀提供2種表單樣式的模板,一種可以填寫2項信息,用於收集較基礎的信息;另一種可以填寫5項信息,用於收集較全面的信息。3.表單編輯:點擊表單的標題、描述和表單主題可在右側分別對錶單進行編輯。在此可修改表單的各項信息、表單提交按鈕文本和提交反饋文本。

不編程朋友圈H5微場景製作方法

注意事項

HTML5的流暢度與設備型號和版本高度相關,建議使用iPhone4s以上或安卓4.0以上的設備進行瀏覽。

3G以上的移動網絡能夠給您帶來絕佳的瀏覽體驗,但部分豐富的作品建議在Wi-Fi環境下瀏覽。

億展秀建議作品上傳音樂大小不大於1M,每張圖片(支持jpg、png、gif)不大於2M。

為了獲得更好的使用,建議使用谷歌瀏覽器(chrome)、360瀏覽器、IE11瀏覽器。

相關問題答案