Photoshopコンテンツ・デザイン パーフェクトマスター

概 要

Photoshopは、世界中のクリエイターが使っている高性能フォトレタッチソフトです。本書は、Photoshopでのコンテンツ作りを中心に、基本操作や基本機能の解説はもとより、RAWデータの現像から、レタッチの実際とノウハウ、質感の表現、Web用イラストの作成方法、さらにはデザインや色彩の基礎理論などをプロの凄いテクニックと共に丁寧に解説。本書一冊で基礎から一線級クリエイターが実践している本物の表現力までが身につきます!

著者 音賀鳴海&アンカー・プロ
価格 本体2500円(税別)
ISBN 978-4-7980-4824-6
発売日 2017/5/30
判型 B5変
ページ数 516
CD/DVD
ダウンロード
表紙イメージ
購入 アマゾンで購入する
楽天で購入する

※リンク先によっては、販売ページが用意されていないことがあります。あらかじめご了承ください。

新しいウィンドウで開く 書籍購入のご案内

サポート

サポート情報は以下からご参照下さい。

サポート情報へのリンク

目次

Chapter 0 写真から広がる世界

0.1 1枚の写真から

0.1.1 撮った後に手が加えられるのが写真

本物か偽物か

写真がつなぐもの

0.2 Photoshopの世界

0.2.1 動詞としても使われるPhotoshop

Photoshopの歴史

0.2.2 Photoshopファミリー

関連のデスクトップアプリケーション

Memo 各ソフトの比較表

Photoshopと関連したモバイルアプリとサービス

0.3 Photoshopグランドホテル

0.3.1 Photoshopがつくる5つの作品

手軽に写真を楽しみたい

撮った写真を修正してプリントアウトしたい

写真を合成してポスターをつくりたい

ポートレート写真のレタッチをしたい

質感を作り出したい

Webパーツをつくりたい

LINEスタンプをつくりたい

Chapter 1 ところで”フォトショ”ってなに?

1.1 スマホの写真を修正してSNSに投稿した話

1.1.1 スマホで撮った写真をアプリで編集するには

Photoshop Expressで写真をワンタップ加工する

Photoshop Expressで顔写真をレタッチする

1.1.2 写真をSNSでシェアするには

Instagram

Photoshop Expressから写真をInstagramにアップロードする

Memo 学生・教職員個人版

1.2 Flickrの写真がPhotoshopで修正されていた話

1.2.1 写真のメタデータを見るには

Flickr

Tips Flickrにアップロードした写真のEXIFを表示しないようにするには

Memo 加工された写真は報道にふさわしくない?!

1.2.2 RAWデータを現像するには

Lightroomで現像する

Memo 無料で利用できるLightroom

1.3 写真をPhotoshopで修正して仲間と共有した話

1.3.1 Photoshopをゲットするには

Photoshop Elements体験版のインストール

Memo Photoshop CCのインストール

1.3.2 Photoshop Elements体験版で写真を修正する

自動補正機能を使う

Hint Photoshop Elementsで画像調整するには

Tips 顔の表情を修正する

1.3.3 Flickrで写真を共有するには

「配信」機能で共有する

Hint Photoshop Elements Organizerで写真をシェアする

1.3.4 Adobe Creative Cloudで写真を共有するには

Adobe Creative Cloudとは

Creative Cloudでコンピューターとタブレットでファイルを共有する

仲間とCreative Cloudの写真を共有するには

Memo Adobe Stockの利用

1.3.5 Adobe Stockを利用してみる

Adobe Stock

Adobe Stockのプレビュー画像を試す

Chapter 2 フォトショ? なにをどうするの!?

2.1 写真をコンピューターに取り込んでみる

2.1.1 カメラを選ぶには

デジタルカメラ選び

カメラの画素数とPhotoshopの表示

2.1.2 写真を撮るには

カメラの設定

写真の構図

2.1.3 写真を取り込むには

SDカードから写真を取り込む

ppiとlpiとdpi

Hint 自動再生

2.2 Photoshopの基本を覚える

2.2.1 JPEG画像をPhotoshopで開くには

Photoshopで写真を開く

