Chọn tốc độ phù hợp cho dự án, cho dù đó là gia tốc trong, khi bắt đầu chạy hay cả hai. Thậm chí có thể sử dụng độ nảy để giải trí thêm!
Sau khi thảo luận về các lựa chọn gia tốc hiện có trong ảnh động, bạn nên sử dụng loại nào trong dự án và nên có thời lượng nào cho ảnh động?
Tóm tắt
- Sử dụng ảnh động dễ dàng cho các phần tử trên giao diện người dùng; một cách đơn giản Quintic rất hay, mặc dù nhanh và dễ dàng.
- Hãy nhớ sử dụng thời lượng hoạt ảnh; các đoạn gia tốc độ và đoạn dễ uốn nên ở trong khoảng 200 mili giây đến 500 mili giây, trong khi các độ nảy và các đoạn tăng độ đàn hồi nên chạy trong khoảng thời gian dài hơn từ 800 mili giây đến 1200 mili giây.
![Một đường cong hoạt ảnh dễ dàng đơn giản Quintic.](https://web.developers.google.cn/static/articles/choosing-the-right-easing/image/a-quintic-ease-animation-cea056c19527.png?authuser=3&hl=vi)
Nói chung, chế độ dễ dàng sẽ là lựa chọn phù hợp và chắc chắn là chế độ mặc định tốt. Tính năng này khởi động nhanh, mang lại cho ảnh động cảm giác phản hồi, điều này rất mong muốn, nhưng với độ chậm lại khá đẹp ở cuối.
Có một nhóm các phương trình đơn giản phổ biến ngoài phương trình được chỉ định với từ khoá ease-out
trong CSS, các phương trình này nằm trong phạm vi "mức độ linh hoạt" của chúng. Để có hiệu ứng nhanh chóng, hãy cân nhắc sử dụng chế độ đơn giản hoá ngẫu nhiên.
Xem ảnh động rút gọn của Quintic
Các phương trình gia tốc khác, đặc biệt là độ nảy hoặc các độ co giãn, nên dùng một cách tiết kiệm và chỉ khi phù hợp với dự án của bạn. Có một số điều khiến người dùng trải nghiệm như ảnh động gây khó chịu. Nếu dự án của bạn không nhằm mục đích thú vị, thì đừng có các phần tử bật lên xung quanh giao diện người dùng. Ngược lại, nếu bạn đang tạo một trang web được cho là thú vị, thì bằng mọi cách hãy sử dụng số trang không truy cập!
Dễ dàng thao tác, xem lựa chọn nào phù hợp với cá tính của dự án rồi bắt đầu từ đó. Để xem danh sách đầy đủ các loại easing, cùng với bản minh hoạ, hãy xem easings.net.
Chọn thời lượng ảnh động phù hợp
Điều quan trọng là mọi ảnh động được thêm vào dự án của bạn đều có thời lượng chính xác. Quá ngắn và ảnh động sẽ tạo cảm giác hăng say và sắc nét; quá dài nên sẽ gây cản trở và khó chịu.
- Thời gian nhanh: khoảng 200 mili giây – 500 mili giây. Điều này giúp mắt có cơ hội xem ảnh động nhưng không cảm thấy bị cản trở.
- Tốc độ rút ngắn: khoảng 200 mili giây – 500 mili giây. Hãy lưu ý rằng màn hình sẽ bị giật ở cuối màn hình và không có sự thay đổi về thời gian nào có thể làm giảm tác động đó.
- Hiệu ứng nảy hoặc đàn hồi: khoảng 800 mili giây – 1200 mili giây. Bạn cần dành thời gian để hiệu ứng đàn hồi hoặc độ nảy "ổn định". Nếu không có thêm thời gian này, phần nảy đàn hồi của ảnh động sẽ trở nên hung hăng và gây khó chịu cho mắt.
Tất nhiên, đây chỉ là các nguyên tắc. Thoả sức thử nghiệm và chọn cách mà bạn cảm thấy phù hợp với dự án của mình.