Tại sao GIF lại sai lầm ở giai đoạn trích xuất

Hầu hết các ảnh GIF xấu đều được quyết định trước khi mở bất kỳ phần mềm GIF nào. Ai đó trích xuất từng khung hình của một clip dài 5 giây, lấy 150 hình ảnh, ghép chúng lại và tạo ra một tệp 14 MB mà ứng dụng trò chuyện từ chối nhúng. Bản năng lúc đó là nén mạnh hơn, khiến nó lầy lội mà không làm nó nhỏ đi nhiều.

Vấn đề thực tế nằm ở thượng nguồn. GIF không phải là một codec video — nó không có tính năng bù chuyển động, không có khả năng dự đoán giữa các khung hình xứng đáng với tên gọi và mức trần cứng là 256 màu cho mỗi khung hình. Mỗi khung hình gần với một hình ảnh độc lập. Thực tế duy nhất đó thúc đẩy mọi quyết định bên dưới.

Vì vậy, trình tự cần suy nghĩ là: quyết định số lượng khung hình trước, bảng màu thứ hai và chỉ sau đó mới lo lắng về việc nén.

Bước 1: Chọn khoảng thời gian lấy mẫu

Câu hỏi không phải là "nguồn có bao nhiêu khung hình" mà là "chuyển động thực sự cần bao nhiêu khung hình". Một số điểm khởi đầu sơ bộ:

  • 10–12 khung hình/giây — cài đặt phù hợp. Đủ mượt mà cho các cử chỉ, bản trình diễn giao diện người dùng và hầu hết các clip phản ứng. Trên nguồn 30 khung hình/giây, tức là cứ mỗi khung hình thứ 3; ở tốc độ 60 khung hình/giây, thứ 5 hàng tuần.
  • 15 khung hình/giây — dành cho chuyển động liên tục trong đó 12 bắt đầu nhấp nháy, như lia máy ảnh hoặc vật thể nảy.
  • 5–8 khung hình/giây — dành cho nội dung giống trang trình bày: biểu đồ đang dựng lên, trước/sau, thu phóng chậm. Thường có vẻ cố ý hơn là rẻ tiền.
  • 24+ khung hình/giây — hiếm khi có giá trị. Kích thước tệp gần như tăng gấp đôi so với 12 khung hình/giây và hầu hết người xem không thể biết được hình ảnh lặp lại nhỏ.

Trong trình trích xuất khung, hãy sử dụng chế độ "Tốc độ khung hình (FPS)" và nhập ước số: 3 cho mỗi khung hình thứ ba, 5 cho mỗi khung hình thứ năm. Số lượng khung hình cập nhật khi bạn nhập, đây là con số thực sự dự đoán kích thước tệp của bạn.

Kiểm tra độ chính xác trước khi trích xuất: nhân số lượng khung hình dự định của bạn với khoảng 30–60 KB. Đó là một sân bóng thực tế cho khung GIF rộng 480 pixel sau khi giảm bảng màu. Sáu mươi khung hình có dung lượng khoảng 2–3 MB. Nếu vượt quá ngân sách của bạn, hãy cắt khung ngay bây giờ — cách này hiệu quả hơn nhiều so với việc nén sau này.

Bước 2: Giữ thời lượng ngắn

GIF không có trường hợp sử dụng dài hạn. Hai đến bốn giây bao gồm hầu hết mọi thứ hoạt động như một vòng lặp và điểm vòng lặp quan trọng hơn độ dài: một clip kết thúc gần nơi bắt đầu đọc là liên tục, trong khi một clip cắt giữa chuyển động sẽ thu hút sự chú ý đến đường nối mỗi lần lặp lại.

Sử dụng thanh trượt phạm vi thời gian để cắt bớt trước khi trích xuất thay vì xóa các khung sau đó. Dấu thời gian hiển thị khi bạn kéo, do đó, bạn có thể đặt điểm ngoài vào cùng tư thế với điểm trong.

Bước 3: Tìm hiểu giới hạn 256 màu

Đây là hạn chế khiến mọi người ngạc nhiên và đáng để hiểu hơn là đấu tranh.

Mỗi khung hình GIF lập chỉ mục vào một bảng màu có tối đa 256 màu. Video nguồn của bạn có hàng triệu. Phải có thứ gì đó loại bỏ sự khác biệt và cách nó quyết định kết quả trông như thế nào.

Hai chiến lược và một chiến lược đúng phụ thuộc hoàn toàn vào nội dung:

  • Phối màu phân tán các pixel của bảng màu liền kề để làm giả những cái còn thiếu. Độ dốc - bầu trời, ánh sáng dịu, bóng trên khuôn mặt - tồn tại tốt hơn nhiều với nó. Chi phí là một mẫu đốm có thể nhìn thấy và một tệp lớn hơn đáng kể vì tiếng ồn đó sẽ làm giảm khả năng nén.
  • Không phối màu cung cấp các vùng màu phẳng, rõ ràng và các tệp nhỏ hơn nhiều. Lý tưởng để ghi màn hình, trình diễn giao diện người dùng, nghệ thuật đường nét, bất kỳ thứ gì có vùng đồng nhất lớn. Trên các dải màu ảnh, nó tạo ra dải cứng.

Quy tắc thực tế: nội dung trên màn hình, không phối màu. Cảnh quay của máy ảnh, phối màu đang bật. Nếu bạn không chắc chắn, hãy xuất cả hai và xem chúng ở kích thước thực tế — sự khác biệt là rõ ràng và phải mất một phút.

