SVG MANIAX Ver.2 - Mars vanilla (SVG勉強会 in こけむさズ : 2014年10月23日 #marsvanilla

SVG MANIAX Ver.2 - Mars vanilla 2014年10月23日に高円寺こけむさズで行なわれたSVG勉強会 ハッシュタグ : #marsvanilla
0
ザ・マーズナレッジ株式会社 @marsknowledge

SMILアニメーションは手軽だが使いドコロがない。しかもIE対応しない。 #marsvanilla

2014-10-23 20:49:35
bg @bitgleams

#marsvanilla アニメーションは大きく分けると3つ - SMILアニメーション - CSSアニメーション - DOMアニメーション

2014-10-23 20:50:45
ザ・マーズナレッジ株式会社 @marsknowledge

CSSアニメーションで動かすのがおすすめ!だがIEは対応せず。。。 #marsvanilla

2014-10-23 20:52:44
ザ・マーズナレッジ株式会社 @marsknowledge

SVG DOMアニメーションはjQuery使えません。SVGは独自の名前空間を持つため #marsvanilla

2014-10-23 20:55:03
ザ・マーズナレッジ株式会社 @marsknowledge

Canvasはビットマップ、SVGはベクターという違い。 #marsvanilla

2014-10-23 20:57:00
bg @bitgleams

めちゃくちゃ動かしたいばあいは、現状圧倒的にCanvas #marsvanilla (´・ω・`)

2014-10-23 20:57:43
bg @bitgleams

SVG は XML なので、アクセシビリティ面は良し。 #marsvanilla

2014-10-23 20:58:47
ヤマギシ♨️🧖‍♂️ @ymgs_bstr

SVGのアニメーションは遅い#marsvanilla

2014-10-23 20:59:05
ザ・マーズナレッジ株式会社 @marsknowledge

SVGの魅力は、イラレなど一枚絵を書き出してすぐに動かしたいパーツだけ動かせる!時計の針など #marsvanilla

2014-10-23 21:00:07
ヤマギシ♨️🧖‍♂️ @ymgs_bstr

魅力はイラレで1枚書き出しした後にパーツだけで動かせる。#marsvanilla

2014-10-23 21:00:12
bg @bitgleams

SVG でのアニメーションは、はっきりいって「低速」。ただ、SVGの魅力は、Illustratorなどで1枚絵を書き出した後、すぐに動かしたいパーツだけ動かせる。 #marsvanilla

2014-10-23 21:00:13
ザ・マーズナレッジ株式会社 @marsknowledge

SVGを作るツール!イラレの注意点は、アートボードがwidth,height,viewboxとなる。なのでピクセルで作りましょう。 #marsvanilla

2014-10-23 21:07:00
ザ・マーズナレッジ株式会社 @marsknowledge

SVGを軽くするネタ、パスを単純化!パスアンカーは減らす。 #marsvanilla

2014-10-23 21:13:00
ザ・マーズナレッジ株式会社 @marsknowledge

イラレ保存時は「svgz」だと軽くなるが、そのあと編集はできなくなるので注意! #marsvanilla

2014-10-23 21:15:35