logmi・ログミー

世界をログする書き起こしメディア

思い出の写真をフォトショでリア充加工 初心者向けデザイン講座

思い出の写真をフォトショでリア充加工 初心者向けデザイン講座

デザイン初心者向けに、超基礎から解説する「デザインかじり部」。今回のテーマは「リア充っぽさを演出する写真加工」です。フリーランスのUIデザイナーとして、Webサイトやアプリケーションの企画・デザイン・フロントエンドプログラミングまで行う本末英樹(オロ)氏の解説のもと、Photoshopを使って思い出の写真をオシャレに加工します。

シリーズ
schoo週末学習【かじり部】 > リア充っぽさを演出する写真加工編
2015年9月6日のログ
スピーカー
株式会社スクー 放送ユニットマネージャー・かじり部部長 鈴木顕照 氏
デザインかじり部 コーチ UIデザイナー 本末英樹(オロ) 氏
部員代表 青島莉子 氏

まずはPhotoshopとサンプルの準備を

鈴木顕照氏(以下、鈴木) それでは部活に入る前に、いくつか準備しておきましょうか。 青島莉子氏(以下、青島) はい、必要なものがあります。 鈴木 準備しておかないといけないですからね。 青島 「できた」ボタンの右側ですね。 鈴木 今日必要なもの。どうでしょうか。 青島 はい、下にグーッと行きますと。 鈴木 Photoshop皆さん入ってますか? 今回ソフトを使いますよ。これしっかりインストールをしてください。まだ間に合います。ちょっと時間かかりますけどね。クリックしてインストールしておきましょう。 そしてその下に、Photoshopアクションと書いてありますね。こちらもPhotoshopと合わせて、インストールしておいてください。こちらも使います。ちょっと手順が大変なですけど、なんとか見つけ出してやっていただければと思います。 そしてこちらのサンプルファイルをダウンロードしておきましょう。デスクトップに置いておくと便利です。そしてその下。 青島 はい、その下。 鈴木 「みなさんの夏休みの思い出の写真」これが大事なんですね。 青島 これ大事ですよ。 鈴木 これもしっかりと準備しておいてください。4枚ぐらいあると、3枚でも大丈夫かな。夏休みの思い出の写真、デスクトップに置いてください。今回実習で使います。

今回のコーチ紹介

鈴木 ちょっと駆け足になりましたけれども、コーチをお呼びしたいと思います。 青島 ついにお待ちかねのコーチ! 鈴木 お待ちかねですねー、スクー初登場。どんなコーチがいらっしゃるんでしょうか。楽しみですけれども。さあそれじゃあ皆さんもタイムラインで「オロコーチ」と入力して呼びましょう。それではいきますよ。せーの。 鈴木、青島 オロコーチ! 青島 どんっ! 鈴木 はい! 青島 なんかどっかで見たことがあるような。 本末英樹氏(以下、オロ) いや? 鈴木 全部やりますね(笑)。 青島 どっかで見たことありますよ(笑)。 鈴木 かじり部が大ファンだという(笑)。 img0005 オロ 中島コーチですね。 鈴木 プログラミングのほうでね、中島コーチというね。 青島 そう夜にね、中島先生の。ちょっとデジャヴが……。 オロ りこちゃん、よっ! 青島 よっ! よろしくお願いしまーす。 鈴木 かじり部の全部に参加していただいていたんですね。前回のやつも。 青島 ありがとうございます。 オロ 中島先生、まきのコーチの大ファンで。 青島 そして中島先生もタイムラインにいらっしゃいますよ。 鈴木 あっ、いらっしゃいますか。ほんとだ、中島コーチ! 青島 よろしくお願いしまーす。 オロ 「夏の思い出無いなぁ」って書いてますね。 青島 ちょっと私の仲間じゃないですか(笑)。 オロ 「りこちゃん、仲間です」(笑)。 鈴木 ちょっと気になっていたのが、本番でここの位置でよかったんですか? これの、タグの位置がですね。リハーサルの時に完全に乳首にあってたんでね。 オロ 痛かったー。 鈴木 本番でちょっとね(笑)。「写真撮らない」ってAさん。写真撮らないんですかぁー。 青島 Aさん、私と仲間ですね。 オロ 自撮り撮らないんですか? たぶんこれリア充じゃない人が今回集まってますよね。タイトルが。「リア充っぽさを演出する写真加工編」ていう事は。 鈴木 そうなんですよねー。リア充じゃない人が結構見られるんですよ。大丈夫ですか。リア充じゃ無い人でも? オロ リア充になれます! 鈴木 リア充になれます? 青島 やったー! ちょっと後でバレますけどまだ隠しましょう。 オロ なります! 今日。あなたもリア充になります! 青島 やったー!