Đây cũng là lý do tại sao việc trích xuất PNG là lựa chọn phù hợp ngay cả khi ảnh GIF cuối cùng có 256 màu. Mỗi thành phần JPEG trong nguồn sẽ trở thành một màu mà bảng màu phải sử dụng để nhập vào. Việc cung cấp các khung hình sạch, không mất dữ liệu vào bước bảng màu giúp bộ lượng tử hóa có một điểm khởi đầu tốt hơn.

Bước 4: Khớp độ trễ khung hình với khoảng thời gian bạn đã trích xuất

GIF không lưu trữ tốc độ khung hình. Chúng lưu trữ độ trễ trên mỗi khung hình, tính bằng phần trăm giây — và đây là lý do khiến rất nhiều ảnh GIF phát ở tốc độ sai.

Số học rất đơn giản: độ trễ = 100 ` số khung hình/giây mục tiêu của bạn.

  • 12 khung hình/giây → độ trễ 8 (0,08 giây)
  • 10 khung hình/giây → độ trễ 10 (0,10 giây)
  • 15 khung hình/giây → độ trễ 7 (làm tròn thành 6,67)
  • 5 khung hình/giây → độ trễ 20 (0,20 giây)

Hai điều cần biết. Đầu tiên, việc làm tròn là có thật: không thể thể hiện chính xác 15 khung hình/giây, do đó vòng lặp hơi trôi đi. Đối với bất kỳ điều gì quan trọng về thời gian, hãy ưu tiên 10, 12,5, 20 hoặc 25 khung hình/giây, phân chia rõ ràng. Thứ hai, hầu hết các trình duyệt đều âm thầm giới hạn độ trễ dưới 2 (0,02 giây) cho đến 10 — do đó, một ảnh GIF được tạo ở tốc độ 50 khung hình/giây sẽ phát ở tốc độ 10 khung hình/giây cho hầu hết người xem, ở kích thước tệp gấp 5 lần và không có độ mượt.

Bước 5: Cắt kích thước theo thứ tự phù hợp

Nếu tệp vẫn quá lớn, hãy áp dụng các tốc độ này theo thứ tự. Mỗi byte được lưu có chất lượng thấp hơn so với byte sau nó.

  1. Giảm kích thước. Giảm một nửa chiều rộng sẽ giảm một phần tư số pixel. GIF rộng 480 pixel phù hợp với hầu hết các bối cảnh nhúng; 800+ hiếm khi cần thiết.
  2. Thả khung. Tốc độ tăng từ 15 lên 10 khung hình/giây sẽ loại bỏ 1/3 dữ liệu cho một thay đổi mà hầu hết người xem sẽ không đăng ký.
  3. Hãy rút ngắn clip. Tàn nhẫn. Hầu hết mọi ảnh GIF đều có một giây ở đầu hoặc cuối mà không làm gì cả.
  4. Giảm bảng màu xuống dưới 256. 128 hoặc thậm chí 64 màu thường không hiển thị trên nội dung màn hình và có ý nghĩa nhỏ hơn.
  5. Tắt phối màu nếu bạn bật tính năng này và nội dung có thể chấp nhận được.

Lưu ý rằng "nén mạnh hơn" không có trong danh sách. Quá trình nén của GIF không bị mất LZW — không có quay số chất lượng. Tất cả những gì bạn có thể làm là quyết định nên đưa dữ liệu nào vào ngay từ đầu.

Khi bạn hoàn toàn không nên tạo ảnh GIF

Đáng nói rõ ràng vì nó giúp tiết kiệm rất nhiều công sức:

  • Bất kỳ nội dung nào kéo dài khoảng 5 giây. MP4 hoặc WebM sẽ có kích thước nhỏ hơn nhưng có chất lượng tốt hơn. Hầu hết các nền tảng chấp nhận "GIF" hiện đều chuyển đổi chúng thành video nội bộ.
  • Nội dung ảnh có nhiều chuyển màu. 256 màu đơn giản là không đủ và không có thủ thuật bảng màu nào khắc phục được điều đó.
  • Bất kỳ nội dung nào cần âm thanh. GIF không có và vòng lặp sẽ có cảm giác sai nếu nguồn có nhịp.
  • Bất kỳ nội dung nào có chiều rộng trên 800 pixel. Khi đó, hình phạt về kích thước đủ nghiêm khắc để video trở thành câu trả lời chính xác.

GIF giành được vị trí của mình trong đúng một tình huống: một vòng lặp tự động phát ngắn, im lặng, phải hoạt động ở bất cứ đâu mà không cần trình phát. Vì thế, nó vẫn bất bại — miễn là các khung hình đưa vào được chọn có chủ ý.

Một ví dụ hoạt động

Giả sử bạn muốn có ảnh GIF về tương tác giao diện người dùng 3 giây từ màn hình 60 khung hình/giây bản ghi có dung lượng dưới 1 MB.

  1. Cắt bớt đến 3,2 giây chứa tương tác, với khung hình cuối cùng gần với khung hình đầu tiên.
  2. Trích xuất ở chế độ FPS với N = 5 — mỗi khung hình thứ năm có tốc độ 60 khung hình/giây sẽ mang lại 12 khung hình/giây, khoảng 38 khung hình. Đầu ra PNG.
  3. Tập hợp ở độ trễ 8, phối màu bị tắt (đó là nội dung màn hình có màu phẳng).
  4. Tỷ lệ rộng tới 600 pixel nếu nguồn lớn hơn.
  5. Kiểm tra kết quả. Khoảng 38 khung hình của nội dung giao diện người dùng phẳng thường có dung lượng dưới 1 MB. Nếu không, hãy thả bảng màu xuống còn 128 màu trước khi chạm vào bất kỳ thứ gì khác.

Toàn bộ quá trình này chỉ mất vài phút và mỗi bước là quyết định của bạn chứ không phải là mặc định mà bạn kế thừa.