画像編集 写真のぼかし


画像編集 写真のぼかし

デジカメやスマートフォンで撮った写真をFacebookやインスタグラムなどSNSに簡単にアップし楽しむことができます。
 
でもSNSに顔出しNGやまったく関係ない人が写っていたりすることも。
そんな時、どうします?消しゴムでゴシゴシと消えればいいのですが・・・
 
また一眼レフなどのカメラであれば背景をぼかし、主役(主被写体)を引き立たせた写真を撮ることもできますが・・・スマホでは、ちょっと難しいかも!
スマホでも背景をぼかし、ちょっとオシャレな写真を撮りSNSにアップしたいと思ったことありませんか?
 
これらの対応策としてぼかし機能のある画像編集ソフトで写真の一部分をぼかしたり、背景をぼかしてしまうことができます。しかも意外に簡単な操作でぼかすことができます。
 

ぼかし機能のある画像編集お薦めソフト

ぼかし機能のあるお薦め画像編集ソフトです。
 

パソコン向けアプリ

〇 ペイント 無料版
 
Windowsアクセサリーの「ペイント」には、残念ですが「ぼかし」機能はありません。
本来は、無料版のソフトを紹介したいのですが・・・
 
〇 Adobe Photoshop Elements 廉価版ソフト
 
Adobe社が提供しているプロ、ハイエンド向け画像編集ソフトAdobe Photoshopです。
でも紹介するソフトは、Adobe Photoshopではなく、その一般ユーザー向け廉価版ソフトのAdobe Photoshop Elementsです。
画像の縮小、切り抜き(トリミング)、各種ツール、フィルター機能など多数の画像編集機能に加え画像管理機能もあるWindows系およびMacOS系のソフトです。
 
ここではAdobe Photoshop Elementsソフトを使用した写真のぼかし方を説明します。
 

写真のぼかし方 説明環境について

写真(画像)のぼかし方説明は、次のOS、ソフト(バージョン)環境にて操作説明します。
 
OS: Windows 10
画像編集ソフト:Photoshop Elements 2018
 
※バージョンの違いにより画面イメージが異なる場合があります。
 

パソコン向け 写真のぼかし方について

写真をぼかすと言ってもどの様にぼかすのか色々な種類、さらに画像編集ソフトのぼかし方にも多くの方法があります。
 
ここでは、一般的に「写真の一部(例えば顔、人物など)をぼかす」、「写真の背景をぼかす」の2種類のぼかしを簡単な3通りのぼかし方法で説明します。
 
<ぼかし方法説明>
 
(その1)写真の一部(顔、人物)をぼかす(ぼかしツール使用)
(その2)写真の一部(顔、人物)にモザイクをかける(フィルター機能使用)
(その3)写真の背景をぼかす(フィルター機能・ぼかし(レンズ)使用)
 

写真の一部をぼかす(ぼかしツール)

写真の一部分をぼかすには、いくつかのぼかし方があります。
Photoshop Elementsのぼかしツールを使い簡単にぼかす方法を説明します。
 
ぼかしのサンプルイメージは次の通りです。
 
 
サンプル写真のペンギンと直ぐ後ろの白い箱をぼかします。
 

Photoshop Elementsの起動、画像読み込み

スタートメニューなどからPhotoshop Elementsを起動し、「写真の編集」を選択します。
 
 
メニューバーの「ファイル」→「開く」からぼかし加工対象の写真を開きます。
 
 
対象写真が表示されます。
サンプル写真の解像度は、600×450pxで、ペンギン全体と後ろの箱をぼかします。
 

ぼかしツールの選択、設定

 
ウインドウ左にあるツールボックスから「ぼかしツール」を選択します。
 
 
ウインドウ下にある「ツールオプション」を選択するとツールオプションが表示されます。
 
 
ツールオプションの各項目を設定します。
ブラシ:ブラシ先端の種類(輪郭がクッキリ/ボケている)やサイズを選択
サイズ:ブラシのサイズを任意選択、写真のぼかす部分の大きさにより設定
強さ:ぼかし効果の強弱度合いを選択
 
この例では、輪郭がクッキリしたブラシ、サイズを65px、強さを100%(強)に設定しています。
 
 

