ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

    ウェブプログラミング講座

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テンプレートモンスター
ホームページテンプレート

Free Templates Online JP
無料ホームページテンプレート
Free Templates Online JP

株式会社ネットオン
採用Webマーケティング
indeed広告代理店

海外 SEO対策 トラッキングツール
海外 SEO対策
ランキングチェックツール

Rank Tracker

テクニック

Homeグラフィック講座 > IllustratorとPhotoshopでハーフトーンの背景を作る方法

IllustratorとPhotoshopでハーフトーンの背景を作る方法

投稿日:2008年8月19日   レベル:初心者    ソフトウェア:photoshop illustrator
このチュートリアルでは、フォトショップとイラストレーターでハーフトーンの背景を作ってみたいと思います。


Step1:はじめに
Adobe IllustratorとAdobe Photoshopの両方を使ってオリジナルのデザインを作ることができます。シェイプをIllustratorで作ってからPhotoshopのクリッピングマスクとして使う技術について、感じの良い背景効果を作るために部分的に隠すことについて取り上げます。


Step2:Illustratorで円の格子をつくる
Illustratorで、長方形ツールをクリックしたまま他のアイコンを引き出します。楕円形ツールをクリックします。

楕円形ツール

Shiftキーを押しながらクリックアンドドラッグして小さな円を作ります。楕円形ツールのアートボードをを選択して、次のように「0.2インチ」など特定のサイズを入力します。黒で塗って境界線を消します。

円の格子

選択ツールで、Ctrlキー(Windows機の場合はAltキー)を押しながら右側にクリックアンドドラッグして円を複製します。事前にShiftキーを押して(「Shift」+「Alt」キー)、90度方向に複製してください。

円の格子

同じ設定でこの効果を繰り返すには、「Option」+「D」キー(Windows機の場合「Ctrl」+「D」キー)を押して先の変換操作を繰り返します。次のように必要なだけ押して小さな円の列を作ります。

円の格子
拡大画像を表示する

選択ツールで、円の列の周囲をクリックアンドドラッグして選択します。それからCtrlキー(Windows機の場合はAltキー)を押して選択範囲の下でクリックアンドドラッグすると列を複製できます。複数回押して小さな円で大きな四角形を作ります。

円の格子


Step3:Photoshopでハーフトーンの背景をつくる
円の格子全体を選択してから、「編集」−「コピー」を選択します。作業する画像を開いてから「編集」−「ペースト」を選択します。

ペースト

「Enter」キーを押してクリップボードにコピーしたシェイプを配置します。次のようになります。

ハーフトーンの背景

背景レイヤーをダブルクリックしてから名前をつけて通常のレイヤーにします。レイヤーパレットで、Illustratorからオリジナルのレイヤーの下にシェイプをペーストした新規レイヤーをクリックアンドドラッグします。この段階ではレイヤーは2つあります。1つはイメージでもう一つはペーストしたシェイプです。ペーストしたシェイプのレイヤーはイメージのレイヤーの下に配置します。

レイヤーパレットにある2つのレイヤーの間にカーソルを置き、Ctrlキー(Windows機の場合はAltキー)を押して円の集まりを表示させます。レイヤーパレットで「クリッピングマスクを作成」を選択します。

ハーフトーンの背景
拡大画像を表示する


Step4:完成
イメージの感じが良くなりましたが、もうワンステップ先に進みましょう。シェイプのあるレイヤーで、ソフトエッジの大きなブラシを選択して円を隠したい領域を黒く塗ります。背景効果が良くなって被写体がイメージから浮き出ます。

完成
拡大画像を表示する


引用:Web Design Library  著者:www.layersmagazine.com 翻訳:菊池



スポンサードリンク

コメント

ランダム記事5件

2016年5月の人気記事ランキング