ヒューマンアカデミーWebデザイン講座1日目~Photoshop基礎講座~

Webデザイン Webデザイン

いよいよお待ちかねついに講座1日目を終えてきました~!楽しかったです!

今回は自分自身の復習を兼ねて、授業の進め方や、授業内容について書いていきたいと思います。

ヒューマンアカデミーのWebデザイン講座を検討している方の参考になったら嬉しいです。

デザインとWebの基礎知識について

まずは基礎の基礎、超初心者用のための基礎知識についてレジュメが配られ、先生の解説がありました。

illustratorとPhotoshopの違い

何れもAdobe社のグラフィックソフトです。グラフィックソフトの業界で覇権を握っており、どこのデザインの現場でも使われているため、使えるようになればとっても潰しのきくスキルになると思われます。工場とか倉庫仕事の人がフォークリフトの免許取っとけばどこの物流現場でも重宝されるみたいな、そういうのありますよね、そんな感じのイメージなんじゃないでしょうか。

Photoshopの特徴と用途

  • ドットでできている(ビットマップ画像)
  • 写真を扱う(合成、補正、修正など)
  • Webの画面デザイン作成

illustratorの特徴と用途

  • 線と面でできている(ベクター画像)
  • 図形を描く
  • デザイン作成なら何でも

解像度の基礎知識

縦横1インチの四角の中に、1ピクセルの四角が何個入ってるか、それが解像度だよ。単位はdpiだよ。1000pixel×1000pixel の画像を印刷しようとしたとき、解像度の設定を72dpiにすれば大きく印刷されるし(画像は粗い) 350dpiにすれば綺麗だけど小さくなるよ。という話でした。むずい。

実践!Photoshopを使った写真の合成(切り抜き+貼り付け)

そして満を持して実践です。

まずは講習後、復習のために 自宅で作ったこの作品をご覧ください。

カラッと晴れた夏の空。こんなロケーションなら青汁だっておいしいに決まってますよね。

これは、授業でやった「気球の写真の背景を砂漠に変更にする」という作業の復習です。授業は先生が少しずつ説明しながら実演し、(大き目のモニターで見せられる)生徒もつづいて作業する、といった流れでした。ここでは、自動選択ツールを使用して青空背景の気球写真のうち気球のみをくり抜き、砂漠の風景写真に張り付けるということをしました。

その技術を応用して出来たのが、この青汁さざ波おじさんです。まだスキルが粗削りなので、おじさんも粗削りでひどいガビガビ状態ですが、記念すべき私の初作品です!

おじさんの背景は真っ白だったので自動選択ツール向きかな~と思いチョイスしたのですが、グラスの白い部分まで削られてしまうのが盲点でした。許容値を狭めて対応しましたが、その結果がこのガビガビです。解決法を見つけて、いつかリベンジしたいと思います。

ついでにもう一つ作成しました。

この作品のすごいところは、まだ授業で習っていない

  • 半透明化で鶏を薄める
  • 鶏を拡大する
  • テキストを入れる

の技を使っているところです。しかもなるべく居酒屋っぽいフォントをわざわざAdobe Fontsから追加しました。また、この画像は「卵かけご飯」の画像が背景となっており、鶏を別の画像から切り取って持ってきたものです。やってみて問題となったのが、「卵かけご飯」に「半透明の鶏」をかぶせてしまうと、卵かけご飯が不鮮明になり、全然おいしそうに見えないのです。これを解決したのが、“元画像から「鮮明なままの卵かけご飯」を切り取り、「背景(卵かけご飯)」の上の「薄い鶏」の上にさらにかぶせる”というアイデアでした。

な・・・何を言っているのかわからねーと思うが

とにかく意欲的に挑戦して工夫してすごいえらいってことです。

ひとつ、欲を言えば、380円のところを白で縁取りしたかったけどやり方がわからなかった。たぶんググったらすぐ出るけど、めんどくさかった。

でもこれで雑コラを作れるようになりました。すごい。嬉しい。

実践!Photoshopを使った色調補正

先生おすすめ「レベル補正」「色相・彩度」「カラーバランス」でお花の画像の色調補正をしました!コントラストと彩度をちょっと上げるといい感じになることが多いそうです。

実践! Photoshopを使った写真の傷の修正(コピースタンプツール)

合成写真の次は、デジタルに取り込んだアナログ写真の傷をコピースタンプツールで修正する作業を習いました。すごい。たのしい。すごい機能だ。すごい。

実践! Photoshopを使った塗り絵(レイヤーを分けて塗る)

レイヤーの考え方を理解する・レイヤーに慣れるために、なんとかレンジャーのポップな線画に色塗りをするという作業をしました。色塗り楽しい!

なんでもレイヤーを分けておけば、後からパーツごとに色や位置の修正ができるのでクライアントの無茶な後出しにもすぐに対応できるのだ!

上書き保存は元に戻らない!クソみたいな最低のコンピューターウイルスの話

授業の間で先生の小話などもあり面白かったです。作成したデータを保存するときに、「保存」は上書き保存だから「別名で保存」してくださいねー。削除したデータは復元できることが多いけど、上書き保存は絶対復元できないから気を付けてくださいね!と注意がありました。昔、感染するとデータがみーんなクソみたいなデータに上書き保存されてしまうウイルスがあったそうな。本来ウイルスって目的があって作られるものなんですが、そのクソみたいなウイルスはただ面白そうだから作られたまったく意味のない代物だったそうで、しかも上書きされてるから復旧もできない。製作者の日本人は世界中のハッカーから「美学がない」などと叩かれたそうです。

こっちからしたら目的があろうがなかろうがウイルスなんて迷惑でしかないけど悪者には悪者の哲学があるんですかね。結局悪いことしてるくせにおもしろいですよね。

最後に

なんとなく、どんな感じで授業が進むのか、伝わったでしょうか?少しでも雰囲気が伝わってれば嬉しいです。

これからも授業の復習を兼ねて、習ったことのポイントをブログに残していきたいと思います。また、制作物も出来たらUPしていく予定ですので、技術が上がっていく過程をお見せ出来たらいいな~と思います。

それでは。

コメント

タイトルとURLをコピーしました