SVG 이미지의 특성

내가 안드로이드 앱 개발에 사용하는 이미지의 주요 파일 형식은 SVG와 PNG입니다.
각각의 파일 특성과 구분에 대해 정리했습니다.

SVG (Scalable Vector Graphics)



SVG 파일, 벡터 이미지.
벡터 이미지(Vector graphics)라고 불리는 화상 형식은, 화상을 점의 집합으로 표현하는 것이 아니라, 복잡한 계산식에 의해 색이나 곡선을 표현.

특성



  • 확대 축소해도 화질이 저하되지 않음
  • Android는 기기에 따라 화면 크기와 해상도가 흐려지기 때문에이 이점이 매우 큽니다

  • 수식이나 문자를 사용한 데이터 파일이므로 엔지니어 측에서 색상과 투명도 변경이 가능
  • 형식이 복잡하지 않으면 파일 크기가 작습니다
  • 애니메이션 가능
  • 투명 가능

  • PNG (Portable Network Graphics)



    PNG는 비트맵 이미지. (「GIF」「JPEG」도 마찬가지.)
    비트맵 화상(Bitmap graphics)은, 화상을 격자 형상으로 세세한 점(픽셀, 화소)으로 분할하고, 각각의 점에 색이나 휘도 등의 정보를 주어 표현하는 방법.

    특성


  • 크기를 조정하면 1 픽셀 크기가 커지므로 이미지가 들쭉날쭉하게 흐려집니다
  • 엔지니어 측에서 색상과 투명도를 변경할 수 없음
  • 벡터 이미지에 비해 파일 크기가 커지는 경향이 있습니다
  • 애니메이션 가능
  • 투명 가능

  • 벡터 이미지와 비트맵 이미지 사용



    이상의 특성을 읽으면 SVG의 압도적 승리로 보인다.
    그러나 SVG에도 단점이 있다.

    그것은, 사진이나 문자 등 복잡하고 섬세한 배색이나 곡선의 화상 묘화에 서투른 일.
    SVG는 복잡한 계산식에 따라 색과 곡선을 표현하므로 사진 등 많은 색을 사용하는 묘사에는 적합하지 않습니다.

    풍경 등 복잡한 이미지를 계산식에 따라 도형으로 취급하려면 방대한 계산이 필요하기 때문입니다.

    실제로, 작은 아이콘 이미지에서도 문자 등 복잡한 곡선 등을 포함하고 있으면, 이미지가 무너져 표현되어 버리기도 했습니다

    이상에서 엉망이지만,
  • 사진이나 복잡한 색 구성표 및 곡선이 필요한 이미지를 만들려면 PNG
  • 아이콘과 같은 복잡하지 않은 이미지를 만들려면 SVG

  • 라고 기억해 두어 구분해 나가면 좋을 것 같습니다.

    다만 앱 개발에 있어서는, 특히 확대 축소해도 화질이 열화되지 않고, 파일 사이즈도 비교적 작아지는 SVG 화상의 특성은 크기 때문에, 복잡한 화상이 아니면, 어느 화면상에서도 명료하게 화상을 표시 가능한 SVG를 비교적 권장합니다.

    좋은 웹페이지 즐겨찾기