今回の勉強会は、
- GoogleClomeデベロッパーツールの使い方
- Photoshop 描画モードの基本
の2部構成となりました。
【第一部】 GoogleClomeデベロッパーツールの使い方
CSSの表示確認をする際に便利なのがGoogleクロームのデベロッパーツールという要素の検証機能です。
特にレスポンシブやWordPressテーマの編集など
そんな作業を一気に楽にしてくれるのがデベロッパーツールです。
CSSの学習にもとてもおすすめのツールです!
サンプル動画(準備中)
【第二部】 Photoshop 描画モードの基本
わかっているようでわからない!?Photoshopの描画モード
レイヤーの描画モードで合成する時、何度もモードを切り替えて、試行錯誤し、結果、思った通りにビジュアルにならず、あきらめた・・・
なんてことありませんか?
Adobeのサイトや市販の参考書には描画モードの種類と合成結果の一覧しかない場合が多く、これでは、現場でどう使えばよいか、わかりません。
描画モードをマスターするコツは代表的なモードの特徴を知ることです。
どの描画モードを選ぶとどんな結果になるのか?
これが、一気に理解できる合成をパパッとやりながらWeb制作では、どんなシーンで使うのかなどを確認しながらビジュアルを作り上げていきました。
一枚の画像が「乗算・スクリーン・オーバーレイ」でとても魅力的に変わるんです!
サンプル動画(準備中)
参加者の声
- Chromeの開発ツールで左側に画面で右クリックして該当のhtmlやらを見られることを知ることができました。大変便利なTipですね。
- Photoshopは膨大な内容なので基本からもう一度おさらいしようと思います。
- 素朴な人や慣れた人、色んな人の声が聞こえて刺激になりました。
- ディベロッパーツールが便利だということは知っていましたが、どうやってみるかがわからず「眺めて終わり」という感じでした。
記号の意味や具体的な使い方を教えていただいて「そうだったのか!」と思いました。 - photoshopの描画モードについて、自分でも試してみたいと思える、基本的なところから教えていただいたのでうれしかったです。
- 最近は、ブログに掲載する画像もとても重要であることに気づき、必ず何かしらの加工をするようにはしていました。
今日教えていただいたアレンジ方法もとても素敵だったので、早速取り入れていこうと思います。 - ご説明が分かりやすく、理解しやすいです。
- 他サイトのCSSのチェック方法、描画モードの使い方が参考になりました。
動画アップされたら、再度見直して練習したいです。