移行中の知識
ベクター画像
Vector Graphics
定義
ベクター画像(vector graphics)とは、point、line、curve、shape等を幾何学的な情報として記述する画像表現です。sourceのshape自体は固定pixel gridへ依存しないため拡大縮小に強い一方、screenに表示される時は最終的にdeviceのpixelへrasterizeされます。
関連
対比すると分かりやすい概念
実例
実際の場面で考える
同じ概念を異なる制作文脈へ持ち込み、何を観察して判断するかを見る。
Brand website
SVGロゴを配置する
見るポイント
logoをSVGで扱う時、複数サイズ用のbitmapを作るのではなく同じvector geometryを異なるdisplay sizeへ描画する。
Responsive UI
Icon setを拡大する
見るポイント
pathで定義したiconはsource geometryを保ったままsize変更できるが、stroke幅やsmall sizeでのoptical adjustmentは別途確認する。
注意
誤解しやすい点
- vectorならどんな出力でも自動的に鮮明になると考える。
- 写真のような連続tone画像もvector化すれば必ず軽く高品質になると考える。
- vector formatとvisual styleを同じものとして扱う。
関連
関連する概念
出典