Cách quay rõ ràng trạng thái hover, thao tác kéo và vi tương tác

Phần lớn lời khuyên về quay màn hình xoay quanh những thứ lớn: chọn độ phân giải, lên kịch bản, cắt bỏ đoạn thừa. Nhưng thứ khiến người xem bối rối nhiều nhất lại là những khoảnh khắc nhỏ: một tooltip hiện ra nửa giây, một thẻ được kéo ngang bảng, một công tắc lặng lẽ đổi trạng thái ở góc màn hình.

Những vi tương tác ấy là nơi thể hiện sự chỉn chu của sản phẩm, và cũng là thứ dễ biến mất nhất trong một bản ghi. Hướng dẫn này chỉ cách ghi lại chúng sao cho người xem thấy đúng những gì bạn đã thấy.

Vì sao vi tương tác khó ghi lại

Ba yếu tố chống lại bạn:

• Chúng rất ngắn. Một tooltip khi hover có thể chỉ hiện 400 mili giây. Chỉ lướt qua là người xem bỏ lỡ hoàn toàn.
• Chúng rất nhỏ. Một ô chọn đổi trạng thái chỉ chiếm một phần cực nhỏ của khung hình 1080p.
• Bạn đã biết cần nhìn vào đâu. Bạn là người thao tác nên mắt bạn bám theo hoàn hảo. Mắt người xem thì không.

Mọi kỹ thuật dưới đây đều giải quyết một trong ba vấn đề đó: kéo dài hơn, phóng to hơn, hoặc chỉ cho mắt biết nên nhìn vào đâu.

Bắt đầu bằng tốc độ khung hình cao hơn

Tương tác nhanh cần đủ khung hình thì mới nhìn thấy được. Ở 30 fps, một cú kéo nhanh qua màn hình chỉ còn là vài vị trí nhòe. Ở 60 fps, cũng chuyển động ấy hiện lên như một đường đi liền mạch, dễ đọc.

Với mọi bản ghi có kéo thả, hiệu ứng chuyển cảnh hay trạng thái hover nhanh, hãy quay ở 60 fps. Tệp sẽ nặng hơn, nhưng bạn luôn có thể nén khi xuất — còn những khung hình chưa từng được ghi thì không thể thêm lại.

Làm chậm bàn tay của bạn

Cải thiện lớn nhất lại chẳng tốn gì: hãy di chuyển có chủ đích. Một đường chuột băng qua màn hình trong nửa giây rất khó theo dõi. Cũng đường đó trong một giây rưỡi thì dễ dàng.

Những nguyên tắc thực tế khi quay:

• Đưa con trỏ tới mục tiêu, rồi dừng lại trước khi bấm
• Để cú bấm hiện rõ trên màn hình rồi mới đi tiếp
• Đừng vượt quá mục tiêu rồi chỉnh lại — hãy tiếp cận bằng một đường cong mượt
• Đừng bao giờ di chuyển con trỏ khi đang giải thích; hãy để yên một chỗ

Cho trạng thái hover đủ thời gian

Khi minh họa một tooltip, bản xem trước của menu thả xuống hay một nút chỉ hiện khi rê chuột, hãy giữ hover ít nhất một giây rưỡi đến hai giây. Lúc quay bạn sẽ thấy chậm đến mức vô lý. Lúc xem lại thì vừa vặn hoàn hảo.

Một thói quen hữu ích: đếm thầm trong lúc hover. Nếu chưa đếm tới “hai”, nghĩa là bạn đã đi quá nhanh.

Quy tắc ba nhịp cho kéo thả

Kéo thả là thao tác bị hiểu sai nhiều nhất, vì người xem thấy kết quả mà không thấy ý định. Hãy chia mỗi lần kéo thành ba nhịp rõ ràng:

1. Cầm — đặt con trỏ lên đối tượng, nhấn giữ và dừng một nhịp ngắn để trạng thái nhấc lên hiện rõ
2. Di chuyển — đi chậm theo một đường thẳng dễ nhìn về phía đích
3. Thả — dừng trên vùng đích trước khi nhả chuột, để phần tô sáng của vùng thả kịp hiện ra

Giữa mỗi nhịp, một khoảng dừng ngắn làm được việc của cả một câu thuyết minh.

Dùng hiệu ứng con trỏ để neo sự chú ý

Các công cụ con trỏ của Recorded sinh ra đúng cho những khoảnh khắc này:

