menu

画面背景にバブルアニメーション(Adobe Muse CC)

【Adobe Muse】の機能を利用したコンテンツを紹介しています。
サードパーティウィジェット「Bubble Background」Widgetを利用すると、
簡単な設定で画面背景にバブルアニメーションを演出することが出来るようになります。
※スマホ対応

〔特徴〕
・泡の後ろにグラデーションの背景を追加します。
・気泡をアニメートするか、気泡を静止させる。
・気泡の量を設定します。
・泡の周りにぼかしを設定します。
・ぼかし色を設定します。
・バブル合成には4つのオプションがあります。
・泡を透明に設定し、泡の後ろにウェブサイトを表示させます。
・泡の色相、彩度、明度、不透明度を設定します。
・バブルのランダムな色相と不透明度を有効にします。
・最新のブラウザのみ。

〔設定項目〕
▼Background Gradient(背景グラデーション)
・First Color
・Second Color
▼Bubble Setings(バブルの設定)
・Amount of Bubbles(泡の量)
・Blur Amount(ぼかし量)
・Blur Color(ぼかし色)
・Compose(作成する)
  ・Source Over(ソースオーバー)
  ・Destination Out(行き先)
  ・Lighter(ライター)
  ・XOR(XOR)
▼HSB And Opacity(HSBと不透明度)
・Hue(色相)
・Saturation(%)(飽和)
・Brightness(%)(輝度)
・Opacity(0-1)(不透明度)

▽サンプル(5パターン用意しています)
live-preview

「Bubble Background」Widgetについての詳細はコチラ(外部サイト)

▷Adobe Muse CCでホームページの制作/岸岡デザイン事務所
http://y-kishioka.com

▷Movie Web Magazine/KISHIOKA.DESIGN
http://kishioka.design

fullscreen-split-slider01フルスクリーン分割スライダー(Adobe Muse)

slides-presentations01スライドショーでプレゼンテーション(Adobe Muse CC)

関連記事

  1. versaslide_img01

    ページスライドアニメーション(Adobe Muse)

    サードパーティウィジェットの「Versa Slide」Widgetを利用することで、フルスクリー…

  2. pdfviewer

    PDFファイルをダイレクトに掲載(Adobe Muse)

    【Adobe Muse】の機能を利用したコンテンツを紹介しています。サードパーティウィジェッ…

  3. chart-connect01

    4種類のチャート図制作(Adobe Muse)

    【Adobe Muse】の機能を利用したコンテンツを紹介しています。サードパーティウィジェッ…

  4. dynamic-copyright

    コピーライトの年号を自動で変更(Adobe Muse)

    【Adobe Muse】の機能を利用したコンテンツを紹介しています。コピーライトに年号を使用…

  5. text-animations

    13種類のテキストアニメーション(Adobe Muse)

    サードパーティウィジェット「Text Animations」Widgetを利用することで、テキス…

  6. slanted-panels-01

    斜めのラインとスクロール効果を使う流行のデザインも簡単に表現可能…

    【Adobe Muse】の機能を利用したコンテンツを紹介しています。サードパーティウィジェット「…

  7. musexpress01

    MuseとWordPressの連携(その1/Adobe Muse…

    Adobe MuseとWordPressを連携させたサイトの制作に挑戦。実現させるために「M…

  8. video-player01

    デザイン優先、5種類のビデオプレーヤー(Adobe Muse)

    【Adobe Muse】の機能を利用したコンテンツを紹介しています。サードパーティウィジェッ…

PAGE TOP