Abobe PhotoshopCS3を用いて制作した簡単なグラフィックから見つけられる、フォトショップの基本的なルールをご紹介します。かなり適当に思いついた順に紹介してますけどね。
イントロダクション
こんなに簡単に出来てしまって良いものかと思うくらい、今や、誰でもものが作れる時代になってきました。作れる時代にはなったけども、肝心なのはやはり、それを使いこなせるかどうかです。まずそのための一歩は、その道具でどんなことが出来るかを知ることです。
今回は遊び絵なんですけども、フォトショップの基本的なルールを駆使して作っていきましょう。あ、コピー(似せ絵)って、一見難しそう(面倒)に見えるけど、とても簡単なんです。息抜きがてら、作って遊んでみましょう。
神経質なまでにそっくりに似せることが大事ではありません。似せたつもりというのが大事なんです(笑)
完成品

←左がお手本(公式から拝借してきたイラスト)、右→がそれを参考にして描いたものです。
3倍に拡大してあります。そうすると描いたやつがとても大雑把であるということがよく分かります。しかし原寸サイズで二つを比べるとその差が分からなくなってきます。
ルール1 完成サイズを確認すること
解説:ウェブグラフィック素材など、サイズが定められている場合は、初めからそのサイズにして作業した方が楽です。
大きいサイズのまま作業して、いざ縮小すると最初の印象を変わってしまう場合があります。そして何より小さい方が描くのが楽。
ただし場合によってはぴったりにしない方が無難です。ちょっと小さかったとかだと悲惨なことになります。お気持ち大きめで作業して、最後にちょっとだけ縮小がベスト。
ルール2 見本も縮小が欠かせません
解説:作業サイズは100px・75pxなので、もちろんお手本もそのサイズに変更してしまいます。
一緒にしないと、とてもじゃないけど出来ないです。至極面倒です。(出来るという方はそのままでどーぞ)
それでは実際の作業に入ります。
全てそれぞれが一枚ずつのレイヤーからなっています。下の画像は実際の作業サイズです。
今回、だいたいの作業は原寸の4倍に拡大してやってます。(↓のサイズではないのでご注意)
~作業開始

お手本の適当な場所からスポイトで適当に色を拾ってきます。土台レイヤーを一色で塗ってしまいましょう。

地図の端っこを描きます。ブラシツール、エアブラシっぽいのを選択。ブラシサイズはかなり小さめで少しずつ埋めていきます。

長方形選択ツールで長方形を作って、編集→境界線を描く です。基本中の基本ですが本当によく使う重宝な機能です。
そして適度に、フィルタ→ぼかし→ぼかし(ガウス)です。これも基本中の基本ですが、欠かせない機能ですね。
ルール3 万物を作るのはぼかし、何かとぼかし
解説:くっきりとした線を自然に和らげるという効果があります。ぼかしによって見る人に自然な印象を与えることも出来ます。
あ、忘れるところだった・・・・これは一番重要事項かもしれません・・・・。
ルール4 不透明度を制するものは全てを制する
解説:もちろんブラシツール一つで天才的に描画されても構いませんが、絶対こっちの方が楽。(楽というのは誰でも出来るという意味での楽です。)
ブラシの扱いが難しくて思うように進まないと言う人は、ぜひレイヤーの不透明度をいじりましょう。
特に、筆圧関知のないマウスのときは、レイヤーの不透明度操作は欠かせません。
また不透明度を下げることによって土台に馴染ませるという、これもまた欠かせない効果があります。

ブラシツールでギザギザを描きます。ランダムで良いです。

内部の枠を描きます。
ルール5 幾何学なものには幾何学なもので
解説:きっちりとした四角が描きたければ、長方形ツールを使いなさいということです。当たり前ですが、手書きできっちりとした四角を描こうとするなんてのはやめましょう。
そして、これも不透明度を変えて土台に馴染ませます。

