October 17, 2010

壁紙をフォトショップで作成-7。( 表示位置の起点の調整 )

フォトショップで壁紙を作成する方法-7 です。
(  表示位置の起点の調整  )
- - -

アロ〜ハ!
水着のショップ作成記録の
sea-wind.netです。

ダイブとご無沙汰でした。
さて、フォトショップ壁紙の続き7回目です。
- - -


今回は壁紙の表示位置の起点の調整です。
前回でベースのファイルが出来ましたので、
そろそろ仕上げになってきました。


これまでの単純作業は、
上のバーの「ウインドウ」-「アクション」などを使って
単純化出来る部分も有りましたが、

ココからは
感覚的なクリエーティブ作業に入っていきます。


その為、

今回の表示位置の起点の調整
次回のキャラクターの位置の調整を、
組合わせ繰り返して、
あなたの、イメージ通りの壁紙を完成させて下さい。

重複部分も有りますが、
先ずは、壁紙の表示位置を決めて見ます。

- - -


壁紙をどの位置に、
どの大きさで使うかにもよりますが、

(例:
全体のバックグランド
テーブルのバックグランド
セルのバックグランド ) 他。

いずれにしても、壁紙は通常では、
「 左の上 」が起点になり、
そこから、右に繰り返したり、下に繰り返したりする場合が
ほとんどだと思います。

ここでもベーシックに、
「 左の上 」を起点と考え、
壁紙の表示される位置を調整します。
最適化部分(一番良いと思った場所)を決めます。

- - -


ふり返ると
最初に決めた壁紙サイズは
X : Yが 150 × 150pixでした。
4こ のキャラクター各1このレイヤーなので
4こ のレイヤー。
(+背景いれ5レイヤー)


それを拡大展開し、下と右に各2つづつ並べ
前回は、
X : Yが 300pix : 300pix
16こ のキャラクターの、各1このレイヤーなので
16こ のレイヤーでした。
(+背景もいれ17レイヤー)に、しました。


その中で表示位置にフィットする壁紙を
今回は、抜き出します。


X : Yが 300pix : 300pix の中から、

150 × 150pixの 位置決めです。


- - -


4つのキャラクター画像と背景×4


1)sea-wind.net のロゴ
2)35pixの正円 ( 濃い )
3)45pixの正円 ( 薄い )
4)65pixの正円 ( 中間 )

- - - - -


最初に決めた壁紙サイズは
X : Yが 150 × 150pixでした。
4こ のキャラクターの、4こ のレイヤー。
(+背景もいれ5レイヤー)


それを拡大展開し、
前回は、
X : Yが 300pix : 300pix
16こ のキャラクターの、16こ のレイヤーでした。
(+背景もいれ17レイヤー)にまでしました。

大枠で壁紙になった状態(展開後のイメージ)が、
分かる様になったと思います。

- - -

その中で表示位置にフィットする壁紙を
今回は、抜き出します。

X : Yが 300pix : 300pixの中から、
150 × 150pixの 位置決めです。


極論、150 × 150pixなら、切りぬきの位置は
どこでもOK。

- - -

ka005
(この上の画像では、さらに左側にSEA-WIND.NETの文字を
上下2レイヤー加え、150pix左に移動させてます。
(前回の壁紙6の所の赤枠から出た文字の部分)
その為、文字最後のNETのETの部分だけ見えています。)

- - -

使用用途や、使用位置の大きさにより
位置決めには様々な答えが有ると思いますが、

ここでは、仮に、


1)SEA-WIND.NETの文字が左側で切れない位置を
左の位置に (文字頭を一番左に)


2)上の位置は全て背景色( 上の場合は白 )で
始まる位置


として

切りぬきの
決定位置を決めました。( 赤枠部分 )

- - -

その他、例えば


3)SEA-WIND.NETの文字の
右上最後のTの文字を一番上にしたい場合は、
赤枠を、上にずらし、いい位置を決めます。


これら以外にも、画像により様々な位置の
決め方が有ると思いますので、試してみて下さい。