ぼかし編集操作

ツールオプションで設定したブラシのサイズによりマウスポインター部分に丸印(黒〇印)が表示されます。サイズは、ぼかす部分の大きさにより調整します。
 
ぼかす部分をドラッグあるいはクリックするとぼかし効果が表れます。
 
 
ボケ具合を確認しながらドラッグあるいはクリック操作を続けます。
 
ぼかし加工編集後の写真です。
ペンギン全体、白い箱・文字の輪郭が自然な感じでボケています。
 
 
写真の一部のぼかし方(その1)は、終了です。
 

 

写真の一部にモザイクをかける(フィルター機能)

写真の一部分をぼかすには、いくつかのぼかし方があります。
Photoshop Elementsのフィルター機能・モザイクを使い簡単にモザイクによるぼかす方法を説明します。
 
モザイク・ぼかしのサンプルイメージは次の通りです。
 
 
サンプル写真のペンギンと直ぐ後ろの白い箱にモザイクをかけぼかします。
 

Photoshop Elementsの起動、画像読み込み

メニューバーの「ファイル」→「開く」からぼかし加工対象の写真を開きます。
 
 
対象写真が表示されます。
ペンギン全体と白い箱にモザイクをかけぼかします。
 

楕円形選択ツールの選択、範囲選択

ウインドウ左にあるツールボックスから「楕円形選択ツール」を選びます。
 
 
ツールボックスに「楕円形選択ツール」ではなく「長方形選択ツール」アイコン表示になっている場合もあります。その時、長方形選択ツールを選び、ツールオプションから楕円形選択ツールを選びます。
 
 
ぼかす部分をドラッグしながら楕円形範囲を設定します。
サンプルでは、ペンギンの左上部分をクリック・右下へドラッグ(赤の矢印、)します。
この操作により長方形イメージの中に楕円形の範囲が選択されます。
 
 
範囲選択された黒色の楕円形部分の実際は、点線表示です。
 
 

ぼかし編集(モザイク)操作

メニューバーの「フィルター」から「ピクセレート」「モザイク」を選択します。
 
 
「モザイク」ダイアログが表示されます。
 
 
スライダーを左右に動かし、セルの大きさ(モザイクの大きさ)を変え、プレビュー確認しながらぼけ具合を調整します。「OK」でモザイクが反映されます。
 
ぼかし(モザイク)加工編集後の写真です。
顔、目、鼻の輪郭がギザギザな感じでボケています。
 
 
写真の一部 モザイクによるぼかし方(その2)は、終了です。
 

 

写真の背景をぼかす(フィルター機能・レンズ)

デジタル一眼レフなどのカメラであれば背景をぼかし主役(主被写体)を目立たせることができますが、コンパクトデジカメやスマホカメラで背景をぼかすのはちょっと難しいでしょう。
でも画像編集ソフトを使用すれば、一見デジタル一眼レフで撮った様に背景をぼかすことができます。
 
画像編集ソフトPhotoshop Elementsを使用した写真の背景のぼかし方を説明します。
 
写真の主役と背景の境界のはっきりしているかなどにより背景のぼかし方は、いろいろな方法があります。
ここでは、主役と背景の境界がはっきりしている単純な写真を対象とし、背景のぼかし方を説明します。
 
写真の背景をぼかすイメージは次の通りです。
 
 
主役は、ペンギンと直ぐ後ろの白い箱、さらに青い缶です。それ以外は背景とします。
 

Photoshop Elementsの起動、画像読み込み

スタートメニューなどからPhotoshop Elementsを起動し、「写真の編集」を選択します。
メニューバーの「ファイル」→「開く」からぼかし加工対象の写真を開きます。
 
 

主役範囲の選択

ツールボックスから「クイック選択ツール」を選び、まず主役の範囲を選択します。
このサンプルでは、ペンギン、白い箱、青い缶が主役の範囲です。
 
 
・ツールボックスから「クイック選択ツール」を選びます。
・ツールオプション欄が表示されていない場合、
「ツールオプション」ボタンをクリックします。
 
 
ツールオプションの「新規選択」「選択範囲に追加」
「選択範囲から一部削除」および「ブラシサイズ」を使用し選択範囲を選びます。
 
 
ツールオプションの「新規選択」および「選択範囲追加」を選び、主役範囲内をクリック/ドラッグすると選択範囲が広がり追加されます。この時、ポインターが、〇印に+表示になります。
 
