Google Play 圖示設計規範
透過集合功能整理內容
你可以依據偏好儲存及分類內容。

Google Play 應用程式與遊戲現採用全新的圖示系統,可根據各式 Google Play UI 版面配置、板型規格和裝置,調整各種開發人員圖片的呈現效果,為 Google Play 打造清新一致的外觀。
統一的圖示形狀擁有更佳的視覺效果,也可讓畫面更為一目瞭然,並有助於吸引使用者關注圖示本身的藝術表現,而非圖示形狀。這項調整也能解決隨機空白區域導致的對齊問題,從而更好地呈現名稱、內容分級以及價格等周邊資訊。
建立 Google Play 應用程式商店資訊的素材資源時,請遵循本頁面說明的規範。舉例來說,由於 Google Play 會以動態方式顯示應用程式圖示的圓角與投射陰影,因此在原始素材資源中即可省略這些設計。
重要資訊:本頁面僅說明 Google Play 圖示相關資訊,如果您有興趣進一步瞭解 APK 啟動器圖示的製作方式,請參閱以下資源:
- Android 自動調整圖示
請參閱這些 APK 圖示規範,瞭解如何製作在 Android 8.0 (API 級別 26) 中推出的自動調整啟動器圖示。
- 產品圖示
探索產品圖示的質感設計原則,包括圖示設計、形狀、規格及處理規範。
建立素材資源
建立 Google Play 應用程式的視覺素材資源時,請遵循本節說明的規範。
屬性
您可以用圖示圖片填充整個素材資源空間,也可以設計標誌等圖片元素,並將這些元素置於標線格線上。放置圖片時可以參考標線,但這不是硬性規則。
建立圖片時,請確認圖片符合下列規定:
- 最終大小:512px x 512px
- 格式:32 位元 PNG
- 色域:sRGB
- 檔案大小上限:1024 KB
- 形狀:完整正方形 (遮蓋部分由 Google Play 進行動態處理)。半徑相當於圖示大小的 20%。
- 陰影:無 (陰影由 Google Play 進行動態處理)。請參閱下方的「陰影」一節,瞭解如何在圖片中加上陰影。
當您上傳素材資源後,Google Play 會以動態方式套用圓角遮罩和陰影,確保所有應用程式/遊戲圖示的設計皆能一致。
最左邊是新的圖示素材資源,往右依序顯示的三張圖片則呈現了 Google Play 對圖示的動態處理方式。
大小
處理極簡圖片時,請將完整的素材資源空間做為背景。
定位標誌等圖片元素時,請使用標線做為指引。
Google Play 以動態方式套用陰影和圓角的最終結果
請勿強制讓標誌或圖片填滿整個素材資源空間,建議您改用標線格線來調整。
cancel
錯誤
請勿將具有明顯特徵的品牌和圖片強制轉換為全出血配置
check_circle
正確
請改為在標線上放置自由形式的圖示圖片
一般來說,插圖圖片以全出血圖示呈現的效果最好。
cancel
錯誤
請勿將插圖圖片縮小到標線範圍內
check_circle
正確
使用完整的素材資源空間,讓圖片填滿整個圖示範圍
您可以查看下方示例,瞭解什麼樣的圖示元素會誤導使用者及違反 Play 開發人員政策。請避免以下所有做法,並參閱 Google Play 的中繼資料政策和使用者評分、評論與安裝次數政策以獲得進一步指引。
cancel
錯誤做法
請勿使用文字或圖形元素來指出排名
cancel
錯誤做法
請勿使用文字或圖形元素來宣傳優惠活動或鼓勵使用者安裝
cancel
錯誤做法
請勿使用文字或圖形元素來指出應用程式已參與 Play 計畫
cancel
錯誤做法
請勿使用可能誤導使用者的文字或圖形元素
陰影
當您上傳圖示後,Google Play 會以動態方式為最終的圖示在周圍新增投射陰影。
在圖示圖片中新增陰影時,請遵循 Google 質感設計規範,以便與 Android 平台設計保持一致。
cancel
錯誤
請勿在最終素材資源中加入投射陰影
check_circle
正確
您可以在圖片內製造光影效果
圓角半徑
Google Play 會以動態方式套用圓角半徑,進而確保圖示針對不同 UI 版面配置調整大小時,能夠保持整體一致。半徑相當於圖示大小的 20%。
check_circle
正確
盡可能將圖片填滿整個素材資源。
品牌調整
如果標誌的關鍵部分在於形狀,請勿將圖片強制調整為全出血配置,而是將標誌放置在新的標線格線上。
從左到右:原始圖示素材資源、新版圖示素材資源 (已依建議調整)、Google Play 顯示的新圖示。
如果可以的話,請為素材資源選取品牌適合的背景顏色,不要保留任何透明部分。透明的素材資源會顯示 Google Play UI 的背景顏色。
從左到右:原始圖示素材資源、新版圖示素材資源 (已依建議調整)、Google Play 顯示的新圖示。
確立標誌形狀的界線時,如果標誌四周沒有明顯的形狀,請將標誌放到全出血的背景中。
從左到右:原始圖示素材資源、新版圖示素材資源 (已依建議調整)、Google Play 顯示的新圖示。
如果您的圖片設計較為彈性,可以考慮進行調整,以便充分利用素材資源的大小;如不可行,可改回將標誌放置在標線格線上。
從左到右:原始圖示素材資源、新版圖示素材資源 (已依建議調整)、Google Play 顯示的新圖示。
舊版模式
如果原始圖示素材資源未依據新規格更新,最後就會依循舊版模式,配合標線格線縮小為 75% 的大小 (512 * 0.75 = 384px)。
自 2019 年 5 月起,系統將不允許以原始規格上傳圖示。查看時程詳細資料。
原始的圖示素材資源會自動轉換為舊版模式的素材資源,並依據新標線格線縮小為 75% 的大小。
給 API 使用者的說明
API 使用者的遷移日期略有不同,但最終結果都是須在 2019 年 6 月 24 日前讓所有圖示符合最新規格,否則將自動轉換為「舊版模式」。
在 2019 年 6 月 17 日前,開發人員必須透過 Play 管理中心為圖示套用新規格。無論您在 Play 管理中心設定哪種規格,所有對 Edits.images: upload 的呼叫都會套用,且您無法透過 API 套用新規格。如果系統仍套用舊規格,Edits.images: upload
呼叫可能會發生錯誤,而該特定圖示的錯誤訊息會為您指出這個規格。使用 Play 管理中心套用新規格後,您可以重試 Edits.images: upload
呼叫。您可能需要多次重試呼叫才能成功。
自 2019 年 6 月 17 日起,對 Edits.images: upload
的所有 API 呼叫都會自動為圖示套用新規格。2019 年 6 月 17 日之後,您應該就只能上傳符合新規格的圖示。
下載設計範本和資源
如要開始使用,請下載下列其中一個素材資源範本:
這個頁面中的內容和程式碼範例均受《內容授權》中的授權所規範。Java 與 OpenJDK 是 Oracle 和/或其關係企業的商標或註冊商標。
上次更新時間:2023-09-20 (世界標準時間)。
[[["容易理解","easyToUnderstand","thumb-up"],["確實解決了我的問題","solvedMyProblem","thumb-up"],["其他","otherUp","thumb-up"]],[["缺少我需要的資訊","missingTheInformationINeed","thumb-down"],["過於複雜/步驟過多","tooComplicatedTooManySteps","thumb-down"],["過時","outOfDate","thumb-down"],["翻譯問題","translationIssue","thumb-down"],["示例/程式碼問題","samplesCodeIssue","thumb-down"],["其他","otherDown","thumb-down"]],["上次更新時間:2023-09-20 (世界標準時間)。"],[],[],null,["# Google Play icon design specifications\n\n\u003cbr /\u003e\n\nApps \\& Games on Google Play are adopting a new icon system to better fit diverse\ndeveloper artwork to Google Play's various UI layouts, form factors, and\ndevices, as well as to bring consistency and a cleaner look to Google Play.\n\nUniformed shapes are visually more appealing and easier to digest. They help\nusers focus on the artwork, as opposed to the shape. They fix alignment issues\ncaused by random open space to better present surrounding information, such as\nthe title, rating, and price.\n\n\nFreeform -- original format \n\nUniformed -- new format\n\n\u003cbr /\u003e\n\nThis page describes the guidelines you should follow when creating assets for\nyour app's listing on Google Play. For example, because Google Play dynamically\nrenders rounded corners and drop shadows for your app icons, you should omit\nthem from your original assets.\n\n**Important:** If instead you're interested in learning more about creating APK\nlauncher icons, which are separate from the Google Play icons described on this\npage, see the resources below:\n\n- [Android Adaptive Icons](/guide/practices/ui_guidelines/icon_design_adaptive) \n Follow these APK icon guidelines to learn how to create adaptive launcher icons introduced in Android 8.0 (API level 26).\n- [Product icons](https://material.io/design/iconography/product-icons.html) \n Discover Material Design principles for product icons, including guidelines for icon design, shapes, specs, and treatment.\n\nCreating assets\n---------------\n\nThis section describes some guidelines you should follow when creating visual\nassets for your app on Google Play.\n\n### Attributes\n\nIcon artwork can populate the entire asset space, or you can design and position\nartwork elements such as logos onto the keyline grid. When placing your artwork,\nuse keylines as a guideline, not a hard rule.\n\nWhen creating your artwork, ensure it conforms to the following:\n\n- Final size: 512px x 512px\n- Format: 32-bit PNG\n- Color space: sRGB\n- Max file size: 1024KB\n- Shape: Full square -- Google Play dynamically handles masking. Radius will be equivalent to 20% of icon size.\n- Shadow: None -- Google Play dynamically handles shadows. See 'Shadows' section below on including shadows within your artwork.\n\n\nTotal asset size \n\nProduct icon keylines\n\n\u003cbr /\u003e\n\nAfter the asset is uploaded, Google Play dynamically applies the rounded mask\nand shadow to ensure consistency across all app/game icons. \nOn the left-hand side is your new icon asset. The following three images on the right-hand side show Google Play dynamic processing of the icon.\n\n### Sizing\n\nUtilize the full asset space as the background when dealing with minimalistic\nartwork.\n\nUse the keylines as guides for positioning artwork elements (i.e. logos).\n\n\nYour full bleed artwork (final asset) \n\nEnd result with shadows and rounded corners dynamically applied by Google Play\n\n\u003cbr /\u003e\n\nDon't force your logo or artwork to fit the full asset space. Instead, utilize\nthe keyline grid. \ncancel\n\n### Wrong\n\nDon't force drastic brand \\& artwork transformation to full bleed \ncheck_circle\n\n### Right\n\nPlace freeform icon artwork on keylines instead\n\nIllustrated artwork typically works well as a full bleed icon. \ncancel\n\n### Wrong\n\nDon't scale down illustrated artwork onto keylines \ncheck_circle\n\n### Right\n\nUtilize full asset space so your artwork occupies the entire icon\n\nThese are examples of icon elements that mislead users and violate Play's\nDeveloper policies. Avoid all of the following practices, and refer to\nGoogle Play's [metadata policy](https://support.google.com/googleplay/android-developer/answer/9898842?ref_topic=9877064)\nand [user ratings, reviews, and installs policy](https://support.google.com/googleplay/android-developer/answer/9898684?ref_topic=9877064#zippy=%2Cexamples-of-common-violations-in-app-title-icon-or-developer-name)\nfor further guidance. \ncancel\n\n### Don't\n\nDon't use text or graphic elements to indicate ranking \ncancel\n\n### Don't\n\nDon't use text or graphic elements to promote deals or incentivize installs \ncancel\n\n### Don't\n\nDon't use text or graphic elements to indicate participation in a Play program \ncancel\n\n### Don't\n\nDon't use text or graphic elements that can mislead users\n\n### Shadows\n\nGoogle Play will dynamically add a drop shadow around the final icon once\nuploaded.\n\nWhen adding shadows inside your icon artwork, consider consistency with the\nAndroid platform by following Google Material [guidelines](https://material.io/guidelines/style/icons.html#icons-product-icons). \ncancel\n\n### Wrong\n\nDon't add drop shadows to your final asset \ncheck_circle\n\n### Right\n\nYou can create shadows and lighting within the artwork\n\n### Corner radius\n\nGoogle Play dynamically applies corner radius. This ensures consistency when the\nicon is resized across different UI layouts. Radius will be equivalent to 20% of\nicon size. \ncancel\n\n### Wrong\n\nDon't round the edges of your final asset \ncheck_circle\n\n### Right\n\nFill your entire asset with artwork when possible\n\nBrand adaptation\n----------------\n\nIf shapes are a critical part of a logo, do not force the artwork to full bleed.\nInstead place it on the new keyline grid. \nFrom left to right: original icon asset, new icon asset (recommended adaptation), new icon rendered on Google Play.\n\nIf possible, pick a background color for your asset that's appropriate for your\nbrand and doesn't include any transparency. Transparent assets will display the\nbackground color of Google Play UI. \nFrom left to right: original icon asset, new icon asset (recommended adaptation), new icon rendered on Google Play.\n\nIf there is no distinct shape around a logo defining it, place it on a full\nbleed background. \nFrom left to right: original icon asset, new icon asset (recommended adaptation), new icon rendered on Google Play.\n\nIf your artwork is flexible enough, consider tweaking it to fully utilize the\nasset size. If that's not possible, revert to placing the logo on a keyline\ngrid. \nFrom left to right: original icon asset, new icon asset (recommended adaptation), new icon rendered on Google Play.\n\nLegacy mode\n-----------\n\nOriginal icon assets that have not been updated per the new specifications will\neventually be migrated to legacy mode and scaled down 75% to the keyline grid\nsize (512 \\* 0.75 = 384px).\n\nUploading an icon per the original specification will not be allowed as of May\n2019. [See more details on timelines](https://android-developers.googleblog.com/2019/03/introducing-new-google-play-app-and.html). \nOriginal icon assets will be automatically turned into legacy mode assets and be scaled down 75% to new keyline grid.\n\nInstructions for API users\n--------------------------\n\nMigration dates are slightly different for API users, but achieve the same end\nresult of migrating all icons to either the new specification or \"legacy mode\"\nby June 24, 2019.\n\nBefore June 17, 2019, developers must use the Play Console to apply the new\nspecification to their icons. All calls to [Edits.images: upload](https://developers.google.com/android-publisher/api-ref/edits/images/upload)\nwill apply whichever specification is configured in the Play Console. There is\nno way to apply the new specification via API. The `Edits.images: upload` call\nmay error if the old specification is still applied, and the error\nmessage for that specific icon will point you to this specification. After\napplying a new specification using the Play Console, you can retry the\n`Edits.images: upload` call. You may need to retry the call multiple times\nbefore it will succeed.\n\nBeginning on June 17, 2019, all API calls to `Edits.images: upload` will\nautomatically apply the new specification to the icon. Following June 17, 2019,\nyou should only upload icons that are compatible with the new specification.\n\nDownload design templates \\& resources\n--------------------------------------\n\nTo get started, download one of the provided asset templates:\n\n- [Sketch template](https://services.google.com/fh/files/misc/playstore_icon_template.sketch.zip) (.sketch)\n- [Illustrator template](https://services.google.com/fh/files/misc/playstore_icon_template.ai.zip) (.ai)\n- [Photoshop template](https://services.google.com/fh/files/misc/playstore_icon_template.psd.zip) (.psd)"]]