7・表示位置の起点の調整
( 赤枠の部分が最初作成した画像 )





○●○●○●○●○○●○●○●○●○○●○●○●○●○
○●○●○●○●○


 注、今回の、サンプル図形について。

 : hahaha~ 
グランド色を白で作ってしまったので、
ブログ記事の背景色と同じだ〜! ピンチ !


と言うことで、

一先ず、
ブログの段落を水色の背景にして見えやすいようにしました。
中の「 白い所のみ 」 見て下さい〜!

ゴメンネ !!  (;´▽`A``

!(´Д`;)


また、壁紙の背景の色の調整は、
最後の方で、項目にします。


○●○●○●○●○
○●○●○●○●○○●○●○●○●○○●○●○●○●○


Photoshopの作業は以下 どぅえ〜す。 ↓ ↓ ↓ -Photoshop








今回もフォトショップの作業をレイヤーで振り返ります。


- - -


ka006-ly1) ところが、
しかし、今回は、
起点の位置を調整する
という記事なので、
特にレイヤーは
関係なかったでした〜。

が、

このblog用には
壁紙の範囲指定位置を
解り易いように
赤枠で表示した為、
右の様に150pixの赤枠を
最初の左上のレイヤー時に
作っておきました。

しかし、通常作業では、
ツールボックスの中の
長方形選択ツールで
情報ボックスを見ながら
150pix × 150pixを
範囲指定して、
それを動かしながら
位置決めすればよいので、
特に、右のレイヤーボックスの
上2つのレイヤーは不要です。

↓ ↓ ↓ 

と、いう事で、
範囲指定で
イメージを。

2)良い位置があれば
「選択範囲の保存」。

切りぬくか
又は、選択範囲全てを
「結合部分をコピー」
新規ファイルに
ペーストして
先ずは元図の完成。



- - -

○●○●○●○●○○●○●○●○●○○●○●○●○●○
○●○●○●○●○

今回は表示位置の起点の調整

イメージ通りの
位置を範囲指定。でした。

- - -

  次回は、
もし、気にいる位置が無かった場合や、
若干、キャラクターを移動させたい時などの
「 キャラクターの位置の調整 」 補正かな?かな?

と言う事で、
また、次回で〜す。 



    チャオ! 

*******************************
*******************************

以前、出した
パイナップル
参照:製品やお買い物方法の水着ショップ ご案内ページに
http://www.f-j-r.com/infor.htm
使用中の水着通販サイトの壁紙。

も、パイナップルの缶には、
だいぶ時間をかけましたが、
(当時はPhotoshopの4.0Jだったので、
工程数が多く、結構大変でした。
今なら、もっと簡単だと思いますが・・・)
又、
左下のヤシの木らしきキャラクターは、
結構アバウトで、配置の関係で、入れました。


フォントの文字型に関しては、
元々PCやフォトショップや
イラストレーターに入っているフォントを加工していってもいいし、
市売でも色々なフォントが売られているので
探してみて下さい。

面白い物も結構あります。
でも遊び過ぎのフォント文字は、
既に、それで完成されていて、
買う時は喜んで買うのですが
後から、あまり加工できないので、
結局、使わない事が多かったです。



○●○●○●○●○
○●○●○●○●○○●○●○●○●○○●○●○●○●○

と、言うことで、
今回は 
壁紙の作成方法-6。( 2:元画像の拡大展開 )
でした。

    では、また。




seawindnet at 12:18│Comments(0)TrackBack(0)││photoshop | 壁紙- 配置

トラックバックURL

この記事にコメントする

名前:
URL:
  情報を記憶: 評価: 顔   
 
 
 
Welcome
シーウィンド.ネットに
ようこそ。

海の風 シーウィンド。ネット


bookmark

sea-wind.net は、
HP初心者の
画像 soft フォトショップ
での、web-shop 作成記録で
その作ったショップは、

水着製造通販の
水着 通販 F-J-R.com

と、

水着ビキニ上下別売りで
カスタムオーダーの通販お店
ビキニ 水着 Fashion-Swim.com

2店のショップの制作、
骨折り記録です。