3つのテーマを発表

鈴木 ビシッと決まりましたけどもね。じゃあ今回のタイムスケジュールを見ていきましょう。タイムスケジュールードンッ! はい、出た。緑のところ注目してください。3つまであります。忙しいなぁ。 img0006 青島 何か動いてますけど。 鈴木 緑のね。すごい素直じゃないですか。テーマは3つあります。ここね。これで進めていきましょう。間に休憩コーナーがあります、2つありますよ。1つ目はミニコーナーでね、こちら側はなんとプレゼントとか書いてありますよ。 オロ プレゼント何がもらえるのかな。 鈴木 今回課題をこのコーナーの前までに投稿してくれた方には、プレゼントをしようと思っています。今回の課題は、家の中とか、街の中とかで見つけたおしゃれなデザイン、いいものを写真で撮ってデザインかじり部のグループに投稿してください。デザインかじり部のグループをちょっと紹介しましょうか。 青島 はい。この授業詳細のところ押していただいて、下のほうに行きますとここから入れます。 鈴木 できたら入ってみましょう。 青島 はい。ここですね。 鈴木 デザインかじり部の皆さん、おそらく入ってると思いますので、ここで投稿の仕方は? 青島 ここの画像の部分を押していただいて、皆さんの選びたい画像を選んで。 鈴木 チラシとかね。雑誌とか。自分家のおしゃれなコップとかでもいい。 オロ コップはプロダクトデザインだから、ちょっとポスターとかチラシの方がいいかな。 青島 そうですね今回は。 鈴木 おしゃれだなと思ったものの写真を投稿してみてください。プレゼントがもらえます。ということで、さっそく始めていきたいと思います。 オロ ちょっと待って。 鈴木 やる気満々ですね。 青島 頑張りましょう。

1つ目のテーマは「Photoshopのツールの使い方」

鈴木 3つのテーマがございます。1つ目のテーマはこちら! 青島 Photoshopのツールの使い方! 鈴木、オロ オォーーー! 鈴木 なるほど。超基本的なところですけどね。 オロ そうですね。 青島 はじめましての方もたぶん、きっといらっしゃるので。 鈴木 それでは、かじり部のルールとしましては、まずはこのコーチの実演とか説明を、皆さんメモを取りながら聞いてください。 オロ そうですよ。 鈴木 メモを取りながら聞いてください。 青島 私も裏紙をちゃんと用意しました。 オロ エコ! 青島 そう、エコ。もったいないじゃないですか。 オロ りこエコ。 青島 りこエコ、エコりこ! 鈴木 メモを取りながら、しっかり聞いてください。その後に今度はりこちゃんと皆さんが一緒に実習する時間ありますから。まずはメモを取ってください。 オロ まずはゆっくりメモ取ってください。 青島 最初はあせらず。 鈴木 ということでオロコーチよろしくお願いします! 青島 お願いしまーす! オロ はい。今回皆さんは、リア充ぽさを演出する写真加工編っていうことで、よく意味がわからないというタイムラインも、さっき見たんですけど(笑)。確かに、「何するの?」っていうタイトルですけど。よくInstagramとか、Facebookとかで、自撮りとか、友達とかと写真を撮っている写真を見ないですか? なんかスタンプを押したりとか、フレームが割ってあったりとか、ああいうのを見ますよね。こいつリア充だなぁって。 青島 ねぇ、本当に。ちょっと心の中でね。羨ましい。 オロ そういう写真を今回、リア充じゃないあなたも! 青島 おーやったぁ! 鈴木 バシッ! オロ 作れるように今回やってみようと思います。

リア充っぽい写真を作ってみよう

