#JSON 這個動畫檔案，可以讓非動畫設計者，控制動畫的速度、頻率甚至是背景顏色等等... 不僅檔案小，而且放大縮小也不會失真，最棒的一件事，就是網路上有很多動態圖可以 #免費下載 使用
lottie json 在 Facebook 的最佳貼文
同時也有2部Youtube影片，追蹤數超過3,370的網紅網頁設計x廣告行銷，也在其Youtube影片中提到，❤免費訂閱Free subscribe❤ https://pse.is/submytube ❤聯絡我們 Contact Us❤ https://pse.is/forums_op ■AE插件Bodymovin.zxp的安装與使用 How to install Bodymovin | After E...
lottie json 在 BorntoDev Facebook 的最佳解答
🌟 "เปลี่ยนไฟล์ภาพแอนิเมชันที่ใหญ่ และ หนักเว็บ ให้เบาขึ้นด้วย LottieFiles กันเถอะ !!"
.
ถ้าเกิดแอดถามว่าจะเอาแอนิเมชันขยับนั่นนี่ลงเว็บไซต์ทำยังไงดี ?
.
ถ้าเป็นเมื่อหลายปีก่อนเราอาจจะตอบแทบจะเป็นเสียงเดียวกันว่า "ก็อัพไฟล์ .gif ลงไปสิ"
.
แต่เอาจริง ๆ มันก็มีข้อจำกัดอยู่คือไฟล์ประเภทดังกล่าวนั้นมันค่อนข้างใหญ่ แล้วยิ่งถ้าเอา PNG มาทำแอนิเมชันขึ้นเว็บแล้วก็ยิ่งไปกันใหญ่อีก 555
.
✅ ดังนั้นพระเอกในวันนี้ของเราคือเจ้าตัวนี้ที่ชื่อว่า "Lottie" นั่นเอง ซึ่งลักษณะของเขาจะเป็นตระกูล JSON นำไปใช้กับแอป หรือ เว็บก็ได้แบบชิล ๆ
.
และด้วยความที่เป็น JSON เราสามารถแก้ไขสี หรือ ข้อมูลต่าง ๆ ในแต่ละเฟรมได้จบในตัวเขาเลย
.
"โอเค เรารู้แล้วว่าขนาดมันเบา ในภาพก็บอกว่าเล็กกว่า Gif เป็นเท่าตัวเลย แล้วมีอะไรอื่น ๆ อีกบ้างหละ ? ขอแบบเด็ด ๆ เบิ้ม ๆ เลยนะ " 🤣
.
🔥 คำตอบคือ "ทำมันงานคู่กับ After Effect ได้เว้ยยย ทุกคนนนน !!"
.
ปัญหาหลายอย่างของการทำพวก Animation ลงเว็บคือ ถ้าเอาออกมาเป็นวีดีโอ เป็น Gif มันใหญ่จัด ๆ หลายคนเลยไปงม ๆ กับ CSS Animation แทน
.
🔥แต่นี่ !! มันใช้กับ AE ได้ ดังนั้นแล้วเราอยากจะเสกหน้าตาแอนิเมชันแบบไหนก็ได้ แถมเขายังมี Editor หน้าเว็บให้ลองอีกด้วย <3
.
เรียกได้ว่าเด็ด ๆ จัดปลัดบอก ขนาดผู้ใหญ่บ้านยังบอก ว่าสุดจัดไปเลยคร้าบพี่น้อง !!
.
✅ หากใครอยากลองเล่น อย่ารอช้า มาพร้อมแอดได้ที่นี่เลยจ้า ! : https://lottiefiles.com/
.
#borntoDev - 🦖 สร้างการเรียนรู้ที่ดีสำหรับสายไอทีในทุกวัน
lottie json 在 軟體開發學習資訊分享 Facebook 的最讚貼文
Airbnb 開發出一個 After effect plugin 可以將設計師設計好的動畫匯出成 JSON ( 應該也是有包含相關的 assest 檔案 , 更神奇的是 JSON 可以透過網路下載，這個可以用在 A/B testing) 然後再透過 Lottie engine ( 有支援 iOS , Android , React Native ) 將動畫在 App 中展現出來，這真的是會省掉不少寫動畫程式的時間。
但是如果你是使用 Xamarin Forms 開發 iOS/Android app 又想要使用 Lottie engine 該怎麼辦？這篇文章有介紹一個針對 Xamarin Forms 開發的 Lottie 套件，讓你使用 Xamarin Forms 開發 App 也可以輕鬆享用 Lottie engine 帶來的便利
https://xamarinskills.blogspot.tw/…/lottie-animations-in-xa…
lottie json 在 網頁設計x廣告行銷 Youtube 的最佳貼文
❤免費訂閱Free subscribe❤
https://pse.is/submytube
❤聯絡我們 Contact Us❤
https://pse.is/forums_op
■AE插件Bodymovin.zxp的安装與使用 How to install Bodymovin | After Effects extensions
https://www.youtube.com/watch?v=q-o-beB0v2o
---------
網頁動畫Lottie_Animation 介紹 | 優點及應用面
應用面：
促成用戶採取行動CTA / 網頁轉場 app preloader / 程式過場
示範 Preloader on web (Webflow)
一、優點
畫質高 / 向量 / 不變形及失真
json 檔案更小 執行速度更快
二、UX 使用者體驗更豐富
三、應用：wix / webflow / wordpress
四、配合軟體工具： adobe after effects / BODYMOVIN
✪✪✪FYR 補充資料如下✪✪✪
lottiefiles
https://lottiefiles.com/
webflow page preloader 示範
https://yt-wixpress-org-test.webflow.io/
wix lottie animation 嵌入 示範
https://178gogogo.wixsite.com/wixtutorials2018/pwd
教學 webflow 的lottie files & pre loader 教學
https://www.youtube.com/watch?v=bAgcHLo7reY
■商業行銷&設計資訊相關討論區
https://freeday.cc/forum/index.php?p=/categories/freesource
■網站架設廣告行銷業務洽詢■
https://pse.is/forums_op
❤小額贊助頻道 Donate us a cup coffee❤
https://www.paypal.me/178yo
■聯絡我們 Contact Us
https://pse.is/forums_op
#網頁設計x廣告行銷
lottie json 在 網頁設計x廣告行銷 Youtube 的最佳解答
❤歡迎訂閱Free subscribe❤
https://pse.is/submytube
---------
免費網頁設計工具 | Webflow 中文教學-03 |
elements hides and lottie animation
實作範例
http://yt-wixpress-org-test.webflow.io/
[After Effects]How to use Bodymovin export html files and json
https://www.youtube.com/watch?v=vyH3zZpu30E
✪✪✪FYR 補充資料如下✪✪✪
一頁式購物網站線上申請
https://room404.tw/minigo/
■Wordpress免費架網站教學
https://www.youtube.com/playlist?list=PLx1Sz7nuD5XoCf4-RN13R_l72iXhq0zl2
■Wix免費架網站教學
https://www.youtube.com/playlist?list=PLx1Sz7nuD5XqtWmmGTag3sOeUJf9Q38s6
❤小額贊助頻道 Donate us a cup coffee❤
https://www.paypal.me/178yo
