建立應用程式時,您需要各種影像用於 iOS、Android 和 Windows 裝置的應用程式圖示和啟動畫面。製作適用於 iOS 的所有圖像,會是需要組合各種影像大小的複雜作業,Android 應用程式只需要單一影像,而 Windows 應用程式則需要三個影像。Asset Generator.psd 檔案和 Adobe Photoshop CC 中的 Generator 功能有助於協調及自動化這些檔案製作。

Adobe Photoshop CC 引進了 Generator 功能,可根據圖層名稱自動建立網頁圖像檔案。Asset Generator.psd 檔案會利用 Generator 功能,在建立應用程式時建立影像檔。Generator 會個別建立檔案和檔案夾結構,以組織適用於三個平台的檔案。

使用 InDesign 建立啟動影像

如果您偏愛使用 InDesign 而不是 Photoshop 來進行設計工作,Keith Gilbert 建立了一個 InDesign 範本讓您使用 InDesign 來建立及匯出所需的 PNG 檔案。請參閱「 2015 應用程式載入時的起始畫面範本」。

使用 Photoshop Asset Generator

  1. 下載、解壓縮,以及移動或複製 Asset Generator.psd 檔案到已知位置,例如 AEM Mobile 發佈作業要用之資產的儲存位置。

    下載

  2. 在 Adobe Photoshop CC 中開啟 Asset Generator.psd 檔案。

  3. 若要啟用 Generator,請在 Photoshop CC 中選擇「檔案 > 產生 > 影像資產」。

    如果選取此選項,Photoshop 會根據「圖層」面板中定義的圖層和群組名稱來產生檔案。Photoshop 將根據 Asset Generator 檔案儲存位置中的檔案名稱建立資產檔案夾。資產檔案類型、品質、尺寸、名稱和檔案夾結構,是由 Photoshop 檔案中圖層和圖層群組名稱所控制。

  4. 若要編輯智慧型物件,按兩下圖層縮圖。它會開啟為另一個暫時性的 Photoshop 檔案。其內部可能有圖層或其他智慧型物件。

    Asset Generator 檔案廣泛使用 Photoshop 智慧型物件。所有圖示都是單一智慧型物件的複本。因此,如果您編輯一個圖示,所有其他圖示都會自動更新。個別獨立的智慧型物件用於大部分的啟動影像。

    有綠色標籤的圖層是您必須自訂的智慧型物件。您可以在「圖層」面板以及「圖層」面板的啟動影像檔案夾中找到綠色圖層。當您編輯內容時,資產會重新產生。

  5. 進行編輯,然後儲存並關閉智慧型物件檔案。當您返回主要 Photoshop 檔案時,智慧型物件的所有複本就會自動更新。

    按兩下任何智慧型物件的縮圖,即可編輯其內容。向量圖智慧型物件開啟時是在 Adobe Illustrator 中進行編輯。在 Illustrator 中編輯向量圖智慧型物件之後,在 Illustrator 中儲存並關閉檔案,然後返回 Photoshop 可看到內容已自動更新。

    儲存並關閉所有智慧型物件,再返回 Asset Generator 檔案,智慧型物件的所有複本將會更新。

  6. 按兩下任何智慧型物件的縮圖,即可編輯其內容。向量圖智慧型物件開啟時是在 Adobe Illustrator 中進行編輯。在 Illustrator 中編輯向量圖智慧型物件之後,在 Illustrator 中儲存並關閉檔案,然後返回 Photoshop 可看到內容已自動更新。儲存並關閉所有智慧型物件,再返回 Asset Generator 檔案,智慧型物件的所有複本將會更新。

此産品由 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License 授權  Creative Commons 條款未涵蓋 Twitter™ 與 Facebook 文章。

法律說明   |   線上隱私權政策