Hint Adobe Bridgeから写真を開く

2.2.2 Photoshopのユーザーインターフェイス

Hint 写真用のワークスペースプリセット

2.2.3 Photoshopで写真を修正するには

自動○○で写真を修正する

Hint PNG以外の形式で書き出すには

2.2.4 編集した写真を保存するには

名前を付けて保存する

PNGで書き出す

Bridgeのファイル管理

ライブラリに保存する

Hint ライブラリに登録されているアセットを使う

2.2.5 Photoshopを終了するには

Photoshopを終了する

Hint 動作を軽快にする設定

2.3 写真の色や明るさを補正する

2.3.1 明るさやコントラストを補正するには

Memo 明るさとコントラスト

輝度のヒストグラムパネルを表示する

Memo キャッシュレベル

Hint コントラストの調整

「明るさ・コントラスト」で補正する

「レベル補正」で補正する

「トーンカーブ」で補正する

「露光量」で補正する

Memo 露光量の調整

Hint 総合的な明るさとトーンの補正

2.4 RAWデータを現像する

2.4.1 RAWデータを現像するには

RAWデータ

Camera Rawで現像する

Camera Rawの基本補正

Tips 補正前の写真と見比べるには

Hint Lightroomで現像する

現像したRAWデータの保存

2.5 写真を使ってカードをつくる

2.5.1 印刷用に写真サイズ調節するには

写真を回転させる

写真を切り抜く

Hint 背景が均一色上のモノを自動でトリミングする

2.5.2 写真に文字を入れるには

文字を入力する

文字を拡大して位置を移動する

2.5.3 写真を入れたカードを印刷するには

プリントする

Chapter 3 写真を合成してポスターをつくる

3.1 写した写真の構図を変えてみる

3.1.1 写真を傾けるには

写真の水平を合わせる

Hint Photoshopの傾きの自動調整機能

Hint 画像の回転

写真を傾けて得られる効果

Hint 回転させて構図を変える

3.1.2 写真の一部を切り抜くには

指定した横縦比/縦横比で切り抜く

Hint Photoshop Fixの切り抜き機能

Tips 遠近法による台形ひずみの画像を補正して切り抜くには

3.2 画像をレイヤーに分解して加工する

3.2.1 建物と背景の空を別々に加工するには

背景とレイヤー

建物と背景の空レイヤーに分ける

Hint 効率良く自動選択するためのオプション設定

3.2.2 建物の背景をグラデーションで描くには

Hint 削除し残りを確認する

新規レイヤーを作成して色を塗る

Hint グラデーションレイヤーを使った場合

3.2.3 画像を型抜きするには

クリッピングマスクで型抜きする

マスクレイヤーで型抜きする

Tips 切り抜いた画像と元の画像の関係性を調整するならマスクレイヤー

3.2.4 レイヤーの基本についてまとめる

Hint レイヤーパネルのサムネイルの大きさを変える

Memo レイヤーサンプル画像のまとめ

レイヤーパネルの操作

Hint PNG画像への書き出し

3.3 不要なものを消す

3.3.1 画像の一部を消すには

消しゴムツールで消す

Hint 消しゴムツールのオプション

3.3.2 不要域を別域のコピー&ペーストで隠すには

なげなわツールで選択した領域を貼り付けて不要領域を隠す

指先ツールで境界線をぼかす

3.3.3 任意の領域を簡単に複製して、その領域を消すには

コピースタンプツールで隠す

Tips コピースタンプツールで画像を複製する

Tips フリンジ削除で貼り付け後の画像のエッジを処理する

Tips コピースタンプツールのレタッチテクニック

3.4 切り抜いた画像を組み合わせてポスターをつくる

3.4.1 ポスター制作はどう進めればいいのか

ポスター制作の過程

3.4.2 ポスター紙面はどのようにして構成すればよいのか

ポスター構図の基本

基本矩形を使った構成

3.4.3 Photoshopで紙面構成するには

定規

Tips ものさしツールで長さを測る

グリッド

ガイドを追加する

ガイドを見て配列する

Hint スマートガイド

基本矩形で紙面を構成する

Chapter 4 写真の修正を依頼された

