webデザイン

photoshopで縁取りを応用し素人っぽさから一歩抜け出すスゴ技を伝授。

photoshopで文字などをデザインする際、レイヤースタイルの境界線を用いて縁取りすることでさまざまな表現が可能になります、しかし単純な縁取りだけではどうも素人っぽさが出てしまいがち

ここでは素人っぽさから一歩抜け出すための効果的な境界線の活用方法をお伝えします。

Photoshop CS6使用グラデーション
所要時間の目安5分グラデーション
画面サイズ570×480:解像度72pixel/inchフリーダウンロード 》

単純な縁取り方法を知りたい方はこちらの関連記事を参考にしてください ⇒ photoshopで文字や図形を縁取りする1番簡単な方法。レイヤースタイルに境界線を適用する&小技

素人っぽさから一歩抜け出す境界線の活用方法

任意のテキストや図形を入力

テキストや図形を入力

テキストレイヤーを複製し、非表示にしておく。【縁取りを応用する場合には複製してから加工することで複雑なデザインが可能になるので日頃からそのように癖付けしておこう。

複製して非表示

複製元のテキストレイヤーにレイヤースタイルの境界線を適用(ここでは2pxで、分かりやすいようにカラーを白にしてます)。

境界線

レイヤーの塗りを0%にして、テキスト部分を消し境界線だけを残す

塗り0%

境界線のみになったテキストレイヤーを右クリックしてレイヤースタイルをラスタライズ

ラスタライズ

ラスタライズしたレイヤーにグラデーションをかける。

グラデーションの調整が苦手な方はこちら ⇒ hemming.grd からダウンロード。(スリームデザイン作成なので自由に使用できます)

グラデーション

つづいて、レイヤースタイルのべベルとエンボス光彩(外側)をニュアンスで適用

べベルとエンボス、光彩

ここで先に複製して非表示にさせていたテキストレイヤーを表示させ左上方向に移動

表示、移動

レイヤースタイルのべベルとエンボスを適用

べベルとエンボス

さらに黄色っぽい色で光彩(外側)を適用

光彩

ロケット部分の図形にもべベルとエンボス、光彩(外側)を適用させ、このように完成しましたがいかがでしたでしょうか?

素人っぽくない縁取り完成

photoshopで縁取りを応用しアレンジしたいろいろ。

今回のようにレイヤーを複製して、それぞれに違うレイヤースタイルを適用したりエフェクトをかけることで単純な縁取りだけでないさまざまな表現が可能になります。

ぜひあなただけのオリジナリティーに溢れた表現に挑戦してみてください

素人っぽくない縁取りアレンジ

スリームデザインの無料メールマガジン

ピックアップ記事

  1. photoshopで仕事をしたい人が身につけておきたい技術や使い方のまとめ。日本…
  2. WordPressの使い方に迷ったらまずこの記事をチェック!すごく参考になる秀逸…
  3. 必読!安易に起業ブームに乗っかる前に…絶対に読んでおきたい【おすすめのビジネス書…
  4. 「特訓Photoshopプロのテクニック教えます!」という本のWEB版を『無料』…
  5. 見ているだけで「Photoshopの実践的な使い方が学べる」日本語解説付き動画の…

関連記事

  1. webデザイン

    「これって写真だったの?」人物写真をphotoshopで手書き風の水彩画ちっくに仕上げるチュートリア…

    ここでは人物写真を、鉛筆画のような加工と絵具の表現の2つの工程を混ぜ合…

  2. フォトショップ

    「Photoshopのカラーピッカーがおかしい、、」いつもと色が違う時の対処法

    Photoshopで色を変更しようと思ってカラーピッカーを開くと、知ら…

  3. webデザイン

    photoshopで普通のノイズを加えるだけじゃ満足できない人にはNoise Texture Gen…

    通常、画像にザラっとしたノイズを加える場合には ↓ のようにフィルター…

Wordpress日本語テーマのまとめ
photoshop日本語チュートリアル

よく読まれている人気の記事

最近の記事

  1. 「特訓Photoshopプロのテクニック教えます!」という本…
  2. 「いつも締め切りに追われてしまう」そんな人がミッションを成し…
  3. Photoshop CCのメニュー文字やツールバーが異常に小…

思考系のおもろい記事

ブログラ
  1. コピーライティング

    「ブロガーがこんなの読んだら反則レベルでしょっ、、」と思うくらい文章力が上がりそ…
  2. キュレーション

    必読!安易に起業ブームに乗っかる前に…絶対に読んでおきたい【おすすめのビジネス書…
  3. SNS

    思わずクリックしてしまう画像でアクセスアップ!2番目に簡単なブログのアイキャッチ…
  4. webデザイン

    「特訓Photoshopプロのテクニック教えます!」という本のWEB版を『無料』…
  5. webデザイン

    photoshopで仕事をしたい人が身につけておきたい技術や使い方のまとめ。日本…
PAGE TOP