ตัวเล่น Lottie
โปรแกรมเล่น Lottie ออนไลน์ฟรี เปิดแอนิเมชัน Lottie JSON ได้ทุกไฟล์ เล่น หยุด ลากดูทีละเฟรม ปรับความเร็ว สลับการวนซ้ำ และพรีวิวบนพื้นหลังลายตารางโปร่งใส — ทำงานในเบราว์เซอร์ทั้งหมด
ไฟล์ Lottie คืออะไร?
ไฟล์ Lottie คือการส่งออก JSON ของแอนิเมชันเวกเตอร์ มักสร้างจาก After Effects ด้วยปลั๊กอิน Bodymovin หรือเครื่องมืออย่าง LottieFiles แอปและเว็บเล่นไฟล์นี้ด้วยตัวเรนเดอร์ที่เบากว่าวิดีโอ ไฟล์จึงเล็กมากและคมชัดในทุกขนาด
ดูตัวอย่างแอนิเมชัน Lottie ที่นี่อย่างไร?
คลิกบริเวณอัปโหลดหรือลากไฟล์ .json มาวาง แอนิเมชันจะโหลดทันทีและเริ่มเล่นเอง และมีปุ่มตัวอย่างให้ทดลองเครื่องเล่นด้วยแอนิเมชันในตัวก่อนได้
แอนิเมชันของฉันถูกอัปโหลดไปเซิร์ฟเวอร์หรือไม่?
ไม่ ไฟล์ถูกอ่านและเรนเดอร์ทั้งหมดภายในแท็บเบราว์เซอร์ ไม่มีการส่งข้อมูลออกไป จึงปลอดภัยแม้กับงานลูกค้าที่ยังไม่เปิดเผยหรือไฟล์ลับ
มีปุ่มควบคุมอะไรบ้าง?
เล่น/หยุดชั่วคราว ปุ่มเริ่มใหม่ สวิตช์วนซ้ำ สไลเดอร์เฟรมที่ลากได้ และตัวเลือกความเร็ว 0.25x–2x พร้อมแสดงเฟรมปัจจุบัน เฟรมทั้งหมด และอัตราเฟรมของแอนิเมชัน
ทำไมมีพื้นหลังลายตาราง?
ลายตารางแทนความโปร่งใสเหมือนในเครื่องมือออกแบบ ใช้ตรวจว่าแอนิเมชันไม่มีพื้นหลังที่ไม่ตั้งใจ และสลับเป็นขาวหรือดำเพื่อดูขอบ แสงเรือง และเงาบนพื้นสว่างหรือเข้ม
รองรับ Lottie เวอร์ชันใด?
เครื่องเล่นใช้ตัวเรนเดอร์ lottie-web รองรับ JSON ของ Bodymovin ตั้งแต่เวอร์ชัน 4 เป็นต้นไป ทั้ง shape layer, mask, matte, trim path และ expression ส่วนใหญ่ที่เบคไว้ตอนส่งออก
ใช้บนมือถือได้ไหม?
ได้ เลย์เอาต์ปรับตามหน้าจอและเรนเดอร์ด้วยเอนจิน SVG ตัวเดียวกัน จึงทำงานบนเบราว์เซอร์ iOS และ Android โดยปุ่มต่างๆ ออกแบบมาสำหรับสัมผัส
.json ต่างจาก .lottie อย่างไร?
รูปแบบ .lottie (dotLottie) เป็นไฟล์ zip บีบอัดที่บรรจุ JSON พร้อมไฟล์ภาพและอื่นๆ ได้ ส่วนเครื่องมือนี้เปิดไฟล์ .json มาตรฐานของ Lottie โดยตรง หากเป็น dotLottie ให้แตกไฟล์เอา .json ออกมาก่อน
ทำไมแอนิเมชันของฉันเล่นช้าหรือแสดงผลเพี้ยน?
แอนิเมชันที่มีเลเยอร์ รูปภาพ หรือ expression จำนวนมากจะเรนเดอร์หนัก ตรวจสอบว่ารูปภาพไม่ได้ถูกส่งออกแยกไฟล์ ลองลดความซับซ้อนของคอมโพสิชันหรือลดความเร็ว — ค่า FPS ที่แสดงคืออัตราที่แอนิเมชันออกแบบไว้
วิธีใช้ ตัวเล่น Lottie
ตัวเล่น Lottie นี้เล่นแอนิเมชัน Bodymovin JSON ได้ในเบราว์เซอร์ของคุณทั้งหมดด้วยตัวเรนเดอร์ lottie-web โหลดไฟล์หรือลากมาวาง ควบคุมการเล่นทีละเฟรม และพรีวิวบนพื้นหลังโปร่งใส ขาว หรือดำ — ไม่มีการอัปโหลดข้อมูลไปที่ใด
- คลิกพื้นที่อัปโหลดหรือลากไฟล์ .json ของ Lottie มาวาง แอนิเมชันจะโหลดและเล่นทันที
- ใช้ปุ่มเล่น/หยุดขนาดใหญ่และปุ่มเริ่มใหม่ในการควบคุมการเล่น
- ลากแถบเลื่อนเฟรมเพื่อไปยังเฟรมใดก็ได้ ตัวเลขจะบอกเฟรมปัจจุบัน เฟรมทั้งหมด และ FPS
- เลือกความเร็วระหว่าง 0.25x ถึง 2x และกดปุ่มวนซ้ำเพื่อเล่นต่อเนื่องไม่หยุด
- สลับพื้นหลังระหว่างลายตารางโปร่งใส ขาว และดำ เพื่อตรวจดูขอบ แสงเรือง และเงา
กดปุ่มตัวอย่างก่อนเพื่อดูพฤติกรรมของโปรแกรมเล่นก่อนโหลดแอนิเมชันของคุณเอง — สะดวกมากเวลาลูกค้าส่ง JSON มาให้ตรวจอย่างรวดเร็ว
เครื่องมือที่เกี่ยวข้อง
- ตัวดูและแก้ไข SVG ดูตัวอย่าง แก้ไข และเพิ่มประสิทธิภาพไฟล์ SVG ออนไลน์ ตัวอย่างแบบเรียลไทม์ การแก้ไขโค้ด และเครื่องมือเพิ่มประสิทธิภาพ
- ตัวดูต้นไม้ JSON แสดงข้อมูล JSON เป็นต้นไม้แบบโต้ตอบที่ยุบได้ ค้นหาคีย์และค่า ติดตาม JSONPath เมื่อวางเมาส์ และจัดการไฟล์ขนาดใหญ่ด้วยการโหลดแบบขี้เกียจ รองรับการลากและวางไฟล์ .json
- ตัวสร้างสไปรต์ชีต รวมภาพเป็นสไปรต์ชีตด้วยการลากเพื่อจัดเรียงใหม่ เลย์เอาต์ตาราง ช่องว่าง โหมดสเกล ส่งออกเป็น PNG/WebP/JPG พร้อมข้อมูล JSON atlas สำหรับเอนจินเกมและ CSS
- รูปภาพเป็น Base64 แปลงรูปภาพเป็นสตริง Base64 และถอดรหัส Base64 กลับเป็นรูปภาพ รองรับ PNG, JPG, GIF, WebP, SVG, BMP, ICO ประมวลผล 100% ในเบราว์เซอร์ ไม่ต้องอัปโหลด
- GIF แยกเฟรม แยกและดาวน์โหลดเฟรมแต่ละเฟรมจากภาพเคลื่อนไหว GIF เป็น PNG หรือสไปรต์ชีต เครื่องมือออนไลน์ฟรีพร้อมดูตัวอย่างและส่งออก ZIP
- GIF ย้อนกลับ ย้อนลำดับการเล่นภาพเคลื่อนไหว GIF ออนไลน์ฟรี อัปโหลด ดูตัวอย่าง และดาวน์โหลดทันที
- เครื่องเปลี่ยนความเร็ว GIF เปลี่ยนความเร็วแอนิเมชัน GIF ออนไลน์ เร่งหรือชะลอไฟล์ GIF ทันที
- วิดีโอเป็น GIF แปลงวิดีโอเป็น GIF แอนิเมชันออนไลน์ ปรับคุณภาพ อัตราเฟรม และความละเอียดโดยตรงในเบราว์เซอร์โดยไม่ต้องอัปโหลด