Adobe認定トレーニングセンター

主にAdobeのソフト操作を紹介しています。DTPやWebの業務で役にたったことやツールのポイントなど参考になればと思います。 主観的なものもありますのでご了承ください!

Illustrator

Illustratorでスピログラフを作ってみよう

使用ソフト: Illustrator CC 2018  

Spirographースピログラフ

スピログラフとは、この美しい幾何学模様を描き出す定規の名前を指します。
発明したのはイギリス人発明家のデニス・フィッシャーという人物で、1965年に考案され1966年には商品化されました。その後日本でも商品化され現在でも人気の玩具として定着しています。

スピログラフ

歯車のような定規に沿って模様を描いていく遊び、しませんでしたか?
スピログラフ?と、思った人も、実際に目にしてみると小さい頃に遊んだ記憶のある場合がほとんどなのではないでしょうか。この幾何学模様を延々と描いてくれる不思議な道具に、私も小さな頃にそれは夢中になりました。

眺めていると引き込まれそうになるこの美しい模様は、Illustratorの回転ツールで簡単に、延々と描くことができます。
厳密に言うとスピログラフの持つ全ての要素を引き出すことは複雑で難しいのですが、ある程度の再現は簡単な操作で作り出すことができます。

それでは、童心に帰ってスピログラフを作成してみましょう!

スピログラフの基本の作り方

基準点を指定して作成する方法

①Illustratorを立ち上げ、[ツールパネル]>[楕円形ツール]を使用してドキュメント上に細長い円を作成します。

円

②[ツールパネル]>[回転ツール]を、一度だけクリックします。

オブジェクトの中心に青色の基準点が表示されます。

基準点
↑基準点

十字カーソルを基準としたい場所に合わせクリックし、基準点を移動させます。
*基準点を中心にしたい時は移動せずそのままにしておきます。

基準点

③移動した基準点を中心に、[Option]を押しながらオブジェクトをドラッグし、回転させながら角度を決定します。
(この時、[Option]+[Shift]を押しながら決定することで、45°、90°…の角度に移動させることもできます。今回は45°移動させています。)

回転

④[⌘]+[D]を使用して、必要な回数だけ複製します。

複製

指定した基準点からスピログラフが作成されました。

基準点を指定して作成する方法の方が、中心かもしくはそれ以外にも基準点を指定できオブジェクトを自由に扱いやすくおすすめです。

オブジェクトの中心から作成する方法(回転パネル使用)

①Illustratorを立ち上げ、[ツールパネル]>[楕円形ツール]を使用してドキュメント上に細長い円を作成します。

円

②作成した円を選択した状態で、[ツールパネル]>[回転ツール]をダブルクリックします。

③回転パネルが表示されます。

回転パネル

回転パネルが表示されるのと同時に、オブジェクトの中心に基準点が表示されます。
回転パネルを使用しオブジェクトを回転させる場合は、自動的に基準点がオブジェクトの中心に設定されます。中心以外を選択することはできません。

④角度を30°に設定し、[コピー]をクリックします。

基準点から30°のところに新しいオブジェクトが作成されました。

回転

⑤[⌘]+[D]を使用して、必要な回数だけ複製します。

複製

オブジェクトの中心を基準にスピログラフが作成されました。

さて、ここまでが基本的な操作方法の説明になります。

作成したオブジェクトの形、基準点、角度をそれぞれ変えていくだけで様々なスピログラフを作成することができます。わずかな違いで全く違う表情の思いがけず美しいスピログラフに出会うこともできることでしょう。

次の項で、もう少し複雑なスピログラフを作成してみましょう!

もっと、スピログラフ!

作成場面を動画にしてみました。
スタート時のオブジェクトの形、基準点の位置、角度など参考にしてみてください^^

GIF

以上でスピログラフの作り方の説明を終了します。

スピログラフ

  • このエントリーをはてなブックマークに追加
hulu dTV

関連記事

  1. Illustrator

    インド国旗を作ろう!その③

    今回は外側のドーナツ型をイラストレーター(Illustrator)で作…

  2. クリスタルを埋め込んだ文字を作ろう

    Illustrator

    クリスタルを埋め込んだ文字を作ろう~part1~

    Illustratorでクリスタルを埋め込んだ作ってみましょう!今…

  3. Illustrator

    【画像トレース】Photoshopのカットアウトでは満足できない人へ

    初めてPhotoshopのカットアウト機能を試した時は感動したものです…

  4. Illustrator

    画像にフチをつけてみよう

    簡単に切り抜き画像にフチをつけられる方法の紹介です。まず、Ph…

  5. Illustrator

    ラフの効果で手書き風のイラストを作ってみよう

    イラストレーター の機能を使うと、つるんとした輪郭線がモコモコとした手…

  6. Illustrator

    「鉛筆ツール」で直線を描こう!

    イラストレーター(Illustrator)の「鉛筆ツール」はフリーハン…

人気の記事

CodeCamp

おすすめの参考書

PAGE TOP