https://idea-hack.com/courses/bevel-and-emboss/lessons/__trashed/
https://idea-hack.com/courses/bevel-and-emboss/lessons/__trashed/

Deepen your understanding about “bevel and emboss” of Photoshop

What is “bevel and emboss” in Photoshop?

On the Adobe page, “bevels and emboss” is explained as follows.

Add different combinations of highlights and shadows to your layers.

Adobe

This explanation is very abstract, and I think it’s almost impossible to understand.

Definition of bevel and emboss in Photoshop

For understanding “bevels and emboss,” it’s easier to understand by starting with a look at the definitions of the terms.

Definition of terms
Bevel

Function to make edges such as angle, slope, and slope three-dimensional

Emboss

Function to make the center of the target element three-dimensional with the center as the axis.

Let’s check the difference in the effect when using the “bevel and emboss” and when not using it.

The following image shows the “bevel” added text layer in photoshop.

ベベルを加えた

On the other hand, the following image describes the one with the “emboss” added.

エンボスを加えた

Photoshop’s bevels and emboss (structure)

In Photoshop, the edit panel of [Bevel and Emboss] is prepared for the layer style.

ベベルとエンボスの編集パネル
ベベルとエンボスの編集パネル

[Structure] → [Style]

As you can see by looking at the panel style, you can set one of the following in [Bevel & Emboss], and there are other options besides [Bebel] or [Emboss].

Setting items
Bevel (inside)
ベベル(内側)
ベベル(内側)
Inside the edge of the layer, a [bevel] is created that is pushed up by the face.
ベベル(外側)
ベベル(外側)
Outside the edge of the layer, a [bevel] is created that is pushed up by the face.
エンボス
エンボス
エンボス
You can add the effect that the entire layer floats.
ピローエンボス
ピローエンボス
You can add a stamp effect under the layer.
Draw the border of embossing
エンボスの境界線
レイヤーにレイヤースタイル[境界線]を付けている時、境界線に対してのみエンボスの効果がつける。

[Structure] → [Technique]

Techniques define the effects of contours. This feature is a handy feature when you want to give a soft or hard texture to an element because it dramatically affects the feel of the component.

ベベルとエンボスのテクニックの種類
ベベルとエンボスのテクニックの種類
Setting items
滑らかに

The side surface is smooth and rounded

シゼルハード

The side of the element can be sloped.

シゼルソフト

Adds an effect that leaves rough marks on the sides.

[Structure] → [Depth]

It is an option that corresponds to the “height” of the element made three-dimensional by [Bevel and Emboss]. It corresponds to the value of the so-called 3D object on the Z-axis.

ベベルとエンボスの深さ
ベベルとエンボスの深さ

[Structure] → [Direction]

The direction in which “Bevel and Emboss” is applied. [Top] and [Bottom] are available.

[Structure] → [Size]

This option corresponds to the “width” when [Bevel and Emboss] is applied. It corresponds to the values on the X and Y axes of so-called 3D objects.

ベベルとエンボスのサイズの違い
ベベルとエンボスのサイズの違い

[Structure] → [Soft]

Defines how soft the “width” applied by Bevel and Emboss. The term “blurring” may be more appropriate.

ベベルとエンボスのソフト
ベベルとエンボスのソフト

Bevel and emboss in Photoshop(shadow)

From here, I will explain the effect of the so-called “shadow.”

[Shading] → [Angle] / [Altitude]

It will be easier to understand if you combine [Angle] and [Altitude]. These represent the “position of the sun” (light source).

OptionMeaning
AngleA value that corresponds to the X and Y axes (defined as -180 ° to 180 °)
AltitudeValue corresponding to the Z axis
ベベルとエンボスの[角度]と[高度]

Specify the only angle

If you specify only the angle, no shadow will be applied, and only the highlight will be applied to the element.

ベベルとエンボスの角度
ベベルとエンボスの角度

Specify angle and height

If you also specify a Height, a shadow will be applied. The lower the value, the stronger the effect, and the higher the value, the weaker the effect.

ベベルとエンボスの角度と高さ
ベベルとエンボスの角度と高さ
Definition of terms
包括光源

包括光源は「光源」の設定を編集中のレイヤーではなく、ドキュメント全体の設定値として扱う機能です。太陽は1つしかないので、レイヤーごとに光源が異なることは物理的にはありません。そのため、この項目にチェックを入れることで、自然な形の「光源」を適用できます。

もちろん、何かしらの効果を与える目的でこの包括光源を外して加工をすることもあります。

[陰影] → [光沢輪郭]

[光沢輪郭]は「光(ハイライト)と影(シャドウ)の分布設定」を決める物です。ハイライトとシャドウの割合やかかり方を定義する物で、デフォルトでプリセットが用意されています。

また、オリジナルの分布設定を作ることも可能です。

下記の分布図を確認してみましょう。

ベベルとエンボス 輪郭光沢 線形
ベベルとエンボス 輪郭光沢 線形
ベベルとエンボス 輪郭光沢 円錐
ベベルとエンボス 輪郭光沢 円錐

These figures are graphs showing the distribution of highlights and shadows.

  • Graph vertices are areas where highlights are brightest
  • The bottom of the graph is the darkest shadow area

You may want to make your settings based on the graphs of each preset.

[陰影] → モード・透明度

モードはハイライトとシャドウに対する描画モードの設定です。ハイライト・シャドウと対象要素を元に、色の合成を適用します。

不透明度はハイライト・シャドウの不透明度を表します。

インストラクター