軟件介紹
目前網頁上的可交互動畫主要由FLASH和HTML5制作,其中HTML5更受大家歡迎,而今天為大家推薦的Hype蘋果版就是一款專門為蘋果Mac電腦打造的HTML5編輯軟件,讓用戶無需編碼就可以在網頁上做出賞心悅目的動畫效果,與Keynote軟件的界面基本一致,并且支持層、時間軸等編輯方式。
Hype for mac延續了蘋果軟件的簡潔風格,用戶可以通過這款軟件創建豐富的網頁交互動畫,并能很好的導出HTML5/CSS3/JavaScript,同時支持多個平臺,無論是在Mac筆記本、iPhone手機和iPad上流暢表現。
軟件特色
總覽
Hype 4是用于macOS的HTML5創建應用程序。用Hype制作的交互式內容和動畫可在臺式機,智能手機和iPad上使用。
場景
場景是分離和組織內容的有用方法。它們類似于Keynote或PowerPoint演示文稿中的幻燈片。
元素
元素是場景中的對象。它們可以是形狀,文本,按鈕,紋理按鈕,圖像,視頻或HTML小部件。
矢量形狀
矢量是使用矢量工具繪制的形狀,包括直線,曲線和復雜形狀。
動畫制作
Hype使用功能強大的基于關鍵幀的動畫系統為元素提供運動和過渡。它的錄制功能使制作動畫變得輕而易舉。
時間線
時間軸包含動畫。每個場景至少有一個時間軸,場景也可以有許多時間軸。使用動作來開始,暫?;蚶^續時間表會創建豐富而復雜的文檔。
動作
場景,時間線和動畫是所有Hype文檔的基礎。動作將這個基礎聯系在一起,并使文檔具有交互性。
符號
符號是一個功能強大的工具,可讓您輕松地重用元素,時間軸和動畫。
音頻視頻
Hype支持最新的HTML5音頻和視頻API,用于創建具有豐富多媒體內容的文檔。
版式
文字和字體控件,Google字體和自定義字體支持。
物理
物理使您可以控制元素的物理屬性(反彈,摩擦,空氣阻力和密度)以及場景的引力。
響應式布局
響應式布局允許您為單個場景創建多個布局,這些布局顯示在特定的斷點處。
布局靈活
靈活的布局是一個功能強大的布局系統,用于調整文檔和元素的大小和縮放比例,允許Hype動畫在瀏覽器窗口或設備的視口更改大小時做出響應。
Hype反映
適用于iOS的Hype Reflect可讓您在任何iOS設備上快速預覽或鏡像Hype文檔。
觸控與行動
Hype提供了幾種用于產生觸摸友好交互性的選項。
預覽和導出
在本地瀏覽器上預覽Hype文檔并將文檔導出到Web。
輔助功能
了解有關如何在文檔中添加替代文本,角色和輔助功能的信息。
導出腳本
通過在導出過程中添加其他處理步驟來自動執行Hype輸出。
范本
模板是“凍干”的Hype文檔-打開Hype模板會基于打開的模板創建一個新文檔。
資源資源
資源是已添加到Hype文檔中的圖像,視頻,JavaScript函數和其他文件。
JavaScript
Hype中的JavaScript函數通常是響應用戶事件而運行的。
檢驗員
Hype的九名檢查員可以輕松訪問文檔,場景和元素屬性,以及各種其他控件。
捷徑
探索Hype的眾多鍵盤快捷鍵,以更有效地工作。
Hype蘋果版軟件功能
多邊形
可以將任意數量的側面形狀輕松插入文檔中。它們是可編輯的,并且可以作為更復雜的矢量形狀的起點。
路徑 路徑
路徑通常被稱為“鋼筆工具”,“曲線”或“向量”,是所有向量形狀的基礎,并且可以包含多個由控制點操縱的直線或曲線段。
鉛筆工具 鉛筆工具
您可以畫一條線,而不是為路徑定義單個點,它會自動平滑并轉換為路徑。我們建議將此工具與Astropad等平板電腦解決方案配對。
形狀變形 形狀變形
自動將一個矢量形狀設置為另一種形狀!您需要做的就是點擊記錄,移動播放頭和修改形狀。
畫線動畫 畫線動畫
非常適合內置,您可以使用“ vivus”風格的效果使矢量形狀具有被繪制的外觀。使用“鉛筆工具”時,可以自動添加這些工具。
物理與互動 物理與互動
矢量形狀可以成為動態物理實體,并成為模擬物理環境的一部分。使用“鉛筆”工具繪制的形狀將變得生動起來!
精靈表/圖像序列導入
導入使用其他工具制作的 Sprite 表格,或讓 Hype 為您提供一系列圖像文件或 GIF 動畫的表格。連同持續時間和循環選項,可以在時間軸上操縱生成的動畫元素。
掉落和嵌入陰影
陰影使用 CSS 濾鏡效果將陰影動態添加到具有不規則形狀的元素或包含 alpha 值的圖像。插圖陰影像小插圖一樣應用到盒子的內部。
回退映像
拍攝活動場景的快照,并將其用作廣告的海報/備用圖像,或在用戶禁用 JavaScript 時用作備用。
數學方程式計時功能
您可以編寫 JavaScript 方程式來定義動畫的定時功能,而不是內置或自定義緩動。
官方CDN
此高級導出選項允許使用托管的運行時文件。對于廣告,它們通常不計入可交付文件的大小要求,并且在某些情況下可以加快加載速度。
iPhone X選項
現在,預設場景大小包括最新手機的默認大小,并且有一個用于處理陷波的移動選項。
翻頁過渡
這是從一個場景到另一個場景(綁定到拖動手勢)的最平滑方法。它是“現場輕掃”操作的過渡選項。新的“為顯示準備”動作處理程序提供了設置下一個場景的機會。
偏斜
通過在 X 或 Y 方向上添加剪切來變換元素。細微的偏斜動畫可以為您的元素增添生氣。
外部編輯
編輯其他應用程序中的資源??梢栽谖谋揪庉嬈鳎ㄈ鏐BEdit)中編輯 JavaScript 函數或 Head HTML??梢栽赑hotoshop 或 Affinity Photo 等應用中編輯圖像。保存在另一個應用程序中會將文件寫回到您的 Hype 文檔中。
可編輯的HTML屬性
將其他屬性添加到圖像。這可以是自定義data- *屬性,也可以是標準屬性,例如視頻的 poster 屬性。
物理API訪問
Hype 的物理引擎基于 something.js,現在可以通過 JavaScript 代碼和元素設置器 API 進行訪問。這允許進一步定制并利用其高級功能。
Hype蘋果版使用方法
Hype的默認界面采用專業黑色設計,分為5個主要區域,包括頂部的工具條,左側的場景切換,中間的內容區和動畫控制區。最右側是對元素、符號以及頁面屬性的一些控制。Hype 3的整體界面操作有些類似 Xcode,不過有了更簡化的操作流程,用戶只需要在空白區域錄入內容,然后選擇內容的動畫變化即可。
Hype的常規設置中,可以調整用戶界面主題色調,以及一些警告的提示設置。此外,Hype 3還可以通過Dropbox同步數據,目前應用還不支持iCloud Drive。最后,應用還有 Hype Reflect for iOS 的推薦,iOS 版 Hype 可以即時預覽 Hype 生成的網頁和 HTML 5動畫??偟脕碚f,Hype 3 將復雜的網頁和動畫創建功能集成在簡單易于使用的界面之中,當然學些Hype 3也需要一些精力和時間,不過整體過程要比學習變成更容易一些。
Hype蘋果版安裝方法
1、從開心電玩下載Hype For Mac官方版后,雙擊dmg文件
2、然后會出現一個彈窗示意我們將“Hype.app”拖入到應用程序的文件夾中,我們照做,將它拖入進去即可
3、之后我們便可以在MacOS自帶的文件管理器的“應用程序”欄目中找到我們的Hype,找到它之后我們就可以雙擊打開將它運行了
- 普通下載:
- 官網遠程下載