• Làm mượt con trỏ loại bỏ rung giật khiến các chuyển động nhanh khó theo dõi. Mức trung bình hợp với hầu hết bản demo.
• Tô sáng cú nhấp khiến khoảnh khắc bấm chuột trở nên không thể nhầm lẫn, rất quan trọng khi kết quả trên màn hình tinh tế.
• Kích thước con trỏ có thể tăng lên để con trỏ vẫn rõ sau khi xuất, nhất là với người xem trên điện thoại.

Với bản ghi nhiều thao tác kéo, tô sáng cú nhấp là bắt buộc — đó là thứ nói cho người xem biết nút vẫn đang được giữ.

Phóng to, nhưng giữ điểm đến trong khung hình

Hiệu ứng thu phóng giúp các tương tác nhỏ trở nên rõ ràng, nhưng riêng với kéo thả có một lưu ý: nếu phóng quá sát vào đối tượng đang cầm, vùng thả có thể nằm ngoài khung hình và người xem mất đi mối liên hệ giữa hai điểm.

Hai cách hiệu quả:

• Bao gồm cả hai đầu. Đóng khung vùng chứa cả điểm xuất phát lẫn điểm đến, dù phải giảm mức phóng.
• Phóng theo nhịp. Phóng vào lúc cầm, lùi ra một chút khi di chuyển, rồi phóng vào lại lúc thả.

Với công tắc, ô chọn và các thay đổi trạng thái không có di chuyển, bạn cứ phóng sát tùy ý — không có vị trí thứ hai nào phải lo.

Quay chậm cho những tương tác thật sự nhanh

Có những tương tác không thể làm chậm: một cử chỉ vuốt, bảng lệnh mở bằng bàn phím, một hoạt ảnh chạy theo tốc độ riêng của nó. Với chúng, hãy quay ở tốc độ thường rồi làm chậm đoạn clip khi dựng.

Một vùng tốc độ 0,5x trên hoạt ảnh dài một giây cho người xem hai giây để tiếp nhận, mà lời thuyết minh không bị hụt. Kết hợp thêm thu phóng ở cùng khoảng đó, ngay cả chuyển cảnh 200 mili giây cũng trở nên dễ đọc.

Thuyết minh những phần vô hình

Một số thao tác của bạn không bao giờ xuất hiện trên màn hình: giữ phím bổ trợ, bấm chuột phải, nhấn giữ lâu. Khi thao tác đầu vào vô hình, kết quả trông như phép thuật.

Hãy bù lại bằng hai cách:

• Nói thành lời: “Tôi giữ phím Shift trong khi kéo để chọn toàn bộ dải”
• Thêm lớp chữ chèn ngay tại thời điểm đó với tên phím hoặc cử chỉ, để vẫn hiểu được khi tắt tiếng

Những lỗi thường gặp

• Quay ở 30 fps rồi thắc mắc vì sao thao tác kéo bị giật
• Đi tiếp ngay lập tức sau khi bấm, trước khi giao diện phản hồi xong
• Minh họa hover bằng một con trỏ đang rời đi
• Phóng quá sát khiến người xem mất phương hướng trên màn hình
• Cho rằng hoạt ảnh đã quá rõ chỉ vì bạn đã xem nó cả trăm lần

Danh sách kiểm tra nhanh trước khi quay

Trước khi quay một bản demo xoay quanh vi tương tác:

1. Đặt tốc độ khung hình ở 60 fps
2. Bật làm mượt con trỏ và tô sáng cú nhấp
3. Tăng kích thước con trỏ nếu đích đến là màn hình nhỏ
4. Tập trước thao tác kéo hoặc hover một lần, ở một nửa tốc độ tự nhiên
5. Lên kế hoạch cho các vùng thu phóng và xác nhận vùng thả vẫn nằm trong khung
6. Ghi lại những thao tác ẩn cần thuyết minh hoặc chèn chữ

Kết luận

Vi tương tác là những chi tiết khiến phần mềm trông được chăm chút, và chúng sẽ biến mất khỏi bản ghi nếu bạn không chủ động bảo vệ. Hãy làm chậm bàn tay, dành trọn hai giây cho trạng thái hover, chia thao tác kéo thành cầm - di chuyển - thả, rồi để hiệu ứng con trỏ và thu phóng lo phần còn lại.

Lần tới khi quay demo, hãy chọn một tương tác mà bình thường bạn sẽ lướt qua và đối xử với nó như nhân vật chính. Sự khác biệt về độ rõ ràng thường lộ ra ngay ở lần xem lại đầu tiên.