主役の範囲を越え背景部分を選択した場合は、「選択範囲から一部削除」を選び、越えた部分をクリック/ドラッグすると選択範囲が削除され狭くなります。この時、ポインターが、〇印に-表示になります。
 
範囲を選択する時、ブラシサイズを小さくするときめ細かく範囲選択でき、大きくすると大雑把な範囲選択になります。
範囲選択する部分の解像度に応じブラシサイズを設定すれば選択し易くなります。
 
 
主役部分を範囲選択しました。
 
 
点線内が選択範囲です。
わかり易く黄色線で表示しています。
 
 

背景範囲の選択

選択範囲を主役部分から背景部分に変更します。
 
メニューバーの「選択範囲」から「選択範囲を反転」を選びます。
 
 
選択範囲が主役部分から背景部分に変更されます。
 
 
画像全体の周りにも点線が表示されます。
画像全体から主役部分を除いた背景部分が選択範囲になります。
 
 

背景をぼかす - ぼかし(レンズ)

背景部分をぼかします。
 
 
メニューバーの「フィルター」から「ぼかし」、「ぼかし(レンズ)」を選びます。
 
 
「ぼかし(レンズ)」ダイアログが表示されます。
 
プレビューを確認しながらぼかしの強弱を設定します。
ぼかし強弱は、ピクセル指定あるいはスライダー移動により行い、値が大きくなるにつれ、ぼかしが強くなります。
 
自然な感じのぼかし具合に調整し「OK」、ぼかしを反映させます。
 
 
写真には、範囲選択の点線が表示されており、それを消します。
 
 
メニューバーの「選択範囲」から「選択を解除」を選びます
 
背景をぼかした写真です。
 
これで写真の背景をぼかし方の説明は終了です。

デュアルディスプレイ お薦め!


パソコンのディスプレイ画面は、何台使用していますか?
 
普通、パソコンのディスプレイは、1台(1画面)です。
1画面1デスクトップでは「狭~い」と思われている方もおられるのではないでしょうか?
 

 

デュアルディスプレイ(モニター)

パソコンにディスプレイを1台追加し、2台にすると、デスクトップのスペースが広くなり、とても見易く・使い易くなります。これをデュアルディスプレイあるいはデュアルモニターとも呼ばれています。
 
運営者は、デスクトップパソコンとノートパソコンの2台を使用していますが、パソコン2台ともデュアルディスプレイで使用しています。
 
画像編集、資料作成、WEB検索など複数のアプリ(ウィンドウ)を開く作業が多いため、デスクトップの広さが作業効率アップに繋がります。
 
<ノートPC>
13.3インチ本体画面 + 17インチ画面のデュアルディスプレイとして使用
(ノートPC仕様)表示機能 外部ディスプレイコネクタ(アナログ接続)あり
*グラフィックカードなし(マザーボード上のグラフィック機能使用)
 
 
ノートPCは、少し古い13.3インチのノートPCです。
13.3インチ画面(解像度 1366×768px)では、デスクトップのスペースが狭く、複数のアプリ(ウインドウ)を開き作業するのがちょっと大変です。
 
この13インチのノートPCに17インチ外部ディスプレイ(解像度 1280×1024px)を追加すると、デスクトップの広さは約2倍に拡がり、複数のアプリを起動しても、ウインドウの切り替えなしで使用できとても便利です。
 
<デスクトップPC>
24インチ画面 + 23インチ画面のデュアルディスプレイとして使用
(デスクトップPC仕様)表示機能 HDMI、DVI-Dコネクタあり
*グラフィックカードあり
 
 
デスクトップPCでは、24インチ画面(解像度 1920×1200px) + 23インチ画面(解像度 1920×1080px)の2台をデュアルディスプレイで使用しています。
 
2台のディスプレイ共にワイド画面のため、かなり広いデスクトップスペースが使用できます。
画像のチェック・編集作業、資料作成、Web検索など多数のアプリを起動する作業が多いのでとても有効にデスクトップを使え便利です。
 
