コーディングをするためにはデザインカンプといわれる設計図がないと、仕事をもらい始め頃に苦労してしまうそうです。
そこでPhotoshopの使い方を調べていたのですが、どれもコーディングとの関連性がないものばかりで困っていました。
そこでudemyという学習サイトを発見！そのことについて紹介します！
近頃ライターに関しての仕事を減らして、コーディングの勉強に明け暮れています。
ここでいうコーディングとは、HTMLとCSSに関する内容になるので注意してくださいね。
以前僕はこれらのコードは、プログラミング言語だと思っていました。
ところが詳しい先輩方から、Twitterでプログラミング言語ではないという指摘をしてもらったんです。
HTML/CSSはマークアップ言語ですよ
— Ueda@転職活動用 (@ueda_job) April 9, 2019
どうやらこのこれらのコードは、マークアップ言語といわれており、webデザインの一種だというのも最近になって気付きました。
webデザインって何？という人は、また後日記事にする予定なので、それを一緒に参考にしてみてください！
かなりザックリ説明すると、webデザインというのはどうやら設計図を作る人のことであり、僕はその勉強ができていませんでした。
そしてそれにはPhotoshopといわれるツールが必要になってきます。
ちなみにHTMLとCSSも必須のスキルになりますが、それはprogateで学ぶのがおすすめですよ！
Photoshopって写真を加工するやつでしょ？コーディングと何が関係あるの？
コーディングの依頼をもらうにはPhotoshopデータが必要だけど…
コードを書くのとPhotoshopと、特に関係がなさそうなイメージでしょうが、じつはコーディングはPhotoshopで仕事のやり取りをする場合があるそうです。
仕事をもらうためのサイトである、クラウドワークスやランサーズのサイトを見てみると、Photoshopファイルである「psd」と書かれていました。
つまりサイトを作るために仕事をもらうためには、Photoshopをある程度使えないと、困ってしまうわけじゃ。
これをここ最近になって気付いたので、僕はPhotoshopの使い方について調べていました。
ちなみに僕はライターでもあるので、クラウドソーシングサイト経由で仕事をもらっています。
Photoshopはノーマークだったから、全くの素人だったんだよな…。
Photoshopは多機能すぎて使い方がわからなかった…
Photoshopというのは多機能で、写真を合成するのはもちろん、きれいに加工して見やすくする機能もあります。
それをするものという偏見がありましたが、画像を切り出す作業もできるようで、これも仕事をもらう時に必要みたいでした。
【プログラマー向け最低限のデザイン技術①】
💡photoshopで背景の切り取り
商品画像を渡されて商品だけの画像に加工することがよくあります
1.画像を配置
2.自動選択ツール選択後、画像の背景選択
3.選択範囲を反転
4.上部メニューからレイヤーを出し、レイヤーマスクをクリック pic.twitter.com/5PYeyCATBS— ふる (@guutenx) August 23, 2018
現役でweb制作の仕事をしている「ふるさん」という方が、Photoshopについてツイートをしていたのを発見！
これを見てPhotoshopをすぐに購入しました。
ところが使い方が全然わからず、いろいろ検索していたのですが、詳しく書いている記事が見つからずに困っていたらUdemyというサービスを発見したんですよ。
フォトショの使い方とか、イラレの使い方とかをすごくわかりやすく動画で説明してくれるUdemyっていう学習サイトやばい！
今まで合成とか補正とか、時間かけてやっていたことが、こんなに簡単にきれいに編集できるの知った💦
そりゃプロが誰でも使っているわけだ✨https://t.co/dVEpdC1guh
— メガネ🤥const＝ネットビジネス挑戦フリーランス (@sekibiyou1984) April 16, 2019
Photoshopの使い方がわからない人はUdemyがおすすめ
Udemyって何？と思う人が多いでしょう。
じつはこのサービスはすべて動画にまとめてくれていて、動画単位に課金すれば、それを見ながら学べるという画期的なサービスでした。
最初は動画で勉強するのは、限度があるかと思っていたが、意外にクオリティが高くて勉強になったの！
ちなみにプログラミング学習サイトの中でも、ドットインストールも動画を使って教えてくれますが、Photoshopについては言及していませんでした。
プログラミング専用のサイトみたいですね。
じつはプログラミングスクールに行こうか、迷ってしまうほど悩んでいました。
でもこれ見ただけで、なんとなく操作性がわかったのでラッキーだったな！
有料の動画学習サービス！幅広いジャンルが用意されている！
プログラミング専用のサービスと思う人が多いでしょうが、じつはUdemyはどんな人でも動画を学習を投稿できるサービスです。
そのためたくさんのジャンルがそろっており、その中にPhotoshopがありました。
もともとアメリカのサービスというのもあり、英語のものが多くありますが、日本語のサービスも充実しています。
【プログラマ志望の方にお勧めな勉強サイト】
▼日本語
●Progate → HTMLやCSSはココ！いまはアプリもあるらしい！●Udemy → 豊富な言語あり！
●Aidemy → 人工知能、ブロックチェーンはココ！
▼英語
●Udacity → 無料！全ての言語あり！自動翻訳ありなので、英語苦手でもOK！— すずかや🔰デザインエンジニア (@suzukaya_jp) October 7, 2018
そんなサービスがあるくらいですから、プログラミング系の教材も多く、僕個人としてうれしいですね。
それもこれもたくさんの人が動画を投稿してくれているから。
星マークでレビューを確認できるため、安心して教材が買えました。
動画によってはクオリティが低いものがあるみたいですが、レビューを見て購入したら、損はしませんよ。
Udemyって安いからなんか怪しい…そんなことありません！
無料ほど怖いものはない…なんてよく耳にしますが、Udemyは無料のお試しの動画もありますが、ほとんどが有料になっています。
しかもその料金は、僕が購入したタイミングではお得になっていました。
ちなみに僕が購入したのは、以下のものになります。
- 未経験からプロのWebデザイナーになる！ 400レッスン以上の完全マスターコース
422レクチャー：￥6,000- WebデザインのためのPhotoshop実践講座
100レクチャー：￥1,200- 【Webバナー編】知識ゼロから即戦力になるためのillustratorCC実践コース
46レクチャー：￥1,400
ここまで購入しても10,000円出しても、おつりが返ってくるほどのお得な料金になっています。
ところが本来はこのレッスン内容なら、30,000円以上もかかっていたんですよね。
それなのに10,000円以下で購入できたのは、Udemyがキャンペーンをしていて、sale価格で購入できたからでした。
ただそれだけでPhotoshopの講座をお得に購入できてしまったんです。
- キャンペーンはいつ終わるかわからないから要注意！
Photoshopの動画も豊富！webデザインについても勉強可能
とくに僕としてはPhotoshopに関しての動画がたくさんあって、かなり個人的に助かった…。
その中でもwebデザインに特化した動画があり、それを見てデザインを作りだすことができたんですよ！
Photoshopでサイトデザインを作れるようになった✨かなり時間かかったけど、細かいテクニックまで教えてくれたから、やっぱUdemy使ってよかった😻 pic.twitter.com/SdN4BL8ujo
— メガネ🤥const＝ネットビジネス挑戦フリーランス (@sekibiyou1984) April 18, 2019
Photoshopでデザインを作りだしたら、それを見ながらコーディングするだけ！
自分でサイトを作った場合は、かなり気持ち的にも楽になります。
もちろんサイトを模写する場合でも、多機能なPhotoshopを使いこなすと、画像を切り出してサイトに使えてしまうんです。
完璧に模写ができるので、Photoshopはそれくらい重要なツールといわれています。
しかも画像編集に強いから、サイト内で使えるバナーとかも作れてしまうんだな！
さらにバナーやロゴといったものもオリジナルで作れるようになれるのも魅力のひとつ。
これらをすべてUdemyで作り方を動画で紹介してくれているので、今回記事にしておすすめしたわけです。
全然Photoshopが使えなかった僕でも、ここ1週間以内で使えるようになりました。
気になる人はUdemyで教材を購入してみてくださいね。
Udemyを使うメリットはスクールよりもお得なところ！
巷ではプログラミングスクールをおすすめしている人が多く、僕もwebデザインについて知りたかったので、少し迷っていました。
ところが今ではPhotoshopを使えるようになったので、スクールを使わず、サイトを模写して勉強している最中です。
もともと模写するのがいいというのはコーディングをする上で重要だといわれていましたが、同じようにコーディングするのは、かなり勉強になってサイト作成が速くなれた気がします。
UdemyでPhotoshopを使えるようになったのが大きいので、サイトを模写しようと思っている人は、Photoshopを先に手に入れてみてください。
どうにも気が早い。まあ何て言うか今日は画像いじる気分だってことで…🤔 PhotoshopよりもIllustratorのが好きです。でもCADが一番楽です…🖱 pic.twitter.com/gVarTzevr5
— ta_ozawa (@takozawa99) April 19, 2019
これだけでもかなりコーディングが上達すると思いますよ！
ちなみに同じabobe社のillustratorというソフトも、Udemyで使い方が紹介されていました。
これも一緒に覚えてみようと思っていますが、コーディングができてからかな？と後回しにしています。
ソフトを持っているだけでは意味ないので、使い方が紹介されているUdemyで1度勉強してみてくださいね！失敗しても最低でだと1200円くらいなので安心ですよ！
