第26回リクリセミナー「天下分け目のベクター祭り SVGじゃ! Illustratorを持てい!」に参加してきました。

SVG初心者が、これからSVGについて勉強したいと思い、セミナーに参加してきました。
初心者の私でも分かりやすい内容の勉強会でとても参考になりました!
ざっくりとメモ。

■イベント :天下分け目のベクター祭り SVGじゃ! Illustratorを持てい
■主 催  :リクリセミナー
■日 程  :2015年11月28日(土) 14:00~17:30
■出 演  :あわゆきさん、松田直樹さん
■セッション:
「まだピクセルで消耗してるの?(仮)- 始めよう、IllustratorですっきりWebデザイン - 」 / あわゆき
SVG MANIAX in Osaka」 / 松田直樹
「勝ち鬨を上げよ!ベクター侍 大坂評定」 / あわゆき&松田直樹&三階ラボ&窪木博士

≪まだピクセルで消耗しているの?≫

■セッションで勉強になったこと

イラストレーターで作成したデータ(ベクター)は、高解像度のディスプレイに対応できることが可能。
今後、高解像度のディスプレイに対応することになっても、ベクターなら問題なく対応することができる。

・過去に作成したデータより高解像度のデータを求められた場合、
 画像ファイルは作り直し等が必要になるが、ベクターは問題なく過去のデータを使用することができる。

イラストレーターは、数値で図形などが出来ているため、数字が基本のWebに向いている。

ベクターはデジタル以外にも展開でき、効率的なデータの取り回しが可能である。

イラストレーターは、SVGの書きだしに強い

パスファインダーで図形を完全に結合させないために、
 option(Alt)を押しながらパスファインダーの形状モードを行うと完全に結合されず、
 後から編集がしやすい

・ブラシを使うとファイルサイズが大きくなる

・Webグラフィックを作成する時の基本設定

  1. カラーモードはRGB
  2. 適切なフォーマット
  3. ピクセルを整合させる

・ピクセルで整合させる際の設定

  1. 表示→ピクセルプレビューで作業をする
  2. 全ての単位を「ピクセル」に変更
  3. キー入力のピクセル単位は「0.5」に変更
    Point
    0.5pixelの場合、shift押しながらの移動が5cmになる
  4. 変型パネルは常に確認をして、図形等が整数になるように確認
    Point
    小数点が出るとにじんでしまう
  5. 環境設定→一般から下記を設定
    線幅と効果も拡大・縮小にチェックを外す
    プレビュー境界を使用にチェックを外す

 ★注意★
 ・新規ドキュメントのダイアログで表示される「ピクセルに整合させる」にはチェックしない!
 ・定規の原点は絶対に変更をしない!原点を変更すると図形がにじんでしまう恐れがあります。
 ・ガイドは使用せず、オブジェクトで代用
 ・回転やリフレクトを行うと、ズレが生じる恐れがあります!

 ★Point★
 ・ピクセルを整合させておくと、描画がにじまず、ズレない
 ・ファイルサイズが軽くなる


■セッションで難しかったこと

アピアランスで図形の変更を行うと、元データが残っているため、
 編集がしやすいらしい
 アピアランスは、アピアランスパネルを見ながら作業をするらしい


・シンボルを使うとファイルサイズが縮小されるらしい


・スライスで部分的にカットすると、レスポンシブのカンプ作成に役立つらしい