Muse (2015) 基本講座

CCライブラリのカラーを適用

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

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
Adobe Colorを使って作成したカラーテーマを、実際にMuse上のデザインに反映させるための手順について解説します。
講師:
06:35

字幕

このレッスンではカラーテーマを使ったサイト内の配色について解説します。それではこのレッスンのファイルを開きます。そして Home の画面を開きます。CC Libraries を開くとAdobe Color CC で作成したカラーテーマが保存されています。ではこれを使って、このサイト内に色を配置していきましょう。まず例えば、この Home の中の写真の後ろここには今透明の長方形が置いてあります。この長方形に色を適用する時には非常に簡単で長方形を選んでる状態でカラーテーマの中から該当する色ですね、例えばこの一番左の黄色これをクリックすると一発で適用されます。例えばこの下のContact Us Today!じゃあここはこの黄土色にしてみましょう。同じくクリックするとこの様に非常に簡単に適用することができます。今、背景色を適用したら、黒文字だとちょっと落ち込むかなという感じがしてきたのでそういう時にはこの文字の所選んで「段落スタイル」で「Subhead 1」の「Light」の方ですねこれを選びます。するとこんな感じで白文字に変わります。こんな風に切り替えられるのでこの段落スタイル白パターン、黒パターン作っておくと何かと便利ですね。 では、上のほうを見てみましょう。では、ここの部分ですね。また同様に「CC Libraries」開けて今度は、この左から2番目の黄土色を適用しましょう。こんな感じになりました。では上の所、今このテキストボックスの塗りの部分これグレーになってますけどここも同じです。ここも同じでクリックするだけでこの様に適用することができます。では、次はこの文字これを明るい黄色にしてみようと思うのですが1回ちょっとやってみましょう。文字を選んでカラーをクリックとやるんですけど実はこのやり方だと適用されません。文字の場合にはこちらから選ぶ必要があるのでこの色ですね、適用する時には例えばこんな方法があります。ライブラリを開けておいてそして文字のカラーの設定を出します。そしたらスポイト、これを選んでカラーテーマの中これをクリックすることでこの色を適用することができます。色々な項目の中には直接このカラーテーマから適用できない項目もあるのですがそういった時には今やったようにスポイトを使えば大体どんなカラーの設定にも使うことができます。では home はこんな感じでAbout Us のページも見てみましょう。ちょっと表示がはみ出るので少し縮小します。 では About Us も人物の後ろの所にこの黄色を適用してみようと思います。それでは長方形を選んでそしてこの間の部分に描き始めて長方形を作ります。そして塗りをこの黄色にします。そうすると、この前に来てしまうので「アレンジ」>「最背面へ」これを選ぶことで後ろに持っていけました。そうすると、この文字が黒だとちょっと重い感じなので全部選んだ上でこれ白にしてしまいましょう。こんな感じでバランスをとることができました。では、これで全部バックを黄色にしてしまうとちょっと変化がなくて寂しいので一人おきに黄色バック、白バック、黄色バックと互い違いにしてみようと思います。それではこの最背面に置いてある長方形ですね。これを Mac の方は Option キーWindows の方は Alt キーを押しながらドラッグするとこの様にずらして持っていけます。そしたらこっちの3人目ティナさんの後ろの所に持ってきて合う所で合わせてあげるとそしてこちらのテキストも白に変えてあげます。これでちょっとプレビューしてみるとこんな感じで一人おきに黄色、白、黄色、白と変化が付いて面白くなりましたね。こんな実験も行うことができます。 では次にPortfolio のページですね。ここの背景もさっき Home でやったのと同じ色にしておきましょう。ではこの黄土色ですね、これを選ぶことで変わります。そしたら、この文字ここはやはり同じように「段落スタイル」にして「Subhead 1 light」にしましょう。するとこの様に目立った形となります。この様にしてライブラリの方に登録されているカラーテーマを使ってどんどんバランスの良い色を置いておけるのでかなり短時間に整った配色を作ることができます。この要領で是非ともいろいろ試してみて下さい。

Muse (2015) 基本講座

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

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

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

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

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