Sketchの塗りオプションを使う

Sketchで画像を塗りとして指定する では、オブジェクトの塗りに「画像」を指定しましたが、他にも有効なオプションがありますので解説します。

グラデーション

グラデーション

グラデーションは 線型 放射型 円錐型 の3種類から選択することができますが、ほとんどのケースで線型と放射型を使うことになるかと思います。

ノイズ

ノイズ

オブジェクトをノイズで敷き詰めることができます。 以前は独立したオプションでしたが、最新の Sketch では画像オプションに内包されました。
画像オプションをクリックし、下部にあるセレクトボックスから Document Images → Global Images を選択します。

ノイズの選択

ノイズ

Sketchで画像を塗りとして指定する で学んだ方法と全く同じです。ここでは予め Sketch が用意してくれているノイズ画像 Global Images を利用していますが、自分で作成した画像を指定することもできます。

ノイズのサイズ

ノイズ

ノイズの目の粗さをコントロールすることができます。
Tile Image を選択して、サイズを調節してみてください。

ブレンドモード

塗りのオプションではないですが、関係の深いブレンドモードについて紹介します。 写真の上にテキストを乗せる場合、文字の視認性を上げるためのテクニックとしてよく使われます。

ブレンドモード

塗りにグラデーションを設定して写真の上に配置します。 インスペクタパネルの Opacity (Normal) を Opacity (Multiply) に変更します。

ブレンドモード

このように、グラデーションが写真と掛け合わさりました。
背景写真の明度が下がりましたので、白い文字がよりはっきりと見えます。

Multiply 以外のブレンドモードも是非試してみてください。

Udemy Webデザイナー
Webデザイナーのキャリアを未経験からスタートするためのオールインワン講座

レクチャーの数: 236 ⁄ 19.5 時間 ⁄ 初級

ウェブサイトの企画・設計、Sketchを使ったデザイン、HTML ⁄ CSS マークアップ、モバイル最適化など、Webデザインに挑戦したい人が一気通貫して学べる総合学習コース Shunsuke Sawada

¥ 1,400

¥ 24,000

4.3

493件の評価