Chuyển động không phải lớp trang trí được thêm ở cuối. Nó là một phần của cách thông tin xuất hiện, cách người xem định hướng và cách một giao diện phản hồi.
Nhịp điệu trước kỹ xảo.
Trước khi chọn easing, tôi đặt câu hỏi: người xem cần nhận ra điều gì trước? Một tiêu đề có thể xuất hiện sớm hơn phần mô tả. Một phản hồi nút bấm nên đến ngay, không phải đợi một màn trình diễn kết thúc.
Một nhịp chuyển động tốt không đòi hỏi người xem chú ý đến nó. Nó giúp chuyển sự chú ý đến đúng nội dung. Thời lượng và khoảng trễ cần được chọn trong bối cảnh thật, không dùng một con số cho mọi loại tương tác.
Chuyển động tốt không chiếm sân khấu. Nó giúp nội dung tìm đúng ánh sáng.
Đừng bắt mọi thứ cùng lên tiếng.
Khi tiêu đề, hình ảnh, đường viền và icon cùng chuyển động, mọi điểm nhấn đều bị triệt tiêu. Tôi ưu tiên một chuyển động chính và để những thành phần còn lại hỗ trợ.
Reveal nên xảy ra khi nội dung thực sự tiến vào vùng nhìn. Phần tử đang chuyển động không nên tự làm mốc cho chính trigger của nó. Những animation lồng nhau cũng cần tránh cùng điều khiển opacity hay transform trên một container.
Quyền được dừng lại.
Một người có thể muốn ít chuyển động hơn vì sức khỏe, khả năng tập trung hoặc đơn giản là sở thích. Tôn trọng prefers-reduced-motion là một quyết định thiết kế, không chỉ một media query.
Với cảnh 3D hay đồ họa liên tục, nút tạm dừng phải dễ tìm. Khi tab không hoạt động hoặc cảnh ra khỏi màn hình, nên dừng việc render không cần thiết. Trải nghiệm vẫn phải đầy đủ khi animation được tắt.
Góc nhìn từ thực hành thiết kế của độc lập. Bài viết không trình bày số liệu kiểm chứng hoặc kết quả của khách hàng.
Trở lại tất cả ghi chép