Thông số kỹ thuật thiết kế biểu tượng Google Play

Ứng dụng & Trò chơi trên Google Play đang áp dụng một hệ thống biểu tượng mới để các tác phẩm nghệ thuật của nhà phát triển phù hợp hơn với nhiều bố cục Giao diện người dùng, hệ số hình dạng và thiết bị đa dạng của Google Play, cũng như mang lại giao diện thống nhất và gọn gàng hơn cho Google Play.

Hình dạng thống nhất thường trông hấp dẫn hơn và dễ tiếp nhận hơn. Những hình dạng này giúp người dùng tập trung vào các tác phẩm nghệ thuật hơn là tập trung vào chính các hình dạng. Hình dạng thống nhất cũng khắc phục các vấn đề căn chỉnh do không gian trống ngẫu nhiên gây ra để trình bày các thông tin xung quanh tốt hơn, chẳng hạn như tiêu đề, xếp hạng và giá cả.

Dạng tự do - định dạng ban đầu
Thống nhất - định dạng mới

Trang này mô tả các nguyên tắc bạn nên tuân theo khi tạo nội dung cho danh sách ứng dụng của bạn trên Google Play. Ví dụ: do Google Play tự động hiển thị các góc tròn và bóng đổ cho các biểu tượng ứng dụng, bạn nên loại chúng khỏi nội dung ban đầu của mình.

Quan trọng: Nếu bạn muốn tìm hiểu thêm về cách tạo biểu tượng trình khởi chạy APK, là những biểu tượng tách biệt với biểu tượng Google Play được mô tả trên trang này, hãy xem các tài nguyên bên dưới:

  • Biểu tượng thích ứng Android
    Thực hiện theo các nguyên tắc này về biểu tượng APK để tìm hiểu cách tạo biểu tượng trình khởi chạy thích ứng đã ra mắt trong Android 8.0 (API cấp 26).
  • Biểu tượng sản phẩm
    Khám phá các nguyên tắc về Material Design cho các biểu tượng sản phẩm, bao gồm nguyên tắc về thiết kế biểu tượng, hình dạng, thông số kỹ thuật và cách xử lý.

Tạo nội dung

Phần này mô tả một số nguyên tắc bạn nên tuân theo khi tạo nội dung hình ảnh cho ứng dụng của mình trên Google Play.

Thuộc tính

Biểu tượng tác phẩm nghệ thuật có thể chiếm toàn bộ không gian nội dung hoặc bạn có thể thiết kế và đặt các yếu tố tác phẩm nghệ thuật như biểu trưng trên lưới keyline. Khi đặt tác phẩm nghệ thuật của bạn, hãy sử dụng các keyline làm hướng dẫn chứ không phải là quy tắc cần tuân theo.

Khi tạo tác phẩm nghệ thuật của bạn, đảm bảo rằng tác phẩm đó tuân thủ các điều sau:

  • Kích thước cuối cùng: 512px x 512px
  • Định dạng: PNG 32 bit
  • Không gian màu: sRGB
  • Kích thước tệp tối đa: 1024KB
  • Hình dạng: Hình vuông đầy đủ - Google Play tự động xử lý việc tạo mặt nạ. Bán kính sẽ tương đương với 20% kích thước biểu tượng.
  • Bóng: Không có - Google Play sẽ tự động xử lý bóng. Xem phần 'Bóng' bên dưới về cách tạo bóng trong tác phẩm nghệ thuật.
Tổng kích thước nội dung
Keyline cho biểu tượng sản phẩm

Sau khi bạn tải nội dung lên, Google Play sẽ tự động áp dụng mặt nạ tròn và bóng để đảm bảo tính thống nhất trong tất cả các biểu tượng ứng dụng/trò chơi.

Ở phía bên trái là nội dung biểu tượng mới. Ba hình ảnh sau đây ở phía bên phải cho thấy quá trình tự động xử lý biểu tượng của Google Play.

Định cỡ

Tận dụng toàn bộ không gian nội dung làm nền khi xử lý các tác phẩm nghệ thuật tối giản.

Sử dụng keyline làm hướng dẫn để đặt các yếu tố tác phẩm nghệ thuật (ví dụ: biểu trưng).

Tác phẩm nghệ thuật tràn lề (nội dung cuối cùng)
Kết thúc cuối cùng trong đó Google Play đã tự động áp dụng bóng và các góc tròn

