2色塗り・部分塗り~背景をもっと自由に彩れます

色の設定欄をリニューアルし、「部分色」が追加されました。
これにより、背景を2色で彩ったり、一部分だけを塗れるようになりました。
ここでは新しい色の設定欄の使い方や使用例を説明します。

使用例

新しい色の設定欄では、部分色の「形状」を選べます。
「形状」は背景の領域を分ける分割タイプと、幾何学模様的に図形が繰り返される模様タイプの2つがあります。

分割タイプ

分割タイプは、このように2色で塗り分けができます。

色のチェックを外して部分色だけを設定することで、このように背景色を図形で塗れます。

画像との併用も可能です。
このように透過した部分色をセットすることで、画像の上にフィルターのように設置できます。

模様タイプ

模様タイプは、このように2色で塗り分けができます。

色の上に部分色で設定した図形が展開されます。

画像との併用も可能です。
このように透過した部分色をセットすることで、画像に模様のフィルターを設置できます。

使い方(PC編)

新しい色設定欄を表示するまでの流れ(これまでと同じ)

装飾メニュー内の色設定欄が変更されました。それ以外に変更はないため、これまでと同じ流れで設定できます。

1.
見出し・文章・画像などの各ブロックにマウスをあてた際に表示される「装飾」ボタン(内側)を押します。
グループ全体の装飾をする場合は、ブロック群の上部に表示される外側の「装飾」ボタンを押します。

2.
左側のタブで設定欄を切り替えます。
ブロックによっては、背景だけでなく他の部分にも部分色をセットできます。

新しい色設定欄の使い方

「色」「部分色」「模様」「グラデ」「画像」の5箇所を設定します(ブロックの種類や場所により1~5箇所)。
これらは、左側のタブで設定欄の表示を切り替え、またチェックボックスでオン・オフ(有効・無効)を切り替えます。

「色」「部分色」は「オススメ」「基本色」「微調整」の3つのタブで、それぞれ異なった方法で色を設定できます。
「部分色」にのみある「形状」タブで部分色を塗る場所を設定できます。

実践編~使用例を設定してみる

上で紹介した使用例を実際に設定してみます。

実践編その1)画像の上にフィルター

仕上がりがこちらです。

1.
画像タブを押して、画像をアップロードします(画像のチェックボックスが自動でチェックされます)。

2.
部分色のオススメタブを押して「白」を押します。

3.
部分色の微調整タブを押して「透過度」を70%にします。

4.
部分色の形状タブを押して、熨斗(のし)のような形状を選びます。

5.
その他、必要に応じてテキストの「文字サイズ」「左右中央揃え」「日本語字体」を調整します。

実践編その2)2色で模様

仕上がりがこちらです。

1.
色のオススメタブ(または基本色・微調整タブ)を押して色を選びます。

2.
部分色のオススメタブ(または基本色・微調整タブ)を押して2つ目の色を選びます。

3.
形状タブを押して形状を選びます

使い方(スマホ編)

部分色を利用した装飾の雛形をご用意しました。
スマホでは装飾メニューが利用できませんが、部分色を利用した装飾の雛形を選ぶことで手軽にご利用いただけます。

2018/5/18