オロ リア充っぽい写真ってどんなのかなぁって、サンプルでもあげてたんですが。ちょっと見てみましょうか。僕の画面見れるかなぁ。 青島 はい、先生の画面で。 オロ リア充、リア充……どこだよリア充? 青島 そして先ほどどなたからか「Photoshopのアクションの入れ方がわかりません」と……。 オロ それは後でやるから大丈夫ですよ。 鈴木 Bさん、後ほどやりますんで、もう少々お待ちください。 青島 よかったでーす。 鈴木 できる方は入れておいていただけるとスムーズかなと思います。 オロ サンプルですね。ちょっとアップしてたのと違うんですけど。こんな写真ですね。これは僕、夏休みは鳥取の水木しげるロードに行ったんですよ。 img0007 鈴木、青島 リア充じゃなーい? オロ リア充じゃないですよ! ただのオッサンですよ。 鈴木 ワハハハハ(笑) 青島 何を言ってるんですか! こんなにかわいい写真。 鈴木 本当にねぇ。 オロ これ、みどちゃん。 鈴木、青島 かわいいーーー! 青島 超リア充じゃないですか。 オロ りこちゃん、リア充ですよね。これは。 青島 ミドちゃん、リア充ですよ! オロ 誰に撮ってもらったんだ、りこちゃん! 青島 気になるよ。私じゃないですよ! これはミドちゃんですよ。 オロ あっ、ミドちゃんだ。 青島 ミドちゃんっていうのは、この後の夜のプログラミング学部で一緒に学ぶ部員代表の方です。 オロ りこちゃんの写真も、こういう写真とかね。これは高円寺の阿波踊りですね。阿波踊りの写真とかをこんなふうに加工してみました。これを皆さんに今から作っていくよっていうことですね。 img0008 青島 へぇーできるんですか。 オロ できちゃうよ。 青島 ミドちゃんみたいなリア充になりたい。 オロ りこちゃんも今日からリア充だからね。 青島 えー! ちょっと早くやりたいですよ(笑)。

サンプルデータを使って実践

オロ みんな行くよー! じゃあ皆さんダウンロードしたデータがありますよね。それを開きましょう。ダウンロードしたデータが……、ちょっとこれみんなと違うのが入ってるんだけど。入ったところに、「flame.psd」っていうのがみんなたぶん入っていると思います。 img0009 これを開きましょう。ダブルクリックでも開けるけど、取ってる? メモを。 青島 はいメモしてます。今はメモの時間ですもんね。 オロ そうだよ、メモの時間だよ。「ファイル」で、「開く」で、まず開きましょうか。サンプルデータを。 img0010 青島 この左側の読み方だとか、上の読み方だとかはどういう? オロ そうです。ちょっとそれも説明しましょうか。サンプルデータどこかな? 「flame.psd」ですね。これを「Enter」でまず開いていきましょうか。 鈴木 皆さん、ダウンロードして、まずサンプルデータの中からね。 オロ まず、Photoshopが今回皆さん初めてだと思うので、簡単な説明をやっていきたいと思います。「Photoshopってそもそも何ぞや?」っていう方はいらっしゃいますかね? 青島 何ぞやっていう方は「何ぞや?」とコメントをください。 鈴木 Photoshopを始めて触るよっていう方は、コメントをちょっとしてみてください。 オロ 初めての方もいらっしゃるかもしれないんですけど、写真加工とかが強いソフトで、アドビシステムズいう会社が作っているアプリケーションですね。昔は結構10万円とか高かったんですけど、今は月に5,000円とか、3,000円とかかな? で買えるんですけど。Photoshopっていうアプリケーションですね。 普段僕もデザインのお仕事をやってるんですけど、ホームページのデザインとか、チラシのデザインとか、写真の加工とかをする時は、Photoshopを使ってますね。

ショートカットキーの解説

