LottieFiles

팁과 튜토리얼

팁과 튜토리얼에 관한 기사를 살펴보세요. 튜토리얼, 팁, 가이드, 영감, 최신 업데이트를 다루고 있습니다.

7개 기사

정렬
신선한 상호작용: 인터랙티비티 라이브러리 활용법

신선한 상호작용: 인터랙티비티 라이브러리 활용법

2022년 9월 13일6분 소요

지금까지는 상호작용을 활용한 Lottie 애니메이션의 경우 하나의 상호작용(클릭, 커서 올리기, 탐색, 반복, 토글 등을 할 때 애니메이션 재생)을 활용하는 경우가 대부분이었죠. 따라서 오픈소스 라이브러리인 Lottie 인터랙티비티(Lottie-Interactivity [https://github.com/LottieFiles/lottie-interactivity])를 통해 Lottie 애니메이션과 상호작용하는 방식을 바꾸고 이를 최대한 쉽게 만들고자 합니다. 이번 블로그 글에서는 현재 사용할 수 있는 기능을 소개해 드리겠습니다. 상호작용 연결이란 무엇인가요? 상호작용 연결(Interaction chaining)이란 Lottie [https://lottiefiles.com/interactivity#LI-chaining] 인터랙티비티를 통해 Lottie 애니메이션과 상호작용하는 새로운 방식을 말합니다. 이 새로운 기능을 통해 여러 사용 가능한 상호작용 및 플레이어 관련 이벤트에 따라

Adobe After Effects 없이 어떤 로고에나 애니메이션 효과를 주는 방법

Adobe After Effects 없이 어떤 로고에나 애니메이션 효과를 주는 방법

2022년 9월 13일6분 소요

어떤 로고에나 애니메이션 효과를 줄 수 있는 능력을 가졌다면 어떨까요? 모션 디자이너와 복잡한 소프트웨어 없이 그저 화장실에 다녀올 짧은 시간 안에 회사 로고에 애니메이션 효과를 줄 수 있다고 상상해 보세요. 네, 바로 LottieFlies와 함께라면 가능하죠. 단지 SVG to Lottie 툴을 사용해 Adobe After Effects [https://lottiefiles.com/plugins/after-effects]없이 어떤 로고에든 애니메이션 효과를 줄 방법이 여기에 있습니다. 영상 보기: Adobe After Effects 없이 로고에 애니메이션 효과 주기 아래 비디오 튜토리얼을 시청하거나 아래로 스크롤하여 기록된 안내 사항을 확인해 보세요. 튜토리얼을 따라 연습할 수 있는 연습 파일 [https://www.figma.com/community/file/1083403045231684111/Animate-your-Logo]은 여기에서 다운로드하실 수 있습니다. 1.

마케터를 위한 꿀팁: DIY 모션 소개

마케터를 위한 꿀팁: DIY 모션 소개

2022년 9월 13일8분 소요

디자인은 단지 미학에 관한 것만이 아닙니다. 디자인에서 모션은 인간 중심의 디자인 접근법에서 즐거운 사용자 인터페이스와 시각적인 스토리텔링을 가져다 주는 열쇠이죠. 모션의 요소들이 콘텐츠를 더욱 매력적이고 친근하게 만들어 주어 콘텐츠를 만족스러운 경험으로 탈바꿈해줍니다. 아이콘이나 일러스트레이션, 텍스트와 로고(몇 가지를 들자면)에 모션을 포함하면 네비게이션이 더 원활해지고 사용자의 참여도가 향상되며, 피드백도 전달받을 수 있습니다. 디자인에서 모션은 어떤 효과를 주나요? * 빠른 주의 집중: 인간의 두뇌는 텍스트 데이터보다 시각적인 데이터를 60,000 배 더 빠르게 처리할 수 있습니다. 그리고 시각 데이터에 관한 한 동적인 데이터가 정적인 데이터보다 훨씬 더 효과적이죠. * 복잡한 개념을 단순화: 숫자와 용어가 더이상 지루하게 느껴질 필요가 없어요! 모션 디자인은 정보의 시각화를 용이하게 하기 때문에 정보를 요약적으로 표현하고 사용자가 복잡한 정보를 더 이해하기

앱유져 경험을 한 단계 업그레이드:  애니메이션의 파워

앱유져 경험을 한 단계 업그레이드: 애니메이션의 파워

2022년 9월 13일8분 소요

시선을 사로잡는 앱을 디자인하고 싶으신가요? 애니메이션을 활용하면 앱 디자인의 수준을 한 단계 높일 수 있습니다. 애니메이션은 앱 인터페이스를 인상적이고, 매력적이고, 이용하기 쉽게 만들죠. 하지만 앱 인터페이스에 필요한 애니메이션을 실제로 디자인하거나 사용하려면 어떻게 해야 할까요? 애니메이션을 통한 디자인 시 고려해야 할 모범 사례와 활용해 볼 애니메이션 유형을 확인해 보세요. sachin udayangana [https://ghost.lottiefiles.com/blog/ghost/#/editor/post/62904bad803a9800015d440d] 의 “웹 디자이너” 애니메이션 애니메이션 디자인 모범 사례 모범 사례를 통해 앱에 필요한 효과적인 애니메이션을 디자인하고 적용하는 데 도움을 받아 보세요. 1. 효과적인 UX 개발을 전담하는 디자이너와 협업하기 팀에 효과적인 UX 개발을 전담하는 디자이너가 최소한 한 명은 필요합니다. UX 전담 디자이너란 궁극적으로 앱에