Photoshopチュートリアル めくれた感じを表現する

Photoshopを使って影の調節など、ちょっとした工夫で、かなり立体感のある、いい感じのめくれを表現できますね~!

こういった、細かい部分にこだわったデザインって素敵ですね。。

っちゅわけで、Photoshopで写真とかステッカーがめくれた感じを表現するチュートリアルをまとめてみました。。

1. PSTUT



2. photoshop Lab



3. Veerle’s blog



4. Sigsource



5. Whits’ Photoshop Tutorials



めくれを表現するだけでも、いろいろな方法があるのですね。

っちゅうわけで、個人的に気に入った一番目のPSTUTさんのチュートリアルを簡単にご説明

1. セレクトツールで写真の大きさに選択。グラデーションツールを選んで左上から右下にドラッグ。そのとき、背景色は#F7F2E7にしておく。



2. 選択範囲を小さくする。(Altキー + S + M + C)もしくは、下の画像のように、[選択範囲]メニューから選択範囲を小さくします。この小さくする部分が、写真のふちになるのでお好きなピクセルサイズで小さくしてください。とりあえず4pxにしましたが・・・



3. 新しくレイヤーを追加して、縮小した選択範囲を塗りつぶす。



4. お好きな写真を追加して、クリッピングマスクをかけます。すると、3で塗りつぶした部分しか写真が見えなくなるはず。。



5. 写真にグラデーションをかけます。





6. レイヤー全部にロックをかけて、お好きな角度に傾けます。



7. 最初に描いたグラデーションのレイヤーをCtrlボタンを押しながら選択。すると、下のようにグラデーション部分が選択されるはず。



8. パスを追加します。



9. パスを変形します。この部分が最終的に影になります。



10. 変形したパスを選択部分に変換します。



11. 一番下に新規レイヤーを追加して、黒く塗りつぶします。



12. 塗りつぶした部分にぼかしをかけます。



今回はちょっと、難しかったかも?こんな感じでできました??

デザインblogランキング

コメント 10 Comments »   はてなブックマーク   del.icio.us

この記事に関連する記事



10 Responses to “Photoshopチュートリアル めくれた感じを表現する”

  1. tu-san Says:

    ちょっと戸惑いましたがなんとかできました。
    とても素敵ですね。

    ありがとうございます

  2. 管理人 Says:

    tu-sanさん
    コメントいただきましてありがとうございます。これからも、使えるチュートリアル紹介する予定ですので、参考にしてみてくださいね!今後ともよろしくお願いいたします~!

  3. Rasmus Badstue Says:

    Looks cool.. Maybe I’ll try it out. Thx for posting.

  4. 最新ITニュース:SpIT Says:

    Photoshopチュートリアル めくれた感じを表現する

    Photoshopを使って影の調節など、ちょっとした工夫で、かなり立体感のある、いい感じのめくれを表現できますね〜!こういった、細かい部分にこだわ…

  5. 管理人 Says:

    Rasmus Badstueさん
    Thanks for your comment! Your portfolio is also cool! I love a photo of your site header too…

  6. 匿名 Says:

    [5.]のステップで、右下にホワイトのグラデーションを加えるともっと自然。

    そえrと、黒のグラデーションはちょっときつすぎる気が…

  7. 管理人 Says:

    匿名さん
    ご指摘どうもありがとうございます。確かに、その方がずっと自然に見えますね。。

  8. 素晴らしい画像加工のチュートリアルを集めてみました。 - 著作権フリーの素材屋・HP素材のおすそわけ。BLOG Says:

    […] AddClipsType=’3′; AddClipsVerticalAlign=’middle'; AddClipsDefault=’bookmark'; AddClipsMode=’popup'; Photoshopチュートリアル めくれた感じを表現する – DesignWalker via […]

  9. 写真をめくれた感じで表現する | 独学WEBデザイナーの覚書 Says:

    […] こちらとかあちらとかでチュートリアルが紹介されていますが、 […]

  10. links for 2009-11-30 | ウェブル Says:

    […] Photoshopチュートリアル めくれた感じを表現する | DesignWalker (tags: Photoshop チュートリアル) […]

この記事に対するコメントを残す




この記事のトラックバックURL

広告掲載のお問い合わせはこちら

検索

Google

カテゴリーアーカイブ

最近の記事

タグ・クラウド

月別アーカイブ

Agile Media Network パートナーブログ