ギザギザのパーツをIllustratorで作る方法をご紹介します。やり方は何種類かあるので自分のやりやすい方法を見つけてくださいね。
セールや特売などのポップやバナーを制作する時に、ひんぱんに使われていたりするお得感をだすデザインパーツでもあるので、覚えておいて損はないと思います。
それでは、簡単にIllustratorで作るいろんな形のギザギザ方法を一緒に見てみましょう！
目次
Illustratorスターツールを使ったギザギザの作り方
長方形ツール内にある星を作るための「スターツール」で、設定を調整するとギザギザ円を作成できます。
スターツールはその名の通り星をつくるツールなので、デフォルトではこのように星になります。
点の数：を［32］に増やすとトゲトゲしくなりました。ギザギザパーツには使いにくい見た目です。
第１半径を増やして、ギザギザ円になりました。
ギザギザ円を赤くして、お得！と表示し、赤くしました。ギザギザが少ないと感じる場合は、点の数［48］ぐらいまで増やすことは平気だと思います。
ただ、このやり方ですとプレビューしながら調整できないので、数値の決め打ちとなってしまいます。
おすすめは次にご案内するフィルター効果を使ったギザギザ作成方法となります。
Illustratorのフィルター効果を使ったギザギザ
円を描いて選択した状態で、ジグザグ効果を適用します。
効果 ＞ パスの変形 ＞ ジグザグ…
大きさ：［3px］折返し：［14］で行っています。しかし、これは円の大きさに比例するので参考数値にはなりません。
元の円を大きくすると、大きさ3pxでもこのようになだらかなギザギザとなってしまいます。しかし、スターツールよりジグザグ効果の方がおすすめな理由は、
プレビューでリアルタイム調整が可能だからです。
スターツールは確かにジグザグを大きくしてもギザギザの具合が変わらないメリットはありますけど、数値の値を毎回打ちながらトゲトゲ具合を見ていかなくてはならない。
リアルタイムプレビューであれば、具合のスライダー調整が楽なのですね。
ジグザグ具合が整えば、アピアランスを分割すれば大きくしても小さくしても、ギザギザは保ったまま変形できます。
楕円形で作る横長ギザギザ
効果で作るジグザグは、均等間隔に三角ができるのできれいに見えるかと思いきや、スターツールやアピアランス分解したギザギザ楕円の方が、お得！を表現する場合だと意外や意外なんだかそれっぽいですよね。
お得感は黄色で表現
お買い得！を表現するには、黄色を使うと効果的です。心理学的にも黄色には思っていたよりも安く見える効果があるようです。
明るい、元気、活発などの色ですから、買いたくなる衝動も喚起される効果が期待できますね。
相当に凝ったデザインの時以外は、SALEによく使われる赤や黄色を使えば、適切な色選択になりますので、迷ったら黄色にしておきましょう。
ギザギザ線をIllustratorで作る
オシャレな区切り線として、ギザギザ線は使いみちがありそうですね。
作り方は、線にジグザグ効果を適用するだけです。
「折り返し」の数値を調整して、山の数を調整して、山の高さを「大きさ」で整えて完成。
波線の作り方
Illustratorなら波線もこのジグザグ効果で簡単に作れます。
ジグザグのポイントにある「滑らかに」を選択すると波線になります。
縦長のものを途中で切って、以下は省略しますよ〜という時に使いますね。
スマホページのカンプをプレゼンで使う時なんかに出番がありそうです。
[応用] ジグザグで旗・ペナントを作ろう
飾り付けの旗、パーティーのような雰囲気をだすためのパーツもジグザグ効果で作れたりします。
適当に曲線を引き、ジグザグ効果を適用します。
あとは、元の曲線を重ねてパスファインダーで分解して、旗の色を選択して塗りつぶし。
曲線の紐の色を整えて、反対側に反転すると旗の飾り付けの完成です！
できれば、この旗にドットやストライプなんかをあしらうと、もっとかわいくなりますね。
ドットに関しては、こちらの記事を参考にしてみてください。
さいごに
Illustratorのギザギザパーツの作り方は、いかがだったでしょうか。
- ギザギザ円でお得マーク
- ギザギザ線で区切り線
- 波線で以下省略の図
- ギザギザ曲線でつらなる旗
素材パーツに頼らなくても、作ろうと思えば案外簡単にできるものばかりでした。
Illustratorなら軽量なファイルサイズなSVGでWebでも使えるので、ギザギザをページ全体に大胆に配置して、ブッ飛び！なデザインもできそうな予感がします。
今回の例を参考に、ギザギザ応用にチャレンジしてみてくださいね。
