افزودن انیمیشنهای حرفهای به وبسایت با LottieFiles


اگه دنبال راهی هستی که به سایتت یه ظاهر جذابتر و حرفهایتر بدی، انیمیشنها یکی از بهترین گزینهها هستن. یکی از منابع فوقالعاده برای این کار سایت LottieFiles هست. توی این سایت میتونی هزاران انیمیشن آماده پیدا کنی و خیلی راحت اونا رو داخل پروژههات استفاده کنی.
پیدا کردن انیمیشن در LottieFiles
کافیه وارد سایت بشی و از بخش Search Animations هر چیزی که میخوای رو سرچ کنی. مثلاً:
با سرچ کلمه loading کلی انیمیشن لودینگ برات میاره.
با سرچ computer انیمیشنهای مربوط به کامپیوتر نمایش داده میشه.
خیلی از سایتهایی که دیدی دقیقاً همین انیمیشنها رو از همین منبع گرفتن.
شخصیسازی انیمیشنها
یکی از قابلیتهای جذاب سایت اینه که میتونی انیمیشن رو قبل از دانلود ویرایش کنی.
مثلاً:
تغییر رنگها
حذف یا اضافه کردن بعضی اجزا
تغییر بخشهای مختلف برای هماهنگی بیشتر با طراحی سایتت
دانلود فایل انیمیشن
بعد از انتخاب انیمیشن، میتونی فایل JSON اون رو دانلود کنی. این فایل همون چیزیه که بعداً داخل صفحه وب لود میشه.
استفاده از Lottie Player
برای نمایش انیمیشنها باید از کتابخونه Lottie Player استفاده کنی. این کتابخونه اوپن سورسه و توی گیتهاب هم در دسترسه.
با اضافه کردنش به پروژهت میتونی:
فایل JSON دانلود شده رو به صفحه اضافه کنی.
کنترل کنی انیمیشن لوپ بشه یا فقط یه بار اجرا بشه.
سرعت، سایز و استایل انیمیشن رو تغییر بدی.
حتی با جاوااسکریپت تنظیمات پیشرفتهتری داشته باشی.
نتیجهگیری
سایت LottieFiles یه منبع عالیه برای پیدا کردن انیمیشنهای آماده و استفادهشون توی وبسایتها. خیلی راحت میشه این انیمیشنها رو دانلود کرد، ویرایش کرد و با کتابخونه Lottie Player به پروژه اضافه کرد. این کار باعث میشه سایتت جذابتر و حرفهایتر به نظر برسه.
برای آموزش کاملتر و دیدن جزئیات بیشتر، پیشنهاد میکنم ویدیوی این صفحه رو ببینید.