SlideShare a Scribd company logo
絵描きさんあるある
Photoshop技
HASHIZUME Yumi
20140613
お前、誰よ
uniq
橋爪由美
夏コミでデザイナー向けGit本だ
すよ!
萌え絵描きデザイナー
CSS/HTML/djangoテンプレート
書いたり、デザイン考えたり
BeProudで働いてます
前はドワンゴ
前の前は、

フリーの絵描き
Photoshop and me
始めての出会いはお絵描きでした
お絵描きのおかげでショートカットや機能を覚えること
ができた
最近のwebデザイン業務は、

Photoshopでデザインつくるよりも、コード書いちゃっ
た方が早い…(だから覚えない><)

なので、絵描き技以外は詳しくなかったり…
でもでも、他のデザイナーさんの知らない技を知ってる
お陰で、ちょっと重宝された事もあったりなかったり
Photoshopで絵を描いてたので、
web業界にて生き残れました
Photoshopさん
ありがとう!
感謝の気持ちをこめて、

絵描きさんPhotoshopあるある技を紹介します
紙に描いてスキャン
iPhoneで撮影することも
Photoshopでペン入れは
難しい(出来ないことは
ないけど…)ので、主線
を描いた紙をスキャンし
て使う
下書きを飛ばす
レベル補正 Command+l
明るさとコントラスト
主線レイヤー作る
カラーモードはRGB
Command+jで背景レイ
ヤーをコピー
Command+alt+5で白が
選択されます。Delキー
で白部分を削除すれば主
線レイヤーの出来上がり。
こんな時に役立ちました!
手書き風イラストが必要な時
カンプ(サイトのレイアウトなど)を準備する時。

紙でさくっと書いて、さくっと補正して、さくっと
見せる。
ごみがある…
あとあと面倒だし
美しく仕上げるために
消したい
ゴミを取る
レイヤー効果の境界線を
使って、ゴミを分かりや
すくする。
消しゴム(e)でゴミを
消す。
選択ツール(m)でゴミ
を選択して消す。
手のひらツール(h)で
あちこち移動
こんな時に役立ちました!
イラストや写真きりとる時
印刷用データで、ゴミがないか調べる時

(使ってないオブジェクトがたまに残ってたり)
色塗りのためのパーツ分け
分かりやすい色で分けると塗り漏れに気づいて良い
タブレットで塗る
Photoshopでも厚塗り・
水彩塗りっぽいのは出来
ます。
ブラシ設定>その他>コ
ントロールを「筆圧」に
ブラシで塗ってる最中は
altキーでスポイトに
なってくれる
こんな時に役立ちました!
手書き風のイラストが必
要な時
写真を手書き風に加工し
て、ちょっと手を加えた
い時
塗った後の仕上げ
このままだと、なんだか
のっぺりしてるなーって
感じ
塗った後の仕上げは
Photoshop必須だよね!
イラストレイヤーをコピーしてガウスぼかし。乗算で重ねる。
イラストレイヤーをコピーしてガウスぼかし。オーバーレイで重ねる
仕上げ、他にも…
ノイズレイヤーを上から重ねる
フィルター>描画>雲模様を上から重ねる



背景との一体感がでたり、メリハリが付いたりする
こんな時に役立ちました!
二枚以上の写真を合成したい時(人物と背景をなじ
ませる)
先方からいただいたイラスト素材を、こちらで用意
した別素材とで、なじませる
そんなこんなで完成
\(^o^)/
ありがとうございました
Photoshop and me

More Related Content

Viewers also liked

Viewers also liked (16)

【商品写真の処方箋】カメラマンも知らない商品写真3つの役割とすぐにできるフォトショTipsでレスポンスを上げる方法
【商品写真の処方箋】カメラマンも知らない商品写真3つの役割とすぐにできるフォトショTipsでレスポンスを上げる方法【商品写真の処方箋】カメラマンも知らない商品写真3つの役割とすぐにできるフォトショTipsでレスポンスを上げる方法
【商品写真の処方箋】カメラマンも知らない商品写真3つの役割とすぐにできるフォトショTipsでレスポンスを上げる方法
 
撮った後が勝負!商品撮影のためのPhotoshopレタッチ入門
撮った後が勝負!商品撮影のためのPhotoshopレタッチ入門撮った後が勝負!商品撮影のためのPhotoshopレタッチ入門
撮った後が勝負!商品撮影のためのPhotoshopレタッチ入門
 
真のレシポンシブって何だろう
真のレシポンシブって何だろう真のレシポンシブって何だろう
真のレシポンシブって何だろう
 
Photoshopでバナー "いい感じ" に制作せよ!
Photoshopでバナー "いい感じ" に制作せよ!Photoshopでバナー "いい感じ" に制作せよ!
Photoshopでバナー "いい感じ" に制作せよ!
 
写真を使った富士宮でのプロジェクト
写真を使った富士宮でのプロジェクト写真を使った富士宮でのプロジェクト
写真を使った富士宮でのプロジェクト
 