4.1 フォトレタッチに必要な基礎知識

4.1.1 「色」の基礎知識

物体色は光源色によって変わる

カメラが色を記録する仕組み

4.1.2 「色」の表し方

色を数値化する試み

色の三属性

色相

明度と彩度

4.1.3 配色に調和を与えるには

トーン

色相で色を調和させる

トーンで色を調和させる

Photoshopで色調調和させたサンプル写真

Tips HSBで色調調整する

Tips Photoshopの色相環機能

4.2 見た目の色と写真の色の違いを調整する

4.2.1 プロファイルとモニターキャリブレーション

カラーマネジメントシステム

キャリブレーション

Hint 平均化(イコライズ)コマンドの調整

Hint ガンマ値による見え方を確認できるソフト

Windows PCのモニターキャリブレーションを使う

Onepoint モニターのプロファイル

Memo Windowsのプロファイルの場所

Onepoint Macのプロファイルの場所

Macのモニターキャリブレーションを使う

プロファイル

4.2.2 色空間を統一するには

Memo RGBとCMYKで色がマッチしない理由

Photoshopでプロファイルを管理する

Hint プロファイルを埋め込むには

4.3 写真の色を調整する

4.3.1 色かぶりを補正するには

トーンカーブで色かぶりを補正する

Hint 色かぶりをヒストグラムで確認する

カラーバランスで色を補正する

Hint 輝度を維持して色かぶりを補正する

Memo カラーバランスの特性

Memo 「白とび」「黒つぶれ」

Tips 色調調節で印象的な写真に仕上げる

4.3.2 特定の色相域の色だけを調整するには

Tips 「かぶり」を補正しながら撮るには

「色相・彩度」調整レイヤーで色調を調整する

Hint 変更域の追加

Tips 特定の場所の色を変更する

4.3.3 カラーモードを変更するには

カラーモード

疑似CMYKにして編集する

CMYKへの変換

4.4 モデルの写真を修正する

4.4.1 ふわふわの輪郭や髪の毛を切り抜くには

毛と背景の境界を切り抜く

Hint モデル写真の背景

4.4.2 肌をきれいに補正するには

シミやシワを消す

肌色を調整する

4.4.3 目鼻立ちを際立たせ肌を整えるには

ハイパスとぼかしを重ねる

Hint より細かくレタッチする

Chapter 5 もっと質感を表現したい

5.1 被写体の柔らかや硬さを演出してみる

5.1.1 毛皮の写真をふわふわにするには

ぼかした画像をオーバーレイで重ねる

Hint ぼかしの種類

Hint 料理を美味そうに見せる

5.1.2 コインの写真を修正するには

コイン表面のエッジをシャープにする

照明で金属光沢を演出する

5.1.3 フィルターを簡単に元に戻すためには

スマートオブジェクトへ変換する

スマートオブジェクトにフィルターを実行する

スマートオブジェクトを変形する

5.2 フォトショで質感をつくってみる

5.2.1 金属板を加工したようにデザインするには

オンラインフィルターの利用

Hint Adobe Add-onsプラグインなどの使い方

スクリーンパターンで穴を開ける

5.2.2 逆巻く濁流をデザインするには

雲模様とクロムで水面をつくる

水面をワープで変形する

Tips 革の質感テクスチャ上にメタル文字をつくる

5.2.3 もじゃもじゃ文字をつくるには

入力したテキストのパスを作成する

Hint 虎縞柄の文字

Hint 選択範囲とパスの切り替え

ブラシツールで毛並を描く

Tips テキストの線をイラストで描く

5.2.4 麻布地のオリジナルプリントTシャツをデザインするには

クリッピングマスクでTシャツに写真をプリントする

写真に麻布風のテクスチャをかける

5.2.5 陶器の招き猫を石掘りのようにするには

ポスタリゼーションで色数を減らす

領域をパターンで塗り分ける

Tips アルミ缶の表面に文字ラベルを巻き付ける

Hint パターンを変える

Tips タイルモザイクの招き猫にする

5.3 複雑な画像加工を一発で実行したい

5.3.1 写真を鉛筆スケッチ風にするには

フィルター

フィルターの特殊効果を重ねる