Không co giãn biểu trưng hoặc tác phẩm nghệ thuật để vừa với toàn bộ không gian nội dung. Thay vào đó, hãy sử dụng lưới keyline.

Không nên.
Không thay đổi thương hiệu và tác phẩm nghệ thuật để hiển thị tràn lề
Nên.
Thay vào đó, hãy đặt biểu tượng tác phẩm nghệ thuật ở dạng tự do trên keyline

Tác phẩm nghệ thuật minh họa thường hoạt động tốt dưới dạng biểu tượng tràn lề.

Không nên.
Không thu nhỏ tác phẩm nghệ thuật minh họa vào các keyline
Nên.
Tận dụng toàn bộ không gian nội dung để tác phẩm nghệ thuật chiếm toàn bộ biểu tượng

Bóng

Google Play sẽ tự động thêm hiệu ứng bóng đổ xung quanh biểu tượng cuối cùng sau khi được tải lên.

Khi thêm bóng trong tác phẩm nghệ thuật biểu tượng của bạn, hãy xem xét tính thống nhất với nền tảng Android bằng cách làm theo hướng dẫn của Google Material.

Không nên.
Không thêm bóng đổ vào nội dung cuối cùng
Nên.
Bạn có thể tạo bóng và ánh sáng trong tác phẩm nghệ thuật

Bán kính góc

Google Play tự động áp dụng bán kính góc. Điều này đảm bảo tính thống nhất khi biểu tượng được thay đổi kích thước trên các bố cục Giao diện người dùng khác nhau. Bán kính sẽ tương đương với 20% kích thước biểu tượng.

Không nên.
Không làm tròn các cạnh của nội dung cuối cùng
Nên.
Hiển thị tác phẩm nghệ thuật trong toàn bộ nội dung khi có thể

Huy hiệu

Phù hiệu được nhúng được tách biệt với tác phẩm nghệ thuật và không thu nhỏ tương ứng cùng với biểu tượng.

Thận trọng.
Tránh quảng bá về tác phẩm nghệ thuật
Thận trọng.
Tránh sử dụng phù hiệu thương hiệu

Thay đổi thương hiệu cho phù hợp

Nếu hình dạng là một phần quan trọng của biểu trưng, không thay đổi tác phẩm nghệ thuật để hiển thị tràn lề. Thay vào đó, hãy đặt biểu trưng trên lưới keyline mới.

Từ trái sang phải: nội dung biểu tượng ban đầu, nội dung biểu tượng mới (điều chỉnh đề xuất), biểu tượng mới hiển thị trên Google Play.

Nếu có thể, hãy chọn màu nền cho nội dung phù hợp với thương hiệu của bạn và không bao gồm bất kỳ độ trong suốt nào. Nội dung trong suốt sẽ hiển thị màu nền của Giao diện người dùng Google Play.

Từ trái sang phải: nội dung biểu tượng ban đầu, nội dung biểu tượng mới (điều chỉnh đề xuất), biểu tượng mới hiển thị trên Google Play.

Nếu không có hình dạng riêng biệt xung quanh biểu trưng để xác định biểu tượng, hãy đặt biểu tượng trên một nền tràn lề.

Từ trái sang phải: nội dung biểu tượng ban đầu, nội dung biểu tượng mới (điều chỉnh đề xuất), biểu tượng mới hiển thị trên Google Play.

Nếu tác phẩm nghệ thuật của bạn đủ linh hoạt, hãy xem xét điều chỉnh biểu tượng đó để sử dụng đầy đủ kích thước nội dung. Nếu không thể, hãy đặt biểu trưng trên lưới keyline.

Từ trái sang phải: nội dung biểu tượng ban đầu, nội dung biểu tượng mới (điều chỉnh đề xuất), biểu tượng mới hiển thị trên Google Play.

Chế độ cũ

Những nội dung biểu tượng ban đầu chưa được cập nhật theo các thông số kỹ thuật mới cuối cùng sẽ được chuyển sang chế độ cũ và giảm 75% tương ứng với kích thước lưới keyline (512 * 0,75 = 384px).

Bạn sẽ không thể tải một biểu tượng theo thông số ban đầu lên kể từ tháng 5 năm 2019. Xem thêm chi tiết về tiến trình.

Nội dung biểu tượng ban đầu sẽ được tự động chuyển thành nội dung ở chế độ cũ và được giảm 75% tương ứng với lưới keyline mới.

Tải mẫu thiết kế xuống và tài nguyên

Để bắt đầu, hãy tải một trong các mẫu nội dung được cung cấp xuống: