X Course Advisor FREE Course Advisor
(Close)
Watch Tutorials
macProVideo.com
Close

無料プレミアムアクセス

プレミアムハブの記事、プロジェクトファイルとから、各チュートリアルビデオの最初の10%の私たちのライブラリ全体にアクセスするオンラインチュートリアルのライブラリを

今すぐ無料アカウントを作成しよう!

PhotoshopのCS5での色のグラデーション入門
Google翻訳で翻訳さ

グラデーションは、あなたのデザインで視覚的な興味を作成するための素晴らしい方法です。しかし、一体何がとにかく勾配です?私はそれらを記述するために来ている方法は、2色以上の間の遷移です。言い換えれば、我々は一緒に少なくとも2つの色をブレンドすることができます、そして、このチュートリアルでは、私達は私達のウェブサイトのヘッダー領域の背景のグラデーションを設定することができます。

あなたのPhotoshopのファイルをどのようなサイズと解像度を確認する必要があります?我々は当社のウェブサイトのためのグラデーションを作成することでしょうので、我々はすべて低解像度(72ppi)を維持することができます。寸法については、そのは、当社のウェブサイトのレイアウトによって決定されます。レッツは、当社のウェブサイトのヘッダ領域が100ピクセルから960ピクセルであることをこの練習のために前提としています。

しかし勾配はまた、印刷に使用することができる、忘れてはいけません。そのような状況では、ちょうどあなたが記入する方法を大規模な印刷文書の領域を把握し、それに応じて文書のサイズを設定しておくとよい。もちろん、あなたもはるかに高い解像度(より多くのような300ppi)を使用しているはずだ。

Okay, let's get started on creating our web gradient.

ステップ1

先に行くと、Photoshopで新しい空白の文書を作成します。

ウェブサイトのヘッダーのグラデーションの私たちの例を使用して、(再び、960x100ピクセル)に応じて幅と高さを設定することを確認してください。また、解像度72インチあたりのピクセルとRGBにカラーモードに設定します。あなたが準備ができたら[OK]を押します。

ステップ2

From the Toolbox, grab the Gradient tool.


The default gradient that's set for the Gradient tool is Foreground To Background. That means that the starting color in the gradient will be the color that's loaded into the foreground color swatch at the bottom of the Toolbox. The ending color would be the color that's loaded into the background color swatch.

あなたがツールボックスにそれらの色見本をクリックして、前景色と背景色を変更できますが、それではプリセットグラデーションのPhotoshopのライブラリを見てみましょうことができます。

ステップ3

On the Options bar, click the drop-down arrow beside the gradient swatch.


This opens Photoshop's Gradient Picker. You can either choose from the set of available gradients, or open another gradient library. To open a new gradient library, open the Options menu in the top-right corner of the Gradient Picker, then choose from the list of libraries towards the bottom of the Options menu.

あなたがPhotoshopの追加のグラデーションライブラリのいずれかを選んだ場合、あなたは、新しいライブラリを使用して現在のグラデーションを置き換えるかどうかを尋ねられます。それらを置き換えるために[OK]をクリックして、または現在のライブラリにそれらを追加するために追加

グラデーションを選択したら、あなたのファイルに適用する準備が整いました。

ステップ4

グラデーションを適用するには、クリックして、ドキュメントウィンドウ内をドラッグします。

For example, click and drag from the left side of your document to the right; or from the top to the bottom. You can even drag on an angle if you wish. If you'd like your gradient to be perfectly straight either horizontally or vertically, hold down Shift as you drag.


Sometimes it takes a few tries to get the look you're after. Once you're done, you're ready to save the file out for use on the web.

ステップ5

Choose File > Save As; then name your file and choose JPEG from the Format menu.

ここに私たちの最後の勾配は次のようになります。

今後のチュートリアルでは、我々はWeb用に Photoshopの保存]を使用する方法についてお話しましょう

ここから、その後、Webレイアウトのヘッダにあなたの新しいグラデーションをロードすると思います。おそらくヘッダーに直接挿入する、またはCSSを使ってグラフィックの背景として設定することによって。ご覧のように、Photoshopのグラデーションでの作業は楽しいと簡単です。まだ別の今後のチュートリアルでは、それは、作成、保存、およびカスタムグラデーションを使用する方法をざっとみてみると楽しいでしょう!

Geoff Blake

Geoff Blake | Articles by this author

Geoff Blake is a book author, video presenter, designer, and visual artist. As an in demand live-on-stage software educator since 1997, Geoff has taught desktop publishing, web design and graphics courses all over North America and is regarded as an expert in Adobe's Creative Suite applications, as well as in HTML, CSS, WordPress, and related technologies. With his humorous, non-jargonny approach, Geoff produces highly regarded articles, video training and DVDs, and regularly contributes to top industry magazines and websites.

Comments

You must be logged in to post a comment.
Create an Account  Login Now

What is macProVideo.com?

macProVideo.com is an online education community featuring Tutorial-Videos & Training for popular Audio & Video Applications including Adobe CS, Logic Studio, Final Cut Studio, and more.
© 2018 macProVideo.com
a division of NonLinear Educating Inc.
Link