またワイド画面のためデスクトップスペースが広く1台だけでも十分な場合があり、その様な時には1台のディスプレイをOFFにし使用しています。
 
<< デュアル・ディスプレイ >>
 
パソコンにもう1台外部ディスプレイを追加すると、
2台分のディスプレイ画面になります。
 
デスクトップ・スペースが広くなり、
とても見易く・使い易く、作業効率アップ!
 
デュアル・ディスプレイの方法は、
「外部ディスプレイ装置(ケーブルも)」と
「その置き場」が有れば、
意外に簡単に接続・使用できます。
 

デュアルディスプレイのメリットとデメリット

デュアルディスプレイのメリットとデメリットです。
なおパソコンと外部ディスプレイ装置が接続できる事が前提です。
 
<メリット>
・デスクトップ(画面)のスペースを広く使用でき、作業し易い。
・ウインドウを複数開く時、ウインドウの重なりを少なくし見易い。
・複数のアプリ(ウインドウ)を見ながら作業でき効率アップが期待できる。
・ノートPCなどの小さな文字を大きな文字で見られる
 
例)13.3、15.6インチノートPC 解像度 1920 x 1080
23インチディスプレイ    解像度 1920 x 1080
 
高解像度のノートPCでは、文字テキストが小さいため120~150%拡大表示が推奨値になっていますが、それでも文字が小さく読みずらい時には23インチくらいの大きなディスプレイ画面でさらに拡大表示することも。
 
<デメリット>
・外部ディスプレイ装置が必要。費用が発生する。
・ディスプレイの置き場が必要
・性能の低いパソコンでは、表示品質(表示が遅い・画像の乱れなど)に影響する可能性あり
 

パソコンとディスプレイの接続

パソコンとディスプレイの接続種類

デュアル・ディスプレイは、パソコンとディスプレイが接続できることが前提条件です。
 
パソコンとディスプレイの接続には、4種類の接続方法があります。
 
(1)VGAケーブル(アナログ)
パソコンとディスプレイなどをアナログ接続するケーブルで、映像のみを転送します。
コネクタは、ミニD-Sub 15pin、VGAコネクタとも呼ばれます。
 
 
(2)DVIケーブル(デジタル)
パソコンとディスプレイなどをデジタル接続するケーブルで、映像のみを転送します。
 
 
(3)HDMIケーブル(デジタル)
パソコンとディスプレイなどをデジタル接続するケーブルで、映像・音声・制御信号を送受信します。
パソコン以外にテレビ、DVDレコーダー、AVレシバーなどのデジタル家電で使用されています。
 
 
(4)DisplayPortケーブル(デジタル)
パソコンとディスプレイなどをデジタル接続するケーブルで、映像・音声・制御信号を送受信します。
 
 
接続種類、表示解像度などパソコン仕様やディスプレイ仕様により異なります。
 
 

パソコン側のインターフェース確認

 
デュアルディスプレイにするには、ディスプレイとパソコンを接続できることが大前提です。
 
まず、パソコンの仕様を確認し、ディスプレイ用出力ポートに何が有るかを確認します。
DisplayPort、HDMI、DVI、VGA(外部ディスプレイ)のいずれかが分かるはずです。
仕様がわからない場合、パソコン背面を見るとほぼ分かります。
 
<ノートPCの仕様 (例)>
 
 
この例では、HDMIとVGAの2種類の接続ができます。
 
<ノートPCのポート (例)>
 
 

ディスプレイ側のコネクタ確認

次に外部ディスプレイの仕様を確認し、PCとの接続に何があるかを確認します。
仕様がない場合、ディスプレイの背面などを見ればわかります。
 
<ディスプレイ仕様 (例)>
 
 
この例では、デジタル入力としてHDMIとDVIがあり、アナログ入力としてミニD-Sub(VGA)の3種類があります。
 
<ディスプレイ側ポート (例)>
 
 
仕様(例)のとおりHDMI、DVI、D-Subの3種類の入力ポートがあります。
 
PCのポートは、HDMI、D-Sub(VGA)の2種類あり、デジタル接続を優先し接続します。
 
