Muse (2015) 基本講座

グラデーションの作成

全334コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
ベタ塗りの設定してある長方形に対し、グラデーションによる塗りを設定し、色の割合などを細かく設定する手順を解説します。
講師:
04:12

字幕

このレッスンではグラデーションを使った作業について解説します。それではこのレッスンのファイルを開いてHome を開けます。そうすると、この部分にある長方形ですが今こんな感じの黄土色ですね。それで、べた塗りしてあります。ではこの塗りの部分の詳細を開けます。そうすると、塗りの種類として単色とグラデーションが選べます。それではここをグラデーションに合わせてみましょう。そうすると、こんな状態になりました。こっちの左端は元々あった色ですが右端がもう1個の色、黒ですね。設定されていて、この色からこっちの黒にかけてグラデーションしていくそのような状態となりました。では今これが「水平方向」となっているのでこの方向でグラデーションなってますがこれを「垂直方向」にしてみましょう。そうすると、この様な感じに上下に変化する形となりました。ではこの状態を元にして一番下が、この色ですね。そして上はもっと明るい色に設定してみようと思います。では今こっち側がこの黄土色なってるのでこの色をこちら側に移そうと思います。その時なんですが、この「カラー」を開けてカラーコードですね、この部分を選択してMac の方は CommandWindows の方は Ctrl キーを押しながらC を押してコピーします。 そしてもう片方の方にそれを Ctrl もしくは Command+V でペーストすればこちら側はこの色になります。そして反対側の色ですね、こちら側を変えるとこの様な感じで、下が暗くて上が明るいグラデーションにできます。ではこっち側、この黄色これに設定してみるとこんな感じで明るくなりましたね。こんな形で、その隣に切り替えたり丁度良い色を探してみます。ではここの黄色ですね、もしコードで入れるとすればFBB03B となるこの色に設定してみましょう。すると、ほかの部分ともバランスの良い丁度いいグラデーションができたかなと思います。グラデーションですがまず色を設定した後例えばこの「焦点」というのをいじるとどちら側の色を割合を多くするかというのを調整することができます。左に行くほどこちら側の色が強くなって数値が上がるほどこちら側の色が強くなると50% にすると丁度バランスよく変わっていくという状態となっています。そしてもう1つ「サイズ」とありますが今「自動」になっています。これを「固定」に切り替えると何ピクセルでグラデーションになるかそれを数値でこの様に決めることもできます。この様に非常に細かい単位でグラデーションを決めることができるので様々なタイプのデザインに対応することができます。 例えばグラデーションの背景画像をわざわざ用意しなくともMuse の内部でこの様なグラデーションを使ったリッチな表現が可能となります。これを使うと表現の幅がかなり広がるので是非とも活用して下さい。

Muse (2015) 基本講座

WebデザインソフトMuseを使うと、HTMLのコードを使わずにデザイン性に溢れるWebページを簡単に作ることが可能です。このコースではマスターページの作成やコンテンツの追加、テキストの追加や色の設定、ウィジェットや拡張機能の活用、レスポンシブなレイアウトの設定やデータをアップロードしてウェブ上に公開する手順などMuseの操作をひと通り学ぶことができます。

4時間01分 (39 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 3,990
発売日:2016年07月02日
再生時間:4時間01分 (39 ビデオ)

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。