トゥムルト誇大広告

誇大広告とは何ですか?

誇大広告 Mac用の強力なHTML5アニメーションツールです。 これにより、デザイナーはインタラクティブで人目を引くアニメーションを作成でき、エクスポートしてWebページに埋め込むことができます。

Blocs Hypeと連携して動作するように最適化されており、合理化された設計ワークフローを提供します。 次のXNUMXつの無料カスタム Brics にインストールする必要があります Blocs 続行する前に

誇大広告のプレビュー Bric

誇大広告の埋め込み Bric

重要な!

このワークフローには次のものが必要であることに注意してください Blocs 3.4.3最小およびHype4.0.3最小。

リアルタイムの誇大広告プロジェクトのプレビュー

Blocs 現在開いているHypeプロジェクトのリアルタイムプレビューをサポートし、デザイナーがHypeでHTML5アニメーションを作成し、それらがどのように表示されるかを確認できるようにします。 Blocs それらをコンパイルしてエクスポートする必要のないプロジェクト、これは信じられないほど高速で効率的で強力なアニメーションWebデザインワークフローを提供します。

次の手順を使用して、現在開いているHypeアニメーションシーケンスをプレビューします。 Blocs.

1.誇大広告のプレビューを追加します Bric を使用してページに Bric バー.

2. Hypeで、プレビューボタンを押して、 Blocs 利用可能なオプションから。 誇大広告のプレビュー Bric 以内 Blocs 現在のHypeアニメーションシーケンスが表示されます。

出力モードのプレビュー

誇大広告のプレビュー Bric、XNUMXつの出力モードがあります。 プレビュー & ライブ.

プレビューモード

プレビューモードでは、エクスポートしてページに埋め込むと表示される現在のアニメーションシーケンスが出力されます。 このモードはデフォルトで有効になっています。

ライブモード

ライブモードでは、実際のHypeデザインステージのリアルタイムミラーが表示されます。 Blocs 設計環境。 たとえば、Hypeタイムラインコントロールを使用して現在のアニメーションシーケンスを再生およびループするようにHypeを設定すると、同じ出力が Blocs.

重要な!

誇大広告のプレビューに注意してください Bric Hypeアニメーションシーケンスを作成およびテストしているときにのみ使用することを目的としています。 最終的なHypeアニメーションを含むWebサイトをエクスポートしてホストする必要がある場合は、 誇大広告の埋め込み Bric プロダクション用にHypeシーケンスを追加します。

誇大広告のアニメーションを埋め込む

のページにHypeシーケンスを埋め込む Blocs 信じられないほど簡単です。

1. Hypeで、を選択してシーケンスをエクスポートします ファイル> HTML5としてエクスポート>フォルダ… メインアプリケーションメニューから。 これにより、Hypeアニメーションに必要なすべてのリソースを含むディレクトリが作成されます。 ディレクトリ名がで終わることに注意してください .hyperresourcesたとえば、次の your_project_name.hyperresources

2.エクスポートされたHypeをドラッグするだけです .hyperresources MacOSFinderからディレクトリ Blocs デザインキャンバス。 これにより、Hypeアニメーションシーケンスのすべてのリソースが現在のに追加されます Blocs としてプロジェクト プロジェクトの添付ファイル.

3.誇大広告の埋め込みを追加します Bric を使用してページに Bric バー。 誇大広告で Bric で選択 Blocs デザインキャンバス、に移動します ドロップダウンメニュー サイドバーインスペクターで、ラベル付き 誇大広告の名前 ここに表示するHypeアニメーションシーケンスを選択します。

今あなたが プロジェクトをプレビューする 以内 Blocs Hypeアニメーションが表示されます。

初心者向けのヒント!

XNUMXつのHypeアニメーションシーケンスは、XNUMXページにXNUMX回しかレンダリングできないことに注意してください。 のすべてのページにHypeアニメーションシーケンスを追加するには Blocs プロジェクト、単に誇大広告の埋め込みを含める Bric Bloc プロジェクトのXNUMXつにネストされている グローバルエリア.

誇大広告は初めて

Hypeを初めて使用し、それに応じてスケーリングするコンテンツの作成に関するヘルプを探している場合は、Hypeのドキュメントから以下を読むことをお勧めします。

レスポンシブレイアウト

柔軟なレイアウト

13年2020月XNUMX日に更新

この記事は役に立ちましたか?

関連記事