Hoạt ảnh chuyển động giúp trải nghiệm người dùng thân thiện và sống động hơn

Hoạt ảnh chuyển động (hay Motion) là một thành phần quan trọng trong trải nghiệm người dùng hiện nay. Từ iOS đến Android, Windows hay macOS... tất cả các nhà phát triển đều cố gắng xây dựng các hệ thống có thể tạo ra và thích ứng với hoạt ảnh. Nhờ khả năng xử lý mạnh mẽ của nhân đồ họa hiện nay cũng như tần số quét của màn hình được nâng cao, hoạt ảnh cũng vì thế xuất hiện nhiều, mượt mà, trơn tru và ấn tượng hơn so với trước.

Hoạt ảnh chuyển động được hiểu là hình thức xuất hiện, biến mất hoặc chuyển đổi của một đối tượng trên màn hình. Bạn có thể nhìn thấy chúng ở các thao tác phổ biến như việc mở khóa điện thoại, đóng ứng dụng hay mở các menu, xem hình ảnh trong thư viện...

Chúng góp phần lớn trong việc giúp trải nghiệm tổng thể trở nên sống động hơn, mang đến cảm giác về sự liền mạch cũng như giảm thiểu tính đột ngột gây ra bởi các đối tượng mới xuất hiện. Cùng với đó, hoạt ảnh chuyển động cũng cho biết trạng thái phản hồi khi người dùng thao tác với một đối tượng giúp họ nhận ra rằng hành động của mình đã thực sự được thực hiện hoặc ghi nhận hay chưa.

Đối với một số trường hợp như khi tải tệp tin xuống trên Google Chrome, đóng cửa sổ trên macOS... hoạt ảnh cực kỳ hữu ích khi giúp người dùng nắm bắt được vị trí mà các đối tượng sẽ được sắp xếp vào, dễ dàng tìm hay mở lại khi cần thiết.

Việc thêm vào các hoạt ảnh này được xem là tối quan trọng trong việc phát triển ứng dụng/ trang web hiện nay. Giao diện sẽ thiếu đi tính thẩm mỹ, hiện đại thậm chí là khả năng thân thiện nếu như không được đưa vào các hiệu ứng đẹp mắt phù hợp.

Nhiều thành phần hệ thống tự động bao gồm chuyển động, cho phép bạn mang lại trải nghiệm quen thuộc và nhất quán trong toàn bộ ứng dụng hoặc trò chơi của mình. Nếu bạn thiết kế chuyển động tùy chỉnh, hãy ưu tiên các hoạt ảnh có chủ ý giúp mọi người luôn định hướng và thoải mái, cung cấp phản hồi rõ ràng để phản hồi hành động của họ và giúp họ tìm hiểu giao diện của bạn mà không bị choáng ngợp.

Theo Apple.

Hoạt ảnh thú vị thu hút mọi người. Thiết kế những khoảnh khắc hấp dẫn bằng chuyển động giúp mọi người liên tưởng đến sản phẩm của bạn và tạo ra trải nghiệm đáng nhớ hơn.

Ngôn ngữ Fluent Design 2 của Microsoft cũng nêu bật tầm quan trọng của hoạt ảnh.

Tuy nhiên để sử dụng hoạt ảnh một cách hợp lý trên giao diện người dùng, nhà thiết kế cũng cần lưu ý một số đặc điểm sau.

Hiệu năng sản phẩm

Thiết kế có hoạt ảnh là cần thiết, vừa mang đến sự sống động, trải nghiệm liền mạch và ấn tượng cũng như dấu ấn riêng của mỗi trang web hay ứng dụng, tuy nhiên việc thêm vào các hiệu ứng này sẽ làm giảm hiệu năng của thiết bị, đặc biệt là với các phần cứng không đủ đáp ứng yêu cầu.

Chính vì thế nhà thiết kế cũng cần xây dựng các tùy chọn để giúp người dùng có thể chủ động tắt các lớp hoạt ảnh này nếu điều kiện không cho phép. Và trong trường hợp đó, nếu hoạt ảnh đóng vai trò quan trọng trong việc truyền đạt thông tin sản phẩm, hãy bổ sung các giá trị khác để người dùng không bỏ lỡ tác vụ cần thiết.

Chuyển động tự nhiên, hợp lý

Trong các ứng dụng không phải trò chơi, chuyển động chân thực, chính xác có thể giúp mọi người hiểu cách thức hoạt động của một thứ gì đó, nhưng chuyển động vô nghĩa - hoặc có vẻ thách thức quy luật vật lý có thể khiến họ cảm thấy mất phương hướng. Ví dụ: nếu ai đó hiển thị một chế độ xem bằng cách trượt nó từ trên xuống, họ sẽ không loại bỏ chế độ xem đó bằng cách trượt nó sang một bên.

Theo Apple.

Như vậy, các hoạt ảnh phù hợp với thao tác không chỉ tạo điều kiện cho việc theo dõi của người dùng không bị phân tán mà còn giúp khả năng điều hướng trở nên dễ dàng, chính xác hơn.

Các hoạt ảnh tự nhiên cũng được hiểu là cần có thời lượng xuất hiện vừa đủ, không quá nhanh hoặc không quá chậm. Kéo dài thêm thời gian hoạt ảnh giúp cho chuyển động tránh được cảm giác quá đột ngột tuy nhiên nó cũng tăng khả năng chờ đợi. Và trong thiết kế trải nghiệm, sự chờ đợi cũng đồng nghĩa với sự khó chịu và tỉ lệ thoát của người dùng. Chính vì lẽ đó, nhà thiết kế cần cân nhắc và thử nghiệm để tìm ra giá trị hợp lý.

Hoạt ảnh cũng cần phải được kết hợp với các hàm kiểu thời gian (easing) phù hợp để tăng khả năng thẩm mỹ và giúp giao diện trở nên hiện đại, đẹp mắt hơn.

Tiết chế và có mục đích

Đừng thêm hoạt ảnh vào các hoạt động diễn ra thường xuyên, liên tục trong phạm vi thời gian ngắn. Điều này vừa khiến cho hiệu năng giảm sút đồng thời tạo cảm giác khó chịu cho người dùng bởi họ sẽ mất thêm thời gian để chờ đợi một tác vụ vốn có thể hoàn thành rất nhanh chóng.

Một loạt các hoạt ảnh chồng lấn cũng sẽ phải loại bỏ nếu bạn muốn giao diện tinh tế và tập trung hơn. Nếu bạn thêm các đối tượng có cùng hoạt ảnh vào một màn hình, hãy cân nhắc đến khoảng thời gian chờ giữa mỗi lần thực thi để giúp giao diện trở nên mượt mà và chân thực hơn.