ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko nb ko ko ko en en ko ko ko ko ko ko ko ko ko en ko ko ko ko ko ko ko ko ko ko fr ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko ko en ko ko ko en ko ko ko ko en es ko ko ko ko ko ko en
04. Lottie interactivity로 애플 웹사이트 따라하기 – LottieFiles 강좌 | 디자인베이스
오늘 만들어볼 예제는 애플 인터렉션 따라하기 입니다. 스크롤을 내려보면 만들어놓은 애니메이션이 움직이는 것을 볼 수 있죠. 실제로 로티를 사용한 부분을 따라서 직접 구현해볼 예정입니다. 일러스트레이터 파일에서 작업한 그래픽을 어떻게 에프터이펙트로 옮기는지, 그리고 그 옮긴 에펙에서 어떻게 애니메이션을 구현하는지, 마지막으로 애니메이션을 로티파일즈로 보낸 후 Lottie Interactivity를 활용해서 스크롤 인터렉션을 구현하는 방법을 배워보도록 할게요.
*참고로 해당 강좌는 코드로 작업할 예정이기 때문에 기본적인 html, css, js 정도는 알고 있어야 따라오기 편합니다.
*디자인 베이스 강좌는 Mac OS를 기준으로 해서 윈도우 사용자와 일부 차이가 있을 수 있습니다. 윈도우 사용자분들은 영상에서 커맨드(Cmd)라는 단축키 대신 컨트롤(Ctrl)을, 옵션(Option) 대신 알트(Alt)를 눌러주세요.
일러스트레이터로 지문 그래픽 만드는 방법
에프터이펙트로 애니메이션을 구현하는 방법
로티파일즈로 보낸 후 Lottie Interactivity를 활용해서 스크롤 인터렉션을 구현하는 방법
#11 시선강탈 웹 메인 배너 만드는 방법(feat. 포토샵) – 웹디자인 입문 강좌
#19 일러스트 고퀄리티로 쉽게 만드는 방법(feat. illustrator) – 포토샵 강좌 실전
23. 클릭 몇번으로 도형 왜곡하는 방법 – 일러스트레이터 기초 강좌
저작권 완전 무료 이미지 사이트 모음
웹 주소 URL 짧게 만들어 주는 웹사이트
오너의 마음으로 프로젝트의 A부터 Z까지
투명 비닐 포장 목업
10. 자유롭게 화면 조절하는 방법 OrbitControls – Three.js 강좌
27. 귀여운 꿀벌 일러스트 쉽게 만드는 방법 – 일러스트레이터 기초 강좌
09. 3d 물체에 그림자 적용하는 방법 – Three.js 강좌
26. 프리폼 그라디언트로 5초 만에 부드러운 그라데이션 배경 만드는 방법 – 일러스트레이터 기초 강좌
Youtube Instagram Pinterest Naver Blog
포토샵 일러스트레이터 피그마 스케치 XD 프로토파이
웹디자인 웹코딩 인비전 프린서플 Lottie Three.js
소개 매거진 디자인 사전 북마크 무료 소스 문의하기 멤버십
© 2022 Designbase. All rights reserved.