イラレで簡単!版ずれ風文字




みなさんこんにちは!プロクラスの村瀬です。
最近はお昼に外に出ると、日差しが強いと感じるようになってきました。
調子に乗って薄着をすると帰りが肌寒い…!という過ちをたびたび繰り返してしまっております…!

そんな服装のずれを感じつつ、今回はillustratorで作れる簡単な版ずれ風文字をご紹介します!(ずれるのは文字だけにしたい…)テキストの線と塗りが少しずれてて見出しやアクセントにもってこいなデザインです。

テキストを用意する

まずはテキストを用意します。
画像と同じ設定がよければ、文字の設定も参考にしてみてください!

「線」と「塗り」を設定する

テキストの「線」と「塗り」の色はこれからの作業をする上で邪魔になるので、どちらも「なし」を選択しておきます。テキストがいったん消えたように見えますが、この状態で大丈夫です。

次にアピアランスパネルから新たに線と塗りの設定を行います。
上部にあるメニューバーから、ウィンドウ>アピアランスの順にクリックします。

テキストを選択した状態で、アピアランスパネル内の「テキスト」を選択します。
アピアランスパネル下にある□のマーク、「新規線の追加」をクリックすると新たに線と塗りが追加されますので、それぞれお好みの色を設定してみてください。

数値で色を指定したい場合は、色を変えたい線、もしくは塗りのアイコンをクリック>新たに出てきたパネル内のアイコンをダブルクリックします。

カラーピッカーパネルが出るので、赤い枠の部分に数値を入力します。

 

今回使ったカラーはこの2色です!参考にしてみてください。
コピペする場合は頭の「#」は必要ありませんので、英数字のみコピペしてください。

■線(紫色):#6729F2
■塗り(オレンジ):#FFC46C

「塗り」の位置をずらす

テキストを選択した状態で、アピアランスパネルの「塗り」を選択します。

つづいてメニューバーの効果>パスの変形>変形を選択します。

変形効果パネルが出るので、移動の「水平方向」と「垂直方向」に数値を入れます。
プレビューになっていなければ下のチェックボックスにチェックを入れると、プレビューを見ながら位置調整できます。

設定はこんな感じです!
お好みで調整してみてくださいね。

■水平方向:3px
■垂直方向:2px

すると、こんな感じで版ずれ感のある文字の出来上がりです!
文字だけでなく、図形にも使えます!背景に版ずれ風の三角を散らしてみました。

いかがだったでしょうか。
この記事がみなさんのお役に立てたら幸いです!

また次回お会いしましょう~!