Tips Photoshopをキビキビ使いたい!

フィルターギャラリー

5.3.2 フィルターや色調補正の一連の画像加工操作を記録させたい

アクションを作成する

Hint ネットからダウンロードしたアクション

5.3.3 他の人のつくったアクションが使いたい

自分でつくったアクションを保存する

他人からもらったアクションを使う

Hint アクションを実行するには

5.4 立体オブジェクトの質感をつくりたいが…

5.4.1 3Dワークスペースの基本と3Dの質感

3Dオブジェクトの質感を変えてみる

Hint 3Dコンテンツの作成または入手法

5.4.2 透明感のある3D文字をつくるには

テキストを3D化する

3Dオブジェクトを移動する

透明なマテリアルを設定して光源を調整する

3Dオブジェクトに背景のマテリアルを貼る

Hint 3種類の光源

Chapter 6 Web用のイラストをつくる

6.1 ショップのロゴをつくる

6.1.1 パスとシェイプの基本

パスとシェイプ

滑らかな曲線でできた図形をペンツールで描く

トレースする

6.1.2 店のロゴマークをつくる

ペンツールで図形を描く

パスを使って図形をつくる

Hint ガイドライン

入力した文字を変形する

Hint シェイプを色塗りする

シェイプを入力する

Tips マグネットオプションをオンにしたフリーフォームペンツール

6.1.3 タイトル文字をつくる

タイトル文字間の間隔を調整して下線を引く

ワープテキスト

Hint 文字パネル

レイヤースタイルによる文字効果

Tips ラスタライズ

6.2 PhotoshopでつくったパーツでWebページをつくる

6.2.1 WordPressのデザイン性

テーマ

ダッシュボード

Hint WordPressのレスポンシブデザイン

プラグイン

6.2.2 Webページにアイコンを付けるには

地図用のピクトグラムをつくる

6.2.3 アクセスページ用の地図をつくるには

Google Mapを下敷きにして道を描く

Hint ファビコン

目印になる建物などを書き入れ地図を完成させる

6.2.4 電話番号の画像をメニュー下に表示するには

PHPとCSS

テーマのCSSでメニューの書体を変更する

テーマのヘッダーに電話番号の画像を追加する

Chapter 7 LINEスタンプをつくる

7.1 黒線でLINEスタンプの輪郭を描く

7.1.1 LINEスタンプ

ガイドライン

7.1.2 手書きのイラストをトレースするには

手書きの下絵とそのデータ化

Ilustrator

Ilustratorで手書きのイラストをトレースする

Hint IlustratorとPhotoshopで使うカラーを共有する

Tips Photoshopで手書きのイラストをトレースする

Adobe Captureアプリで手書きのイラストをトレースする

7.2 色を塗ってLINEスタンプを完成させる

7.2.1 LINEスタンプに仕上げるには

トレースした線画に色を塗る(Photoshop編)

トレースした線画に色を塗る(Ilustrator編)

Photoshopでスタンプを仕上げる

文字入れとサイズ調整

PNGファイルへの変換

スタンプシミュレーターで確認

7.2.2 LINEスタンプを販売するには

LINEスタンプを販売するまで

7.3 アニメーションスタンプもつくる

7.3.1 APNG Assemblerでアニメーションスタンプをつくるには

サイズを統一した画像を各ファイルに書き出す

Hint ファイル名をリネームする

APNG Assemblerでアニメファイルにする

Onepoint 再生回数の設定

Onepoint 切り替えのタイミング

ANPGの再生確認

Tips アニメーションGIFを作成する方法

7.3.2 Adobe Animateでアニメーションスタンプをつくるには

Adobe Animateでアニメーションを作成する

ムービーを1コマごと書き出す

アニメーションスタンプの作成と確認

Memo LINE着せ替え

7.4 写真スタンプに挑戦する

7.4.1 写真スタンプをつくるには

写真を切り出す

集中線を描くⅠ

集中線を描くⅡ

7.4.2 アクションでスタンプの余白を入れるには

余白挿入のアクションを記録する

Hint アクションを再生する

資料 Photoshop主要コマンド一覧

PR

秀和システム