シルクオーロラ:夜のネイビーにゆらめくアクアとペリウィンクルのアニメーション オーロラ
シルクオーロラでは、アクア、ペリウィンクル、エメラルドグリーンの帯が、ほぼ黒に近いネイビーのベースの上を漂います。グラデーションの種類は「オーロラ」、パレットは「北欧の夜」で、「アニメーション」はオン、「速度」は 35 なので、帯は駆け抜けるのではなくゆっくりと揺れます。「グレイン」は 10 まで下げて帯のなめらかさを保ち、「ビネット」の 35 が、夜空のように端を闇へ沈めます。
自分好みに仕上げる
読みやすいように動きを遅くする
「速度」は 35 で、穏やかですが動きは目に入ります。本文の背景にするなら「速度」を 15 あたりまで下げるか、「アニメーション」をオフにして、止まったフレームを「Open Graph」プレビュー用の静止画として使います。
帯を広げる、または絞る
空というより光のショーのような細く鋭い筋にするには、「柔らかさ」を 40 から 20 に下げます。逆に 65 に近づけると、それぞれの帯が太くなり、幅広い光の広がりになります。
よくある質問
アニメーションするオーロラ背景はコンテンツの邪魔になりませんか?
この設定なら邪魔になりません。動きは「速度」35 のゆっくりした揺れで、パレットも暗いままなので、明るいテキストのコントラストが保たれます。最も明るい帯を見出しから離し、「ランディングページ」と「モバイル」のプレビューを確認し、動きを減らす設定を好む訪問者のために静止版も用意しておきましょう。
使い方
出発点を選ぶ
ソフトメッシュ、日食の光芒、リソハーフトーンなど 28 のスタイルのいずれかから始めるか、グラデーションの種類と 24 のパレットのいずれかを選びます。
グラデーションを調整する
スケール、ゆがみ、渦巻き、柔らかさを調整し、グレイン、ガラスパネルやガラスタイル、ドット、グリッド、線のオーバーレイ、ブレンドした 2 枚目のレイヤー、ハーフトーンやピクセルソートなどの加工を追加します。アニメーションをオンにして、速度を個別に設定することもできます。
プレビューして使う
ランディングページ、カード、モバイル、新規登録のレイアウトでグラデーションを確認します。その後、無料の UX Pilot アカウントでログインすると、キャンバスで使用したりエクスポートしたりできます。