ウェブデザインにおいて、キネティックエフェクトは単なるケーキの上のアイシングではなく、訪問者の感情を呼び起こし、視線を誘導(dǎo)し、コンテンツの表現(xiàn)力を高めます。微妙なスクロールアニメーションやテキストの分割効果、あるいはページ要素のわずかな浮き上がりは、注目を集めることができます。

利用する エレメンタル?プロ 提供アニメツールを使えば、ダイナミックなウェブページを簡単に作成できます。以下では、アートワークのプレゼンテーションやブランド紹介、インタラクティブなページに適した、一般的で人目を引くアニメーションの4つの方法をご紹介します。

1.ズーム?コンテナ?アニメーション：フルスクリーンの視覚的インパクトを生み出す

小さな要素をページ上で拡大し、瞬時(shí)に目を引くようにしたいですか？コンテナ背景ズームエフェクトを使えば、そんなことができます。

操作手順：

• コンテナを挿入し、背景に設(shè)定するスライド複數(shù)の畫像を追加して回転させる

• ページ上部にコンテナを固定する「スティッキーポジショニング」を有効にする。

• スクロール効果」をオンにし、「ズーム」を選択します。
• ズーム速度の調(diào)整

• X、Yのアンカーポイントを設(shè)定し、ズーム方向を制御する

• アニメーションの完全なレンダリングを保証するために、コンテナの高さを上げる。

バナー、オープニングアニメーション、ビジュアルメインイメージエリアなどに最適。

2.エレメント?フローティング?アニメーション：ページ上の空間的階層感を高める。

ページ上の畫像やグラフィックをスクロールとともにゆっくりと浮遊させることで、軽やかで流れるような雰囲気を演出することができる。

実踐的なアプローチ：

• 複數(shù)の畫像や裝飾グラフィックを挿入

• イネーブル"スクロール効果オフセット変換」の「オフセット変換」機(jī)能

• 要素がXまたはY方向に移動(dòng)する距離を設(shè)定します。

• 透明度、スケーリング、回転、その他のパラメータを組み合わせて、レイヤーの変更を作成します。

• 異なるオフセット値を持つ複數(shù)のエレメントにより、より自然なダイナミックエフェクトを?qū)g現(xiàn)。

ブランド紹介、チーム紹介、サービスフローなどのページに適しています。

3.テキスト分割アニメーション：物語のリズム感を示す

このアニメーションは、スローガンや分割された文章、見出しのテキストを、視覚的に強(qiáng)く拡張して見せるのに最適です。

製造方法：

• Sticky Top」に設(shè)定した大見出しテキストを挿入する。

• 新しいコンテナを作成し、2段落のテキストを追加し、左右から中央にスライドさせる。
• 2つのテキストブロックに「水平スクロール」と「透明」エフェクトを適用する。

• コンテナも "Sticky Top "に設(shè)定されている。
• 各行ごとに上記の手順を繰り返すと、行ごとにスライドする分割テキストが完成する。

コンテンツのトランジション、ブランディングのアイデア、バナーのトランジション、その他のシナリオに最適です。

4.エントリーアニメーション：ページの読み込みをよりリズミカルにする

エレメンタ 內(nèi)蔵のエントリーアニメーション機(jī)能により、ビューポートに入ったときにページコンテンツをさまざまな方法で表示することができ、全體的なブラウジング體験が向上します。

推奨される使用法

• 上下左右からのスライドイン方式の設(shè)定

• フェード、ローテーション、その他のスタイルも使用できます。

• ブロックの位置に応じてアニメーションの方向を調(diào)整
• ページをよりダイナミックにするために、畫像、ヘッダー、ボタンと一緒に使用する。

ブロックタイプのページ、サービス內(nèi)容、プロジェクトフロー、その他のモジュールの表示に最適です。

概要

デザインとは、単に要素を配置することではなく、感情やストーリーを伝えることだ。そのために エレメンタル?プロ なアニメウェブページをより生き生きと表現(xiàn)豊かにする機(jī)能：

• コンテナをズームイン／ズームアウトして、素早く注目を集める
• ページ階層を強(qiáng)調(diào)するフロート要素
• 読書のペースを?qū)Г匹攻确指?/li>
• コンテンツを盛り上げるイントロダクション?アニメーション

これらのツールや設(shè)定テクニックを使うだけで、視覚的にスムーズで生き生きとしたウェブページを構(gòu)築できる！

お問い合わせ
チュートリアルが読めない？無料でお答えします！個(gè)人サイト、中小企業(yè)サイトのための無料ヘルプ！	カスタマーサービス WeChat
① 電話：020-2206-9892
② QQ咨詢：1025174874
三 Eメール：info@361sale.com
④ 勤務(wù)時(shí)間: 月～金、9:30～18:30、祝日休み