オロ じゃあPhotoshopの説明に入りたいと思うんですが。スライドを見てみましょう。皆さんスライドをちょっと見てください。 鈴木 そうですね。 青島 資料のところですね。できたボタンの右。この間にCさんですかね、Dさん、初めてだそうです。 オロ 初めてぇ? 青島 初めての方でもできるんですよね。 オロ できるよ。ちょっとこれはまた後で見ておいてくださいね。まずPhotoshopなんですけど、今回僕はMacintosh、Macですね。Macでやるんですが、たぶんWindowsの方のほうが多いと思います。ちょっとコマンドのキーが違うんですよね。 img0011 例えば「Command」+「Z」で、1個戻る、操作を戻る、あっ唾飛んじゃったね。ごめんね。 青島 気づかなかったです(笑)。 鈴木 怒っていいんだよ。 青島 なんで飛ばしてるんですか! オロ はい……。 鈴木 ドMかい!(笑)。怒られたいんですか? オロ 後で怒って。 青島 怒ってあげる(笑)。 オロ キーボードの話……。 青島 キーボードの違い、教えてください早く! オロ ごめんごめん、りこちゃん。キーボードの操作が違うので、ショートカットとかキーが違うので、見といてください。例えば1個戻るのが、「Command」+「Z」でMacだと戻るんですけど、Windowsの場合は「Control」+「Z」ですね。っていうふうにちょっとMacとWindowsではキーボードが違うので。どうしても。これをちょっと見ながら使ってください。 もう1個。Photoshopの画面の構成ですね。簡単にちょくちょく言葉がでてくるので、さらっとどういった画面でツールがあるかのご説明ですね。まず上がメニューバーといいます。左側がツールバーっていいます。ここにツールみたいなのがいっぱい入ってますね。次に真ん中がカンバスといいます。ここでデザインをしていきます。 img0012 ここはドックと言って、これをクリックするとここにパネルっていうのがあるんですけど、こういうのを開きます。それでここがパネルですね。これが簡単に画面説明でした。じゃあ、さっそくやっていきましょうかね。 鈴木 Eさん「先生のキャラ好き」って。 オロ 好き? ラブ! 鈴木 好きだって。 青島 Fさんから「りこ嬢、やかましい」と。 オロ 俺のりこ嬢を! 鈴木 俺の?(笑) オロ 奥さん来るからやめよう。 鈴木 奥さんいるの。ご覧になられてるんですね。気をつけてくださいね。 オロ ハナコー見てるかー? (室内笑) 鈴木 プライベートで使わないでください(笑)。

好きなフレームを選択!

オロ すいません。なんだっけかな? 開いてましたよね。 鈴木 Photoshopをね。中のは後でね。 オロ 後で開けますからね。 鈴木 今はメモを取ってくださいね。 オロ Photoshopを開いています。ここにレイヤーパネルっていうのがあります。見てみましょう。レイヤーパネルっていうのがあって、フレーム3、フレーム4、フレーム6、イラストスタンプっていうのが入ってますね。「フレームって何だろう?」って思うんですけど、この目のマークをパチパチとつけると、レイヤーって言って上に積み重ねる感じですね。 img0013 いくつかフレームがあるので、自分の好きなフレームを選んでください。フレーム6が結構数がいっぱいあるので、難しいですね。ちょっと難しい。フレーム4はちょっと斜めになっているので、難しいですね。回転とかいっぱいしないと難しいですね。 ちょっと私自信がないなぁっていう人は、この3つの正方形のタイプのやつでもまずはチャレンジして、来週の宿題までに難しいのをチャレンジしてもいいですよ。 鈴木 なるほど。 オロ 僕はこのフレーム3のほうを進めていきますね。

  

logo_square

スクーが提供する「かじり部」は、ちょっとだけデザインやプログラミングに興味のある人が無料で学べるオンライン動画学習サービス。パソコンとインターネットに接続できる環境があれば場所を問わず誰でも“部員”として参加することができます。プログラミングやWEBデザインなどの分野で活躍中の専門家が、難しい専門用語をなるべく使わずに指導を行い、参加者が楽しみながら成功体験を重ねることで、「学び」に対するモチベーションを高めていきます。

・週末学習 かじり部 – schoo(スクー) WEB-campus
https://schoo.jp/kajiribu

×
×
×
この話をシェアしよう!
シェア ツイート はてブ
思い出の写真をフォトショでリア充加工 初心者向けデザイン講座

編集部のオススメ

無料で求人掲載できる!エン・ジャパンの採用支援ツール、engage(エンゲージ) PR

おすすめログ

人気ログランキング

TOPへ戻る