ポスタリゼーション| psgips

写真をイラスト調に！４色ポスタライズ「階層を滑らかにする方法」【2024】

古岡ひふみ — Sun, 11 Aug 2024 23:00:00 +0000

【Photoshop講座】人物の写真をポスタライズする方法です。ポスタリゼーションは、明るさや色の違いを簡略化して、段階的な層に分けることができます。パラメーターだけの簡単操作！このレッスンでは、Ver.25.11.0 を使用しています。

中間調でコントロール！

ここで行うポスタリゼーションは、４つの階調しかありません。ノイズを含む画像では、階調数が少なくなるほど、不要な粒子が目立つようになります。これは、明るさがわずかに異なるだけでも、別の階層に属する可能性が高くなるためです。階層の領域を制御するのは、[ シャドウ・ハイライト ] の中間調です。最も暗い階層を決めて、中間調をコントロールしましょう。

写真をイラスト調に！

４色ポスタライズ

[ STEP-01 ]

背景を白色に設定する

[ STEP-02 ]

写真の生っぽさをなくす

[ STEP-03 ]

ポスタリゼーションを適用する

人物写真をポスタライズ

これから行う操作は、人物の写真をポスタライズする方法です。ポスタリゼーションを使用すると、明るさと色の違いを段階的な階層に分けて簡略化できます。

元画像

４色ポスタライズ

主要なディテールを残しながらノイズを軽減して、階層を滑らかにする方法をご紹介しましょう。

目次に戻る

レッスン動画を配信中！

サムネールをクリックすると、

レッスン動画にリンクします。

背景を白色に設定する

ここでは、数少ない４つの階層に分けたポスタライズを想定しています。そのため、人物のハイライト領域と同じ階層に属する白色の背景を、塗りつぶしレイヤーを使用して設定します。

人物を切り抜く

背景を白色に設定

目次に戻る

人物を切り抜く

人物を切り抜くための選択範囲を作成します。[ 被写体を選択 ] は、人工知能が自動的に作成してくれる機能です。ただし、この機能を活用できる素材は、画像内に、他の被写体がない場合に限ります。複数の被写体がある場合は、あらかじめ、必要な部分だけをトリミングしておきましょう。

【操作方法】

素材画像をダウンロードして開きます。素材画像は、[ 幅 : 1920 pixel ]、[ 高さ : 1080 pixel ] 、[ 解像度 : 72 pixel/inch ]、[ カラーモード : RGB カラー ] を使用しています。

素材画像をダウンロードしよう！ ( 329 KB )

素材画像を開く

photo by Pexels

[ 選択範囲 ] メニューから、[ 被写体を選択 ] を選択します。

被写体を選択

選択方法を選ぶ！

[ 被写体を選択 (クラウド処理) ] は、デバイス上の処理よりも詳細な結果を取得できます。数ある選択方法の中にあって、最もパフォーマンスが高いコマンドです。被写体を選択のクラウド処理 : [ Photoshop (編集) ] - [ 環境設定 ] - [ 画像処理 ]

[ レイヤー ] パネルで、[ マスクを追加 ] をクリックします。

レイヤーマスクが追加されたことを確認します。

基本がわかる！レイヤーマスクの使い方

レイヤーマスクを確認

人物写真のマスク領域が、透明ピクセルに変換されたことを確認してください。

透明ピクセルを確認

透明ピクセルとは？

透明部分は、[ 環境設定 ] で設定された、グリッドが表示されます。レイヤーマスクで隠された部分は、見た目では透明ですが、元画像はそのまま、変わらずに残っています。レイヤーマスクを削除、または、効果を一時的に解除すれば、切り抜く前の状態に戻すことができます。

このような再編集を可能にするメリットが、レイヤーマスクにはあります。しかし、隠された部分が、そのまま保持されているので、データ容量が大きくなるデメリットも、持ち合わせています。

目次に戻る

塗りつぶしレイヤーを設定

背景を透明ピクセルに置き換えることができたら、ホワイトを敷いて、切り抜きの状態を確認しましょう。

【操作方法】

[ レイヤー ] パネルで、 [ 塗りつぶしレイヤーを新規作成 ] をクリックし、メニューから、[ べた塗り ] を選択して、[ べた塗り 1 ] を作成します。

[ べた塗り 1 ] を作成

[ カラーピッカー ] ダイアログで、新しい色に [ ホワイト ] を設定します。H: 0° / S: 0 % / B: 100 %

[ OK ] をクリックします。

カラーピッカーの使い方

[ カラーピッカー ] を設定