※使用する端子に応じ入力端子の切り替え設定が必要なディスプレイ装置もあり、その時にはディスプレイのスイッチにて切換えます。
 

Windows10のデュアルディスプレイの設定

デュアルディスプレイの設定(例)

デュアルディスプレイの設定例として幅、高さの異なる次の画面で説明します。
 
13.3インチ ノートPC(1366×768)・・・ワイド画面
17インチディスプレイ(1280×1024)・・・長方形の画面
 
 

デュアルディスプレイの設定

 
パソコン(Windows10)側の設定をします。
デスクトップ上を右クリックし、「ディスプレイ設定」を選択します。
 
 
ディスプレイ設定画面が表示されます。
設定画面には、PC画面、外部ディスプレイの配置図が表示されます。
 
 
「1」・・・ノートPC
「2」・・・外部ディスプレイ
 
左にノートPC「1」、右に外部ディスプレイ「2」が表示されます。
「識別」をクリックすると画面に「1」「2」の識別番号が表示されます。
この配置は、配置図内をドラッグすれば変更できます。(説明は後述)
この配置と物理的な配置によりマウスポインターの動きに注意が必要です。(説明は後述)
 
「ディスプレイ」画面の下の方にある「複数のディスプレイ」を設定します。
 
 
「表示画面を複製する」を選択すると、外部ディスプレイに同じデスクトップ内容が表示されます。
「表示画面を拡張する」を選択すると、デュアルディスプレイとしてデスクトップスペースが拡張され使用できます。
この操作で2台のディスプレイ画面を一つのデスクトップとして使用できます。
 
「表示画面を拡張する」を選択した時のスクリーンショットです。
赤丸印の番号は、画面の識別番号です。
 
 
元の1台に戻す時には、「1のみに表示する」を選択すると元のディスプレイだけの表示に戻ります。
 

デュアルディスプレイの物理配置(左右上下)

デュアルディスプレイを使用する時、PCと外部ディスプレイの物理配置を自由に設定できます。
 
例ではノートPCを左側、外部ディスプレイを右側に配置し、設定も同じように設定しています。
 
この配置を逆:ノートPCを右側、外部ディスプレイを左側に配置する時には、
設定を変更します。
変更方法は、配置図の「1」(例ではノートPC)をドラッグし、外部ディスプレイの右側に移動します。
 
 
これで左右が入れ替わり物理的な配置と配置図が同じになります。
外部ディスプレイが左側、ノートPCが右側に配置されました。
 
 
また、配置図の「1」をドラッグし、外部ディスプレイの下に移動することもできます。
外部ディスプレイの置き場が無く、棚などの上に置けば・・・特別な配置(?)の時に可能でしょう。
あまり現実的ではないでしょうけども。
 
 

マウスポインターの動き

デュアルディスプレイでは、デスクトップスペースが画面2台分のスペースに拡張します。
配置図のイメージでデスクトップが拡張され、その配置図に従いマウスポインターの動きが可能になります。
次の例では、ノートPCが左側、外部ディスプレイが右側です。
PC画面の右側から外部ディスプレイの左側に、その逆で外部ディスプレイの左からPC画面へマウスポインターの移動は可能です。
 
 
注意点は、2画面の解像度:高さの違いです。
ノートPC(1366×768)・・・高さ768px
外部ディスプレイ(1280×1024)・・・高さ1024px
この例では2画面の上位置を合わせているため、下位置にマウスポインターの移動できない場所ができ、外部ディスプレイの左側下部からPC側へは移動できません。
 
次の例では、同じくノートPCが左側、外部ディスプレイが右側、下位置を合わせているため、外部ディスプレイの左上からPC側へは移動できません。
 
 
次の例では、外部ディスプレイが左側、ノートPCが右側、下位置を合わせているため、外部ディスプレイの右上からPC側へは移動できません。
 
 
本来であれば解像度(高さ)の同じディスプレイを使用すればスムーズにマウスポインターの移動が可能です。しかし予算等の問題もあり、特にノートPCのデュアルディスプレイでは解像度の違いがでてしまいます。
従って色々設定をし使い易い設定を見つければ良いでしょう。
いずれにせよ、デュアルディスプレイはお薦めです。