Photoshopで「丸いロゴ」を切り抜くやり方〜ウォーターマークやLINEで!〜

こんにちは。部長ナビです。

早速問い合わせが来ておりますコレ

image

「この、右下の「部長」って何?」

はい、これ「ウォーターマーク」って言うそうです。gori.meさんのサイトで学びました。

ウォーターマークの入れ方やアプリについては別記事で紹介します。今日はとりあえず「丸いロゴを作る」というのに結構苦労したので、それを備忘録で紹介しておきたいと思います

元画像、Photoshopを準備

これが、元画像です。普通の280×280の「ガラケー」で昔撮影したヘルメットの画像です。うーむ、これ、撮り直ししないとダメだな~。このロゴを作ってくれたのはウチのモーグルチームのメンバーの「坊」です。岩手県内にはいますが、今、不明です(笑)。どこにいるんだろう?彼も家族が出来て、忙しいんだよね~

じゃ、いってみっか!

1 Photoshopで「画像を開く」

まず、フォトショップで画像を開いて表示させます。ま、その通りですね

2 丸い点々の「範囲選択ツール」で「楕円」ってヤツを選ぶ

左の方にアイコンがズラーッと並んでいると思うので、上の方にある点々の丸いヤツを選んでください。楕円の範囲指定になるはずです

3 「Shift」押しながら、画像の左上「角」をクリック

これ、ポイント。Shift押しながらだと、「正円」での範囲指定になりますが、私は、ちょうど端から端まで切り取りたいので、その場合は、「画像の左上の隅」をクリックします。これ、内側をクリックするとダメ。左上の隅ね。

ちなみに、当然ですが、「画像の真ん中だけを切り抜きたい」って人は、「切り抜く左上隅」をクリックしてください。左上から右下まで範囲指定して、そこから正円が切り取られる感じです

4 Command+Cでコピー、そのまま、Command+Vで貼り付け

そのまんまです。右の方に「レイヤー」ってのがあると思うんですけど、そこに、丸くくりぬかれたものが「レイヤー2」かな?として出るはずです

5 元画像のレイヤーの左にある「目」のアイコンをクリック

右の方に「レイヤー」のウィンドウがあって、4をやっても、元画像が表示されているのでくりぬかれていません。ここで、元画像(レイヤー0かレイヤー1だと思う)の所に(左)「目」のアイコンありますよね?これをクリックしてください。これで元画像が非表示になります

くりぬかれたものだけ表示されればオーケー!

6 「PNG」で保存!JPGはダメよ!

最後に「別名で保存」を選んで、好きなところに保存しますが、「PNG」で保存してください。JPGだと、背景が透明になりません。GIFでも良いみたいですが、gori.meさんからいただいたアイコンがPNGなので、真似してみました。ここで私躓いて、かなり時間を食いました。JPGは「透明」という色の保存が出来ないみたいです。よくわかりませんが、そういうことだそうです。詳しくはググって詳しい方のサイトを見てくださいね

7 ぼかしを入れると全然違う。オレは5px!

2と3の間で、画面上にある「ぼかし」という欄に数字を入れると、範囲選択した時に、境界線がボケます。では、実際に、ぼかし無しと、ぼかし5pxの違いをお見せしましょう(すかしの具合はアプリによるものですので、境界線のぼかし具合だけ見てください)

image

これがぼかし無し。くっきりハッキリ

image

これがぼかし5px。ほら、全然違うでしょ?フワッとなるよね?私はぼかし入りで行くことにしました!

はい、というわけで、ブログ野郎には必須の「画像を軽くしながらウォーターマーク」ですけど、まず、丸い画像を作らないと始まりませんので、gori.meさんみたいにかっこいいロゴが作れる人は限られてると思いますので、私の作り方を参考に、「普通の写真をぼかして丸くロゴ作ってみる」ってのをぜひやってみてください。

用途に応じて、ぼかしを決めてください。

次は「この一発でウォーターマーク」を入れるという神アプリをgori.meさんの記事と一緒に紹介します!お楽しみに!

スポンサーリンク

この記事をシェアする!

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

この記事の関連カテゴリ

サイト内検索