[ べた塗り 1 ] を背面へ移動します。背面へ移動: [ command ( Ctrl ) ] + [ [ ]

背面へ移動

人物の背景が白色になったことを確認してください。

背景を白色に設定

すべてのレイヤーを選択します。すべてのレイヤーを選択: [ command ( Ctrl ) ] + クリック

すべてのレイヤーを選択

[ レイヤー ] メニューから、[ スマートオブジェクト ] – [ スマートオブジェクトに変換 ] を選択します。

スマートオブジェクトに変換されたことを確認してください。

スマートオブジェクトを確認

スマートオブジェクトとは？

レイヤーや背景を、スマートオブジェクトに変換しておくと、適用するフィルターや、色調補正などの調整が、再編集できるようになります。

目次に戻る

続きは↓下の番号をクリック！

古岡ひふみ

フリーのグラフィックデザイナーです。カタログ、ポスター、パッケージなど様々な分野に携わってきました。

psgips.net

The post 写真をイラスト調に！４色ポスタライズ「階層を滑らかにする方法」【2024】 first appeared on psgips.

写真をイラスト調に！エッジの効いたポスタリゼーション「詳細をストロークでぼかす」

古岡ひふみ — Sat, 01 Jan 2022 23:00:00 +0000

【Photoshop講座】ポスタリゼーションとは、画像の階調数を減らす処理です。地形図の等高線のように、陰影や色の違いが段階的な層になるので、写真をイラスト調にする手法としてよく用いられます。このポスタリゼーションに輪郭線をプラスして、スッキリ＆おしゃれな処理にバージョンアップしましょう。

油絵のタッチを利用する！

写真をイラスト調にする心構えは、生っぽさを消すことです。ポスタリゼーションの境界は、ぎこちない形状になりがちです。そのため、階調の段差をぼかして滑らかにします。しかし、輪郭線にとってぼかしは天敵です。ヒゲの男性ではさらに厄介ですね。作例では、詳細な輪郭線を維持させる方法として [ 油彩 ] フィルターを利用します。

写真をイラスト調に！

エッジの効いたポスタリゼーション

[ STEP-01 ]

[ STEP-02 ]

[ STEP-03 ]

[ STEP-04 ]

[ STEP-05 ]

ポスタリゼーション風イラストに加工

これから行う操作は、人物写真をポスタリゼーション風イラストに加工する方法です。ポピュラーな手法ですが、詳細なエッジを効かすことで、スッキリと洗練された印象にしましょう。

元画像

ポスタリゼーション風イラストに加工

目次に戻る

人物を切り抜く

このレッスンは、写真をイラスト調にすることがテーマです。このため、人物の切り抜きについては省略しています。詳しくは、以下のページを参照してください。

【操作方法】

素材画像をダウンロードして開きます。素材画像は、[ 幅 : 1280 pixel ]、[ 高さ : 1920 pixel ]、 [ 解像度 : 300 pixel/inch ]、[ モード : RGB カラー ] を使用しています。

素材画像をダウンロードしよう！ ( 813 KB )

素材画像を開く

photo by theharpreetbatish

[ 選択範囲 ] メニューから、[ 被写体を選択 ] を選択して適用します。

[ クイック選択ツール ] で選択範囲を修正します。

人物の選択範囲を作成

[ 選択範囲 ] メニューから、[ 選択とマスク ] を選択します。[ 境界線調整ブラシツール ] で、境界線を調整します。

[ 選択とマスク ] で境界線を調整

[ 選択とマスク ] セクションの [ 出力先 ] に [ 新規ドキュメント (レイヤーマスクあり) ] を選択して、[ OK ] をクリックします。

[ 新規ドキュメント (レイヤーマスクあり) ] を選択

出力された新規ドキュメント (レイヤーマスクあり) を確認します。

出力された新規ドキュメントを確認

切り抜かなくてもOK !

作例では、背景から人物を切り抜いていますが、そのままイラスト調にすることも可能です。被写体との境界が同系色であったり、不鮮明な場合を除けば、スッキリ＆おしゃれな、ポスタリゼーション風イラストに加工できます。

元画像

背景を含めた適用例

photo by Free-Photos

目次に戻る

レッスン動画を配信中！

サムネールをクリックすると、

レッスン動画にリンクします。

背景色を設定

人物を切り抜くことができたら、背景に敷く [ 塗りつぶしレイヤー ] を作成しましょう。[ 塗りつぶしレイヤー ] には、仕上がりを想定したカラーを設定します。

【操作方法】

[ レイヤー ] パネルで、[ 塗りつぶしレイヤーを新規作成 ] をクリックし、メニューから、[ べた塗り ] を選択して、[ べた塗り 1 ] を作成します。

[ べた塗り 1 ] を作成

[ カラーピッカー ] ダイアログで、[ カラー : H : 40°/ S : 100 % / B : 80 % ] を設定して、[ OK ] をクリックします。

カラーピッカーの使い方

[ カラーピッカー ] を設定

[ レイヤー ] パネルで、[ べた塗り 1 ] をドラッグ、または、[ command ( Ctrl ) ] + [ [ ] キーを押して、[ べた塗り 1 ] を背面へ移動します。

[ べた塗り 1 ] を背面へ移動

人物の切り抜きの背景色が設定できました。

背景色を設定

被写体との対比を考える

背景色は自由に設定できますが、被写体との組み合わせにより、後に適用する、輪郭線の効果が出にくい色があります。輪郭の検出は、色の違いと明るさの違いから行われます。

たとえば、白い服と白い背景では、輪郭線の効果が出にくくなります。同系色と組み合わせる場合は、被写体を明るく、背景を暗くして対比させましょう。

目次に戻る

続きは↓下の番号をクリック！

古岡ひふみ

フリーのグラフィックデザイナーです。カタログ、ポスター、パッケージなど様々な分野に携わってきました。

psgips.net

The post 写真をイラスト調に！エッジの効いたポスタリゼーション「詳細をストロークでぼかす」 first appeared on psgips.

写真をイラスト調に！マンガ風景の描き方「モノクロ・場面転換・都会の雑踏」

古岡ひふみ — Mon, 13 Dec 2021 23:00:00 +0000

【Photoshop講座】漫画でよく見かける風景は、実際の写真をトレースしたものが多いです。場面転換のカットとして、都会の雑踏を感じさせるイメージを教材に選びました。スッキリ整理された線を素材から抽出して、ハーフトーンでそれっぽく仕上げましょう。墨入れバージョンも作れます。

白地を活かす！

写真の生っぽさを消すひとつの方法に、陰影を少なくして白地を活かすことがあげられます。あとは輪郭線と墨入れにメリハリを付ければ、「マンガ風景」のムードを、一気に高めることができるでしょう。

写真をイラスト調に！

マンガ風景の描き方

– モノクロ・場面転換・都会の雑踏 –

[ STEP-01 ]

[ STEP-02 ]

[ STEP-03 ]

[ STEP-04 ]

[ STEP-05 ]

[ STEP-06 ]

漫画の風景カットのように加工

これから行う操作は、写真を漫画の風景カットのように加工する方法です。スマートオブジェクトに複数の色調補正やフィルターを加えて完成させます。

「マンガ風景の描き方」は、元画像をそのまま利用する方法です。そのため、作例とは違うピクセルサイズの画像では、効果が発揮できないことがあります。他の素材に応用する場合は、あらかじめ、使用する画像の長辺をリサイズしてください。

目次に戻る

レッスン動画を配信中！

サムネールをクリックすると、

レッスン動画にリンクします。

暗い部分を明るくする

暗い部分を明るくする操作は、写真をイラスト調にする効果として、なくてはならないものです。写真の生っぽさをなくすには、ノイズを除去して、階調を滑らかにすることも効果的です。

【操作方法】

素材画像をダウンロードして開きます。素材画像は、[ 幅 : 1920 pixel ]、[ 高さ : 1276 pixel ] 、[ 解像度 : 72 pixel/inch ]、[ カラーモード : RGB カラー ] を使用しています。加工する素材は、陰影がはっきりした建物や乗り物など、線画になっても形状がわかりやすい写真が好ましいです。

素材画像をダウンロードしよう！ ( 611 KB )

素材画像を開く

photo by Free-Photos

[ レイヤー ] メニューから、[ スマートオブジェクト ] – [ スマートオブジェクトに変換 ] を選択して適用します。

スマートオブジェクトを確認

スマートオブジェクトとは？

[ スマートオブジェクトに変換 ] を適用すると、[ 背景 ] やレイヤーが「スマートオブジェクト」に変換されます。スマートオブジェクトにすることで、適用後の色調補正やフィルターが再編集できます。

[ 背景 ] に適用すると、レイヤー名が [ レイヤー 0 ] に変更され、[ 背景 ] では設定できなかった [ 描画モード ] や [ 不透明度 ]、[ 位置をロック ] などが有効になります。

目次に戻る

ノイズの除去

後の手順で、ポスタリゼーションの効果と輪郭線を抽出するため、あらかじめ、写真素材に含まれているノイズを除去して、階調を滑らかにしておきます。

【操作方法】

[ フィルター ] メニューから、[ ぼかし ] – [ ぼかし (表面) ] を選択します。[ ぼかし (表面) ] ダイアログで、[ 半径 ] に [ 5 ] pixel、[ しきい値 ] に [ 10 ] pixel を入力して、[ OK ] をクリックします。

[ ぼかし (表面) ] を設定

写真素材のノイズを除去して、階調を滑らかにすることができました。

輪郭を残して表面をぼかす

[ ぼかし (表面) ] は、階調の段差ができている部分を中心線として、その周囲をブレンドすることにより、輪郭を残して表面をぼかします。[ 半径 ] はブレンドする距離で、[ しきい値 ] は残す輪郭の幅です。

[ 半径 ] の数値が大きいほど滑らかになります。[ しきい値 ] の数値で、輪郭の際立ちをコントロールできますが、大きくなりすぎると逆効果になるので気をつけましょう。

目次に戻る

シャドウ・ハイライトを設定

[ シャドウ・ハイライト ] は、影を明るくすることに特化した色調補正ツールです。明るくする量は、50% をベースとして、素材により、階調 (中間調) を調整することがコツになります。

【操作方法】

[ イメージ ] メニューから、[ 色調補正 ] – [ シャドウ・ハイライト ] を選択します。[ シャドウ・ハイライト ] ダイアログで、[ 調整 ] セクションの [ シャドウのクリップ ] に [ 10 ] % を入力します。

[ シャドウ ] セクションの [ 量 ] に [ 50 ] % を入力します。[ OK ] をクリックします。

基本がわかる！シャドウ・ハイライト

[ シャドウ・ハイライト ] を設定

暗い部分を明るくすることができました。

素材により適正値は違う！

[ シャドウ・ハイライト ] の適正値は、対象の素材により異なります。暗い部分を明るくする設定は共通しているので、素材が明るい場合には、[ 量 ] に [ 10 ] %、一般的には、[ 量 ] に [ 35 ] % を設定してください。再編集はいつでも行えます。

目次に戻る

続きは↓下の番号をクリック！

古岡ひふみ

フリーのグラフィックデザイナーです。カタログ、ポスター、パッケージなど様々な分野に携わってきました。

psgips.net

The post 写真をイラスト調に！マンガ風景の描き方「モノクロ・場面転換・都会の雑踏」 first appeared on psgips.

写真をイラスト調に！フェアリー風のステンシルアート「３色シルクスクリーンの技法」

古岡ひふみ — Mon, 14 Jun 2021 23:00:00 +0000

【Photoshop講座】シェパード・フェアリーは、アメリカを代表する、ストリート・アーティストです。その独創的な配色や、抽象的に図案化された、肖像画のポスターなどが有名です。３色で刷られた、シルクスクリーンの技法を再現しましょう。

階調をハッキリ分ける！

ふだんは嫌われるギザギザを、要所に取り入れることが成功の秘訣です。たとえば、切り抜きのマスクを２階調化します。ポスタリゼーションで、モノクロの階調を５段階にハッキリ分けて、塗りやハーフトーンの領域を作り出します。

写真をイラスト調に！

フェアリー風のステンシルアート

[ STEP-01 ]

[ STEP-02 ]

[ STEP-03 ]

[ STEP-04 ]

[ STEP-05 ]

フェアリー風のステンシルアート

これから行う操作は、人物写真を、フェアリー風のステンシルアートに、加工する方法です。あらかじめ、カラーやテクスチャなどを設定した、レッスン用ファイルからスタートして、ひとつの作品を完成させましょう。

出典 : Shepard Fairey ( シェパード・フェアリー ) / HUBLOT ( ウブロ )

目次に戻る

人物を配置する

人物写真をレッスン用ドキュメントに配置しましょう。ここでは、一般的な配置方法である [ 埋め込みを配置 ] を使用し、JPEG 形式の画像をスマートオブジェクトで、レイヤー更新ができるように操作します。

【操作方法】

素材画像をダウンロードして開きます。素材画像は、[ 幅 : 1440 pixel ]、[ 高さ : 1440 pixel ]、 [ 解像度 : 300 pixel/inch ]、[ カラーモード : RGB カラー ] を使用しています。ファイル容量に注意してください。

素材画像をダウンロードしよう！ ( 5.6 MB )

素材画像を開く

[ レイヤー ] パネルで、[ コンテンツ-A ] – [ 背景-塗り ] を選択します。

[ 背景-塗り ] を選択

設定済みドキュメント

レッスン用ドキュメントは、ツートンカラーの背景を想定した２種類のグレーで塗り分けられています。そして、再編集できるグラデーションマップが設定されています。

グラデーションマップやテクスチャは、初期設定では非表示にされていますが、作業中に表示しても問題はありません。必要に応じて、表示 / 非表示を切り替えてください。

[ ファイル ] メニューから、[ 埋め込みを配置 ] を選択します。[ portrait.jpg ] を選択します。

[ 配置 ] をクリックします。

[ portrait.jpg ] を選択

すると、レッスン用ドキュメントに、人物写真のサンプル画像が配置されます。変形を確定しない

サンプル画像を配置

オプションバーで、[ 水平比率を設定 ]、または、[ 垂直比率を設定 ] を確認してください。

[ enter ] キーを押して、変形を確定します。拡大・縮小比率を確認後に実行

配置画像の拡大・縮小比率を確認

ビッグドキュメントとは？

JPEG 形式の画像を配置した場合は、ビッグドキュメント形式での更新ができません。ここでは、オリジナルサイズでラスタライズした後、再び、スマートオブジェクトに変換する方法を取ります。

JPEGを配置した場合

ビッグドキュメント形式とは、スマートオブジェクトが採用する保存形式です。従来の PSD ( Photoshop ) 形式に、容量制限 ( 2 GB / 30,000 px まで) があるため、それよりも大きなドキュメントに対応することができます。32 bit チャンネル / 300,000 px までをサポートしています。

目次に戻る

レッスン動画を配信中！

サムネールをクリックすると、

レッスン動画にリンクします。

ビッグドキュメント形式に変更

JPEG 形式の配置画像を、オリジナルサイズでラスタライズした後、再び、スマートオブジェクトに変換します。これは、JPEG 形式が、レイヤーなどの機能に対応していないために生じる、不便さを解消する操作です。

ラスタライズすることで、ビッグドキュメント形式に変更され、さまざまなコンテンツの編集、更新ができるようになります。

【操作方法】

[ レイヤー ] メニューから、[ スマートオブジェクト ] – [ レイヤーに変換 ] を選択します。[ スマートオブジェクトレイヤーに適用された変形を保持しますか？ ] に、[ いいえ ] をクリックします。

変形を保持しない [ いいえ ] をクリック

すると、オリジナルサイズでのラスタライズが行えます。

オリジナルサイズでのラスタライズ

[ レイヤー ] メニューから、[ スマートオブジェクト ] – [ スマートオブジェクトに変換 ] を選択します。[ レイヤー ] パネルで、スマートオブジェクトに変換されたことを確認してください。

スマートオブジェクトを確認

スマートオブジェクトとは？

レイヤーや背景を、スマートオブジェクトに変換しておくと、適用するフィルターや、色調補正などの調整が、再編集できるようになります。

変形のバウンディングボックスを表示します。オプションバーで、[ 縦横比を固定 ] をクリックします。自由変形 : [ command ( Ctrl ) ] + [ T ]

[ 水平比率を設定 ]、または、[ 垂直比率を設定 ] に、[ 80% ] を入力します。

[ 水平比率を設定 : 80 % ]

変形を確定します。人物写真を配置することができました。変形を確定 : [ enter ]

変形を確定

トリミングはここで！

サンプル画像は、あらかじめ、ドキュメントの比率でトリミングしています。フレーム内のトリミングが必要な場合は、この時点で調整を行ってください。スマートオブジェクトに変換しているので、いつでも再編集が可能です。

目次に戻る

続きは↓下の番号をクリック！

古岡ひふみ

フリーのグラフィックデザイナーです。カタログ、ポスター、パッケージなど様々な分野に携わってきました。

psgips.net

The post 写真をイラスト調に！フェアリー風のステンシルアート「３色シルクスクリーンの技法」 first appeared on psgips.

写真をイラスト調に！コミック風のハーフトーン加工

古岡ひふみ — Thu, 24 Dec 2020 23:00:38 +0000

【Photoshop講座】イラストや漫画などに用いられるハーフトーンを合成して、ビートルの写真を、オシャレでポップなコミック風に加工しましょう。イラスト調の極意は、写真の生っぽさを消すことです。それは、複雑なピクセル情報を持つ画像から、形状や色数を、単純化していく技であると言えます。輪郭から抽出した線画も加えましょう。

単純化を身につけよう！

画像の単純化とは、複雑な線を滑らかにしたり、フルカラーから限定した色数に減らす作業です。ここでは、階調数を減らすことができる [ ポスタリゼーション ] を中心に、形状や色数を単純化する作業を組み立てましょう。

写真をイラスト調に！

コミック風のハーフトーン加工

[ STEP-01 ]

[ STEP-02 ]

[ STEP-03 ]

[ STEP-04 ]

[ STEP-05 ]

[ STEP-06 ]

コミック風のハーフトーン加工

これから行う操作は、写真をイラスト調に加工する方法です。コミック風のハーフトーン加工は、スマートオブジェクトに複数の色調補正やフィルターを加えて完成させます。

元画像をそのまま利用する方法なので、作例とは違うピクセルサイズの画像では、効果が発揮できないことがあります。他の素材に応用する場合は、あらかじめ、使用する画像の長辺をリサイズしてください。

目次に戻る

レッスン動画を配信中！

サムネールをクリックすると、

レッスン動画にリンクします。

ハイキーな色調にする

はっきり見やすいコミック風を強調するため、画像の明るい領域をハイキー (白く飛ばす) にします。ここでは、[ トーンカーブ ] を使用して、ビートルの丸っこいボディを、浮き立たせるように調整しましょう。

【操作方法】

素材画像をダウンロードして開きます。素材画像は、[ 幅 : 2048 pixel ]、[ 高さ : 1536 pixel ] 、[ 解像度 : 72 pixel/inch ]、[ カラーモード : RGB カラー ] を使用しています。加工する素材は、陰影がはっきりした建物や乗り物など、線画になっても形状がわかりやすい写真が好ましいです。

素材画像をダウンロードしよう！ ( 905 KB )

素材画像を開く

[ レイヤー ] メニューから、[ スマートオブジェクト ] – [ スマートオブジェクトに変換 ] を選択します。

スマートオブジェクトを確認

スマートオブジェクトとは？

レイヤーや背景を、スマートオブジェクトに変換しておくと、適用するフィルターや、色調補正などの調整が、再編集できるようになります。

[ イメージ ] メニューから、[ 色調補正 ] – [ トーンカーブ ] を選択します。[ トーンカーブ ] ダイアログで、カーブに調整ポイントを追加し、[ 入力 ] と [ 出力 ] に数値を入力して、[ OK ] をクリックします。

基本がわかる！トーンカーブの使い方

[ トーンカーブ ] を設定

【設定値】

[ 入力 : 0 ] [ 出力 : 0 ]

[ 入力 : 128 ] [ 出力 : 128 ]

[ 入力 : 207 ] [ 出力 : 255 ]

ハイキーな色調に調整することができました。[ レイヤー ] パネルで、スマートフィルターに [ トーンカーブ ] が追加されたことを確認します。

[ トーンカーブ ] の追加を確認

中間調を維持する

ここで行うハイキーな調整は、シャドウ領域と中間調を維持しながら、ハイライト領域を明るくすることを目指しています。

[ トーンカーブ ] の操作は、まず、中間調 (入力 : 128, 出力 : 128 ) に調整ポイントを追加し、それをアンカーとしたカーブを作成することで、滑らかで違和感のないハイライト点を探ります。

目次に戻る

続きは↓下の番号をクリック！

古岡ひふみ

フリーのグラフィックデザイナーです。カタログ、ポスター、パッケージなど様々な分野に携わってきました。

psgips.net

The post 写真をイラスト調に！コミック風のハーフトーン加工 first appeared on psgips.

写真をイラスト調に！カラフルなアメリカン・ポップアート風

古岡ひふみ — Sun, 09 Dec 2018 23:00:00 +0000

【Photoshop講座】ポップアートとは、1960年代のアメリカで誕生した現代芸術です。「リキテンスタイン」や「ウォーホル」などが有名ですね。写真やコミックといった、商業ベースの素材を扱い、鮮やかな色で構成された、シルクスクリーン (孔版印刷) による技法が特徴です。あなたのプロフィール写真を、カラフルでアーティステックなアメリカン・ポップアート風にしましょう。

カラバリを無限に増やそう！

ポップアート風は、カラフルな配色も大きな特徴です。カラーバリエーションが簡単に増やせることができれば、配色が苦手な人でも、たくさん作った中から選べますよね。

スマートオブジェクトを活用すれば、カラーの設定が何度でもやり直せるので、お気に入りの配色がきっと見つかるハズです。各階調層に対して色が設定できる [ グラデーションマップ ] で、カラーバリエーションを無限に増やしましょう。

写真をイラスト調に！

カラフルなアメリカン・ポップアート風

[ STEP-01 ]

[ STEP-02 ]

[ STEP-03 ]

[ STEP-04 ]

[ STEP-05 ]

写真をアメリカン・ポップアート風に加工

これから行う操作は、写真をアメリカン・ポップアート風に加工する方法です。フィルターや描画モード、グラデーションマップなど、複数の操作を経て完成させます。

使用する素材画像を、そのまま利用する方法です。このため、作例とは違うピクセルサイズでは、効果が発揮できないことがあります。他の素材に応用する場合は、あらかじめ、使用する画像の長辺をリサイズしてください。

photo by modelpiece.com

目次に戻る

表面をフラットにする

写真の生っぽさを消すには、ノイズを軽減して、表面をフラットにしておきます。まず、元画像をスマートオブジェクトに変換しておきましょう。

【操作方法】

素材画像をダウンロードして開きます。素材画像は、[ 幅 : 1280 pixel ]、[ 高さ : 1280 pixel ] 、[ 解像度 : 72 pixel/inch ]、[ カラーモード : RGB カラー ] を使用しています。加工する素材は、人物のプロフィールや小物の切り抜きなど、主体と背景がはっきり区別できて、かつ、明度が高い (白色) 写真が好ましいです。

素材画像をダウンロードしよう！ (455 KB)

素材画像を開く

photo by modelpiece.com

素材画像が開けたら、[ レイヤー ] メニューから、[ スマートオブジェクト ] – [ スマートオブジェクトに変換 ] を適用します。

スマートオブジェクトを確認

[ レイヤー ] パネルで、[ レイヤー 0 ] を [ 新規レイヤーを作成 ] にドラッグして、[ レイヤー 0 のコピー ] を作成します。

[ レイヤー 0 のコピー ] を作成

[ レイヤーの表示 / 非表示 ] をクリックして、複製した上層の [ レイヤー 0 のコピー ] を非表示にします。

[ レイヤー 0 ] を選択します。

[ レイヤー 0 ] を選択

スマートオブジェクトとは？

レイヤーや背景を、スマートオブジェクトに変換しておくと、適用するフィルターや、色調補正などの調整が、再編集できるようになります。

目次に戻る

基本がわかる動画を配信中！

基本がわかる！画像解像度の設定

基本がわかる！色かぶりの補正

チャンネル登録をお願いします！

ぼかし(表面)を設定

[ ぼかし (表面) ] の適用は、ディテールを簡略化するためのベースづくりです。画像の輪郭を残しながら、その他の領域をぼかすことによって、ノイズを軽減することができます。

【操作方法】

[ フィルター ] メニューから、[ ぼかし ] – [ ぼかし (表面) ] を選択します。[ ぼかし (表面) ] ダイアログで、[ 半径 ] に [ 10 ] pixel、[ しきい値 ] に [ 15 ] レベルを入力して、[ OK ] をクリックします。

[ ぼかし (表面) ] を設定

すると、大まかな輪郭を残した表面がブレンドされ、画像のノイズや細かいディテールがフラットになります。

ぼかしの適正値は？

設定値の [ 半径 ] は、表面を滑らかにするブレンドの距離で、数値が大きほどフラットになります。[ しきい値 ] は、境界線の太さに該当するもので、数値が大きいほど簡略になります。適正値は、対象の画像にもよりますが、ノイズの軽減に関しては、ピクセル単位のブレンドになるため、たとえば、[ 半径 : 1 pixel ] でも、効果が現れることもあります。

目次に戻る

続きは↓下の番号をクリック！

古岡ひふみ

フリーのグラフィックデザイナーです。カタログ、ポスター、パッケージなど様々な分野に携わってきました。

psgips.net

The post 写真をイラスト調に！カラフルなアメリカン・ポップアート風 first appeared on psgips.

写真をイラスト調に！クールなドットポスタリゼーション

古岡ひふみ — Thu, 01 Mar 2018 23:00:00 +0000

【Photoshop講座】印刷物などに用いられる「ハーフトーン (ドット) 」を誇張した表現方法は、写真をイラスト調にする技法としてよく使われています。大小のドットだけで構成される色彩や陰影は大変面白いですね。このハーフトーンの効果にプラスして、これもまたポピュラーな [ ポスタリゼーション ] を加えると、簡略化したディテールや階調で、おしゃれ度がアップします。

階調層の明度を読む！

イラスト調における最大の課題は、写真の生っぽさを消すことです。しかし、ディテールだけでは当然ダメです。いかに色彩を加えるかが腕の見せどころ。[ ポスタリゼーション ] フィルターは、粗い階調層をつくり出すことができます。しかし、この階調層のカラーを直接、調整することはできません。

ここでは、モノクロ化した階調層に対して、[ グラデーションマップ ] で着色します。思い通りのカラーを設定するには、階調層の明度を読むことが必要になります。

写真をイラスト調に！

クールなドットポスタリゼーション

[ STEP-01 ]

[ STEP-02 ]

[ STEP-03 ]

[ STEP-04 ]

[ STEP-05 ]

写真をドットポスタリゼーションに加工

これから行う操作は、写真をドットポスタリゼーションに加工する方法です。フィルターや描画モード、色調補正など、複数の操作を経て完成させます。

目次に戻る

明るさを調整する

このレッスンでは、ポスタリゼーションの階調層を生み出すことが、重要なカギとなります。素材画像が暗すぎると、その効果が十分に発揮できません。明るさを調整する前に、スマートオブジェクトに変換しておきましょう。

【操作方法】

素材画像をダウンロードして開きます。素材画像は、[ 幅 : 1920 pixel ]、[ 高さ : 1281 pixel ] 、[ 解像度 : 72 pixel/inch ]、[ カラーモード : RGB カラー ] を使用しています。加工する素材は、陰影がはっきりした人物の顔や小物など、ディテールが単純な写真が好ましいです。

素材画像をダウンロードしよう！ ( 799 KB )

素材画像を開く

photo by Nissor Abdourazakov

素材画像が開けたら、[ レイヤー ] メニューから、[ スマートオブジェクト ] – [ スマートオブジェクトに変換 ] を選択して適用します。

スマートオブジェクトを確認

これから複数のレイヤーで作業するので、それぞれの役割を確認しやすくするため、レイヤー名を [ ポスタリゼーション ] に変更します。

レイヤー名を [ ポスタリゼーション ] に変更

スマートオブジェクトとは？

レイヤーや背景を、スマートオブジェクトに変換しておくと、適用するフィルターや、色調補正などの調整が、再編集できるようになります。

目次に戻る

基本がわかる動画を配信中！

基本がわかる！画像解像度の設定

基本がわかる！色かぶりの補正

チャンネル登録をお願いします！

レベル補正を設定

画像を明るくする調整は、[ レベル補正 ] で行います。ここでは、白色点をそのままにして、コントラストを弱める設定を行います。

【操作方法】

[ イメージ ] メニューから、[ 色調補正 ] – [ レベル補正 ] を選択します。[ レベル補正 ] ダイアログで、[入力レベル] に [ 0 ]、[ 1.30 ]、[ 255 ] を入力して、[ OK ] をクリックします。

[ レベル補正 ] を設定

元画像の明るさを調整することができました。

暗い素材画像は明るく補正

[ レベル補正 ] の設定は、これから適用する効果のための調整です。[ ポスタリゼーション ] や [ カラーハーフトーン ] の効果は、ディテールを簡略化するものです。素材画像が暗すぎると均一になる領域が多くなるので、[ レベル補正 ] で中間点のバランスを変え、全体的に明るい印象にしておきます。

目次に戻る

続きは↓下の番号をクリック！

古岡ひふみ

フリーのグラフィックデザイナーです。カタログ、ポスター、パッケージなど様々な分野に携わってきました。

psgips.net

The post 写真をイラスト調に！クールなドットポスタリゼーション first appeared on psgips.

【スタイル】グラフィック・ポスタライズ【フリー】

古岡ひふみ — Sun, 03 Sep 2017 23:49:00 +0000

【Photoshopレイヤースタイル】クリックひとつで、リアルな質感や陰影が適用できる「オリジナル・レイヤースタイル」です。「ポスタライズ」は、階調に段差をつける効果をイメージしました。グレーを基調としたノーマルカラータイプと、補色の対比を際立たせたグラフィックタイプを組み合わせたカラーバリエーション12色セットです。

ご利用規約

レイヤースタイルの操作方法

│No.099│グラフィック│ポスタライズ│

レッド N

イエロー N

グリーン N

シアン N

ブルー N

マゼンタ N

レッド G

イエロー G

グリーン G

シアン G

ブルー G

マゼンタ G

カラーバリエーション：12色

レイヤースタイルの適用例（使用フォント：Swiss 721 Rounded BT / 120 pt）

クリックでダウンロード！

ダウンロードされる際には必ず「ご利用規約」をお読みください。ダウンロードしたプリセットファイルをダブルクリックすると、[ スタイル ] パネルにレイヤースタイルのサムネールが表示されます。

ご利用規約

その他、レイヤースタイルの詳しい使い方は、「レイヤースタイルの操作方法」ほかのページをご参照ください。

レイヤースタイルの操作方法

古岡ひふみ

フリーのグラフィックデザイナーです。カタログ、ポスター、パッケージなど様々な分野に携わってきました。

psgips.net

The post 【スタイル】グラフィック・ポスタライズ【フリー】 first appeared on psgips.

【スタイル】グラフィック・サーモグラフィ「赤外線熱を感知する装置の温度分布図」【フリー】

古岡ひふみ — Sun, 03 Sep 2017 23:36:00 +0000

【Photoshopレイヤースタイル】クリックひとつで、リアルな質感や陰影が適用できる「オリジナル・レイヤースタイル」です。「サーモグラフィ」は、赤外線熱を感知する装置のグラフィックをイメージしました。温度変化の分布図を表すスタイルバリエーション３種セットです。スタンダードで可読性の高いサンセリフ系書体がオススメです。

ご利用規約

レイヤースタイルの操作方法