Procreate アプリでは、描いたイラストetc.を「透明にする」という機能があります。
この機能によって
・まとまりを表現する
・写真etc.をトレースする
・光を表現する
といった加工が簡単に出来ます。

今回は
【before】塗りつぶし(不透明度100%)
【after】不透明度70〜20%
の画像を見比べながらそれぞれの印象の違いを確認しましょう。


操作はとっても簡単です。
1.ブレンドモードをタップ
2.スライダーをスライドする
この2ステップのみで完成します。

すでに作成済み画像データのレイヤーを確認します。
「iPhone」グループの右向き三角をタップします。

「iPhone」グループ内の各レイヤーが表示されました。

グループ内のレイヤーを確認すると、今回 加工したい「iPhone壁紙」レイヤーがありました。
「iPhone壁紙」レイヤーの「N」と表示されているブレンドモードをタップします。

不透明度のスライドが表示されました。
最初は不透明度が「最大」になっています。
「不透明度が最大」とは、完全に塗りつぶされていて、透明さが全くない状態です。
上記の例では、iPhoneの壁紙が白色で完全に塗りつぶされていて、その下のレイヤー(背景)が全く見えない状態になっています。
スライダーを左右にドラッグして不透明度を調整します。

不透明度「70%」にしてみました。
iPhoneの裏側にある背景の画像がほんのり見えてきました。

不透明度50%です。
背景がかなり見えてきました。

不透明度20%です。
iPhoneの壁紙があるのか?ないのか?わからないくらい、背景が透けて見えています。
今回はここで一旦「完成」とします。

「不透明度20%」で完成させてみました。
後からいくらでも不透明度を変更できるので、まずは適当に不透明度を決定してみました^ ^

上記はらっぽるで販売しているアイフォンアイコン素材の 商品内容リストです。
リストをただ表示したのでは分かりにくいので「不透明度を調整した四角形」でリストを囲ってみました。
リストのまとまりがわかりやすくなりました。
また、不透明な枠を利用したことで背景が透けて見えるので、1枚のイラストとしての統一感も保たれています。
不透明度を利用することによって
・まとまり表現する
・写真etc.をトレースする
・光を表現する
といったさまざまな画像加工が可能です。
ぜひ いろいろな場面で「不透明度機能」を使ってみてください^ ^



iPhoneの壁紙の不透明度を調整したことにより、複数のiPhoneが背景とマッチして全体としての統一感がでました。
