WordPress 網站建設在此透過 3 種簡單的動態特效（而且每個人都可以輕易學會），來探索用 HTML5 網頁設計多媒體互動，能為展示帶來什麼樣的神奇效果。很多人都說我們 SEO 站群的網站設計效果做的很不錯，其實說多了更多的是我們設計師們的努力及經常會舉辦一些小型的分享會，把好的資訊分享給身邊的每一個小朋友，讓大家一起進步，而這邊文章就是我們 WordPress 網站建設-SEO 站群設計部的小夥伴們分享的小內容今天分享給大家！
1 、延時，60 秒做出生長的效果
如果您準備釋出 WordPress APPle Watch，如何在 5 秒內立刻抓住人們的眼球？一個簡單卻實用的方法是讓產品細節分步呈現出來，形成組裝產品的生長效果。
大部分產品有 PSD 格式的原型圖，設計精美但細節繁多，匯入 PPT 等軟體進行動效處理十分麻煩。如上圖，利用 iH5.cn 釋出的新功能，能在保留所有分層結構的前提下一次性匯入 PSD，快速製造延時的動效。
把 PSD 檔案拖拽到編輯器進行上傳，再為產品的部件分別新增飛入、彈跳等動效、設定動效在不同時間出現，就能模擬出產品的 “生長情況” 。
KEY#1：動效的延遲一開始可以控制在 1-3 秒，後面的間隔越來越短（並低於動效時長），還能形成重疊的動感，有利於製造現場的張緊感。
2 、聚焦，Duang 一樣的特技
“怎麼讓觀眾把注意力集中到我想要讓他們看的地方？” 聚焦有兩個技巧，一是把您想要突出的內容放大，二是隱藏不重要的內容。
著名的展示工具 Prezi 用的就是個法子，實時放大展示重點。但它應用還不廣，每到一個地方得重灌一次，功能也比較有限。如上圖，使用畫布工具來設計好玩的 “聚焦” 特技的遮罩功能，能在普通瀏覽器中進行線上展示。
在畫布下放兩張圖片，一張展示圖，一張 PNG 格式的白色蘋果 LOGO，把展示圖的遮罩設為蘋果 LOGO，就有上圖的效果。容易吧？如果再為圖片放一個向左滑動的效果，還能製造漂移的動感。
KEY#2：畫布的遮罩效果和設為遮罩的圖片息息相關，作為遮罩的圖片色彩越明亮，被遮的圖片越不透明。
因為作為遮罩的蘋果 LOGO 是全白的，它顯示區域內的圖片才是完全不透明的。比如上面從白色到黑色的四個圓是遮罩，它的顏色越深，城堡圖片對應位置的透明度越低。遮罩全黑時，城堡就不見了。
（注：國內很多移動端瀏覽器尚未支援 HTML5 的 Canvas 遮罩效果，所以它目前更適用於 PC 端展示。）
3 、演示，是調節氣氛的步伐
如果想要設計一場毫無缺漏的釋出會，直接搞一場錄播就行，但也失去了現場的魅力。因為可能會出現各種突發情況，現場才更刺激、更有吸引力。怎樣能在展示中加入可控的 “變數” 來調節氣氛？
答案之一是演示，而且知名是用一些讓觀眾自己上臺，同樣能輕易完成的行為。電腦上的比如簡單的拖動，如上圖，利用有趣的遮罩結合拖動來展示不同型號的蘋果手機。
這裡應用到了遮罩強悍的 “濾鏡” 功能，設定很簡單，只是把剛才的白色蘋果 LOGO 做成了彩色漸變，再用一張蘋果手機的圖片作為彩色 LOGO 的遮罩。這樣一來，相當於保留了 LOGO 的顏色特徵，又能利用蘋果手機圖片的色彩明暗變化讓 LOGO 現出蘋果手機的 “原形” 。
這時候，把蘋果 LOGO 圖片的 “拖動型別” 設為任何方向，就能在展示中途隨意用滑鼠拖移蘋果 LOGO，演示為蘋果手機加彩色濾鏡的特技了。
KEY#3：想要實現 Prezi 的聚焦放大效果？使用事件工具，在一張允許拖動的圖片上放個透明按鈕，設定點選按鈕時圖片尺寸放大就行
“除非您有值得一說的東西，不然您就做不了一個好的演講。”
全球赫赫有名的 TED 大會，靠演講為世界傳播了各種各樣的創意。而作為 TED 多年的策展人 Chris Anderson，有著上面這句名言。
有了值得一說的東西，是否有足夠好的演講手段，是史蒂夫·喬布斯和蒂姆·庫克在蘋果釋出會上反響的區別。您更欣賞喬布斯還是庫克？現在，您還要錯過用動態展示抓住觀眾注意力的機會嗎？