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回目です…

  2. Illustrator

    最近使用したフォントの表示を消す方法

    Illustratorでフォントを選ぶ時、上部に履歴が表示されますよね…

  3. Illustrator

    コマンドXとコマンドF(B)を使ってオリンピックマークを作ってみよう

    来年2020年は東京オリンピックが開催されますね。とても楽しみです。…

  4. Illustrator

    日の出(放射状)を簡単に作る

    チラシやネット上の広告で、こんな感じの物を見る事ありませんか?…

  5. Illustrator

    斜めにカットされたオブジェクト同士の幅を指定する方法

    オブジェクトのセグメントが斜めにカットされている場合、その間隔を数値指…

  6. Illustrator

    フリーハンドで絵を描こう!(鉛筆ツール)

    イラストレーター(Illustrator)の「鉛筆ツール」を使うと、ド…

人気の記事

CodeCamp
  1. Illustrator

    Illustratorで3Dオブジェクトを作ってみよう
  2. Illustrator

    Use Warp Effect in Illustrator
  3. シャープに仕上げる

    Photoshop

    写真にエッジをつけてシャープに仕上げよう
  4. Photoshop

    二つの画像を自然に重ねる
  5. リアルな湯気をつくろう

    Photoshop

    Photoshopでリアルな湯気を作ろう
PAGE TOP