オンラインでプログラミングのレッスンが受けられるコードキャンプでは、現在7種類の講義を扱っています。&CSS、さらにはJavaScriptまで学習できる「デザインマスターコース」を受講することにしました。私が受けているコースは「デザインマスターコース」です。HTML/CSSなどWebデザインを行う上では欠かせないコーディングの知識に加えて、PhotoshopやIllustratorの使い方までマスターできる内容です。引用:CodeCamp(コードキャンプ)受講回数は2ヶ月(20回)、4ヶ月(40回)、6ヶ月(60回)の3つから選べます(今回は2ヶ月間受講します)。適用されるため、最大6万円のキャッシュバックが受けられる可能性もあり、非常にお得です!!引用:CodeCamp(コードキャンプ)それでは、2018年10月6日に受講した、Codecamp(コードキャンプ)「デザインマスターコース」第3回目の学習内容をレビューします。始めてから20年以上。ウェブデザインの初級・中級科の職業訓練指導員を主に行いながら、商工会のパソコン教室・各セミナーなどを多数担当してまいりました。本業は、マーケティングやSEO対策なども含めたWebディレクター兼Webデザイナーです。JavaScript/jQuery/PHPプログラムを使った。トータルでのサイト作成を行なっています。制作実績は主にクライアント様のご要望の多いWordpressでの構築を合わせて大小50サイト以上の実績があります。プラグインやテーマも自作で作ります。引用:CodeCamp(コードキャンプ)第3回目のレッスンで学んだことは以下の内容です。画像の延長方法1.課題(画像合成)のチェック今回は、事前に第9章課題(画像合成)の課題を作成していたので、それについての質問をしていきます。以下が第9章の課題です。第9章の課題これに対して、僕が作成した画像がこちらです。完成サンプルとは微妙に違いがありますが、いい感じにできたのではと個人的に思ってます。中村淑子先生すごい!上手にできてますね。課題の画像では写真にテープを張っているのですが、このテープって簡単に作れますか?中村淑子先生このテープはおそらくIllustratorで作っていますね。テープの端のギザギザの部分はIllustratorだと簡単に再現できるのですが、Photoshopだけでキレイに表現するのは少し難しいです。方法としてはシェイプで長方形の形を作って、「フィルター」からノイズやぼかしで調整するとそれっぽいのができるかと思います。永尾圭そうなんですね!あまり使わなそうなので、そこは今回はスキップします。先生から見て僕の課題で何か気になる点はありますか?中村淑子先生そうですね、猫に影の部分をつけると良いかと思います。課題の画像にも影が入ってますよね。影を入れることはよくあるので、簡単にできますので覚えておくといいですよ。それでは物体に影を入れる方法を順番に説明しますね。猫の下に灰色で形を作ります。投げ縄ツールか、シェイプの楕円を使うと良いでしょう。次に「フィルター」→「ぼかし(ガウス)」を選択してあげると、半径の値を調整できるので数字を変化させます。影のぼかしを調整している中村淑子先生これで影っぽくなりました。後は影の形や色を調整して、影の完成度を高めていきます。永尾圭すごい、本当に影ができました。自然な影を作ろうとすると難しいですね。後で何回か練習します。つ僕から質問させてください。永尾圭このように画像の右端が空いている場合に、Photoshopでは画像を右側に延長できると聞いたのですが、どうすればできるかわかりません。中村淑子先生それは「編集」→「塗りつぶし」→「コンテンツに応じる」を選択すれば可能ですが、もしかすると違和感のが出てしまうかもしれませんね。役に立つ機能なのでやってみましょう。空いているスペースを選択します。今回だと長方形が最適です。「編集」→「塗りつぶし」→「コンテンツに応じる」を選択してOKを押します。今あるコンテンツが選択した範囲に延長されます。中村淑子先生キレイに空が延長されましたね。今回くらいの大きさのスペースだとキレイに延長されましたが、半分ほどスペースが空いていると、違和感が出てくることが多いんです。今回は「空」のような均一な素材だったのでうまく画像が延長できたようです。逆に画面下の木や花の部分は少し違和感のある仕上がりになってますね。確かに画像右下に紫の部分がめちゃくちゃ増えてます。空は違和感なく広がってますね。デザインマスターコース3日目の成果と課題|CodeCamp(コードキャンプ)第3回を受講して学んだことと、次回に向けた課題について整理します。次回課題はPhotoshopの最終課題です。コンセプトシートに沿って以下のようなWEBサイトをデザインしていきます。完成までに時間がかかりそうなので、次回のクラスはPhotoshopではなくJavaScriptを受講し、最終課題が完成したら、再度Phoshopのレッスンを受講する予定です。デザインマスターコース3日目の感想|CodeCamp(コードキャンプ)今回は3回目のレッスンでした。Photoshopの教科書はサクサク進めるられ、私の場合は次回のクラスと合わせると4回で終了できるようです。レッスンを受けるだけでは、Photoshopの技術が向上している気がしないので、自分でどんどんいろんな画像を加工して練習したいと思います。「猫に影をつける方法」や「女性の肌をキレイに見せる方法」など、より実践的な方法を用途に合わせて覚えて行く必要があるなと感じました。書籍やネットで調べて随時テクニックを身につけていきたいです。CodeCampの無料体験を申し込むCodeCampの評価を見るCodeCamp(コードキャンプ)の「デザインマスターコース」とはCodeCamp(コードキャンプ)の「デザインマスターコース」は、Webデザイナーになるために必要な知識を基礎から実践まで学べるコースです。無料で相談する編集部がプログラミングスクール選びのアドバイスをさせていただきます。「スクールがたくさんあり過ぎてどれを選べば良いのか分からない」「どの言語を勉強すれば良い?」「転職に有利なスクールはどこ?」など、どんな質問でもOKです!気軽にご連絡ください★CodeCamp(コードキャンプ)デザインマスターコースの評判・口コミ・レビューツイートシェアはてブGoogle+PocketfeedlyCodeCamp(コードキャンプ)のデザインマスターコースレビュー・感想|4日目CodeCamp(コードキャンプ)のデザインマスターコースレビュー・感想|2日目RECOMMENDこちらの記事も人気です。