Home > 1a > | ノート > 1a-13 Adobe Illustrator で作成した素材を Processing で利用する

1a-13 Adobe Illustrator で作成した素材を Processing で利用する

  • Posted by: masa
  • 2009年7月13日 14:40
  • 1a | ノート

Adobe Illustrator で作成した素材を Processing で利用したい人のために、手順を解説する。

  • Adobe Illustrator で素材を作成
  • 書き出し(背景が透過のPNG形式)
  • フォトショップでトリミング、保存

解説に利用した Adobe Illustrator のバージョンは「CS3」なので、バージョンの違いにより用語の違いがある場合がある。

Adobe Photoshop で作成した素材を利用したい場合は、メニューの「ファイル > Webおよびデバイス用に保存」でPNG形式を選択し、保存する。

Adobe Illustrator で素材を作成

幅1280px、高さ800pxで新規ドキュメントを作成する。(作品のサイズがこの大きさなので、素材の大きさを確認するために)

カラーモードは「RGB」、単位は「ピクセル」とする。

0. 新規ドキュメント

自由に素材を描き、名前をつけて保存する。保存形式は「ai形式」とする。

1. イラレで作成

書き出し(背景が透過のPNG形式)

背景が透過のPNG形式の画像を書き出す。

メニューの「ファイル > 書き出し」を選択する。

2. ファイル-書き出し

ファイルに名前をつけ、フォーマットをPNGにして、任意の場所(例えばデスクトップ)に書き出しする。

3. 書き出し

書き出しオプションで、解像度は「スクリーン」、背景は「カラー:透明」を選択する。OK を押すと、背景の透過処理されたPNGファイルが作成される。

4. 書き出しオプション

Adobe Photoshop でトリミング、保存

書き出したままの画像では、背景の余計な部分が多いのでトリミングする。

上の手順で作ったPNG ファイルを、Adobe Photoshop で開く。

5. フォトショで開く

メニューの「イメージ > トリミング」を選択する。

6. イメージ-トリミング

トリミング対象カラーは「透明ピクセル」を選択、「トリミングする部分」は全部にチェックを入れる。

7. トリミングオプション

トリミングされた画像を確認し、保存する。

i8. トリミング-完成

Home > 1a > | ノート > 1a-13 Adobe Illustrator で作成した素材を Processing で利用する

Search
Feeds
Textbook
  • Built with Processing [改訂版]
Recommends
  • Processing – A Programming Handbook for Visual Designers and Artists
  • Learning Processing: A Beginner's Guide to Programming Images, Animation, and Interaction (Morgan Kaufmann Series in Computer Graphics)
  • Arduinoをはじめよう
  • ビジュアライジング・データ ―Processingによる情報視覚化手法
  • +GAINER―PHYSICAL COMPUTING WITH GAINER

Return to page top