Thư viện thuật ngữ / Figma

Spring animation và easing trong Figma là gì?

Còn gọi: spring animation figma, gentle quick bouncy, easing figma, custom spring

Spring animation là kiểu easing mô phỏng lò xo trong prototype Figma, với các mẫu Gentle, Quick, Bouncy, Slow và Custom spring, cho chuyển động tự nhiên và có độ nảy.

Hiểu kỹ hơn

Trong thiết lập Animation của một kết nối prototype, mục easing có các đường cong thông thường (Linear, Ease in, Ease out, Ease in and out, các bản Back và Custom bezier) và nhóm spring. Spring không dùng thời gian cố định như bezier mà dựa trên độ cứng, độ cản và khối lượng, nên chuyển động có quán tính và có thể nảy nhẹ khi dừng. Gentle mềm và chậm, Quick dứt khoát, Bouncy nảy rõ, Slow trôi lâu. Spring hợp với thẻ bật lên, bottom sheet, nút thích, những thứ cần cảm giác vật lý. Với chuyển trang hoặc làm mờ, ease out ngắn thường gọn hơn. Mẹo: thống nhất vài kiểu easing cho cả sản phẩm và ghi vào tài liệu motion để lập trình viên làm đúng.