SVG Loader 공유 사이트, MageCDN

웹 애플리케이션에서 Loader는 UX 향상을 위한 중요한 요소이다. 만약 데이터를 불러오거나 처리하는 동안 사용자에게 제공하는 시각적 피드백이 없다면 사용자는 웹사이트가 멈췄다고 생각하고 떠나버릴 수도 있다.

하지만 나 같은 1인 개발자가 독창적이고 매력적인 Loader를 직접 만드는 것은 쉬운 일이 아니다. 그렇기 때문에 이미 CSS Loader를 공유하는 사이트를 이용해 Loader를 만들고 있었는데, 이번에 SVG Loader를 공유하는 곳을 아게 되어서 소개한다.

MageCDN 사이트는 사실 이미지를 업로드하고 다양한 곳에서 사용할 수 있게 해주는 CDN 사이트이다. 그러나 Resources 탭의 SVG Loader Icons로 들어가면 SVG로 된 애니메이션 로더 모음을 볼 수 있다.

주요 특징은 다음과 같다.

이 중에서 가장 마음에 들었던 부분은 SVG 애니메이션 사용이다. SVG 자체로 애니메이션을 재생하기 때문에 SVG 코드만 덜렁 복사해서 쓰면 된다는 점이 아주 매력적이었다.

사이트에서 원하는 SVG Loader만 받을 수도 있고, GitHub Repo에서 모든 파일을 다 받을 수도 있다.

#SVG로더제작 #웹UX개선팁 #창의적인로딩애니메이션 #프론트엔드개발도구 #사용자경험향상방법 #웹디자인트렌드 #SVG애니메이션생성기 #웹사이트성능최적화 #인터랙티브웹요소 #효과적인로딩화면디자인