これくらいはやってほしいWebデザイン
これくらいはやってほしいWebデザインこれくらいはやってほしいWebデザイン
これくらいはやってほしいWebデザイン
 
リクルート式ビッグデータ活用術
リクルート式ビッグデータ活用術リクルート式ビッグデータ活用術
リクルート式ビッグデータ活用術
 
Best of MAX「ベテランほど知らずに損してる IllustratorとPhotoshopの新常識(CCライブラリ編)」
Best of MAX「ベテランほど知らずに損してる IllustratorとPhotoshopの新常識(CCライブラリ編)」Best of MAX「ベテランほど知らずに損してる IllustratorとPhotoshopの新常識(CCライブラリ編)」
Best of MAX「ベテランほど知らずに損してる IllustratorとPhotoshopの新常識(CCライブラリ編)」
 
 〜デザイン初心者向け〜
 デザイン時に気をつけると幸せになれる事
 〜デザイン初心者向け〜
 デザイン時に気をつけると幸せになれる事 〜デザイン初心者向け〜
 デザイン時に気をつけると幸せになれる事
 〜デザイン初心者向け〜
 デザイン時に気をつけると幸せになれる事
 
リクルートテクノロジーズが語る 企業における、「AI/ディープラーニング」活用のリアル
リクルートテクノロジーズが語る 企業における、「AI/ディープラーニング」活用のリアルリクルートテクノロジーズが語る 企業における、「AI/ディープラーニング」活用のリアル
リクルートテクノロジーズが語る 企業における、「AI/ディープラーニング」活用のリアル
 
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえようノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
 
Aさんが言うデザインとBさんの言うデザイン、結局どっちが正しいの?
Aさんが言うデザインとBさんの言うデザイン、結局どっちが正しいの?Aさんが言うデザインとBさんの言うデザイン、結局どっちが正しいの?
Aさんが言うデザインとBさんの言うデザイン、結局どっちが正しいの?
 
Photoshopで学ぶ、一生使える色調補正 先生:藤本 圭先生
Photoshopで学ぶ、一生使える色調補正 先生:藤本 圭先生Photoshopで学ぶ、一生使える色調補正 先生:藤本 圭先生
Photoshopで学ぶ、一生使える色調補正 先生:藤本 圭先生
 
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
分かりやすく、使いやすいデザインを生み出す工夫 先生:池田 拓司
 
Webデザインのセオリーを学ぼう
Webデザインのセオリーを学ぼうWebデザインのセオリーを学ぼう
Webデザインのセオリーを学ぼう
 
The Dementia Project: Innovation Driven by Social Challenges - As a example ...
The Dementia Project:  Innovation Driven by Social Challenges - As a example ...The Dementia Project:  Innovation Driven by Social Challenges - As a example ...
The Dementia Project: Innovation Driven by Social Challenges - As a example ...
 

Similar to 絵描きさんあるあるPhotoshop技 DIST3

プログラマがデザインをがんばってみた
プログラマがデザインをがんばってみたプログラマがデザインをがんばってみた
プログラマがデザインをがんばってみた
だいすけ ふるかわ
 
20140613 tanakaseigo dist3
20140613 tanakaseigo dist320140613 tanakaseigo dist3
20140613 tanakaseigo dist3
Seigo Tanaka
 
ABC2013 Spring デザインナーとエンジニアの連携プレイのコツ
ABC2013 Spring デザインナーとエンジニアの連携プレイのコツABC2013 Spring デザインナーとエンジニアの連携プレイのコツ
ABC2013 Spring デザインナーとエンジニアの連携プレイのコツ
Mori Keita
 

Similar to 絵描きさんあるあるPhotoshop技 DIST3 (19)

デザインはおまかせで、丸投げされた時どうする?
デザインはおまかせで、丸投げされた時どうする?デザインはおまかせで、丸投げされた時どうする?
デザインはおまかせで、丸投げされた時どうする?
 
WEBデザイナーのための、印刷用画像作成(入門) 先生:村上 良日
WEBデザイナーのための、印刷用画像作成(入門) 先生:村上 良日WEBデザイナーのための、印刷用画像作成(入門) 先生:村上 良日
WEBデザイナーのための、印刷用画像作成(入門) 先生:村上 良日
 
デザイン系の学校に通っていない学生のためのポートフォリオことはじめ
デザイン系の学校に通っていない学生のためのポートフォリオことはじめデザイン系の学校に通っていない学生のためのポートフォリオことはじめ
デザイン系の学校に通っていない学生のためのポートフォリオことはじめ
 
プログラマがデザインをがんばってみた
プログラマがデザインをがんばってみたプログラマがデザインをがんばってみた
プログラマがデザインをがんばってみた
 
20140613 tanakaseigo dist3
20140613 tanakaseigo dist320140613 tanakaseigo dist3
20140613 tanakaseigo dist3
 
デザイナーさんでもできる Browsersync からはじめる作業効率化・春
デザイナーさんでもできる Browsersync からはじめる作業効率化・春デザイナーさんでもできる Browsersync からはじめる作業効率化・春
デザイナーさんでもできる Browsersync からはじめる作業効率化・春
 