お手本から川の色を取り、適当に川を描きます。こういうときはタブレットのが楽です。マウスしかない場合はもちろん根性で描きます。

ルール6 大きく色を変えるときは必ずレイヤー分けをする。
解説:ただし似たようなレイヤーは途中途中結合して、レイヤーを整理しておきます。
川の淵みたいなのを、更にブラシツールで描画していきます。これもまたマウスだけだと根性で描くしかありません・・・。
ルール7 奥深し観察
解説:観察が楽しいという人はきっと、作るのがもっと楽しくなってくると思います。ものつくりの基本は見て感じて表現する、でわないかと・・・。

まずは川の色の違うところを微妙に書きたします。かなり適当です。

ついで橋とか関所とかを書き足します。

白いところは白っぽくと、メリハリをつけます。でないと画面がのっぺりしたままになってしまいます。思い切ってやってみましょう。思い通りにいくまではレイヤーを何枚捨ててもいいのだし。

山のでこぼこみたいなのを描いていきます。そして不透明度を操作して山に馴染ませます。
ルール8 ひたすら見栄えを上げる
解説:こだわりというやつです

前のやつと何が変わったのかよく分かりませんが、そろそろ完成。縮小・拡大して全体をチェックし、見本と見比べてディテールを詰めていきましょう。

↑↓うーん・・・どこが違うんだろう・・・・。
正解は橋と関所の線の太さです。
完成しました。
ちなみに・・・・
このときはタブレットを持ち合わせていなかったのでマウスで作業しましたが、基本的に絵を描くとかじゃなければ普通のマウスでも充分ものは作れます。自分もウェブ素材はマウスのみでやってます。
ちなみに私はロジクールの一番が二番目に安いマウス(光学式)を使ってます。最初は高機能を求めるより、使いやすくて安いのを選んだ方が良いのではないでしょうか?どうしても必要であるなら高機能のやつを・・とか。(貧乏人の考え)
グラフィックの制作作業は以上で終了です。
(今回、特にやり直しをすることもなく、所要時間30分程度で終わりました。)
それでは額縁にはめ込む作業へ移ります。

まず、ここで名前を付けて保存を行います。
ルール9 保存を上手く活用
解説:これももう当たり前ですが・・・しかし「保存するタイミング」というのが分かってくると、とても作業がはかどります。
保存をしたら、レイヤーの右側のとこを押してメニューを開き「画像を統合」
レイヤーが一枚になったら、レイヤーを複製。
元からあったやつのレイヤーを非表示にして、イメージ→色彩補正→レベル補正をします
効果が似てますが、明るさ・コントラストとレベル補正は明確に使い分けるのがベター。
画像の強さを変えたいというときは「レベル補正」で、明るさやコントラストを変えたいと言うときは「明るさ・コントラスト」です。
ルール10 画像補整で見栄えをよくする
解説:よほどすごい人以外は、完成前に画像補整をしましょう。
今回のは額縁にあてはめてみてみないと分かりませんから、鼻から最後に画像補整することを頭に入れて作業してました。最後のツメは、こういった画像補整で出来てしまうことも多いです。
変形方法は、編集→変形→自由な形に です。
自由な形にはこうゆうとき使うんですね・・・・。角度だけではなく、大きさも同時に変えられます。形を歪ませないであれば自由変形ですけどね。
作業サイズより若干縮小されて、なかなか良い感じに仕上がりました。

ちょっと不満な点はあるものの、全体がそれっぽく見えるからいいか・・・。終わりです。
ちなみに・・・・
公式のイラストをそのまま当てはめると、なんかごちゃごちゃしちゃって見栄えがよくありませんでした。かなり縮小&ゆがみを入れてしまうので、細かく描かない方が見栄えが良いようですね。よってアバウトの勝利です。
シムピーブルのオブジェを作るコーナーはまた機会があったらにします。(ここではなくシムのページ方で書くかも)
20080628
OJ