Fukuoka.php 第一回勉強会 LTスライド
Fukuoka.php 第一回勉強会 LTスライドFukuoka.php 第一回勉強会 LTスライド
Fukuoka.php 第一回勉強会 LTスライド
 
Pythonと出会ったデザイナーの話 #PyLadiesTokyo
Pythonと出会ったデザイナーの話 #PyLadiesTokyoPythonと出会ったデザイナーの話 #PyLadiesTokyo
Pythonと出会ったデザイナーの話 #PyLadiesTokyo
 
Sketch速習会@Wantedly
Sketch速習会@WantedlySketch速習会@Wantedly
Sketch速習会@Wantedly
 
Trunkerから学ぶsketchの使い方
Trunkerから学ぶsketchの使い方Trunkerから学ぶsketchの使い方
Trunkerから学ぶsketchの使い方
 
こわくないPython
こわくないPythonこわくないPython
こわくないPython
 
坂本典子一人プレゼン 3.18大阪大会
坂本典子一人プレゼン 3.18大阪大会坂本典子一人プレゼン 3.18大阪大会
坂本典子一人プレゼン 3.18大阪大会
 
PHPとか よくわかんない系WEBデザイナーでもShifterでいろいろできたよ!というお話。
PHPとか よくわかんない系WEBデザイナーでもShifterでいろいろできたよ!というお話。PHPとか よくわかんない系WEBデザイナーでもShifterでいろいろできたよ!というお話。
PHPとか よくわかんない系WEBデザイナーでもShifterでいろいろできたよ!というお話。
 
10/12 WordBench神戸 WordPressの学習方法
10/12 WordBench神戸 WordPressの学習方法10/12 WordBench神戸 WordPressの学習方法
10/12 WordBench神戸 WordPressの学習方法
 
ABC2013 Spring デザインナーとエンジニアの連携プレイのコツ
ABC2013 Spring デザインナーとエンジニアの連携プレイのコツABC2013 Spring デザインナーとエンジニアの連携プレイのコツ
ABC2013 Spring デザインナーとエンジニアの連携プレイのコツ
 
デザインツール戦争とMaterial Theme Editor
デザインツール戦争とMaterial Theme Editorデザインツール戦争とMaterial Theme Editor
デザインツール戦争とMaterial Theme Editor
 
作品は誰かに見てもらった方が良い!
作品は誰かに見てもらった方が良い!作品は誰かに見てもらった方が良い!
作品は誰かに見てもらった方が良い!
 
OrenoHP
OrenoHPOrenoHP
OrenoHP
 
組み合わせ利用でいいとこ取り! Adobe XD+Photoshop+Illustratorの長所を活かしたデザイン手法を学ぼう
組み合わせ利用でいいとこ取り! Adobe XD+Photoshop+Illustratorの長所を活かしたデザイン手法を学ぼう組み合わせ利用でいいとこ取り! Adobe XD+Photoshop+Illustratorの長所を活かしたデザイン手法を学ぼう
組み合わせ利用でいいとこ取り! Adobe XD+Photoshop+Illustratorの長所を活かしたデザイン手法を学ぼう
 

More from Yumi uniq Ishizaki

アイディア発想法とかモノ作りを初める前にやること
アイディア発想法とかモノ作りを初める前にやることアイディア発想法とかモノ作りを初める前にやること
アイディア発想法とかモノ作りを初める前にやること
Yumi uniq Ishizaki
 

More from Yumi uniq Ishizaki (8)

スクラムする前に知って欲しいアジャイルさんっぽいこと
スクラムする前に知って欲しいアジャイルさんっぽいことスクラムする前に知って欲しいアジャイルさんっぽいこと
スクラムする前に知って欲しいアジャイルさんっぽいこと
 
デザイナーにGitは必要?
デザイナーにGitは必要?デザイナーにGitは必要?
デザイナーにGitは必要?
 
connpass design at BPStudy #88
connpass design at BPStudy #88connpass design at BPStudy #88
connpass design at BPStudy #88
 
Oocssとかついでにsmacssとbemの話も
Oocssとかついでにsmacssとbemの話もOocssとかついでにsmacssとbemの話も
Oocssとかついでにsmacssとbemの話も
 
とっさのデザイン〜ボタン編〜
とっさのデザイン〜ボタン編〜とっさのデザイン〜ボタン編〜
とっさのデザイン〜ボタン編〜
 
アイディア発想法とかモノ作りを初める前にやること
アイディア発想法とかモノ作りを初める前にやることアイディア発想法とかモノ作りを初める前にやること
アイディア発想法とかモノ作りを初める前にやること
 
とある色の決め方
とある色の決め方とある色の決め方
とある色の決め方
 
Semantic html が止まらない
Semantic html が止まらないSemantic html が止まらない
Semantic html が止まらない
 

絵描きさんあるあるPhotoshop技 DIST3